/*------------------------------------------------------------------
[Master Stylesheet]
Project:Mates Site
Version:1
Author:Cristian Sans
Company:Gimmicklab
Date:26/06/08
Last change:30/09/09
URL:http://www.mates.es
Notes:Fixes for IE6 in a separate stylesheet
Some fixes for IE7 also included.
A Firefox 2 targetting rule needed.
Safari specific rules at bottom.
Targetting IE7 for the breadcrumb
Run FixME to see them.
-------------------------------------------------------------------*/
@import "reset.css";/* Main Estructure */
html,body,div#container{height:100%;}
body{background:#002f67 url(../img/main-bg.png) repeat-x 0 82px;font-size:62.5% !important;color:#fff;}
/* Tipography */
body,h1,h2,h3,h4,h5,h6{font-family:Helvetica,Verdana,sans-serif;}
/* Layout */
div#container{width:100%;min-width:975px;}
div#header{background:transparent url(../img/header-bg.png) repeat-x top left;height:82px;}
div#main{min-height:440px;}
div#footer{background:transparent url(../img/footer-bg.png) repeat-x bottom left;width:100%;height:172px;clear:both;position:relative;}
div#footer ul{background:transparent url(../img/skyline.png) no-repeat 0 0;margin:0 auto;width:975px;height:47px;padding-top:125px;}
div.wrapper{margin:0 auto;width:975px;}
/* Block Elements */
h1,h2,h3,h4{color:#fff;font-weight:normal;}
h1{font-size:2.8em;float:left;display:inline;margin-top:25px;}
h1 a{display:block;background:transparent url(../img/logo-mates.png) no-repeat top left;width:183px;height:48px;text-indent:-9000px;line-height:3em;}
h2{font-size:2.2em;}
h3{font-size:1.8em;font-weight:bold;}
h4{font-size:2.6em;font-weight:normal;}
p{font-size:1.2em;line-height:1.4em;margin:15px 0 15px 0;}
ul,ol{font-size:1.2em;line-height:1.4em;}
ol li{list-style-type:decimal;list-style-position:outside;margin-left:20px;}
ul ul,ol ol{font-size:1em;}
li{list-style:none;}
span{font-size:1em;}
img{border:none;}
input{outline:none;}
hr{display:none;}
a{color:#fff;font-size:1em;text-decoration:underline;outline:none;}
a:hover{text-decoration:none;}
/* Menu */
div#header ul{float:left;font-size:1.4em;margin:47px 0 0 105px;}
div#header li{display:block;float:left;background:url(../img/tab1.png) no-repeat bottom left;padding:0 0 0 20px;height:35px;margin-left:-4px;*font-weight:bold;/* FIXME IE renderizes better with bold */}
div#header li a{background:url(../img/tab2.png) no-repeat bottom right;display:block;float:left;text-align:center;line-height:3em;padding:0 20px 0 0;height:35px;color:#fff;text-decoration:none;letter-spacing:.3px;color:#666;}
div#header li:hover,div#header li.active{background-position:top left;}
div#header li:hover a,div#header li.active a,div#header li a:hover{background-position:top right;color:#fff;}
/* Footer */
div#footer li{display:block;float:right;font-size:1em;margin:10px 0 0 15px;}
div#footer a{margin-left:5px;}
div#footer li.copy{float:left !important;margin-left:60px;font-size:1.1em;margin-top:12px;color:#666;}
div#footer label{margin-right:5px;}
div#cursa{width:270px;height:40px;position:absolute;top:45px;left:65%;}
div#cursa span{font-size:1.3em;font-weight:bold;display:block;color:#666;text-indent:5px;}
div#cursa a{background:transparent url(../img/cursa.png) no-repeat top left;display:block;width:265px;height:26px;margin-bottom:3px;text-indent:-9999px;}
/* Homepage */
div.home{padding-top:20px;}
div.home div{margin-left:60px;position:relative;}
div.home ul{width:645px;margin:-100px 0 0 105px;position:absolute;*position:static;/* IE7 */}
div.home object{clear:both;}
div.home li{background:transparent url(../img/home-box.png) no-repeat top left;width:151px;height:133px;display:block;float:left;margin:5px;position:relative;}
div.home h2{font-size:1em;padding:10px 0 0 15px;}
div.home li a{display:block;width:123px;height:89px;text-indent:-9000px;margin:5px 0 0 14px;}
div.home li a#history{background:transparent url(../img/history-btn.png) no-repeat top left;}
div.home li a#shop{background:transparent url(../img/shop-btn.png) no-repeat top left;}
div.home li a#catalogue{background:transparent url(../img/catalogue-btn.png) no-repeat top left;}
div.home li a#customize{background:transparent url(../img/customize-btn.png) no-repeat top left;}
/* Breadcrumb */
h2#breathcrumb{font-size:1.2em;color:#fff;padding:25px 0 15px 285px;}
h2#breathcrumb a{text-decoration:none;border-bottom:2px solid #666;margin:0 5px;}
h2#breathcrumb a:hover{border-bottom:none;}
h2#breathcrumb span#current{margin-left:5px;font-weight:bold;}
h2#breathcrumb span#title{color:#666;margin:0;}
/* Sidebar */
div#sidebar{width:193px;float:left;margin-top:3px;}
div#sidebar h2{background:transparent url(../img/submenu1-first.png) no-repeat 0 0;display:block;height:23px;padding:0 10px;font-size:1.3em;line-height:1.8em;margin:1px 0;}
div#sidebar ul#submenu{font-size:1.3em;margin-bottom:25px;}
div#sidebar ul#submenu li{background:transparent url(../img/submenu1.png) no-repeat 0 0;}
div#sidebar ul#submenu li#first{background:transparent url(../img/submenu1-first.png) no-repeat 0 0;}
div#sidebar ul#submenu ul li{background:transparent url(../img/submenu2.png) no-repeat 0 0;}
div#sidebar ul#submenu li a{display:block;height:23px;text-decoration:none;padding:0 10px;line-height:1.8em;margin:1px 0;}
div#sidebar dl{background:transparent url(../img/shops-bg.png) repeat-y 0 0;display:block;padding:0 10px 10px 10px;font-size:1.2em;line-height:1.3em;}
div#sidebar dt{padding-top:10px;}
div#sidebar dd,div#sidebar dt,div#sidebar p{background:transparent url(../img/shops-bg.png) repeat-y top left;}
div#sidebar p{margin:0;padding:10px;}
div#sidebar p a{background:transparent url(../img/shops-bg.png) repeat-y top left;display:block;padding:10px 0 5px 0;margin-top:5px;line-height:.4em;}
div#sidebar p#custom{background:none !important;padding:0 !important;font-size:1.3em;}
div#sidebar p#custom a{background:transparent url(../img/customlink-btn.png) no-repeat 0 50px;display:block;width:181px;height:185px;margin:20px 0 0 0;color:#fff;font-size:1.4em;line-height:1em;font-weight:bold;letter-spacing:1px;text-indent:25px;text-decoration:none;}
div#sidebar p#custom a span{display:block;margin-left:15px;}
div#sidebar ul#novedades{font-size:1.3em;margin-bottom:20px;}
div#sidebar ul#novedades li{background:transparent url(../img/submenunovedades.png) no-repeat 0 0;}
div#sidebar ul#novedades li a{display:block;height:23px;text-decoration:none;padding:0 10px;line-height:1.8em;margin:1px 0;}
/* Catalogue */
div#catalogue{float:right;width:700px;padding:0 0 0 75px;}
div#catalogue dl{background:transparent url(../img/catalogue-box.png) no-repeat top left;float:left;width:197px;height:169px;padding:10px 0 0 8px;margin:0 15px 15px 0;color:#020a10;}
div#catalogue dl a{color:#020a10;text-decoration:none;}
div#catalogue dl a:hover{text-decoration:underline;}
div#catalogue dt{width:190px;height:116px;}
div#catalogue dd{margin:10px 0 0 10px;font-size:1.4em;font-weight:bold;margin-bottom:3px;padding-right:20px;}
div#catalogue dd.ref,div#catalogue dd.price{font-size:1.2em;font-weight:normal;margin:0 0 0 10px;}
div#catalogue dd.ref{float:left;}
div#catalogue dd.price{float:right;margin-left:0;}
p.pagination{clear:both;padding:0 50px 0 0;font-size:1.3em;line-height:2.6em;margin:0 auto;width:auto;text-align:center;}
p.pagination a,p#back a{background:transparent url(../img/pagination1.png) no-repeat 0 0;color:#666;text-decoration:none;padding:0 0 0 15px;height:35px;display:inline-block;}
p.pagination,x:-moz-any-link{/* FIXME Only for Firefox 2 and override IE */
padding-top:25px;*padding-top:0;}
p.pagination,x:-moz-any-link,x:default{/* Overriding Firefox 3 */
padding-top:0;}
p.pagination a,x:-moz-any-link,p#back a,x:-moz-any-link{/* Only for Firefox 2 and override IE */
padding:10px 0 10px 15px;}
p.pagination a,x:-moz-any-link,x:default,p#back a,x:-moz-any-link,x:default{/* Overriding Firefox 3 */
padding:0 0 0 15px;}
p.pagination a{margin-top:25px;}
p#back{margin-top:0;}
p.pagination span,p#back span{background:transparent url(../img/pagination2.png) no-repeat top right;display:inline-block;padding:0 15px 0 0;height:35px;cursor:pointer;}
p.pagination span,x:-moz-any-link,p#back span,x:-moz-any-link{/* Only for Firefox 2 and override IE */
padding:10px 15px 10px 0;*padding:0 0 0 15px;}
p.pagination span,x:-moz-any-link,x:default,p#back span,x:-moz-any-link,x:default{/* Overriding Firefox 3 */
padding:0 15px 0 0;}
p.pagination a:hover,p.pagination a.current,p#back a:hover{color:#fff;background:transparent url(../img/pagination1.png) no-repeat 0 -36px;}
p.pagination a:hover span,p.pagination a.current span,p#back a:hover span{background:transparent url(../img/pagination2.png) no-repeat right -36px;}
p#back{font-size:1.3em;line-height:2.6em;}
div#productimg{background:transparent url(../img/catalogue-main-header.png) no-repeat top left;padding:17px 0 20px 0;width:640px;height:200px;}
div#productimg img{background:transparent url(../img/catalogue-main-bg1.png) repeat-y top left;padding:0 10px;}
div#perso{width:600px;background:transparent url(../img/catalogue-main-bg1.png) repeat-y top left;text-align:center;padding-right:40px;}
div#perso a{background:transparent url(../img/perso-button.png) no-repeat top left;width:129px;height:25px;font-size:1.3em;text-align:center;line-height:2em;display:block;margin-left:480px;text-decoration:none;}
div#perso a:hover{text-decoration:underline;}
div#details{background:transparent url(../img/catalogue-main-bg2.png) repeat-y top left;width:560px;padding:20px 40px 0px 40px;color:#020a10;clear:both;}
div#details h2{color:#499dbe;font-size:1.9em;font-weight:bold;margin-bottom:15px;}
div#details h2 span{color:#020a10;display:block;font-weight:normal;margin-top:5px;font-size:.7em;}
div#details h3{clear:both;font-size:1.3em;color:#020a10;}
div#details div{width:45%;float:left;}
div#details div#colors{float:right !important;padding-top:22px;}
div#details div#colors ul{margin:10px 0 5px 0;}
div#details div#colors li span{margin-top:3px !important;}
div#details div#colors li{float:left;margin:0 10px 10px 0;}
div#details div#colors li a{display:block;width:102px;height:63px;margin-bottom:5px;border:1px solid #02070b;}
div#details div#colors img{border:1px solid #edeeee;}
div#details div#colors li span{margin-left:5px;}
div#details div p,div#details div ol{margin:5px 0 15px 0;}
div#details div ol {*margin-left:5px;}
div#colors a{font-size:1.3em;}
div#colors a#sizes{color:#499dbe;}
div#colors form {margin-bottom: 25px;}
div#colors a#addcart{background:transparent url(../img/buy-button.png) no-repeat top left;display:block;width:108px;height:14px;margin:0 0 15px 0;padding:11px 0 10px 0;text-align:center;text-decoration:none;}
div#colors a#shoppingcart:hover{text-decoration:underline;}
div#colors select{margin:5px 0 15px 0;}
div#catalogue p#back{background:transparent url(../img/catalogue-main-footer.png) no-repeat top left;padding:40px 0 0 25px;margin:0 0 30px 0;}
/* No products */
div#noproduct{margin-left:8px;}
div#noproduct p{font-size:1.4em;}
/* Shopping Cart */
div#cart h3{background:transparent url(../img/submenu1-first.png) no-repeat 0 0;font-size:1.3em;line-height:1.8em;font-weight:normal;width:173px;height:23px;padding:0 10px;margin-bottom:1px;}
div#cart ul{background-color:#c9cdd2;padding:5px 10px;color:#000;}
div#cart ul li{line-height:1.6em;clear:both;}
div#cart ul li span{display:block;float:left;}
div#cart ul li span.quantity{float:right;padding-right:2px;}
div#cart li#units{font-weight:bold;margin-top:5px;padding-top:7px;border-top:1px solid #999;}
div#cart li#total{font-weight:bold;margin-bottom:5px;}
div#cart a#shoppingcart,tr#checkout a,.form input#send{background:transparent url(../img/buy-button.png) no-repeat top left;font-size:1.1em;line-height:1.2em;color:#fff;display:block;width:108px;height:14px;padding:11px 0 10px 0;margin:0 0 5px 30px;text-align:center;text-decoration:none;}
div#cart a#shoppingcart:hover,tr#checkout a:hover{text-decoration:underline;}
div#cart a{color:#000;}
div#catalogue table{background:transparent url(../img/cart-right.png) no-repeat top right;font-size:1.3em;line-height:1.8em;width:100%;margin-top:3px;}
div#catalogue caption{display:none;}
div#catalogue thead tr{background:transparent url(../img/cart-left.png) no-repeat top left;height:24px;}
div#catalogue thead td span{background:transparent url(../img/submenu1.png) repeat-x top left;display:block;}
div#catalogue thead td.product,div#catalogue tbody td.product{width:35%;}
div#catalogue thead td.delete,div#catalogue tbody td.delete{width:5%;}
div#catalogue thead td.product span{margin-left:10px;padding-left:5px;}
div#catalogue thead td.delete span{text-indent:-9999px;margin-right:10px;}
div#catalogue tbody{background-color:#c9cdd2;color:#000;}
div#catalogue tbody tr{margin-left:10px;}
div#catalogue tbody td{padding:10px 0 0 0;}
div#catalogue tbody td span{display:block;border-bottom:1px solid #999;padding-bottom:10px;}
div#catalogue tbody td.product span{margin-left:15px;}
div#catalogue tbody td.product a{color:#000 !important;}
div#catalogue tbody td.delete span{margin-right:15px;}
div#catalogue tbody td.delete a{background:transparent url(../img/dele-btn.png) no-repeat 0 4px;width:15px;height:auto;display:block;text-indent:-9999px;}
div#catalogue tbody td a{color:#2f83a4;}
div#catalogue tbody td.quantity{width:15%;}
div#catalogue tbody td.quantity input{width:20px;text-align:center;padding:2px;border:1px solid #999;}
div#catalogue tbody td.quantity input:focus{border:1px solid #2f83a4;color:#2f83a4;font-weight:bold;}
div#catalogue tbody td.size span,div#catalogue tbody td.price span,div#catalogue tbody td.quantity span,tr#subtotal span.price{text-indent:3px;}
tr#subtotal span{font-size:1.1em;font-weight:bold;padding:0 !important;letter-spacing:.05em;}
tr#subtotal span.total{text-align:right;padding-right:5px;}
tr#checkout td{padding:0 0 20px 0 !important;}
tr#checkout a{font-size:1em;line-height:1.1em;color:#fff !important;margin:0;float:right;}
div#catalogue p.return{background:none !important;padding:0 !important;margin:15px 0 0 5px !important;}
tr#checkout span,tr#subtotal span{border:0 !important;}
/* Form */
div#catalogue.form,div#noproduct{background:transparent url(../img/cart-right.png) no-repeat top right;color:#000;margin-bottom:0 !important;}
div.form h3,div#noproduct h3{background:transparent url(../img/cart-left.png) no-repeat top left;font-size:1.3em;line-height:1.8em;font-weight:normal;margin-top:3px;}
div.form h3 span,div#noproduct h3 span{background:transparent url(../img/submenu1.png) repeat-x top left;height:24px;display:block;margin:0 10px;}
div.form fieldset{padding-bottom:15px;}
div.form form h4,div#catalogue.form div h4{font-size:1.2em;color:#000;margin:0 0 15px 0;text-indent:3px;font-weight:bold;padding-bottom:5px;border-bottom:1px solid #999;}
div#catalogue.form div ul,div#catalogue.form div ol{margin:10px 0 20px 0;}
div.form fieldset p{padding:0 0 15px 0 !important;}
.form form,div#catalogue.form p,div#catalogue.form div,div#noproduct p{background-color:#c9cdd2;padding:15px;}
div#catalogue.form a,div#catalogue.form table a{color:#2f83a4 !important;}
div#catalogue.form p#back a{color:#666 !important;}
div#catalogue.form p#back a:hover{color:#fff !important;}
div#catalogue.form div p{padding:0 0 10px 0;}
div#catalogue.form div p span{font-weight:bold;}
div#catalogue.form div img{margin:5px 0 20px 5px;}
div#catalogue.form p{margin:0;}
.form label{font-size:1.1em;line-height:1.4em;width:200px;display:block;margin-right:20px;float:left;text-indent:3px;}
.form input{display:block;width:180px;}
.form input#cp,.form input#cvv{width:75px;}
select#caducity{float:left;margin-right:10px;}
.form label a{margin:0 0 0 7px;color:#2f83a4;}
.form select{display:block;margin-bottom:5px;}
.form input#send{font-size:1.3em;height:35px;padding-top:7px;margin:10px 0 0 0;border:0;color:#fff;cursor:pointer;}
div#catalogue.form thead{display:none;}
div#catalogue.form table{background:none;}
div#catalogue.form tbody td.quantity span{margin-right:15px;}
div#catalogue.form tr#subtotal span{padding-bottom:10px !important;}
div#catalogue.form table{margin:0 0 1px 0 !important;}
span.error{color:red;line-height:2em;display:block;text-indent:3px;}
p.error{color:red;margin:5px 0 0 0 !important;}
div#noproduct p{margin:0;font-size:1.2em;}
/* Corporate */
div.corporate div#pics,div#customize{float:right;width:700px;margin:-3px 0 0 75px;}
div.corporate p.pagination{float:right;margin:-15px 25px 0 0;line-height:2.8em;*float:none;/* FIXME IE doesn't accept inline-block (declared in general pagination) */
*margin:-15px 0 0 765px;}
/* Contact */
div#contact{padding:20px 0 0 0;margin-left:285px;background:transparent url(../img/mates-map.png) no-repeat 250px 35px;border:1px solid transparent;}
div#contact h2{margin:0 0 15px 0;}
div#contact dl{font-size:1.4em;margin:15px 0;}
div#contact dt{color:#666;margin:5px 0;}
div#contact dd{margin:5px 0;}
/* History */
div.history{padding-top:50px;}
div.history object{margin-left:60px;}
/* Customize */
div#customize h3,div#customize a{color:#2c3337;}
div#customize h3{background:transparent url(../img/customize-title.png) repeat-y top left;width:247px;height:32px;padding:230px 20px 0 375px;font-size:1.4em;font-weight:normal;}
div#customize span{background:transparent url(../img/customize-link.png) repeat-y top left;display:block;width:247px;height:85px;padding:9px 20px 0 375px;}
div#customize a{font-size:1.8em;font-weight:bold;text-decoration:none;border-bottom:2px solid #fff;}
div#customize a:hover{border-bottom:none;}
/* Clases */
.clearfix:after,#header ul:after,.wrapper:after,#main:after,#catalogue:after,#details:after,#colors ul:after,.home ul:after,#cart li:after,span.dele a:after,.form label:after,div.sizes:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.howto {margin: 10px 0 0 0;font-weight:bold;}
/* Safari Fixes */
@media screen and (-webkit-min-device-pixel-ratio:0){/* FIX ME Targeting Safari */
div#catalogue tbody td.quantity span{height:21px;}
div#catalogue.form tbody td.quantity span{height:auto;}
.form label a{margin:0 0 1px 10px;}
}