/* CSS Document */
html{
font-size:14px;
line-height:1.45em;
font-family:Arial, Helvetica, sans-serif;
color:#666666;
}
body {
margin: 0px;
padding:0px;
background:#f6f6f6;
}
*:before, *:after {
box-sizing: border-box;
}
div.mensaje_error_tarjeta{
background-color: antiquewhite;
border-radius: 7px;
text-align: center;
background-image: url("/imgs/atencion.png");
background-repeat: no-repeat;
background-size: contain;
}
* {box-sizing: border-box;}
.container{content:""; display:table; width:480px;}
.suscribete, .bot-i {
background: rgba(0, 0, 0, 0) linear-gradient(#159dac, #128794) repeat scroll 0 0;
border: 1px solid #128794;
border-radius: 6px;
box-shadow: 0 3px 6px #999999;
color: #ffffff;
display: block;
font-family: "Century Gothic",Arial,Helvetica,sans-serif !important;
font-size: 1.4em;
font-weight: bold;
letter-spacing: 2px;
margin: 0 auto;
outline: medium none;
padding: 0.7em 1em;
text-align: center;
text-decoration: none;
text-shadow: 1px 1px #666666;
text-transform: uppercase;
}

#tarjetapago div {
clear: both;
margin-bottom: 7px;
margin-top: 7px;
position: relative;
}
#tarjetapago .seg{
width: 33%;
}
.seg {
background: #ffffff none repeat scroll 0 0;
clear: none !important;
display: table-cell;
margin: 0 !important;
padding: 0 0.5%;
text-align: center;
vertical-align: middle;
width: 25%;
}
#tarjetapago div {
clear: both;
margin-bottom: 7px;
margin-top: 7px;
position: relative;
}
#seguridad {
display: table;
width: 100%;
}
.bot-i {
box-shadow: 0 3px 6px #999999;
padding: 0.6em 1em;
}
.go {
clear: both;
margin: 0 auto 1em;
max-width: 293px;
padding-top: 0.5em;
text-align: center;
}
.center {
clear: both;
margin: 0 auto;
text-align: center;
vertical-align: top;
}
body, img, form, label, fieldset, div, ul, li {
border: 0 none;
margin: 0;
padding: 0;
}
img{max-width: 100%;height:auto; border:0px;}
.wrap{
margin:0 auto;
width:96%;
}
#cabecera{margin-bottom:1.6em; text-align: center;}
.logo{margin-top:.5em; text-align:left;}
#cabecera .titulo, #cabecera .subtitulo{
font-family: "Century Gothic", Arial, Helvetica, sans-serif;
}
.titulo, h1{
font-size:2.7em;
line-height:1em;
font-weight: bold;
margin:auto;
text-transform: uppercase;
}
.subtitulo{
font-size:1.5em;
line-height:120%;
color: #4a4a4a;
}
.tit{
font-size:1.8em;
line-height:1em;
margin: .7em 0.3em;
font-family: "Century Gothic", Arial, Helvetica, sans-serif;
font-weight: bold;
}
.col3{text-align:center; margin:1em auto;}
.col3 p{font-size:1.2em; font-weight:bold; margin: .5em 0em;}
.col3 span{
font-size:0.65em;
line-height:1.25em;
font-weight:normal;
display: block;
}
#info{clear:both;}
#footer {
border-top: 0.7em solid #E5E5E5;
padding-top: 2em;
float: left;
width: 100%;
clear: both;
}
#masinfo ul, form{margin:0px; padding:0px;}
#info2 ul {margin: 0px 4%;}
#masinfo li{
list-style-type: none;
background:url(../imagenes/item.jpg) no-repeat 0.4em 0.3em;
padding-left:1.3em;
margin-bottom:0.4em;
line-height:1.2em;
font-size: 1.15em;
color: #4A4A4A;
}
#info2 .small{font-weight:bold;}
.nav {padding:0.3em 0em; }
.nav li {
margin: 0px;
padding: 0em 0.7em 0em 0em;
display: inline;
background: none;
font-size: 0.85em;
white-space: nowrap;
}
a, .nav a{
text-decoration:none;
color:#128A98;
white-space: nowrap;
outline:none;
}
a:hover, .nav a:hover{color:#999999;}
/*form*/
label {
display: block;
width: 32%;
float: left;
font-size: 0.9em;
padding: .35em 0em .35em 0em;
line-height:1.2em;
}
#acepto{
/* width:80%; */
margin:0 auto !important;
}
#tratamiento{
display: table;
float: right;
width: 65%;
right: 3%;
margin-top:0 !important;
margin-bottom: 0 !important;
}
#hijos, #mascotas{
float: left;
width: 65%;
clear: none !important;
margin-top:0 !important;
margin-bottom: 0 !important;
}
#tratamiento label, #hijos label, #mascotas label{
width:auto;
margin-right: 0.6em;
}
#mascotas input[type="checkbox"]{display:block;}
#acepto label{
width:100% !important;
font-size: 0.85em;
padding:.7em 0em 0em 0em;
line-height: 1.45em;
text-align: center;
}
input, select, textarea, .inputbox {
padding: 2px;
color:#666666;
font-family:Arial, Helvetica, sans-serif;
margin:2px 2px;
}
.inputbox{
border: 1px solid #A8A8A8;
background: #FFFFFF;
width:100%;
}
select.inputbox{border: 1px solid #A8A8A8;
background: #FFFFFF; width:auto; max-width:65%; }
#form1 div, #form2 div{
margin-top:3px;
margin-bottom:3px;
position: relative;
clear: both;
}
.fix{
vertical-align: middle;
padding: 0;
float: left;
width: 65%;
clear: none !important;
margin-top: 0 !important;
}
fieldset{padding: 0;
border: 0px;
margin: 0 auto;}
a.bot, #bot2{
display:block;
outline:none;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #FFFFFF;
font-family:"Century Gothic", Arial, Helvetica, sans-serif !important;
line-height:2.2em;
font-weight:bold;
letter-spacing:2px;
text-shadow:1px 1px #666666;
margin:0;
background: -moz-linear-gradient(top, #159DAC 0%, #128794 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#159DAC), color-stop(100%,#128794));
background: -webkit-linear-gradient(top, #159DAC 1%, #128794 100%); /* Chrome10+,Safari5.1+ */
background: linear-gradient(#159DAC, #128794);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#159DAC', endColorstr='#128794');/* ie */
zoom: 1;/* ie */
}
a.bot{border-radius: 6px;}
#info .bot,#info2 .bot{font-size:1.4em;}
#boton, .botm{
border: 1px solid #128794;
border-radius: 8px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: #FFFFFF;
font-size:1.8em;
font-family:"Century Gothic", Arial, Helvetica, sans-serif !important;
padding:.5em 0em;
font-weight:bold;
letter-spacing:2px;
text-shadow:1px 1px #666666;
width:100%;
margin:0;
cursor:pointer;
outline:none;
background:#128794;
background: -moz-linear-gradient(top, #159DAC 0%, #128794 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#159DAC), color-stop(100%,#128794));
background: -webkit-linear-gradient(top, #159DAC 1%, #128794 100%); /* Chrome10+,Safari5.1+ */
background: linear-gradient(#159DAC, #128794);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#159DAC', endColorstr='#128794');/* ie */
zoom: 1;/* ie */
}
input#boton:hover, input#boton:focus, a.bot:hover, .botm:hover{
background: -moz-linear-gradient(top, #128794 0%, #159DAC 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#128794), color-stop(100%,#159DAC));
background: -webkit-linear-gradient(top, #128794 1%, #159DAC 100%); /* Chrome10+,Safari5.1+ */
background: linear-gradient(#128794, #159DAC);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#128794', endColorstr='#159DAC');/* ie */
zoom: 1;/* ie */
}
.tit2 p{
color:#107985;
font-size:2em;
font-weight:bold;
line-height:0.9em;
margin-bottom: 0.9em;
width:62%;
font-family: "Century Gothic", Arial, Helvetica, sans-serif;
}
.tit2 span{font-size:0.85em; display:block;}
#precio{
float: right;
min-width: 108px;
text-align: center;
font-weight: bold;
position: absolute;
z-index: 1;
right: .5em;
top:0;
}
.oferta{
position:absolute;
z-index:2;
color: #FFFFFF;
padding: 1.8em 0em;
width: 97%;
}
.cod {padding: 1.5em 0em;line-height: 110%;}
.cod span span {text-decoration: line-through;display: block;}
#precio img{
position:relative;
z-index:1;
}
#precio p{
margin: 0.1em 0em;
letter-spacing: -1px;
}
.valor{
font-family:"Century Gothic", Arial, Helvetica, sans-serif;
font-size:2.3em;
}
.valor span{
font-size:.85em !important;
}
.user .boton{width:100% !important; max-width:267px;}
.boton{
padding-top: 1.2em !important;
text-align: center;
clear: left;
width: 50%;
margin: 0 auto;
}
.bg{
height:14px;
background: -moz-linear-gradient(top, #999999 0%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999999), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top,  #999999 1%,  #ffffff 100%); /* Chrome10+,Safari5.1+ */
background: linear-gradient(#999999, #ffffff);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#999999', endColorstr='#ffffff');/* ie */
zoom: 1;/* ie */
border-radius: 5px;
margin-top:0 !important;
}
#reserva{
position:relative;
background:#ffffff;
float: right;
width:46%;
padding:0 3.5%;
margin-bottom: 1em;
margin-top: 1em;
}
#info{
width: 50%;
float: left;
clear: none;
margin-bottom: 1em;
margin-top: 1em;
}
#info2{
width: 54%;
padding:0em 0 2em 0;
}
.small{
font-size:0.95em;
line-height:1.35em !important;
}
.tit3{
font-size:1.2em;
line-height:1em;
margin: .7em 0em;
font-weight:bold;
}
.clear{
clear:both;
height:1px;
float: none !important;
}
#comentarios{background:url(../imagenes/fdo-opinion.jpg) repeat-x 0 100%; clear:left;}
#marcas {
border-top: 0.7em solid #E5E5E5;
background: #ffffff;
float: left;
width: 100%;
padding-top: 0.3em;
}
.tabmarcas {
text-align: center;
vertical-align: middle;
display: inline;
width: 16.5%;
min-width: 14.5%;
float: left;
background: #ffffff;
padding: 2% 0.5%;
}
.logopie {
margin: -20px 3px 0px 0px;
float: left;
max-width:145px;
}
#info2 li {
list-style-type: none;
font-size: 0.9em;
margin: 0;
color: #5D5D5D;
line-height: 1.30em;
width: 100%;
margin-bottom: 0.5em;
background:#FFFFFF;
text-align:center;
}
#info .boton, #info2 .boton{width:50%; margin:0 auto; max-width:270px;}
#info2 .wrap{
padding:0em 0 1em 0;
background:url(../imagenes/comillas.jpg) no-repeat 100% 1em;
border-top:1px dotted #999999;}
#canje{padding:1em 0;}
.total {
border-bottom: dotted 1px #999999;
padding: 0.7em 0.5em;
width: 100%;
display: table;
background: #E3F9FA;
font-size:.9em;
margin:0 !important;
}
.total div{
float: left;
clear: none !important;
margin:auto !important;
display:table-cell;
vertical-align:bottom;
}
.titinfo {
font-size:1.3em;
font-weight:bold;
width: 54%;
vertical-align: bottom;
}
.price,.promo {
font-size:1.3em;
font-weight:bold;
width: 46%;
text-align: right;
vertical-align: bottom;
white-space: nowrap;
}
.price{padding-right:.5em;}
.txtb{font-weight:bold; width: 54%; padding: 2px 0px;}
.promo .inputbox{width:100px;}
.botm{font-size:.8em; letter-spacing:1px; padding:.3em; width:100px; border-radius:3px; margin:2px;}
#cvcinfo {
float: right;
width: 67%;
line-height: 1.2em;
font-size: .9em;
margin-top:-7px !important;
}
#cvc{
width:100px;
float:left;
margin-right: .5em;
}
#tarjetapago div{margin-top:7px; margin-bottom:7px;}
#tarjeta2{padding: 7px 0px;}
#seguridad{text-align:center;}
.seg{
text-align: center;
vertical-align: baseline;
display: inline;
width: 25%;
float: left;
background: #ffffff;
padding: 0% 0.5%;
clear:none !important;
margin: 0 !important;
}
#reply{
margin:0em auto 1.5em auto !important;
text-align:center;
width:85%;
}
b{white-space: nowrap;
font-weight: normal;}
#tarjetapago .fix{margin-top:3px !important; margin-bottom:3px;}
/*cambio clase*/
.user span{display:none;}
.user .oldclass { color:#CC0000; display:block; }
.user .newclass { font-size: 10px;
line-height: 110%;
margin: 0px 0px 0px 6px;
color: #CC0000;
left: 0px;
background: #ffffff;
display:block;
clear:both; }
/*pagpago*/
.gral{background:#FFFFFF; padding-bottom: 1em;}
#datospago{
width: 57%;
float: left;
clear: none;
margin-bottom: 1em;
margin-top: 1em;
}
#datos {
float: right;
width: 40%;
margin-top: 1em;
}
.gral .tit{margin-left:0px;}
.gral .txtb{font-size: 1.1em;}
.gral .txtb p{
font-weight: normal;
font-size: .9em !important;
margin: 0.3em 0;}
#canje2{margin:0 0 1em 0 !important;}
#pagpago #tarjetapago{
max-width: 480px;
margin: auto;}
.detalle{
background:#EBEBEB;
border-bottom: dotted 1px #999999;
padding: 0.7em 0.5em;
display:table;
width:100%;
}
.detalle div {
display: table-row;
vertical-align: top;
padding: .2em 0;
}
.titinfo b{font-size:.8em !important; white-space: nowrap !important; font-weight:bold;}
#pagpago #boton{font-size:1.5em !important;}
#nom, #dir, #tel{font-weight:bold; float:left; min-width:96px; font-size:.9em;}
#nom{background:url(../imagenes/ico-name.gif) no-repeat 0 1px; padding-left:23px;}
#dir{background:url(../imagenes/ico-direccion.gif) no-repeat 0 1px; padding-left:23px;}
#tel{background:url(../imagenes/ico-telefono.gif) no-repeat 0 0; padding-left:23px;}
.dat{float:left; width:auto; font-size:.9em;}
#ent{
font-weight:bold;
font-size:0.9em;
text-align:center;
padding:0px;
}
#ent img{margin-top:-8px; margin-bottom:-3px;}
#packaging{text-align:center; margin: 1em 0 0 0;}
/*mensajes junio2016*/
.mensajes{
display: table;
margin: 0 auto;
font-size:.9em;
line-height:1.3em;
}
.mensajes img{max-width:initial; float: left; margin-right:2px;}
#error span, .error{color:#CC0000; text-align:left;}
#exito span, .exito{color:#336699; text-align:left;}
.cell2 {
display: table-cell;
vertical-align: middle;
padding: 10px 2px;
}
#loading{
position: absolute !important;
text-align: center;
padding: 18px;
z-index: 10;
width: 100%;
background: #ffffff;
max-width: 270px;
margin:0px !important;
top:0px;
}
/*foto*/
.foto{
background: #E8EAEA;
max-height: 355px;
position: relative;
}
.foto .wrap{
text-align: center;
margin: 0 auto;
width: 100%;
overflow: hidden;
}
/*17-11*/.foto img {
vertical-align: bottom;
max-width: 100%;
margin: 0 0%;
height: 355px;
width:790px;
}
/*17-11*/.pic{width:358px;}

@media (max-width:690px){
.wrap{width:98%;}
#cabecera{text-align:center;}
#reserva{margin-top: 0em !important;}
#reserva, #info, #info2{float:none; width:100%; padding: 0 3.5% 2em 3.5%;}
.titulo {
font-size: 2em;
line-height: 1em;
font-weight: bold;
margin-bottom: .15em;
margin-left:0 !important;
}
.subtitulo{font-size:1.2em; font-weight:bold; margin-left:0 !important; color:#666666;}
#msjexito{min-height: 220px;}
/*17-11*/.tit2{padding-top:.7em; padding-bottom: .7em;}
#precio{top:1em;}
.tabmarcas{width:32%;}
.nav {
padding: 0em;
text-align: left;
margin: 0 0 1em 0;
}
#datos, #datospago, #reply{clear:both; width:100%; padding:0 3.5% 0 3.5%;}
#info2 ul {
margin: 0px 0%;
}
/*17-11*/.foto img {
vertical-align: bottom;
max-width: 142%;
margin: 0 -18% 0 -30%;
max-height: 142%;
height: auto;
}
}

@media (max-device-width: 320px){
label{width:31%;}
.fix{width:67%;}
select.inputbox{max-width:67%;}
#mascotas label {margin-right: 0.35em;}
.tit2 p{width:58% !important;}
.tit2 span{font-size: 0.6em !important;}
#marcas img{max-width:105px !important;}
.circulo{width:115px !important; height:115px !important;}
.movil p{font-size:.85em !important; }
.titulo, h1{font-size: 1.8em; line-height:1.1em !important;}
.titinfo b{white-space:normal;}
#datos, #datospago, #reply {
padding: 0 3% 0 3%;
}
}

@media (max-width: 370px){
#info2 li {
width: 100%;
margin: 0 auto 1em auto;
text-align:center;
}
}

@media (max-device-width: 480px){
.titulo, h1{ font-size: 1.8em; margin-bottom:0em; margin-top:-.2em; line-height:1em !important;}
.subtitulo{font-size:1em !important; padding:0 10%;}
.lb2{margin-top:-0.85em;}
.tit2 p{width:100%; padding-top:0em; margin-bottom: 0.5em;}
#oferta{margin-top: -1.3em;}
.tit2 span {font-size: 0.70em;}
#masinfo li{font-size:1em; line-height: 1.35em;}
}

@media (max-width: 480px){
#cabecera{margin-bottom:.7em;}
.tit {margin: .7em 0em .7em 0em; font-size:1.7em;}
.fdocolor{
background: #FFFFFF;
border-top: 10px #FFFFFF solid;
border-bottom: 10px #FFFFFF solid;
margin:0em auto 2em auto;
}
#comenta label, #comentarios{width:100% !important;}
.tit3{
font-size:1.1em;}
#marcas{padding: 0.7em 0em;}
.tabmarcas {
width: 50%;
}
.logopie {
margin: 0 auto !important;
float: none;
display:block;
}
.copyright, .nav{text-align:center;}
.logopie{max-width:100%;}
#footer{padding-top:1em;}
#info .bot,#info2 .bot{font-size:1.8em !important;}
.boton{width:95% !important;}
.logo{width:50%; margin:.3em auto .2em auto;}
#precio{top:0.25em;}
#reply {margin: 0em auto !important;}
}

@media (min-width: 960px){
#cabecera{text-align:left;}
#cabecera .titulo, #cabecera .subtitulo{
margin-left:60px;
}
#invitacion{
position: absolute;
right: 0px;
top: 0px;
width: 100%;
z-index: 2;
}
#reserva{
float:right !important;
width:33% !important;
z-index:10;
padding:0 2.5%;
}
#info{
width: 64%;
float: left;
margin-top: 520px;
}
#info2{
margin:0 auto;
clear:left;
max-width: 960px;
width:auto;
}
#info2 ul{margin:0;}
#oferta{
float:right;
margin-top: -1.7em;
width:35%;
}
.wrap{
max-width:960px;
width:100%;
}
#cabecera{margin-bottom:1.6em;}
.logo{text-align:left;}
.logo img{display:block;}
.col1, .col2{float:left;width:45%; }
.col1 {
margin-right: 2.5em !important;
margin-left: 1.5em !Important;
}
.tit{
font-size:1.85em;
line-height:1em;
margin: .8em 0em;
}
.tit3{
font-size:1.2em;
line-height:1em;
margin: .7em 0em;
font-weight:bold;
}
.tit2 p{
padding-top:1.2em;
width: 100%;
}
#precio{top: 2.5em;}
#seccion #cabecera {width:85%;}
.boton{padding-bottom:1em !important;}
.tabmarcas {
max-width: 16.5%;
padding: 0.5% 0%;
}
.copyright {
width: 73%;
float: left;
text-align: left;
margin: 0em 0em 0em 0.5em;
}
.nav {
padding: 0.3em 0em;
text-align:left;
}
#comentarios{margin-top:300px;}
#info2 li {
width: 100%;
}
#info2 li.clear{clear:none !important;}
#info .bot, #portada2 #info2 .bot{font-size:1.4em !important;}
#info2 .bot{font-size:1.8em !important;}
#portada2 #info2 .wrap{
max-width: 630px;
margin-left: 0;
padding: 0;
}
#portada2 #info2 li {
width: 27%;
margin: 0 3%;
}
#datospago{
width: 64%;
}
#datos {
width: 33%;
}
#pagpago #seguridad{
max-width: 450px;
}
.gral #tarjetapago label{
font-size: 1em;
text-align: right;
line-height: 1.45em;
padding-right: .5em;
}
.gral .txtb{font-size: 1.3em;}
.gral .inputbox{font-size:1em;}
.gral .titinfo b{white-space:normal; font-size:.9em !important; font-weight:bold;}
#canje2 .titinfo, #canje2 .txtb{width:66%;}
#canje2 .promo, #canje2 .price{width:34%;}
.gral .total {padding: 0.7em 1em;}
.detalle{font-size:1.1em !important;}
.half{
width: 46.5%;
float: left;
}
.half.right{float:right;}
.foto .wrap{
width: 100%;
max-width: 100%;
}
.foto img {
margin: 0 250px 0 -150px;
}