﻿
/* Common Styles */

body{background:#666 url(../i/BackBody.jpg) center top; font:62.5% "Segoe UI", Arial, sans-serif;}
.Clear, .clear{clear:both; height:0; font-size:0; line-height:0;}
a:focus{outline:none;}
p{margin-bottom:0.6em;}
h1{color:#25393D; font-size:2.4em; margin-bottom:10px; line-height:inherit;}
h2{color:#25393D; font-size:1.8em; font-weight:bold; margin-bottom:10px; line-height:inherit;}
.bodytext {font-size: 1.1em;}


.divider{font-size:0; line-height:0; height:6px; margin:10px 0px; background:url(../i/whiteDots.gif);}
.smallDivider{font-size:0; line-height:0; height:3px; margin:10px 0px; background:url(../i/smallWhiteDots.gif);}

.page{width:560px; margin:auto; padding-bottom:40px;}
#breadCrumb{display:block; height:25px;}
#breadCrumb li{display:block; float:left; color:#A5B0B2; font-size:1.2em; padding-left:12px; margin-right:8px; background:url(../i/breadCrumbArrow.gif) no-repeat 0px 4px;}
#breadCrumb li a{display:block; color:#A5B0B2; font-weight:bold;}
#breadCrumb li a:hover{color:#B13855;}
#breadCrumb .home{padding-left:0; background:none;}

#products{}
#products .group{}
#products .item{float:left; width:140px; padding-top:10px; background:url(../i/catProductBack.gif) no-repeat;}
#products a{text-decoration:none;}
#products .thumb{display:block; text-align:center; margin-bottom:25px; height: 114px;}
#products .title{display:block; font-size:1.4em; color:#25393D; font-weight:bold; text-align:center;}
#products .price{display:block; font-size:1.4em; color:#B52F51; font-weight:bold; text-align:center;}
#products .PriceOff{color:black; text-decoration: line-through; font-weight: normal;}
#products .Price{display: block;}
div.Price{display:inline;}

/* Template Styles */

#OuterWrapper{width:100%; background:url(../i/OuterWrapperBack.jpg) repeat-y center top;}
#InnerWrapper{width:968px; margin:auto; height:100%; background-color:#f2f0ee;position: relative;}

#Header{height:177px; background:url(../i/HeaderBack.jpg); padding: 17px 17px 0 0; text-align: right;}
#ContentWrapper{zoom:1; padding:10px 0 0 0; font:1.0em "Segoe UI", Arial, sanserif; color:#5c6263; background:url(../i/ContentBack.gif) repeat-y;}
#footer{height:75px; text-align:center; background:url(../i/FooterBack.gif) no-repeat; position: relative;}
#footer .inner{padding-top:5px;}
#footer a{font:bold 1em "Segoe UI", Arial, sanserif; color:#d696a6; text-decoration:none;}
#footer a:hover{color:#b52f51;}
#footer span{font:1em "Segoe UI", Arial, sanserif; color:#d696a6;}
#footer #TVILink {position: absolute; display: block; width: 155px; height: 20px; top: 40px; left: 555px;}

#MenuColumnLeft{float:left; width:194px; padding-bottom:20px;}
#MenuColumnLeft .Inner{margin:0 26px 0 22px;}
#MenuColumnRight{float:left; width:194px; padding-bottom:20px;}
#MenuColumnRight .Inner{margin:0 19px 0 26px;}
#MainContent{float:left; width:580px; margin-bottom: 25px;}

.menuTitle{margin-bottom:3px;}
.menuDivider{height:26px; background:url(../i/menuDivider.gif) no-repeat left center;}
.sideMenu{}
.sideMenu li{}
.sideMenu li a{zoom:1;display:block; padding-left:15px; color:#5C6263; font-size:1.1em; text-decoration:none; background:url(../i/sideMenuArrow.gif) no-repeat 0px 3px;}
.sideMenu li a:hover{display:block; padding-left:15px; color:#B13855; font-size:1.1em; text-decoration:none; background:url(../i/sideMenuArrow.gif) no-repeat 0px -77px;}
.sideMenu .active a{display:block; padding-left:15px; color:#5C6263; font-size:1.1em; font-weight:bold; text-decoration:none; background:url(../i/sideMenuArrowActive.gif) no-repeat 0px 3px;}
.sideMenu .subMenu{padding:1px 0 3px 15px;}
.sideMenu .subMenu li a{display:block; padding-left:12px; color:#9D9B95; font-size:1.0em; text-decoration:none; background:url(../i/sideMenuSubArrow.gif) no-repeat 0px 4px;}
.sideMenu .subMenu li a:hover{display:block; padding-left:12px; color:#B13855; font-size:1.0em; text-decoration:none; background:url(../i/sideMenuSubArrow.gif) no-repeat 0px -76px;}
.sideMenu .subMenu .active a{display:block; padding-left:12px; color:#666; font-size:1.0em;  text-decoration:none; background:url(../i/sideMenuSubArrowActive.gif) no-repeat 0px 4px;}

#quickSearchWrapper{position:relative; width:142px; height:29px; margin-bottom:8px; background:url(../i/sideMenuInputWrapper.gif) repeat-x;}
#quickSearch{position:absolute; left:3px; top:3px; width:136px; height:18px; background:url(../i/quickSearchInputBack.gif);}
#quickSearch input{width:126px; height:14px; padding:2px; margin-left:2px; font-size:1.1em; color:White; border:none; background:none;}

/* Horrible hack for IE5/6 */
* html #quickSearch input {
\height: 10px; /* for IE5 and IE6 in quirks mode */
h\eight: 14px; /* for IE6 in standards mode */
} 

#miniBasket{background:url(../i/miniBasketBack.gif) no-repeat; zoom:1;}
#miniBasket .empty{padding-top:32px;}
#miniBasket .full{padding-top:48px;}
#miniBasket .items{width:142px;} 
#miniBasket .items li{padding-bottom:6px; margin-bottom:6px; background:url(../i/miniBasketDots.gif) repeat-x left bottom;}
#miniBasket .description{float:left; width:84px;}
#miniBasket .spinner{position:relative; float:right; width:50px; height:29px; background:url(../i/spinnerBack.gif);}
#miniBasket .spinner .quantity{position:absolute; left:6px; top:9px; width:22px; height:16px; color:White; text-align:right; border:none; background:none;}
#miniBasket .spinner .plus{font-size:0; position:absolute; left:35px; top:3px; width:12px; height:11px;}
#miniBasket .spinner .plus a{display:block; width:12px; height:11px; background:url(../i/spinnerPlus.gif) 0px 0px;}
#miniBasket .spinner .plus a:hover{background:url(../i/spinnerPlus.gif) 0px -11px;}
#miniBasket .spinner .minus{font-size:0; position:absolute; left:35px; top:15px; width:12px; height:11px;}
#miniBasket .spinner .minus a{display:block; width:12px; height:11px; background:url(../i/spinnerMinus.gif) 0px 0px;}
#miniBasket .spinner .minus a:hover{background:url(../i/spinnerMinus.gif) 0px -11px;}
#miniBasket .summary{font-size:1.1em; color:#5C6263; margin-bottom:8px;}
#miniBasket .summary .label{float:left; width:60px;}
#miniBasket .summary .value{float:left; width:60px;}
#miniBasket .summary .total .label{color:#25393D; font-weight:bold;}
#miniBasket .summary .total .value{color:#25393D; font-weight:bold;}
#miniBasket .btnCheckout a{display:block; width:143px; height:32px; background:url(../i/btnMenuCheckout.gif) no-repeat 0px 0px;}
#miniBasket .btnCheckout a:hover{background:url(../i/btnMenuCheckout.gif) no-repeat 0px -32px;}
#miniBasket .btnEditBasket a{display:block; width:143px; height:32px; background:url(../i/btnMenuEditYourBasket.gif) no-repeat 0px 0px;}
#miniBasket .btnEditBasket a:hover{background:url(../i/btnMenuEditYourBasket.gif) no-repeat 0px -32px;}

.loginInputWrapper{position:relative; width:142px; height:29px; background:url(../i/sideMenuInputWrapper.gif) repeat-x;}
.loginTextBox{position:absolute; left:3px; top:3px; width:136px; height:18px; background:url(../i/loginInputBack.gif);}
.loginTextBox input{width:126px; height:14px; padding:2px; margin-left:2px; font-size:1.1em; color:White; border:none; background:none;}

#loggedOut .buttons{margin-top:5px;}
#loggedOut .btnLogin a{display:block; width:143px; height:32px; background:url(../i/btnMenuLogin.gif) no-repeat 0px 0px;}
#loggedOut .btnLogin a:hover{background:url(../i/btnMenuLogin.gif) no-repeat 0px -32px;}
#loggedOut .btnForgotPassword a{display:block; width:143px; height:21px; background:url(../i/btnMenuForgottenPassword.gif) no-repeat 0px 0px;}
#loggedOut .btnForgotPassword a:hover{background:url(../i/btnMenuForgottenPassword.gif) no-repeat 0px -21px;}
#loggedOut .btnNewAccount a{display:block; width:143px; height:21px; background:url(../i/btnMenuRegisterNewAccount.gif) no-repeat 0px 0px;}
#loggedOut .btnNewAccount a:hover{background:url(../i/btnMenuRegisterNewAccount.gif) no-repeat 0px -21px;}

/* Home Page */

#homePicture{float:right; margin:0 0 20px 20px;}
#homeIntro{font-size:1.1em;}
#pageHome h1{font-size:2.1em; font-weight:bold;}

/* Category Page */

.paging{width:200px; margin:auto; margin-top:20px;}
.paging .first{float:left; width:21px; margin-right:1px;}
.paging .previous{float:left; width:21px; margin-right:1px;}
.paging .numbers{float:left; width:112px; text-align:center; color:#25393D; font-size:1.2em; padding-top:2px; font-weight:bold;}
.paging .numbers a{color:#9A9892; padding:0 3px;}
.paging .numbers .current{padding:0 3px;}
.paging .next{float:left; width:21px; margin-left:1px;}
.paging .last{float:left; width:21px; margin-left:1px;}

.paging .first a{display:block; height:21px; background:url(../i/btnPagingFirst.gif) no-repeat 0px 0px;}
.paging .first a:hover{background:url(../i/btnPagingFirst.gif) no-repeat 0px -21px;}
.paging .previous a{display:block; height:21px; background:url(../i/btnPagingPrevious.gif) no-repeat 0px 0px;}
.paging .previous a:hover{background:url(../i/btnPagingPrevious.gif) no-repeat 0px -21px;}
.paging .next a{display:block; height:21px; background:url(../i/btnPagingNext.gif) no-repeat 0px 0px;}
.paging .next a:hover{background:url(../i/btnPagingNext.gif) no-repeat 0px -21px;}
.paging .last a{display:block; height:21px; background:url(../i/btnPagingLast.gif) no-repeat 0px 0px;}
.paging .last a:hover{background:url(../i/btnPagingLast.gif) no-repeat 0px -21px;}

/* Product Page */

#product{width:560px;}
#productColumnsLeft{float:left; width:140px;}
#productColumnsRight{float:left; margin-left:10px; width:410px;}

#product .photos{width:140px; padding-top:10px; background:url(../i/productBack.gif) no-repeat;}
#product .photos .words{font-size:1.1em; text-align:center;}
#product .photos .words a{color:#25393D;}
#product .thumb{display:block; text-align:center; margin-bottom:25px; height: 114px;}
#product .buttons{margin-top:10px; text-align:center; margin-bottom: 10px; }
#product .buttons .Variants {text-align: left; margin: 5px; margin-bottom: 10px;}
#product .btnAddToBasket a{display:block; float: left; width:136px; height:32px; background:url(../i/btnAddToBasket.gif) no-repeat 0px 0px;}
#product .btnAddToBasket a:hover{background:url(../i/btnAddToBasket.gif) no-repeat 0px -32px;}
#product .btnEmailToAFriend a{display:block; float: left; width:136px; height:32px; background:url(../i/btnEmailToAFriend.gif) no-repeat 0px 0px;}
#product .btnEmailToAFriend a:hover{background:url(../i/btnEmailToAFriend.gif) no-repeat 0px -32px;}

#product .price{color:#B52F51; font-size:1.4em; font-weight:bold; margin-bottom:8px;}
#product .PriceOff{color:black; text-decoration: line-through; font-weight: normal;}
#product .priceInline{display: inline; color:#B52F51; font-size:1.4em; font-weight:bold; margin-bottom:8px;}
#product .Price{display: block;}
#product .description{font-size:1.1em;}
#product .details{background:#F0E3E2; padding:15px; color:#892347; font-size:1.1em; border:solid 2px white;}
#product .details tr td{padding:3px 0px;}
#product .details .label{font-weight:bold; padding-right:15px;}

/* Links Page */

#pageLinks .link {text-decoration: none; font-weight: bold; color:#892347;}

/* Checkout confirm */

#pageCheckout .confirmaddress{float:left; width:140px; padding-top:10px;}
#pageCheckout .link {text-decoration: none; font-weight: bold; color:#892347;}
#pageCheckout .checkoutAddresses {margin-bottom: 10px; margin-top: 10px;}
#pageCheckout .addressBar {margin-bottom: 10px; font-size: 1.1em; display: block;}
#pageCheckout .addressBar input {margin-right: 5px; position: relative; top: 2px;}
#pageCheckout .textBox input{width:260px; height:14px; padding:2px 5px; color:White; font-size:1.1em; border:none; background:#67909D url(../i/formTextBoxBack.gif) repeat-x left top; }
#pageCheckout #checkoutConfirmDetails .dropDownList select{width:200px; padding:2px 0 2px 5px; color:White; font-family:Segoe UI; font-size:1.1em; border:none; background:#67909D;}
#pageCheckout #checkoutConfirmDetails td {padding-bottom: 10px;} 
#pageCheckout #checkoutPromotion {margin-bottom: 15px;} 

/* Order History */

#pageOrderHistory .Order {margin-bottom: 20px;}
#pageOrderHistory .OrderTable {width:100%; border-collapse:collapse;}
#pageOrderHistory .OrderTable td{ padding:5px;}
#pageOrderHistory .OrderDetail td{ border-bottom:1px solid #B7DDF7;}

/* Account Form */

#pageAccountForm .accountForm {margin-bottom: 40px;}
#pageAccountForm .link {text-decoration: none; font-weight: bold; color:#892347;}
#pageAccountForm .addressBar {margin-bottom: 10px; font-size: 1.1em; display: block;}

/* Forms */

.miiForm{width:500px;}
.miiForm field{}
.miiForm textBox{}
.miiForm .row{zoom:1; border:solid 2px white; margin-bottom:4px; background:#D0E1E1 url(../i/formRowBack.gif) repeat-y right top;}
.miiForm .question{float:left; width:184px; font-size:1.1em; margin:10px;}
.miiForm .inputWrapper{float:right; width:276px; margin:7px;}
.miiForm .inputBorder{background:white; padding:3px;}
.textBox input{width:260px; height:14px; padding:2px 5px; color:White; font-size:1.1em; border:none; background:#67909D url(../i/formTextBoxBack.gif) repeat-x left top; }
.miiForm .textArea textarea{width:265px; padding:2px 0 2px 5px; color:White; font-family:Segoe UI; font-size:1.1em; border:none; background:#67909D url(../i/formTextBoxBack.gif) repeat-x left top;}
.miiForm .dropDownList select{width:270px; padding:2px 0 2px 5px; color:White; font-family:Segoe UI; font-size:1.1em; border:none; background:#67909D;}
.miiForm .errorMsgWrapper{display:none;}
.checkBox input{height:14px; padding:2px 5px; font-size:1.1em; border:none; background:#67909D url(../i/formTextBoxBack.gif) repeat-x left top; }
.checkBox .inputBorder {border:solid 2px white; text-align:center; padding:2px; margin-right:229px; background:#67909D url(../i/formTextBoxBack.jpg) repeat-x;}

.error .row{zoom:1; color:#990000; border:solid 2px white; margin-bottom:4px; background:#FAEBED url(../i/formRowBackError.gif) repeat-y right top;}
.miiForm .error input{background:#D20000 url(../i/formTextBoxBackError.gif) repeat-x left top;}
.miiForm .error textarea{background:#D20000 url(../i/formTextBoxBackError.gif) repeat-x left top;}
.miiForm .error select{background:#D20000;}
.miiForm .error .errorMsgWrapper{display:block; height:20px; padding:2px 0 8px 23px; margin-top:5px; background:url(../i/errorMessageIcon.gif) no-repeat;}
.miiForm .error .errorMsg{}


.miiForm .buttonRow{text-align:center; padding:3px; border:solid 2px white; background:#E9E9E9;}
.miiForm .buttonRow .btnMenuLogin a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnMenuLogin.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnSendMessage a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnSendMessage.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnPasswordReminder a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnRemindMe.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnRegister a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnRegisterMe.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnUpdate a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnUpdate.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnAddAddress a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnAddAddress.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnContinue a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnContinue.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnMakePayment a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnMakePayment.gif) no-repeat 0px 0px;}
.miiForm .buttonRow .btnLogin a{display:block; width:143px; height:32px; margin: 5px auto 5px auto; background:url(../i/btnLogin.gif) no-repeat 0px 0px;}

.miiForm .buttonRow  a:hover{background-position: 0px -32px;}


/* --- OVERLAY --- */
.overlayWrapper {position: absolute; top: 0px; left: 0px; width: 968px; background-color: #F2F0EE; height: 100%;}
#overlay { width: 606px; margin: 0 auto; background: #f2f0ee; margin-top: 50px; }
#overlay IMG { border: none;  }
#overlay #overlayContainer { width: 586px; height: 435px; position: relative; margin: 0 auto; background: transparent url(../i/bg_overlay.gif) no-repeat center top; }
#overlay #animals { width: 560px; padding: 10px 0 0 10px; text-align: center; }
#overlay #animals UL { margin: 0; padding: 0; list-style: none; }
#overlay #animals LI { display: inline; }
#overlay #enter { position: absolute; right: 50px; bottom: 49px; }
#overlay #overlayFooter { margin: 0; padding: 10px 0 20px 0; text-align: center; color: #a5b0b2; font-size: 1.1em; }
#overlay #overlayFooter UL { list-style: none; margin: 0; padding: 0; }
#overlay #overlayFooter LI { display: inline; margin: 0 0.3em; padding: 0; }
#overlay #overlayFooter LI IMG { vertical-align: middle; }
#overlay #overlayFooter A, #overlay #overlayFooter A:link, #overlay #overlayFooter A:visited, #overlay #overlayFooter A:hover { color: #a5b0b2; font-weight: bold; text-decoration: none; }
