
ul {
padding:0px;
}

li {
z-index: 1px;
}

#calculadora_calorias_cont {
width: 926px;
background-image: url(../img/calculadora/bg_calculadora.png);
background-repeat: repeat;
float: left;
clear:both;
font-family: Arial, Helvetica, sans-serif;
padding: 13px 0px;
border: 1px solid #b3a081;
padding-bottom: 40px; /*Borrar*/
}

#calculadora_top {
float:left;
clear:both;
position: relative;
margin-bottom:28px;
}

#calculadora_header {
display: block;
height: 75px;
margin-left:0px;
padding-left:17px;
padding-top:13px;
margin-top:-13px;
margin-bottom:15px;
background-image: url(../img/calculadora/bg_calculadora_trans.png);
background-repeat: repeat;
border-bottom: 2px solid #b9a17f;
}

#calculadora_top h3 {
color: #644818;
font-weight: 300;
margin:0px;
margin-bottom:10px;
font-size: 26px;
font-family: 'Oswald', Helvetica, Arial;
text-shadow: none;
}

#calculadora_top p {
color: #644818;
font-size: 12px;
font-weight: bold;
margin-bottom:32px;
}

div.instruccion {
background-color: #ffffff;
border: 1px solid #7c8493;
height: 98px;
position: relative;
font-size: 15px;
font-weight: bold;
box-shadow: 5px 5px 0px 0px #b09e85;
box-shadow: 5px 5px 0px 0px rgba(176,158,133,0.5);
float:left;
clear:none;
}

img.paso {
position: absolute;
top:-10px;
left:-10px;
}

div.instruccion h5, #alimentos_contenedor h5 {
margin:0px;
font-family: 'Oswald', Helvetica, Arial;
background-color: #2350a7;
text-shadow: none;
font-weight: 300;
color: #ffffff;
font-size: 16px;
padding-left:55px;
height: 23px;
line-height: 23px;
}

div.cuadro_edad {
margin-left:17px;
width: 181px;
color: #7b4f2a;
}

div.cuadro_edad input {
border: 1px solid #9e9388;
width: 49px;
height: 37px;
margin-left: 40px;
margin-right:15px;
text-align: center;
font-size: 20px;
font-weight: bold;
color: #000000;
}

div.cuadro_altura {
width: 322px;
margin-left:30px;
}

div.cont_drag {
width: 235px;
height: 30px;
background-color: #ffffff;
border: 1px solid #a79c90;
position: relative;
margin-left:12px;
}

div.cuadro_altura div.altura {
width: 215px;
position: absolute;
height: 2px;
background-color: #bcbdbd;
left:10px;
top:14px;
}

div.cuadro_altura div#altura_resultado {
font-size: 20px;
font-weight: bold;
position: absolute;
right:4px;
top:44px;
}

div.cuadro_peso {
width: 324px; 
margin-left:30px;
clear:right;
}

div.cuadro_peso div.peso {
width: 215px;
position: absolute;
height: 2px;
background-color: #bcbdbd;
left:10px;
top:14px;
}

div.cuadro_peso div#peso_resultado {
font-size: 20px;
font-weight: bold;
position: absolute;
right:8px;
top:44px;
}

div.cuadro {
position: absolute;
left:0px;
top:-4px;
width: 10px;
height: 10px;
background-color: #000000;
z-index: 10;
border-radius: 10px;
}

/*div.cuadro_peso div.cuadro {
left:80px;
}*/

div.cuadro:hover {
cursor: move;
}

div.cuadro_genero {
width: 242px;
margin-top:30px;
margin-left:17px;
}

div.cuadro_genero ul, div.cuadro_actividad ul {
list-style-type: none;
margin-left:30px;
margin-top:-13px;
}

div.cuadro_genero li, div.cuadro_actividad li {
float:left;
margin-right:10px;
position: relative;
}

div.cuadro_genero li span, div.cuadro_actividad li span {
margin-top:20px;
display: block;
float:left;
color: #6a6c6c;
font-size: 13px;
}

div.cuadro_genero li img {
border: 1px solid #a59a8f;
background-color: #ffffff;
padding:4px 10px;
margin-right:5px;
float:left;
opacity: 0.3;
filter: alpha(opacity=30);
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

div.cuadro_genero li.activo span, div.cuadro_actividad li.activo span {
color: #000000;
}

div.cuadro_genero li.activo img, div.cuadro_actividad li.activo img {
opacity: 1;
filter: alpha(opacity=100);
}

.globo {
display: none;
position: absolute;
padding:10px 8px;
background-color: #ffffff;
border: 1px solid #535354;
z-index: 25;
border-radius: 8px;
bottom:98px;
font-size: 11px;
font-weight: normal;
width: 150px;
left:-18px;
box-shadow: 5px 5px 0px 0px #b09e85;
box-shadow: 5px 5px 0px 0px rgba(176,158,133,0.5);
}

.globo:after {
content: '';
width: 43px;
height: 42px;
background-image: url(../img/calculadora/globo.png);
background-repeat: no-repeat;
position: absolute;
left:20px;
bottom:-42px;
}

#alimentos_contenedor .globo span {
font-size: 16px;
font-weight: bold;
border-bottom: 1px dotted #cccccc;
}

#alimentos_contenedor .globo p {
font-size: 11px;
padding:0px;
}

#alimentos_contenedor .globo div {
font-size: 12px;
font-weight: bold;
color: #000000;
margin-top: 2px;
}

#alimentos_contenedor .globo div span {
display: inline;
font-size: 14px;
color: #c60017;
border-bottom: none;
}

#alimentos_contenedor ul li div.globo {
bottom:140px;
left:40px;
width: 200px;
}

div.cuadro_genero li:hover, div.cuadro_actividad li:hover {
cursor:pointer;
}

div.cuadro_actividad li:hover .globo {
display: block;
opacity: 1;
filter: alpha(opacity=100);
}

div.cuadro_genero li:hover span, div.cuadro_actividad li:hover span {
color: #6a6c6c;
}

div.cuadro_genero li:hover img, div.cuadro_actividad li:hover img {
border: 1px solid #2350a7;
opacity: 0.4;
filter: alpha(opacity=40);
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

div.cuadro_actividad {
width: 614px;
margin-top:30px;
margin-left:30px;
}

div.cuadro_actividad li img {
border: 1px solid #a59a8f;
background-color: #ffffff;
margin-right:4px;
float:left;
opacity: 0.3;
filter: alpha(opacity=30);
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

div.cuadro_actividad li span {
margin-top:15px;
font-size: 12px;
}

div.cuadro_actividad li {
float:left;
margin-right:5px;
}

#calculadora_bottom {
clear:both;
}

#alimentos_contenedor {
float:left;
background-color: #ffffff;
margin-left:17px;
width: 531px;
border: 1px solid #7c8493;
position: relative;
font-size: 14px;
font-weight: bold;
box-shadow: 5px 5px 0px 0px #b09e85;
box-shadow: 5px 5px 0px 0px rgba(176,158,133,0.5);
}

#alimentos_contenedor ul {
list-style-type: none;
margin-top:25px;
padding-left:7px;
}

#alimentos_contenedor ul li {
width: 96px;
height: 228px;
border: 1px solid #a3988c;
float:left;
margin-right: 6px;
font-size: 12px;
position: relative;
color: #707172;
margin-bottom:5px;
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

#alimentos_contenedor ul li:hover {
border: 1px solid #3862b2;
cursor:pointer;
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

#alimentos_contenedor ul li:hover .globo {
display: block;
}

#alimentos_contenedor ul li:hover img {
opacity: 0.8;
filter: alpha(opacity=80);
}

#alimentos_contenedor ul li h6 {
margin:0px;
color: #707172;
font-family: Arial, Helvetica, sans-serif;
background-color: #ececed;
font-weight: normal;
font-size: 13px;
padding: 6px;
min-height: 34px;
}

#alimentos_contenedor ul li p {
padding:5px;
margin:0px;
}
#alimentos_contenedor ul li span {
color: #000000;
font-size: 30px;
display: block;
margin-bottom:-5px;
}

#alimentos_contenedor ul li img.alimento {
border: 2px solid #4f5152;
width: 94px;
margin-left:-1px;
}

#alimentos_contenedor ul li.activo {
border: 1px solid #4168b4;
background-color: #f3f7ff;
}

#alimentos_contenedor ul li div.sumarrestar {
position: relative;
background-color: #ffffff;
color: #b4b2b2;
text-align: center;
width: 100%;
height: 21px;
line-height: 21px;
}

#alimentos_contenedor ul li div.sumarrestar div.restar {
position: absolute;
border: 1px solid #e0dddd;
background-image: url(../img/calculadora/restar_off.png);
width: 14px;
height: 14px;
left:3px;
top:2px;
}

#alimentos_contenedor ul li div.sumarrestar div.sumar {
position: absolute;
border: 1px solid #e0dddd;
background-image: url(../img/calculadora/sumar_off.png);
width: 14px;
height: 14px;
right:3px;
top:2px;
}

#alimentos_contenedor ul li.activo div.sumarrestar {
display: block;
position: relative;
background-color: #3862b2;
color: #ffffff;
text-align: center;
width: 100%;
height: 21px;
line-height: 21px;
}

#alimentos_contenedor ul li.activo div.sumarrestar div.restar {
border: 1px solid #00236f;
background-image: url(../img/calculadora/restar.png);
}

#alimentos_contenedor ul li.activo div.sumarrestar div.sumar {
border: 1px solid #00236f;
background-image: url(../img/calculadora/sumar.png);
}

#alimentos_contenedor ul li.activo div.sumarrestar div.restar:hover, #alimentos_contenedor ul li.activo div.sumarrestar div.sumar:hover {
opacity: 0.8;
filter: alpha(opacity=80);
cursor: pointer;
border: 1px solid #e4ebfa;
}

#alimentos_contenedor ul li.activo h6 {
color: #27498e;
background-color: #e4ebfa;
}

#alimentos_contenedor p.leyenda_alimentos {
color: #6a6c6c;
font-size: 11px;
font-weight: normal;
margin-left:10px;
margin-top: 5px;
margin-bottom: 5px;
}

#alimentos_contenedor ul li.activo:hover div.globo {
display: none;
}

#alimentos_contenedor ul li.activo img.alimento {
border: 2px solid #3862b2;
}

#resultado_calorias {
background-color: #ffffff;
border: 1px solid #a70417;
position: relative;
margin-left:28px;
width: 327px;
height: 537px;
font-size: 15px;
font-weight: bold;
box-shadow: 5px 5px 0px 0px #b09e85;
box-shadow: 5px 5px 0px 0px rgba(176,158,133,0.5);
float:left;
clear:none;
}

#resultado_calorias h5 {
font-family: 'Oswald', Helvetica, Arial;
margin:0px;
font-weight: 300;
background-color: #a70417;
color: #ffffff;
font-size: 16px;
padding-left:10px;
height: 23px;
line-height: 23px;
}

#resultado_calorias div.resultado_calorias {
color: #000000;
padding-top:40px;
font-size: 60px;
width: 100%;
display: block;
text-align: center;
}

#resultado_calorias div.bajada_resultado_calorias {
color: #707172;
font-size: 15px;
width: 100%;
display: block;
text-align: center;
}

.silueta_fondo {
width: 218px;
height: 337px;
background-color: #bcbdbd;
position: relative;
margin-left:58px;
}

.silueta_fondo img {
position: absolute;
}

.silueta_color {
position: absolute;
bottom:0px;
width: 218px;
height: 0px;
background-color: #4a7298;
max-height: 320px;
}

div.boton_reset {
color: #ffffff;
font-size: 13px;
background-color: #b22434;
padding: 5px 3px;
border-radius: 10px;
text-align: center;
width: 130px;
margin-left:10px;
margin-top:10px;
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

div.boton_reset:hover {
background-color: #cc1126;
cursor: pointer;
transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
}

div.maxcalorias {
display: none;
color: #707172;
font-size: 11px;
font-weight: normal;
position: absolute;
margin-bottom:10px;
top:30px;
left:10px;
}

div.maxcalorias span {
font-weight: bold;
font-size: 12px;
padding:2px;
border: 1px solid #dddde0;
color: #000000;
}

img.ticket {
display: none;
border: none;
position: absolute;
top: 0px;
left:25px;
}