/*

  eBoutique
  by Slim Pickings Design

*/

body, html {
  height: 100%;
}

h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, em, strong, th {
  font-size: 100%; 
  font-weight: normal; 
  font-style: normal;
}

h1 {
  font-size: 24px;
  padding-top: 10px;
}

h2 {
  font-size: 13px;
  font-weight: bold;
}

h3 {
  font-size: 12px;
  font-weight: bold;
}

p {
  line-height: 18px;
  margin-bottom: 15px;
}

ul {
  list-style: none;
}

ol {
  list-style: inside decimal;
}

fieldset, img {
  border: 0;
}

table {
  border-collapse: collapse; 
  border-spacing: 0;
}

a, input {
  outline: none;
}

a {
  color: #ef4863;
}

input, textarea, select {
  font-family: "Trebuchet MS", Helvetica, sans-serif;
  font-size: 12px;
}

sub {
  font-size: 0.5em;
  vertical-align: text-bottom;
}

sup {
  font-size: 0.7em;
  vertical-align: text-top;
}

.foo {
  border: 1px solid #00ffff;
}


/* -------------------- Layout -------------------- */
body {
  font-family: "Trebuchet MS", Helvetica, sans-serif;
  font-size: 12px;
  color: #333;
  background: url(/images/content/stripes.gif);
}

#layout {
  width: 100%;
  height: 100%;
}  

#left {
  width: 100px;
  color: #333;
  background: url(/images/content/shopper-girl-left.gif) bottom left no-repeat;
}

#center {
  width: 850px;
  vertical-align: top;
  color: #333;
  background: url(/images/content/border-y.gif) #fff no-repeat 170px 174px;
}

#right {
  color: #333;
  background: url(/images/content/shopper-girl-right.gif) bottom left no-repeat;
}


/* -------------------- Page Header -------------------- */
#header {
  height: 109px;
  padding-top: 50px;
  background: url(/images/content/stripes-center.gif) no-repeat top;
}

#header img {
  float: left;
  padding: 26px 0 0 20px;
}

#header .shoppingCart {
  float: right;
  padding: 70px 20px 4px 0;
  font-size: 11px;
}

#header .shoppingCart ul li {
  display: inline; 
  list-style-type: none; 
}

#header .shoppingCart a {
  color: #CD5C6E;
}


/* -------------------- Main Navigation -------------------- */
#mainNav {
  width: 830px;
  height: 26px;
  margin-left: 10px;
  color: #fff;
  background: #b89599;
  float: left;
}

#mainNav #home a {
  padding-left: 9px;
}  

#mainNav li {
  float: left;
}

#mainNav a {
  line-height: 26px;
  padding: 4px 8px 4px 8px;
  font-weight: bold; 
  text-decoration: none;
  color: #fff;
}

#mainNav a.selected {
  color: #fff;
  background: #CBA6AA;
}

#mainNav a:hover {
  color: #fff;
  background: #CBA6AA;
}

#mainNav #facebook {
  float: right;
}

#mainNav #facebook a {
  padding: 0;
  display: block;  
  text-indent: -99999px;
  overflow: hidden;  
  width: 70px;
  height: 24px;
  background: url(/images/logos/facebook-nav.gif) no-repeat;  
}

#mainNav #facebook a:hover {
  background-position: 0 -24px;
}  


/* -------------------- Sub Navigation -------------------- */
#subNav {
  width: 150px; 
  float: left;
  padding: 10px 0 10px 20px;
}

#subNav li.open {
  padding-left: 10px;
}

#subNav li.border {
  height: 10px; 
  width: 130px; 
  color: #666; 
  background: url(/images/content/border_subnav.gif) center left no-repeat;
}

#subNav a {
  line-height: 18px;
  font-size: 11px;
  color: #666; 
  text-decoration: none; 
  font-weight: bold; 
}

#subNav li span.selected a {
  color: #CD5C6E;
}

#subNav li.open a {
  font-weight: normal; 
}

#subNav a:hover {
  color: #CD5C6E;
}

#subNav li.extra a {
  font-weight: normal; 
}

#subNav img {
	padding-top: 30px;
}



/* -------------------- Right Column -------------------- */
#rightColumn {
  border: 1px solid #fff; /* alignment fix for Chrome */
}

#content #rightColumn h1 {
  color: #000;
  font-weight: normal; 
}

#content #rightColumn p, #content #rightColumn td {
  color: #000;
}


/* -------------------- Ads -------------------- */
#adTop {
  margin-left: 15px;
  padding-top: 10px;
}

#content #adTop, #productInfo #adTop, #news #adTop {
  margin-left: 0;
}

#pageAd {
  padding-bottom: 10px;
}


/* -------------------- Images -------------------- */
img.left {
  float: left;
  padding: 3px 10px 10px 0;
}

img.right {
  float: right;
  padding: 3px 0 10px 10px;
}

img.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 0 10px 0;
}


/* -------------------- Results Navigation -------------------- */
.resultNav {
  overflow: hidden;
  padding: 5px 0 5px 0;
}

.resultNav ul {
  text-align: right;
  margin-right: 25px;
  padding: 3px 0 3px 0;
  float: right;
}

.resultNav li {
  font-size: 14px;
  display: inline; 
  float: left;
  margin-left: 2px;
}

.resultNav li.selected {
  color: #ffffff; 
  background: #D5BF92;
  font-weight: normal;
  padding: 2px 4px 2px 4px;
}

.resultNav li.heading {
  padding-right: 5px;
}

.resultNav a {
  color: #333; 
  text-decoration: none; 
  display: block;
  float: left;
  padding: 2px 4px 2px 4px;
}

.resultNav a:hover {
  color: #ffffff; 
  background: #D5BF92;
}

.resultNav li.arrow a:hover {
  color: #ffffff; 
  background: #ffffff;
}

.noResultNav {
  height: 26px;
}


/* -------------------- Footer -------------------- */
#bottom {
  height: 116px;
  vertical-align: bottom;
  color: #333;
  background: url(/images/content/border-y.gif) #fff no-repeat 170px;
}

#footer {
  height: 126px;
  clear: both;
  background: url(/images/content/footer.gif) no-repeat bottom;
}

#footer p {
  padding: 25px 20px 0 20px;
  color: #555;
  font-size: 11px;
}

#footer img {
  float: right;
}

#footer a {
  color: #555;
}

#footer a:hover {
  color: #CD5C6E;
}


/* -------------------- Index -------------------- */
#contentIndex {
  width: 665px;
  padding-top: 12px;
  overflow: hidden;
  float: right;
}

#contentIndex .heading {
  width: 665px;
  float: left;
}

#contentIndex .heading .more {
  float: right;
  margin-top: 43px;
  margin-right: 24px;
  color: #222222;
  text-decoration: underline;
}

#contentIndex .heading .more:hover {
  color: #ef4863;
}

#contentIndex .heading h2 {
  float: left;
}

#contentIndex h2 {
  width: 350px;
  overflow: hidden;  
  text-indent: -99999px;  
  height: 50px;  
  margin-top: 10px;
}

#contentIndex #recommend h2 {
  background: url(/images/content/recommend.gif) no-repeat;  
}

#contentIndex #new h2 {
  background: url(/images/content/new.gif) no-repeat;  
}

#contentIndex #sale h2 {
  background: url(/images/content/sale.gif) no-repeat;  
}

#contentIndex div.product {
  float: left; 
  text-align: center; 
  line-height: 12px; 
  padding-bottom: 15px;
  margin-right: 20px;
}  

#contentIndex div.product img {
  margin-bottom: 4px;
  display: block;
  border: solid 3px #D5BF92; 
}

#contentIndex div.product .title {
  display: block;
  font-weight: bold;
}

#contentIndex div.product a {
  text-decoration: none; 
  color: #222222; 
  font-size: 11px;
  line-height: 140%;
}  

#contentIndex div.product a:hover {
  color: #ef4863;
}  

#contentIndex #recommend, #contentIndex #new, #contentIndex #sale {
  width: 665px;
  float: left;
}

#contentIndex #facebook {
  margin-top: 25px;
  margin-bottom: 25px;
  float: left;
}


/* -------------------- Product Info -------------------- */
#productInfo {
overflow: hidden;
}

#productInfo div h2, #productInfo div p {
  padding-left: 130px;
}

#productInfo div.info {
  clear: both;
  padding-bottom: 20px;
}

#productInfo div.info img {
  float: left;
}

#productInfo p a {
  display: block;
}


/* -------------------- Product Search -------------------- */
#productSearch {
  margin-left: 170px;
}

#productSearchBox {
  width: 640px; 
  height: 250px; 
  background: url(http://www.eboutique.fi/images/content/product-search.jpg) bottom no-repeat; 
  margin: 0 0 4px 15px;
  padding-top: 10px;

}

#productSearchBox div {
  padding: 173px 0 0 17px;
}

#productSearchBox .fields {
  float: left;
  padding: 17px 0 0 0;
}

#productSearchBox .searchTerm {
  width: 128px; 
  font-size: 11px; 
  padding-left: 2px;
}

#productSearchBox .searchCategory {
  font-size: 11px; 
  width: 135px;
  margin-left: 10px; 
}

#productSearchBox .submit {
  padding-left: 15px;
}

#productSearch p {
  margin-left: 15px;
  padding-top: 15px;
}


/* -------------------- Order Tracking -------------------- */
#orderTracking {
  width: 640px;
  margin: 10px 0 0 185px;
  padding-bottom: 30px;
}

#orderTrackingBox {
  width: 640px; 
  height: 250px; 
  background: url(http://www.eboutique.fi/images/content/order-tracking.jpg) bottom no-repeat; 
  margin-bottom: 20px;
}

#orderTrackingBox div {
  padding: 160px 0 0 17px;
}

#orderTrackingBox .fields {
  float: left;
  padding: 28px 0 0 0;
}

#orderTrackingBox .submit {
  padding-left: 15px;
}


#orderTrackingBox .orderNumber {
  width: 128px; 
  padding-left: 2px;
  font-size: 11px; 
  background: #E4DBD7;
  color: #000;
}

#orderTrackingBox .password {
  width: 128px; 
  padding-left: 2px;
  margin-left: 10px; 
  font-size: 11px; 
  background: #E4DBD7;
  color: #000;
}

#orderTrackingBox .submit {
  display: block;
  padding-top: 10px;
}

#track {
  width: 640px;
  margin: 10px 0 60px 0; 
}

#track tr.heading {
  height: 21px; 
  background: #efefef;
}

#track .headingDate {
  padding-left: 5px; 
  width: 140px;
}

#track .headingPayment {
  width: 315px;
}

#track .headingStatus {
  width: 180px;
}

#track .date {
  padding: 5px 0 0 5px; 
  height: 40px; 
  vertical-align: top;
}

#track .payment {
  vertical-align: top; 
  padding-top: 5px;
}

#track .status {
  vertical-align: top; 
  padding-top: 5px;
}


/* -------------------- News -------------------- */
#news h1 {
  margin-bottom: 15px;
}


/* -------------------- Contact -------------------- */
#content #contact {
  margin: 5px 0 20px 0;
}

#content #contact td {
  height: 20px;
  padding-right: 20px;
}

#contactForm table {
  background: url(/images/content/border-x.gif) no-repeat top left;
}

#contactForm table h2 {
  padding-top: 20px;
}

#contactForm .first {
  width: 250px;
}

#contactForm .second {
  width: 390px;
}

#contactForm .select {
  width: 217px;
  height: 20px;
  font-size: 11px; 
  color: #000; 
  padding-left: 3px;
  margin-bottom: 9px;
}

#contactForm .field {
  width: 210px;
  font-size: 11px; 
  color: #000; 
  padding-left: 3px;
  margin-bottom: 10px;
}

#contactForm .textarea {
  width: 461px;
  margin-bottom: 10px;
  padding-left: 3px;
}

#contactForm .submit {
  margin: 10px 0 30px 0;
}


/* -------------------- Misc -------------------- */

.swarovski {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
}


/* -------------------- Product Catalog -------------------- */
#productsContent #index {
  margin-left: 15px;
  padding-top: 10px;
}

#productsContent {
  margin-left: 170px;
}

#products {
  width: 660px;
  margin-left: 15px;
  overflow: hidden;
}

#products .product {
  float: left; 
  text-align: center; 
  line-height: 12px; 
  padding-bottom: 15px;
  margin-right: 20px;
}  

#products img {
  margin-bottom: 4px;
  display: block;
  border: solid 4px #D5BF92; 
}

#products .title {
  display: block;
  font-weight: bold;
}

#content, #productInfo, #news {
  width: 640px;
  padding-bottom: 30px;
  float: right;
  padding-right: 25px;
}


#productsContent #leftColumn {
  width: 370px;
  float: left;
  padding-left: 1px;
}

#productsContent #rightColumn {
  width: 270px;
  margin-left: 370px;
  padding: 45px 0 70px 0;
}

#products .product a {
  text-decoration: none; 
  color: #222222; 
  font-size: 11px;
}  

#products .product a:hover {
  color: #ef4863;
}  

.offer {
  color: #CD5C6E; 
  background: #fff;
  font-weight: bold;
}

.strike {
  text-decoration: line-through;
}


/* -------------------- Product Details -------------------- */
#productsContent #rightColumn h1 {
  padding-bottom: 5px;
}

#rightColumn #productDetails {
  width: 270px;
}

#rightColumn #productDetails td {
  height: 24px;
  vertical-align: middle;
}

#rightColumn #productDetails td:first-child {
  width: 80px;
}

#rightColumn #productDetails #size {
  width: 80px; 
  height: 20px;
  font-size: 11px;
}

#rightColumn #productDetails #size .sizeOption {
  color: #ff0000; 
  font-size: 11px; 
}

#rightColumn #productDetails .quantity {
  width: 74px; 
  font-size: 11px;
  padding-left: 2px;
}

#rightColumn #productDetails .border {
  background: url(/images/content/border-x.gif) no-repeat left;
  height: 10px;
}

#rightColumn #productDetails input.button {
  margin-top: 6px;
}


/* -------------------- Step 1 -------------------- */
#step1 {
  width: 640px;
  margin: 10px 0 0 185px;
  padding-bottom: 30px;
}

#cartEmpty {
  padding: 80px 80px 80px 200px;
}

 .nextSteps {
  color: #ccc;
}

#step1 ul.cartHeading {
  width: 640px;
  height: 22px; 
  float: left;
  background: #efefef;
  padding-top: 4px;
}

#step1 ul.cartHeading li {
  padding-top: 3px;
}

#step1 li.headingItem {
  width: 185px;
  float: left;
  padding-left: 5px; 
}

#step1 li.headingUnit {
  width: 90px; 
  float: left;
  text-align: right; 
}

#step1 li.headingPrice {
  width: 90px; 
  float: left;
  text-align: right; 
}

#step1 li.headingTotal {
  width: 90px; 
  float: left;
  text-align: right; 
}

#step1 li.headingUpdate {
  width: 95px; 
  float: left;
  text-align: right; 
  padding-right: 15px;
}

#step1 li.headingRemove {
  width: 60px; 
  float: left;
  text-align: right; 
  padding-right: 10px;
}

#step1 ul.cartItem {
  width: 640px;
  float: left;
  background: url(/images/content/border-x.gif) bottom left no-repeat;
}

#step1 .item {
  width: 185px;
  float: left;
  padding: 6px 0 8px 5px;
  line-height: 130%;
} 

#step1 input.unit {
  width: 30px; 
  height: 16px; 
  font-size: 11px; 
  color: #000000; 
  padding-left: 3px; 
  text-align: right;
}

#step1 li.unit {
  width: 90px; 
  float: left;
  text-align: right; 
  padding-top: 12px;
}

#step1 .price, #step1 .total {
  width: 90px; 
  float: left;
  text-align: right; 
  padding-top: 17px;
}

#step1 .update {
  width: 97px; 
  text-align: right; 
  padding: 12px 13px 0 0;
  float: left;
}

#step1 .remove {
  width: 60px; 
  text-align: right; 
  padding: 12px 10px 7px 0;
  float: left;
}

#step1 ul.cartHeadingBottom {
  background: #efefef;
  height: 30px;
  float: left;
  margin-bottom: 30px;
}

#step1 li.grandTotal {
  width: 460px;
  font-weight: bold; 
  text-align: right; 
  float: left;
  padding-top: 10px;
}

#step1 li.emptyCart {
  width: 170px;
  text-align: right; 
  padding-right: 10px;
  float: left;
}

#step1 .empty {
  padding-top: 4px;
}

#step1 h2 {
  padding-bottom: 5px;
}

#step1 select.paymentMethod {
  height: 20px;
  font-size: 11px; 
  color: #000000; 
  padding-left: 3px;
}

#checkOut p {
  line-height: 24px;
  margin-bottom: 0;
}


/* -------------------- Step 2 -------------------- */
#step2 {
  width: 640px;
  margin: 10px 0 0 185px;
  padding-bottom: 30px;
}

table.cart {
  width: 640px;
}

table.cart tr {
  background: url(/images/content/border-x.gif) bottom left no-repeat;
} 

table.cart tr.heading {
  height: 21px; 
  background: #efefef;
}

table.cart td {
  vertical-align: middle;
}
  
td.headingItem {
  padding-left: 5px; 
  width: 195px;
}

td.headingUnit {
  width: 89px; 
  text-align: right; 
}

td.headingPrice {
  width: 89px; 
  text-align: right; 
}

td.headingTotal {
  width: 89px; 
  text-align: right; 
}

td.headingTax {
  width: 89px; 
  text-align: right; 
  padding-right: 10px;
}

td.tax {
  text-align: right; 
  padding-right: 10px;
}

td.total2, td.delivery {
  height: 40px; 
  padding-left: 5px;
}

td.item {
  height: 40px; 
  padding-left: 5px;
} 

td.unit, td.price, .total {
  text-align: right; 
}

table.cart tr.headingBottom {
  height: 31px; 
  background: #efefef;
}

td.headingGrandTotal {
  padding-right: 10px;
}

td.grandTotal {
  font-weight: bold; 
  text-align: right; 
}

#step2 h2, #step3 h2, #orderTracking h2 {
  padding-top: 30px;
  padding-bottom: 5px;
}

table.form {
  width: 640px;
}

table.form .field {
  width: 240px; 
  height: 18px;
  padding: 2px 0 0 2px; 
}

table.form .fieldLong {
  width: 500px; 
  height: 18px;
  padding: 2px 0 0 2px; 
}

table.form .fieldText {
  width: 500px; 
  padding: 2px 0 0 2px;
}

table.form td.first {
  width: 260px; 
}

table.form td input {
  margin-bottom: 10px;
}

table.form td.border {
  background: url(/images/content/border-x.gif) no-repeat bottom left;
  height: 30px;
}

.required {
  font-family: verdana,arial,tahoma,helvetica,sans-serif; 
  font-weight: bold; 
  font-size: 11px; 
  color: #ff0000;
  background: #fff;
}


/* -------------------- Step 3 -------------------- */
#step3 {
  width: 640px;
  margin: 10px 0 0 185px;
  padding-bottom: 30px;
}

table.info {
  width: 640px;
}

table.info td {
  height: 20px; 
}

table.info td.first {
  width: 130px; 
}

.continue {
  padding-top: 40px;
  background: url(/images/content/border-x.gif) no-repeat 0px 30px;
}


/* -------------------- Step 4 -------------------- */
#step4 {
  width: 640px;
  margin: 10px 0 0 185px;
  padding-bottom: 30px;
}

#step4 td  {
  height: 22px; 
}

table.paymentInfo td.first {
  width: 130px;
}

#step4 td.border {
  background: url(/images/content/border-x.gif) no-repeat top left;
}

table.paymentInfo td.paymentInfo {
  font-weight: bold;
  width: 510px;
}

#step4 div.continue {
  padding: 30px 0 30px 0;
  background: url(/images/content/border-x.gif) no-repeat 0px 20px;
}


/* -------------------- Step 5 -------------------- */
#step5 {
  width: 640px;
  margin: 10px 0 0 185px;
  padding-bottom: 30px;
}


/* -------------------- Message -------------------- */
#message table {
  margin: 30px 0 0 20px;
  width: 562px; 
}

#message .messageTop {
  width: 413px;
  height: 15px;
  background: url(/images/content/message-box-top.gif) bottom no-repeat; 
}

#message .messageContent {
  height: 80px;
  padding: 0 15px 0 15px; 
  background: #f484A2;
}

#message p {
  font-size: 20px; 
  font-weight: bold; 
  color: #fff; 
  line-height: 24px; 
  margin-bottom: 0;
}

#message a {
  color: #fff;
}

#message .messageBottom {
  width: 413px;
  height: 15px;
  background: url(/images/content/message-box-bottom.gif) top no-repeat; 
}