@font-face {
font-family: 'oswald-regular';
src: url('oswald-regular-webfont.eot'); 
src: url('oswald-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('oswald-regular-webfont.svg#oswald-regular') format('svg'),
    url('oswald-regular-webfont.ttf')  format('truetype');
}

#contenedor_infografia ul {
list-style-type: none;
}

#contenedor_infografia {
font-family: Arial, Helvetica, sans-serif;
border: 1px solid #b3a081;
width: 958px;
height: 780px;
background-image: url(../img/bg_calculadora.png);
background-repeat: repeat;
float:left;
padding: 13px 0px;
}

#header_infografia {
width: 925px;
padding: 13px 17px;
min-height: 75px;
background-image: url(../img/bg_calculadora_trans.png);
background-repeat: repeat;
border-bottom: 2px solid #b9a17f;
margin-top: -13px;
}

#header_infografia h3 {
color: #644818;
font-weight: 300;
margin-bottom:0px;
font-size: 26px;
font-family: oswald-regular, Helvetica, Arial;
text-shadow: none;
}

#header_infografia p {
	color: #644818;
	width: 900px;
	font-size: 12px;
	font-weight: bold;
}

#side_menu {
width: 260px;
min-height: 688px;
background-image: url(../img/fondo_menu_side.png);
background-repeat: no-repeat;
margin-top:5px;
padding-top:40px;
float:left;
}

#side_menu h5 {
width: 230px;
height: 35px;
color: #fdefda;
background-color: #c21c2a;
text-align: center;
font-size: 20px;
line-height: 35px;
margin:0px;
}

#side_menu ul {
margin-left:17px;
background-color: #ffffff;
border-left: 1px solid #c2a494;
border-right: 1px solid #c2a494;
border-bottom: 1px solid #c2a494;
width: 186px;
padding-top:5px;
padding-bottom:12px;
}

#side_menu li {
position: relative;
border: 1px solid #e5b88e;
margin: 0px 11px;
margin-top: 7px;
height: 27px;
line-height: 27px;
padding-left:30px;
font-size: 13px;
font-weight: bold;
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;
}

#side_menu li:hover {
cursor: pointer;
border: 1px solid #ec848f;
background-color: #eae4e4;
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;
}

#side_menu li.activo {
background-color: #eae4e4;
border: 1px solid #ec848f;
}

#side_menu li img {
position: absolute;
left:-8px;
top:-2px;
}

#contenedor_cortes {
float:left;
position: relative;
width: 698px;
min-height: 500px;
background-image: url(../img/vaca.png);
background-repeat: no-repeat;
background-position: 19px 80px;
}

#contenedor_cortes ul#vaca_cortes li img {
position: absolute;
}

#contenedor_cortes ul#vaca_cortes li img:hover {
opacity: 0.9;
filter: alpha(opacity=90);
cursor:pointer;
}

img.vaca_trans {
display: none;
position: absolute;
top: 80px;
left:19px;
}

#caja_detalle_corte {
list-style-type: none;
position: relative;
}

#caja_detalle_corte li {
position: relative;
display: none;
background-image: url(../img/bg_detalle_corte.png);
background-repeat: no-repeat;
background-position: 45px 435px;

}

#caja_detalle_corte li div.detalle_corte {
position: absolute;
top:460px;
left:70px;
background-color: #ffffff;
border: 1px solid #c2a494;
height: 140px;
width: 422px;
padding:15px;
}

#caja_detalle_corte li div.detalle_corte h4 {
width: 190px;
font-weight: bold;
font-size: 15px;
margin-bottom:5px;
}

#caja_detalle_corte li div.detalle_corte p {
width: 190px;
font-size: 11px;
}

#caja_detalle_corte li div.detalle_corte div {
width: 190px;
font-size: 11px;
position: absolute;
bottom:15px;
}

#caja_detalle_corte li div.detalle_corte img {
position: absolute;
}

#caja_detalle_corte li div.detalle_corte img.imagen_corte {
border: 1px solid #e5b88e;
right:15px;
top:15px;
}

.imagen_corte_png, .numero_corte {
display: none;
}

li.activo img.imagen_corte_png, li.activo img.numero_corte {
display: block;
}

#caja_detalle_corte li img.cerrar {
position: absolute;
top: 445px;
left:505px;
background-image: none;
}

#caja_detalle_corte li img.cerrar:hover {
cursor: pointer;
opacity: 0.8;
filter: alpha(opacity=80);
}
