body { margin:0; background:url(../images/bg_carrito.jpg) no-repeat; background-position:0 100px; } .clear { clear:both; } /* FONT FACE */ @font-face { font-family: 'DINLight'; src: url('../font_face/din/din-light-webfont.eot'); src: local('☺'), url('../font_face/din/din-light-webfont.woff') format('woff'), url('../font_face/din/din-light-webfont.ttf') format('truetype'), url('../font_face/din/din-light-webfont.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'DINRegular'; src: url('../font_face/din/din-regular-webfont.eot'); src: local('☺'), url('../font_face/din/din-regular-webfont.woff') format('woff'), url('../font_face/din/din-regular-webfont.ttf') format('truetype'), url('../font_face/din/din-regular-webfont.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'DINBold'; src: url('../font_face/din/din-bold-webfont.eot'); src: local('☺'), url('../font_face/din/din-bold-webfont.woff') format('woff'), url('../font_face/din/din-bold-webfont.ttf') format('truetype'), url('../font_face/din/din-bold-webfont.svg') format('svg'); font-weight: normal; font-style: normal; } h3 { font-family: 'DINBold'; font-size:16px; color:#6a594f; font-weight:normal; padding-bottom:15px; margin:0 0 15px 0; background:url(../images/hearts.png) no-repeat bottom left; } h3 b { font-family:'DINLight'; color:#fa646f; font-weight:normal; } /* HEADER CSS */ #header { position:relative; width:976px; margin:0 auto; padding:5px 0; } #header #contacto { position:absolute; bottom:15px; right:0; width:200px; font-family: 'DINRegular'; font-size:24px; color:#000; text-align:right; } #header #iconos { position:absolute; width:520px; bottom:20px; left:250px; text-align:left; font-family: 'DINRegular'; font-size:14px; color:#000; } #header #iconos a { color:#000; text-decoration:none; margin-right:15px; } #title { position:relative; width:976px; margin:0 auto; padding:60px 0; font-family:'DINRegular'; font-size:30px; color:#6a594f; } #title strong { font-size:40px; color:#f77078; font-weight:normal; } #title h1 { font-family:'DINRegular'; font-size:30px; color:#6a594f; margin:0; padding:10px 70px 10px 0; background:url(../images/ic_tit_user.png) no-repeat center right; font-weight:normal; display:inline; } /* NAVEGACION CSS */ #nav { position:relative; width:976px; margin:0 auto; } #nav #reflejo { position:absolute; top:0; left:0; width:100%; height:25px; background:url(../images/reflejo.png); z-index:10000; } #nav ul { list-style:none; margin:0; padding:0; } #nav ul li { float:left; position:relative; } #nav ul li a { display:block; text-align:center; padding:15px 15px; border:solid 1px #FFF; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; font-family:'DINLight'; font-size:18px; text-decoration:none; } #nav ul li.big { width:259px; } #nav ul li.small { width:229px; } /* BOTONERA PASOS CSS */ #current a { background:#f77078; color:#FFF; } #current .arrowCurrent { width:10px; height:18px; background:url(../images/arrow_selec.png) no-repeat center right; position:absolute; top:15px; right:-9px; z-index:500; } #open a { background:#d2b159; color:#FFF; } #open a:hover { background:#f77078; color:#FFF; } #open .arrowOpen { width:10px; height:18px; background:url(../images/arrow_mas.png) no-repeat center right; position:absolute; top:15px; right:-9px; z-index:500; } #open .arrowOpenOver { width:10px; height:18px; background:url(../images/arrow_selec.png) no-repeat center right; position:absolute; top:15px; right:-9px; z-index:500; } #close a { background:#e2e2e2; color:#bebebe; } #close .arrowClose { width:10px; height:18px; background:url(../images/arrow_close.png) no-repeat center right; position:absolute; top:15px; right:-9px; z-index:500; } /* USUARIOS REGISTRADOS CSS */ #regUsers { float:left; width:100%; padding:10px 0 35px 0; background:url(../images/bg_reg_users.jpg) repeat-x top left; font-family:'DINRegular'; font-size:14px; color:#7c7573; border:solid 5px #FFF; -moz-box-shadow: 0px 3px 5px #DDD; -webkit-box-shadow: 0px 3px 5px #DDD; box-shadow: 0px 3px 5px #DDD; } #regUsers #content { width:906px; padding:0 35px; margin:0 auto; } #regUsers strong { color:#fa646f; font-weight:normal; } #regUsers input[type='text'] { width:90%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px; } #regUsers input[type='password'] { width:90%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px; } #regUsers input[type='submit'] { padding:4px 10px; height:26px; border:0; background:#f87075; margin:0; cursor:pointer; font-family:'DINLight'; font-size:14px; color:#FFF; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } #regUsers #logIn { float:left; width:545px; padding-right:25px; margin-right:35px; background:url(../images/sep_big.png) no-repeat top right; } #regUsers #recoveryPass { float:left; width:300px; } #recoveryPass strong { font-family: 'DINBold'; font-size:16px; color:#6a594f; font-weight:normal; } #regUsers a { color:#fa646f; } /* USUARIOS NO REGISTRADOS CSS */ #cenefa { background:url(../images/cenefa_carrito.jpg); } #recomienda { width:906px; padding:35px; margin:0 auto; background:#FFF; font-family:'DINRegular'; font-size:16px; color:#9d8b7f; border-top:solid 1px #EEE; -moz-box-shadow: 0px 0px 10px #BBB; -webkit-box-shadow: 0px 0px 10px #BBB; box-shadow: 0px 0px 10px #BBB; } #recomienda a { color:#fa646f; } #recomienda strong { font-family:'DINBold'; color:#fa646f; font-weight:normal; } #recomienda .label { font-family:'DINLight'; color:#6a594f; font-weight:normal; } #recomienda input[type='text'] { width:90%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px; } #recomienda input[type='password'] { width:90%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px; } #recomienda input[type='submit'] { padding:4px 10px; height:26px; border:0; background:#6a594f; margin:0; cursor:pointer; font-family:'DINLight'; font-size:14px; color:#FFF; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } #recomienda input[type='button'] { padding:4px 10px; height:26px; border:0; background:#6a594f; margin:0; cursor:pointer; font-family:'DINLight'; font-size:14px; color:#FFF; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } #recomienda #btn a { font-family:'DINLight'; font-size:14px; color:#FFF; padding:8px 10px; background:#fa646f; text-decoration:none; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin:25px 0; } #recomienda #btn a:hover { background:#6a594f; } #recomienda #notas { width:290px; margin-left:25px; float:right; height:300px; } #recomienda #notas #info { margin-left:25px; } #recomienda #notas #info #tit { position:relative; background:#f0dadc; padding:8px 10px 8px 35px; font-family:'DINRegular'; font-size:14px; color:#fa646f; -webkit-border-top-left-radius:10px; -moz-border-top-left-radius:10px; border-top-left-radius:10px; -webkit-border-top-right-radius:10px; -moz-border-top-right-radius:10px; border-top-right-radius:10px; } #recomienda #notas #info #tit #icono { position:absolute; top:-6px; left:-25px; } #recomienda #notas #nota { padding:25px; margin-top:1px; background:#f9f2f2; border:solid 1px #f4dde1; font-size:14px; color:#6a594f; -webkit-border-bottom-left-radius:25px; -moz-border-bottom-left-radius:25px; border-bottom-left-radius:25px; -webkit-border-bottom-right-radius:25px; -moz-border-bottom-right-radius:25px; border-bottom-right-radius:25px; } #recomienda #notas #nota img { border:solid 1px #FFF; } /* FOOTER */ #bg_footer { position:relative; background:#852626 url(../images/footer.jpg) no-repeat top center; } #bg_footer #shadow { background:url(../images/shadow.png) repeat-x top left; width:100%; height:10px; position:absolute; top:-15px; left:0; } #footer { position:relative; width:976px; margin:0 auto; padding:15px 0 40px 0; font-family:Arial; font-size:12px; color:#FFF; } #footer #redes { float:right; text-align:right; margin-top:15px; } #footer ul { list-style:none; margin:0; padding:0; } #footer ul li { position:relative; float:left; margin-top:15px; } #footer ul li.normal { width:290px; margin-right:15px; } #footer ul li.grande { width:365px; } #footer ul li a { display:block; background:#852626 url(../images/ic_info.png) no-repeat top right; padding:25px 0 25px 85px; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px; border:solid 1px #ac4e4e; text-decoration:none; font-family: 'DINRegular'; font-size:14px; color:#ffdbdb; } #footer ul li a:hover { background:#20a8dc url(../images/ic_go.png) no-repeat bottom right; } #footer ul li strong { font-family: 'DINBold'; font-size:16px; color:#FFF; font-weight:normal; text-decoration:none; } #footer .icono { position:absolute; border:0; top:5px; left:10px; } #footer #links { font-size:14px; color:#ffc2c2; margin:30px 0 5px 0; } #footer #links a { color:#ffc2c2; text-decoration:none; margin:0 8px; } #footer #links a:hover { color:#FFF; } #divCargador { visibility:hidden; margin-left:-150px; left:50%; top:375px; position:absolute; } #recomienda #logIn { float:left; width:415px; padding-right:20px; margin-right:31px; background:url(../images/sep_big.png) no-repeat top right; } #recomienda #recoveryPass { float:left; width:440px; } #datosFacturacion { margin-bottom:15px; } #datosEnvio { margin-bottom:15px; } /* USUARIOS NO REGISTRADOS CSS */ #cenefa { background:url(../images/cenefa_carrito.jpg); } #noRegUsers { width:906px; padding:35px; margin:0 auto; background:#FFF; font-family:'DINRegular'; font-size:14px; color:#7c7573; border-top:solid 1px #EEE; -moz-box-shadow: 0px 0px 10px #BBB; -webkit-box-shadow: 0px 0px 10px #BBB; box-shadow: 0px 0px 10px #BBB; } #noRegUsers td { padding-bottom:25px; } #noRegUsers strong { color:#ac9d94; font-weight:normal; } #noRegUsers span { font-size:12px; color:#fc9e9e; } #noRegUsers input[type='text'] { width:95%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px 2%; } #noRegUsers input[type='password'] { width:90%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px; } #noRegUsers select { width:95%; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px 2%; } #noRegUsers textarea { width:95%; height:100px; border:solid 1px #facccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; margin-right:10px; font-family:'DINRegular'; font-size:14px; color:#a9a8a8; padding:4px 2%; } #noRegUsers #password { background:#fff3f4; padding:20px 25px; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px; } #noRegUsers #password strong { color:#fa646f; font-weight:normal; } /* DATOS FACTURACION CSS */ #datosFacturacion { float:left; width:48%; margin-right:4%; } #datosEnvio { float:left; width:48%; } /* GASTOS ENVIO GRATIS CSS */ #gastosEnvioGratis { background:url(../images/gastosEnviogratis2.jpg) no-repeat top left; width:370px; height:290px; padding:25px 30px; font-family:'DINLight'; font-size:28px; color:#e85260; letter-spacing:-1px; border:solid 1px #ffeaec; border-bottom:solid 2px #FFF; -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; -moz-box-shadow: 0px 5px 10px #DDD; -webkit-box-shadow: 0px 5px 10px #EEE; box-shadow: 0px 5px 10px #DDD; } #gastosEnvioGratis strong { font-family:'DINBold'; font-size:30px; color:#6b6b6b; font-weight:normal; } #gastosEnvioGratis span { font-family:Arial; font-size:12px; color:#111; letter-spacing:0; } input[type='button'] { padding:4px 10px; height:26px; border:0; background:#f87075; margin:0; cursor:pointer; font-family:'DINLight'; font-size:14px; color:#FFF; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } input[type='submit'] { padding:4px 10px; height:26px; border:0; background:#f87075; margin:0; cursor:pointer; font-family:'DINLight'; font-size:14px; color:#FFF; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } /*LOGIN CON REDES SOCIALES*/ #accessFacebook, #accessTwitter, #accessGoogle{ width: 272px; float: left; margin: 0 10px; } #accessFacebook a { display:block; background:url(../images/access_facebook.png) no-repeat; background-position:0 0; background-size:200% auto; max-width:272px; height:40px; margin:15px 0; } #accessFacebook a:hover { background-position:100% 0; } #accessTwitter a { display:block; background:url(../images/access_twitter.png) no-repeat; background-position:0 0; background-size:200% auto; max-width:272px; height:40px; margin:15px 0; } #accessTwitter a:hover { background-position:100% 0; } #accessGoogle a{ display:block; background:url(../images/access_google.png) no-repeat; background-position:0 0; background-size:200% auto; max-width:272px; height:40px; margin:15px 0; } #accessGoogle a:hover { background-position:100% 0; } #fx-banner { position:fixed; bottom:25px; right:25px; width:408px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; z-index:1000; } #fx-banner.hide { right:-390px; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-banner .close{ position: absolute; z-index: 21; right: 5px; top: -15px; display: block; cursor:pointer; } #fx-fixed a.btn-facebook { display:block; width:272px; height:40px; background:url(../images/btn_facebook.png) no-repeat; background-position:0 0; margin:15px 0 2px 0; } #fx-fixed a.btn-facebook:hover { background-position:-272px 0; } #fx-fixed a.btn-gplus { display:block; width:272px; height:40px; background:url(../images/btn_gplus.png) no-repeat; background-position:0 0; margin:15px 0 2px 0; } #fx-fixed a.btn-gplus:hover { background-position:-272px 0; } #fx-fixed { position:relative; bottom:0; right:0; background:url(../images/fixed.png) no-repeat center top; width:348px; height:95px; padding:23px 30px; font-family:'DINRegular'; font-size:16px; color:#7e662c; text-shadow:1px 1px #FFF; letter-spacing:-1px; z-index:20; } #fx-fixed.nreg{ background-image:url(../images/fixed-nreg.png); height:145px !important; } #fx-fixed strong { display:block; margin-top:10px; font-family:'DINBold'; font-size:36px; color:#000; font-weight:normal; } #fx-fixed span { font-size:15px; } #fx-fixed a { color:#7e662c; cursor:pointer; } #fx-fixed a:hover { color:#333; } #fx-bubble { position:absolute; background:url(../images/bubble.png) no-repeat center top; width:338px; height:107px; padding:25px 35px; font-family:'DINLight'; font-size:18px; color:#333; line-height:20px; letter-spacing:-1px; opacity:1; z-index:10; } #fx-bubble.nreg{ height:160px !important; } #fx-bubble.down { bottom:0; right:0; opacity:0; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-bubble.up { bottom:140px; right:0px; opacity:1; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-bubble b { font-family:'DINBold'; color:#000; font-weight:normal; } #fx-bubble strong { font-family:'DINBold'; color:#eb4352; font-weight:normal; } #fx-bubble ul { list-style:none; margin:10px 0 0 0; padding:0; } #fx-bubble ul li { background:url(../images/list-style.png) no-repeat left center; padding:0 0 0 20px; margin:5px 0; font-family:'DINBold'; font-size:18px; color:#eb4352; } #fx-bubble ul li b { color:#333; font-weight:normal; } #fx-bubble span { font-size:14px; color:#aeadad; } #fx-bubble span a { color:#aeadad; } #fx-bubble span a:hover { color:#dd1c3f; } #fx-arrow { position:absolute; top:50px; left:0; z-index:10; opacity:0; cursor:pointer; } #fx-arrow.right { top:50px; left:0; opacity:0; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-arrow.left { top:50px; left:-55px; opacity:0.8; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-arrow.left:hover { opacity:1; } #fx-arrow.hide { top:50px; left:0; opacity:0 !important; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-arrow2 { position:absolute; top:50px; right:0; z-index:10; opacity:0; cursor:pointer; transform: rotateY(180deg); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-arrow2.show { top:50px; right:408px; opacity:0.75; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } #fx-arrow2.show:hover { opacity:1; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }