/*=================================== START GLOBAL CSS ===================================*/
@import 'fonts.css';
* { margin: 0; padding: 0; border: 0 none; outline: 0; list-style-type: none; }
.css3, a.product .box { transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; }
body { background: url("../img/body.gif") repeat-x scroll center top #E9E9E9; color: #B0AFAF; font-family: Arial,Helvetica,sans-serif; font-size: 12px; }
.cl { clear: both; display: block; width: 100%; height: 0; line-height: 0; }
.fl { float: left; }
.fr { float: right; }
.h10 { clear: both; display: block; width: 100%; height: 10px; }
.h20 { clear: both; display: block; width: 100%; height: 20px; }
h1, h2, h3, h4, h5 { font-weight: normal; text-transform: uppercase; }
a, a:hover { text-decoration: none; }

#main { position: relative; width: 1000px; height: auto; margin: 0 auto; }

.line { display: block; clear: both; width: 100%; height: 1px; background: #bbb; box-shadow: 0px 0px 5px #555; margin: 10px 0; }
/*=================================== END GLOBAL CSS ===================================*/



/*=================================== START HEADER ===================================*/
.header { padding-top: 35px; }
.header-top { position: relative; width: 100%; height: 107px; background: url("../img/header-top.gif") repeat-x scroll center bottom transparent; }
.header-top-left { height: 107px; background: url("../img/header-left-top.gif") no-repeat scroll left bottom transparent; }
.header-top-right { width: 100%; height: 107px; background: url("../img/header-right-top.gif") no-repeat scroll right bottom transparent; }

.header-bottom { position: relative; width: 100%; height: 23px; background: url("../img/header-bottom.gif") repeat-x scroll center bottom transparent; }
.header-bottom-left { height: 23px; background: url("../img/header-left-bottom.gif") no-repeat scroll left bottom transparent; }
.header-bottom-right { height: 23px; background: url("../img/header-right-bottom.gif") no-repeat scroll right bottom transparent;
    width: 100%; }

.login { position: absolute; top: 10px; left: 330px; font-size: 14px; text-transform: uppercase; font-weight: bold; color: #333; z-index: 999; width: 250px; }
.login .field { margin: 2px 0; }
.login .field span { text-transform: none; text-align: right; font-size: 12px; color: #444; width: 50px; display: block; float: left; margin-right: 5px; }
.login .field .inputText { display: block; float: right; border: 1px solid #ddd; width: 190px; }
.login .field .submit { cursor: pointer; background: #B02352; color: #fff; font-size: 12px; padding: 2px 10px; display: block; float: right; }
.login .link { margin: 5px 0px 5px 0px; text-align: center; }
.login .link a { color: #2d2d2d; text-decoration: none; font-size: 12px; text-transform: none; }
.login .link a:hover { color: #bb0000; text-decoration: underline; }
.login .error { display: block; position: absolute; margin: -30px 0 0 0; background: #BF6665; padding: 2px 5px; color: #fff; text-align: center;  font-size: 12px; font-weight: normal; text-transform: none; } 


.logo { position: absolute; bottom: -3px; left: 20px; }
.logo a img { width: 270px; height: 129px; }

.searchForm { position: relative; float: right; margin: 20px 20px 0 0; height: 30px; }
.searchForm span { height: 30px; line-height: 30px; display: block; float: left; color: #888; text-transform: uppercase; font-size: 14px; font-weight: bold; padding: 0 10px 0 0; }
.searchForm .searchField { width: 185px; height: 30px; float: left; background: url("../img/searchField.gif") no-repeat scroll 0 0 transparent; border: 0 solid; color: #B2B2B2; padding: 8px 10px; }
.searchForm .searchButton { width: 36px; height: 30px; float: left; background: url("../img/searchButton.gif") no-repeat scroll 0 0 transparent; }

.top-menu { position: absolute; bottom: 7px; right: 56px; height: 39px; }
.top-menu li { display: block; float: left; }
.top-menu li a { display: block; height: 39px; line-height: 39px; color: #222; background: url("../img/top-menu.gif") repeat-x left top; }
.top-menu li a:hover { color: #222; }
.top-menu li a span { display: block; padding: 0 20px; background: url("../img/top-menu-sep.gif") no-repeat scroll right top transparent; }
.top-menu li a span.second { background: none; }
/*=================================== END HEADER ===================================*/



/*=================================== START NAVMENU ===================================*/
.navmenu { position: relative; width: 100%; height: 58px; background: url("../img/navmenu.gif") repeat-x scroll center top transparent; }
.navmenu .menu { width: 100%; }
.navmenu .menu li { display: block; float: left; }
.navmenu .menu li a { display: block; padding: 0 30px; font-size: 14px; text-transform: uppercase; line-height: 58px; background: url("../img/menu.gif") repeat-x scroll center top transparent; color: #FEFEFE; }
.navmenu .menu li a:hover { display: block; color: #FDDA18; background: url("../img/menu-hover.png") repeat-x scroll center top transparent; }
.navmenu .menu li a span { display: block; background: url("../img/menu-sep1.gif") no-repeat scroll right 0 transparent; }
.navmenu .menu li a span span { display: block; background: url("../img/menu-sep2.gif") no-repeat scroll 0 0 transparent; padding: 0 25px; }

.cart { position: absolute; top: 20px; right: 20px; color: #fff; font-size: 14px; }
/*=================================== END NAVMENU ===================================*/



/*=================================== START SECTION ===================================*/
.section { background: url("../img/section.gif") repeat-x scroll center bottom #FFFFFF; border-radius: 20px; padding: 20px; margin: 20px 0 0 0; }
/*=================================== END SECTION ===================================*/




/*=================================== START REGISTRATION ===================================*/
.registration { position: relative; }
.orders .success { margin: 10px 0px 0px 0px; background: #FBD20D; border: 1px solid #5eae00; padding: 10px; text-align: center; color: #000; font-size: 14px; }
.registration .success { margin: 10px 0px 0px 0px; background: #FBD20D; border: 1px solid #5eae00; padding: 10px; text-align: center; color: #000; font-size: 14px; }
.registration table { width: 600px; margin: 0px auto; }
.registration table tr {  }
.registration table tr td { font-size: 12px; }
.registration table tr td.left { text-align: right; padding: 0 20px 0 0; color: #666; }
.registration table tr td input[type=text],
.registration table tr td input[type=password] { border: 1px solid #bbb; padding: 3px; width: 373px; margin: 0px 0px 3px 0px; }
.registration table tr td input[type=submit],
.registration table tr td input[type=reset] { border: 1px solid #9d9d9d; padding: 3px; background: #535353; cursor: pointer; color: #fff; font-size: 12px; }
.registration table tr .error { color: red; }

.user { position: relative; display: block; margin: 20px 0 0 0; }
.user .username { display: block; font-size: 13px; color: #666; font-weight: normal; text-transform: none; }
.user .username strong { font-size: 17px; color: #000; }
.user .link { display: block; margin: 10px 0 0 0; padding: 0; }
.user .link a { text-decoration: underline; }
/*=================================== END REGISTRATION ===================================*/





/*=================================== START CART TABLE ===================================*/
.cartTable { width: 100%; }
.cartTable tr th { padding: 5px; background: #444343; color: #fff; font-size: 15px; font-weight: normal; }
.cartTable tr td { padding: 5px; color: #333; background: #e3e3e3; color: #222; text-align: center; }

.order { position: relative; display: block; float: right; }
.order .row { float: right; text-align: right; }
.order .count { background: #FAC801; padding: 0 20px; height: 30px; line-height: 30px; color: #000; font-size: 16px; }
.order .orderButton { background: #B02352; color: #fff; font-size: 14px; padding: 0 20px; height: 30px; line-height: 30px; margin: 0 0 0 5px; cursor: pointer; }
/*=================================== END CART TABLE ===================================*/




/*=================================== START ASIDE ===================================*/
.aside { width: 230px; height: auto; float: left; }
.aside .cats-list { background: #3D3D3D; border-radius: 10px; border: 10px; padding: 0 0 10px 0; }
.aside .cats-list h2 { color: #fff; font-size: 20px; padding: 10px 20px; }
.aside .cats-list ul {  }
.aside .cats-list ul li { display: block; color: #fff; }
.aside .cats-list ul li a { display: block; color: #fff; font-size: 13px; margin-left: 5px; padding: 4px 10px; border-bottom: 1px solid #333; list-style-type: circle; }
.aside .cats-list ul li a:hover { color: #FACB04; }

.aside .banner { width: 230px; margin: 10px 0; border-radius: 10px; }
/*=================================== END ASIDE ===================================*/



/*=================================== START ASIDE ===================================*/
.content { width: 700px; height: auto; float: right; }
.content h2 { display: block; color: #333; background: url('../img/title.gif') repeat-x; border-radius: 10px; line-height: 54px; height: 54px; padding: 0 20px; text-shadow: 0px 0px 2px #bbb; font-size: 24px; }
.content h2 a { color: #333; }
.content h3 { font-weight: bold; font-size: 17px; padding: 5px 0; display: block; color: #000; }
.content p { color: #222; font-size: 14px; padding: 5px 0; }
.content ul li { margin-left: 20px; color: #222; font-size: 14px; padding: 2px 0; }

.content .noProducts { display: block; padding: 20px; color: #bb0000; font-size: 14px; font-style: italic; }

.content .products { width: 100%; text-align: center; }
.content a.product { display: block; float: left; position: relative; width: 160px; border: 1px solid #ddd; border-radius: 10px; vertical-align: top; margin: 3px; }
.content a.product:hover .box { background: #555; }
.content a.product img { width: 150px; height: 113px; margin: 5px; }
.content a.product .box { background: #3D3D3D; text-align: left; }
.content a.product .title { color: #FACB04; font-size: 13px; padding: 3px; font-weight: bold; }
.content a.product .desc { color: #fff; font-size: 11px; padding: 3px; }
.content a.product .price { color: #fff; font-size: 15px; padding: 3px; font-weight: bold; }




.showProduct { position: relative; display: block; padding: 20px; color: #555; font-size: 13px; }
.showProduct img { float: left; margin: 10px; border: 1px solid #FAC902; padding: 2px; border-radius: 3px; }
.showProduct .desc { display: block; padding: 10px 0; font-size: 22px; color: #333; }
.showProduct .price { float: left; font-size: 16px; }
.showProduct .price strong {  }
/*=================================== END ASIDE ===================================*/



/*=================================== START ASIDE ===================================*/
.footer { width: 100%; height: auto; padding: 20px 0; }
.footer .fl { padding: 0 0 0 20px; color: #555; }
/*=================================== END ASIDE ===================================*/