/********FUENTES*******/

/*MULI*/




@font-face {
    font-family: 'mulibold';
    src: url('../fonts/muli/muli-bold-webfont.eot');
    src: url('../fonts/muli/muli-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/muli/muli-bold-webfont.woff2') format('woff2'),
         url('../fonts/muli/muli-bold-webfont.woff') format('woff'),
         url('../fonts/muli/muli-bold-webfont.ttf') format('truetype'),
         url('../fonts/muli/muli-bold-webfont.svg#mulibold') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'mulilight';
    src: url('../fonts/muli/muli-light-webfont.eot');
    src: url('../fonts/muli/muli-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/muli/muli-light-webfont.woff2') format('woff2'),
         url('../fonts/muli/muli-light-webfont.woff') format('woff'),
         url('../fonts/muli/muli-light-webfont.ttf') format('truetype'),
         url('../fonts/muli/muli-light-webfont.svg#mulilight') format('svg');
    font-weight: normal;
    font-style: normal;

}



@font-face {
    font-family: 'muliregular';
    src: url('../fonts/muli/muli-webfont.eot');
    src: url('../fonts/muli/muli-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/muli/muli-webfont.woff2') format('woff2'),
         url('../fonts/muli/muli-webfont.woff') format('woff'),
         url('../fonts/muli/muli-webfont.ttf') format('truetype'),
         url('../fonts/muli/muli-webfont.svg#muliregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*AMARANTH*/


@font-face {
    font-family: 'amaranthBold';
    src: url('../fonts/amaranth/amaranth-bold-webfont.eot');
    src: url('../fonts/amaranth/amaranth-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/amaranth/amaranth-bold-webfont.woff2') format('woff2'),
         url('../fonts/amaranth/amaranth-bold-webfont.woff') format('woff'),
         url('../fonts/amaranth/amaranth-bold-webfont.ttf') format('truetype'),
         url('../fonts/amaranth/amaranth-bold-webfont.svg#amaranthregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'amaranthregular';
    src: url('../fonts/amaranth/amaranth-regular-webfont.eot');
    src: url('../fonts/amaranth/amaranth-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/amaranth/amaranth-regular-webfont.woff2') format('woff2'),
         url('../fonts/amaranth/amaranth-regular-webfont.woff') format('woff'),
         url('../fonts/amaranth/amaranth-regular-webfont.ttf') format('truetype'),
         url('../fonts/amaranth/amaranth-regular-webfont.svg#amaranthregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*********TERMINA FUENTES************/


/*COMIENZO*/
body{
    background: url("../img/general/body-bg.png") repeat scroll 50% 0;
    font-family: 'muliregular', Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #092248;
}

.pantalla {
    background-color: #e0e0e0;
    bottom: 0;
    left: 0;
/*    margin: 63px auto auto;*/
    min-height: 597px;
    position: relative;
    right: 0;
/*    top: -63px;*/
    width: 100%;
	/*min-width: 1010px;*/
}


.exploracion {
    padding: 2%;

}

.css-glosario.js-btn-glosario {
    color: #e8bb49;
}


.vtn-vtnesquema .css-glosario.js-btn-glosario {
    color: #0868ce;
}

.Css-vtnTxtGlosario::after {
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 22px solid #f8762e;
    bottom: 0;
    content: "";
    display: block;
    height: 0;
    left: 0;
    margin: auto;
    position: relative;
    right: 0;
    top: 26px;
    width: 0;
}

.Css-vtnTxtGlosario {
    background: #f8762e none repeat scroll 0 0;
    box-shadow: 0 0 6px #772801;
    color: white;
    padding: 20px 20px 10px 10px;
    position: relative;
    top: 193px;
}

.pantallas .Css-glosarioVtn {
    position: absolute;
    width: 61%;
}




.btn-icono.btn-creditos {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -161px -205px;
    border: medium none;
    color: #fff;
    float: right;
    height: 46px;
    margin: 9px;
    text-indent: -99999px;
    width: 46px;
    z-index: 17;
}

/*ESTILO CREDITOS*/
.creditos--lista {
    list-style: outside none none;
    margin: 0;
    padding: 20px;
}


.vntn-creditos .ui-state-default.ui-corner-top.ui-tabs-active.ui-state-active {
    background: #1b828e none repeat scroll 0 0;
}


.vntn-creditos .ui-tabs .ui-tabs-panel {
    background: #1B828E;
    border: 1px solid #92a97e;
    display: block;
    margin-top: 8px;
    padding: 0;
}


.vtn-creditos .ui-tabs-nav .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
    color: white;}


/*creditos*/
.right {
    float: left;
    margin-left: 5%;
    text-align: center;
    width: 45%;
}

.left {
    float: left;
    margin-left: 7%;
    text-align: center;
    width: 35%;
}
.creditos--col:nth-of-type(1), .creditos--col:nth-of-type(2), .creditos--col.creditos-dgtic > .creditos--lista {
	width: 90%;
}


.vntn.vntn-creditos {
    background-color: rgba(249, 205, 65, 0.95);
    border: medium none;
    bottom: 2%;
    box-shadow: 0 5px 5px #17546c;
    color: white;
    max-width: 1212px;
    min-height: 575px;
    min-width: 700px;
    top:8px;
    width: 90%;
}



.vntn-creditos .vntn--btn-cerrar {
    border: medium none;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
    font-weight: lighter;
    height: 48px;
    top: 12px;
    width: 48px;
    z-index: 60;
}
.bibliografia > li {
    text-align: left;
}
.vntn.vntn-creditos .tabsCred ul.bibliografia li a{
	display:inline-block;
	float: none;
}
.vntn.vntn-creditos .tabsCred ul li a {
    float: left;
    line-height: 2px;
    padding: 1.3em;
    text-decoration: none;
/*    color: white;*/
}
.vntn.vntn-creditos .tabsCred ul li.ui-corner-top{
/*    background: #1B828E;*/
    border: medium none;
    color: #ffffff;
    font-weight: normal;
}
.vntn.vntn-creditos .tabsCred  li.ui-state-default{
/*    background: #99c99d;*/
	  border: medium none;
}
h2.vntn--titulo {
    border-bottom: 1px solid #99b088;
    color: #17546c;
    font-size: 26px;
    padding-bottom: 1px;
    font-family:"amaranthregular",Arial,Helvetica,sans-serif;
}

.creditos--entidad {
    color: white;
    font-size: 20px;
    text-align: center;
}

.creditos--cargo, .creditos--credito {
	color: white;
	display: block;
	font-size: 19px;
	font-weight: bold;
}

.creditos--nombre {
    color: #8DF7F7;
    display: block;
    font-size: 19px;
}

.creditos--col.creditos-dgtic > .creditos--lista {

	margin: 10px 2% 34px;
}

.creditos--lista > li {
	margin-bottom: 8px;
}

.copy > p {
	color: #32401f;
	font-size: 17px;
}

.copy {
/*	border-top: 1px solid #889d6c;*/
	height: auto;
	margin-top: 25px;
	position: absolute;
	width: 93%;
}

.copy p {
	border: 0 none;
	display: block;
	font-size: 12px;
	line-height: 17px;
	margin-bottom: -9px;
	text-align:center;
}

.copy img {
    margin-right: 9px;
    position: relative;
    top: 8px;
}



/*Tabs para créditos*/
.tabsCred--gral {
	height: 82%;
	position: absolute;
	top: 40px;
	width: 94%;
}

.tabsCred.ui-widget-content {
    height: 40%;
}


.vntn-creditos .copy {
/*    border-top: 1px solid #889d6c;*/
    height: auto;
    margin-top: 14px;
    position: absolute;
    width: 93%;
}



/*scroll plugin*/

 .mCustomScrollbar .mCSB_4_scrollbar_vertical{
 position: absolute;
 width: 16px;
 height: auto;
 left: auto;
 top: 0;
 right: 0;
 bottom: 0;
 background: red;
 background-color:red;
 }
.vntn-creditos .mCSB_scrollTools  div.mCSB_dragger .mCSB_dragger_bar{
	 background-color: #35ACBF;
	 width: 15px;
}
.vntn-creditos .mCSB_scrollTools  div.mCSB_dragger_bar:hover  {
 background-color: #8DF7F7;
 width: 15px;
 }
.mCSB_scrollTools .mCSB_draggerContainer {
 left: 30px;
 }
.mCSB_scrollTools .mCSB_draggerRail {
 width: 10px;
 }
 .mCSB_scrollTools  .mCSB_inside  .mCSB_container {
 margin: auto 58px -2px 7px;
 }

/**fin plug in*/
.logos {
/*    border-bottom: 1px solid #f4f4f4;*/
     margin-bottom: 52px;
}
.logos  ul {
    text-align: center;
}
.logos li {
    background-image: url("../img/general/logos.png");
    background-position: 0 center;
    background-repeat: no-repeat;
    display: inline-block;
    height: 70px;
    list-style: outside none none;
    text-indent: -1000px;
    width: 181px;
    text-align:center;
    margin:auto;
    text-indent: -10000px;
}
.logos li.sep {
    background-position: -186px center;
    margin-left: 5%;
    margin-right: 5%;
    width: 246px;
}
.logos li.unam {
    background-position: -443px center;
    margin-right: 10%;
    width: 80px;
}
.logos li.dgtic {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #5b5b5b;
    font-size: 30px;
    font-weight: bold;
    position: relative;
    text-indent: 0;
    top: 16px;
}

/*ESTILO TABS BALLENAS CRONOLOGIA*/


.hudc-zona-horse .ui-accordion-header.ui-state-default.ui-accordion-icons.ui-accordion-header-active.ui-state-active.ui-corner-top {
    background-color: #1b828e;
    border-bottom: 2px solid white;
    height: 44px;
    line-height: 44px;
    margin: 0;
}

.hudc-zona-horse  .ui-accordion-content.ui-helper-reset.ui-widget-content.ui-corner-bottom.ui-accordion-content-active {
    background-color: #3e9fa2;
    color: white;
    margin: 0;
    padding: 9px;
}

.ui-accordion-header{
	 margin-bottom: 0px;
    margin-top: 0px;
	 cursor:pointer;
	}

.css-chichi-menu{
	 left:50;
	  right:50%; 
	  margin:auto;
    background-repeat: no-repeat;
    height: 12px;
	width: 37px;
	}
	
.hudc-zona-horse  .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: #f7762e none repeat scroll 0 0;
    border: 1px solid #c5c5c5;
    color: white;
    font-weight: normal;
    height: 44px;
    line-height: 44px;
    text-align: center;
}
	

.ballanaPatas05 .ui-accordion-content {
    height: 250px;
}





.css-chichi-1{
background-image: url("../img/general/chi_1.png");
}

.css-chichi-2{
background-image: url("../img/general/chi_2.png");
}
.css-chichi-3{
background-image: url("../img/general/chi_3.png");
}


.vntn.Css-ventana.Css-vtnIntruccion > span {
    border-bottom: 3px solid #118b98;
    float: right;
    margin-top: 16px;
    text-indent: -9999px;
    width: 85%;
}

.Css-vtnImgLibro span {
    font-size: 25px;
    font-weight: bold;
    left: 7px;
    position: relative;
    top: -24px;
    text-shadow: 2px 3px 1px #004d54;
}


.vntn.Css-ventana.Css-vtnIntruccion.js-vntn-ballanaPatasDragInt {
background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
}


.vntn.js-vntn.Css-ventana.Css-vtnIntruccion.js-vntn-laboratorio2Ints{
background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
}

.vntn.js-vntn.Css-ventana.Css-vtnIntruccion.js-vntn-laboratorio3{

background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
    width: 50%;
}


.btn-icono.btn-instruccion {
    border: medium none;
    color: #fff;
    float: right;
    font-family: "amaranthregular",Arial,Helvetica,sans-serif;
    font-size: 18px;
    height: 63px;
    padding-left: 55px;
    text-align: right;
    width: 164px;
    z-index: 60;
}

.btn-icono.btn-instruccion::before {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") no-repeat scroll -161px -109px;
    content: "";
    display: inline-block;
    height: 46px;
    position: absolute;
    right: 181px;
    top: 10px;
    width: 46px;
    z-index: 60;
}
    
.titulo {
    color: #e95a0c;
    margin-bottom: 51px;
    text-shadow: 4px 1px 0 white;
}

.css-subMenuLab a {
    color: white;
    display: block;
    font-family: "amaranthregular",Arial,Helvetica,sans-serif;
    height: 100%;
    padding-right: 22px;
    text-align: right;
    text-decoration: none;
    width: 100%;
}

.css-subMenuLab {
    margin: 0;
    padding: 0;
    position: absolute;
    top: 12px;
    width: 68%;
}

.css-subMenuLab > li {
    border-radius: 23px 24px 0 0;
    display: inline-block;
    float: left;
    height: 51px;
    line-height: 20px;
    padding-right: 22px;
    width: 29%;
}

.vntn  .Css-ventana .vtn-hueso{
    background-color: violet;
    
}


.css-subMenuLab > li:nth-child(1) {
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.3, #90523C),
	color-stop(1, #493422)
);
background-image: -o-linear-gradient(bottom, #90523C 30%, #493422 100%);
background-image: -moz-linear-gradient(bottom, #90523C 30%, #493422 100%);
background-image: -webkit-linear-gradient(bottom, #90523C 30%, #493422 100%);
background-image: -ms-linear-gradient(bottom, #90523C 30%, #493422 100%);
background-image: linear-gradient(to bottom, #90523C 30%, #493422 100%);
}

.css-subMenuLab > li:nth-child(2) {
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.3, #38C2A4),
	color-stop(1, #379B9E)
);
background-image: -o-linear-gradient(bottom, #38C2A4 30%, #379B9E 100%);
background-image: -moz-linear-gradient(bottom, #38C2A4 30%, #379B9E 100%);
background-image: -webkit-linear-gradient(bottom, #38C2A4 30%, #379B9E 100%);
background-image: -ms-linear-gradient(bottom, #38C2A4 30%, #379B9E 100%);
background-image: linear-gradient(to bottom, #38C2A4 30%, #379B9E 100%);
}

.css-subMenuLab > li:nth-child(3) {
   background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0.3, #F88F2E),
	color-stop(1, #EF7833)
);
background-image: -o-linear-gradient(bottom, #F88F2E 30%, #EF7833 100%);
background-image: -moz-linear-gradient(bottom, #F88F2E 30%, #EF7833 100%);
background-image: -webkit-linear-gradient(bottom, #F88F2E 30%, #EF7833 100%);
background-image: -ms-linear-gradient(bottom, #F88F2E 30%, #EF7833 100%);
background-image: linear-gradient(to bottom, #F88F2E 30%, #EF7833 100%);
}

.btn-icono.btn-pertenecefosil::before {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") no-repeat scroll -157px 0;
    content: "";
    display: block;
    height: 45px;
    margin: 5px 10px;
    position: absolute;
    width: 69px;
}
.btn-icono.btn-evolCetacio::before {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") no-repeat scroll 0 -199px;
    content: "";
    display: block;
    height: 43px;
    margin: 8px -1px;
    position: absolute;
    width: 78px;
}

.btn-icono.btn-conservaCetacio::before {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") no-repeat scroll 0 -151px;
    content: "";
    display: block;
    height: 46px;
    margin: 5px 18px;
    position: absolute;
    width: 85px;
}


.ccs-btn-ventana.vntn-btn-cerrar {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -101px;
    color: white;
    font-weight: bold;
    height: 48px;
    left: 0;
    line-height: 43px;
    margin: 0 auto;
    padding-left: 11px;
    position: absolute;
    right: 0;
    text-align: left;
    text-decoration: none;
    width: 147px;
}

.vntn.js-vntn.Css-ventana.Css-vtnIntruccion.js-vntn-laboratorio1 {
     background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
    width: 50%;
}


.vntn.js-vntn.Css-ventana.Css-vtnIntruccion.js-vntn-ballenaPatas01{
     background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
}


.vntn.js-vntn.Css-ventana.Css-vtnIntruccion.js-vntn-conservaCetaceo {
     background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
}


.vntn.js-vntn.Css-ventana.Css-vtnIntruccion.js-vntn-conservaCetaceo2 {
     background: #fdc558 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 2px 4px 0 2px #17546c;
    max-width: 50%;
    top: 29%;
}


.vntn {
    background: none;
    border: none;
    box-shadow: none;
    left: 0;
    margin: auto;
    max-width: 80%;
    min-width: 300px;
    padding: 20px;
    position: absolute;
    right: 0;
    top: 4%;
    z-index: 50;
    text-align: justify;
    width: 80%;
}

.vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg {
    background: #89f7f7 none repeat scroll 0 0;
    border-bottom: 4px solid #135562;
    height: 55px;
    left: 0;
    margin: 0 auto;
    padding: 0 6px;
    position: absolute;
    right: 0;
    text-align: justify;
    top: 57%;
    width: 93%;
    z-index: 1;
}

.vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg::before, .vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg::after {
    content: "";
    display: block;
    height: 0;
    position: absolute;
    bottom: -11px;
    width: 0;
    
}

.vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg::after {
    border-bottom: 7px solid transparent;
    border-left: 6px solid #135562;
    border-top: 0 solid transparent;
    right: 0;

}

.vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg::before {
    border-bottom: 7px solid transparent;
    border-right: 6px solid #135562;
    border-top: 0 solid transparent;
    left: 0;
}


.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1::before, .Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1::after {
    content: ""; 
    position: absolute;
    width: 0;
    height: 0;
    display: block;
    bottom: -11px;
}

.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1::after {
    border-bottom: 7px solid transparent;
    border-left: 6px solid #135562;
    border-top: 0 solid transparent;
    right: 0;
   
}

.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1::before {
    border-bottom: 7px solid transparent;
    border-right: 6px solid #135562;
    border-top: 0 solid transparent;
    left: 0;
   
}


.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1 {
    background: #89f7f7 none repeat scroll 0 0;
    border-bottom: 4px solid #135562;
    height: 55px;
    margin: 0 auto;
    padding: 0 6px;
    right: 639px;
    text-align: justify;
    top: 9%;
    width: 460px;
    z-index: 3;
}

.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1 > h3 {
    height: auto;
    margin-bottom: 11px;
    margin-top: 12px;
    padding: 0;
}

.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1 > p {
    background: #1b828e none repeat scroll 0 0;
    color: white;
    margin-top: 15px;
    padding: 20px 20px 42px;
    z-index: 0;
}

.css-btn-continuar.btn-hueso-sig.btn-cerrar1 {
    top: 390px;
}

.vntn.Css-ventana.vtn-hueso.tooltip1::before {
    border-left: 20px solid transparent;
    border-right: 2px solid transparent;
    border-top: 21px solid #fdc558;
    content: "";
    float: left;
    height: 0;
    position: absolute;
    right: 16px;
    top: 43px;
    width: 0;
}
.vntn.Css-ventana.vtn-hueso.tooltip1 {
    background-color: #fdc558;
    border-bottom: 3px solid black;
    border-radius: 52px;
    font-size: 22px;
    font-weight: bold;
    max-width: 116px;
    min-width: 157px;
    padding: 6px;
    text-align: center;
}


.css-txt-respVnt.js-txt-respVnt {
    background-color: #118b98;
    color: white;
    margin-bottom: 10px;
    margin-top: 59px;
    padding: 7px 20px 61px;
}


.vtn-respPreg .vntn--btn-cerrar {
    top: 5px;
}

.ccs-btn-ventana.vntn-btn-continuarFosil-2 {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -101px;
    color: white;
    height: 48px;
    left: 0;
    line-height: 44px;
    margin: 0 auto;
    padding-left: 15px;
    position: absolute;
    right: 0;
    text-align: left;
    text-decoration: none;
    top: 120%;
    width: 141px;
}.ccs-btn-ventana.vntn-btn-continuarFosil-2 {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -101px;
    color: white;
    height: 48px;
    left: 0;
    line-height: 44px;
    margin: 0 auto;
    padding-left: 15px;
    position: absolute;
    right: 0;
    text-align: left;
    text-decoration: none;
    top: 120%;
    width: 141px;
}

.clearfix.pantalla.laboratorio2 {
    clear: both;
}

.css-btn-continuar.btn-cetaceo-sig.continuar2 {
    margin-top: 22px;
}
.Css-glosarioVtn .vntn--btn-cerrar {
    right: -2px;
    top: 189px;
}
.Css-glosarioVtn .vntn--btn-cerrar {
    right: 0;
}

.css-cuadro-Infocetaceo .css-btn-continuar {
    bottom: -25px;
}

.css-cuadro-IntxtCetaceo{ 
     position:relative;
	  left:4%;
    width: 90%;
	}







.css-cetaceos-li a:nth-child(2)::before {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -209px -203px;
    border: 2px solid;
    border-radius: 100%;
    content: "";
    display: block;
    height: 45px;
    left: 241px;
    position: relative;
    top: -30px;
    width: 45px;
}

.laboratorio3 .Css-zoom-vtn {
    background: #38a0a3;
    height: 100%;
    max-width: 1280px;
    min-width: 768px;
    padding: 0;
    position: absolute;
    top: -62px;
}

.vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-ballena {
    height: 110%;
      top: -77px;
    width: 100%;
}
.vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-elefente {
    height: 113%;
    top: -77px;
    width: 100%;
}
.vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-orca {
    height: 110%;
      top: -77px;
    width: 100%;
}


.vtn-zoo-diente .css-img-cetaceo-vtn.zoom-gris {
    height: auto;
    position: absolute;
    width: 100%;
}


.vtn-zoo-elefente .vntn--btn-cerrar {
    right: 12px;
    top: 12px;
}

.vtn-zoo-ballena .vntn--btn-cerrar {
    right: 12px;
    top: 12px;
}

.vtn-zoo-orca .vntn--btn-cerrar {
    right: 12px;
    top: 12px;
}


.css-img-cetaceo-vtn.zoom-elefante {
    height: 100%;
    text-align: center;
    width: 100%;
}

.css-img-cetaceo-vtn.zoom-orca {
    height: 100%;
    text-align: center;
    width: 100%;
}


.vtn-zoo-diente .css-img-cetaceo-vtn.zoom-gris > img {
    margin-left: -8%;
    margin-top: -38px;
    width: 100%;
}

.vtn-zoo-ballena .css-img-cetaceo-vtn.zoom-gris {
    height: auto;
    text-align: center;
    width: 100%;
}

.vtn-zoo-ballena .css-img-cetaceo-vtn.zoom-gris > img {
    margin-top: 13%;
    max-width: 90%;
}

.css-img-cetaceo-vtn.zoom-elefante > img {
    margin-top: 13%;
    max-width: 90%
}

.css-img-cetaceo-vtn.zoom-orca > img {
    margin-top: 7%;
    max-width: 90%;
}
.btn-a .vntn--btn-cerrar {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -161px -157px;
    position: fixed;
    text-indent: -9999px;
    top: 12px;
    z-index: 1;
}

.laboratorio3 .css-img-cetaceo-vtn p {
    border-top: 1px solid;
    color: white;
    margin: 44px auto;
    text-transform: uppercase;
    width: 80%;
}

/*COMIENZA ESTILO DE CRONOLOGIA*/

.css-ballenaIlustra {
    margin: 5% 0 0 5%;
}


.descrip-ballena {
    position: relative;
    top: 265px;
    width: 100%;
}


.descrip-ballena > h3, h4 {
    color: #043051;
    margin: 0 0 0 -2px;
}
/*TERMINA ESTILO DE CRONOLOGIA*/



/*******************TERMINA**********************/

/*Estilo para ventana TABS*/


.css-area-txt-ballena {
    width: 57%;
}



.css-area-txt-ballena .ui-tabs .ui-tabs-panel {
    border: none;
    display: block;
    padding: 1em 1.4em;
}


.css-area-txt-ballena .css-txt-litMex {
    text-align: center;
}

.css-area-txt-ballena .css-txt-litIUCN {
    text-align: center;
}

.conservaCetaceo-2 .ui-tabs.ui-widget.ui-widget-content.ui-corner-all {
/*    background-color: #35acbf;*/
    margin: 0;
    width: 100%;
}
.conservaCetaceo-2 .ui-tabs-panel.ui-widget-content.ui-corner-bottom {
    display: inline-flex;
}


.conservaCetaceo-2 .owl-carousel .owl-wrapper-outer {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.conservaCetaceo-2 .owl-carrusel.owl-theme.owl-carousel {
    width: 434px;

}

.conservaCetaceo-2 .ui-tabs .ui-tabs-panel {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    display: block;
    padding: 15px 0 45px 2%;
    width: 98%;
    background-color: #35acbf;
       border-radius: 0 22px 22px;
 
}

.conservaCetaceo-2 .ui-tabs .ui-tabs-nav {
    margin: 0;
    padding: 0;
}


.conservaCetaceo-2  .ui-tabs .ui-tabs-nav li {
    border-bottom-width: 0;
    border-radius: 18px 18px 0 0;
    float: left;
    list-style: outside none none;
    margin: 1px 0.5em 0 0;
    padding: 0;
    position: relative;
    top: 0;
    white-space: nowrap;
    width: 22%;
}


.conservaCetaceo-2 .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    float: left;
    padding: 0;
    text-align: center;
    text-decoration: none;
    width: 100%;
}


.css-txt-evolCetaceo .ui-state-default.ui-corner-top.ui-tabs-active.ui-state-active {
    background: #35acbf none repeat scroll 0 0;
    color: #ffffff;
    font-weight: bold;
    border: none;
}

.conservaCetaceo-2 .owl-theme .owl-controls .owl-page span {
    background: #fff none repeat scroll 0 0;
    border-radius: 20px;
    display: block;
    height: 12px;
    margin: 5px 7px;
    opacity: 0.5;
    width: 12px;
}

/*TERMINA ESTILO TABS*/


header {
    background-color: #252828;
    height: 63px;
    position: relative;
    width: 100%;
    z-index: 2;
}

.oacontext{
    background-color: #e0e0e0;
    box-shadow: 0 0 3px #666;
}
.ccs-btn-comenzar{
  background-color: gray;
    left: 336px;
    position: absolute;
    top: 225px;
    width: 100px;
	}
/*FOSILES*/
/*ACTIVIDAD 1 MODULO 1*/
.wrapper{
    background: #F9F9F9;
	 max-width:auto;
}

.Css-lista{ 
	display:inline-block;
background-color:#FFF9D2; 
     margin-right: 10px;
    padding:10px;
    width:35px;
	 height:35px;

	}
.Css-imgInfoFosil{
	display:inline-block;
  background-repeat:no-repeat;
   width:300px;
height:300px;

}

.Css-imgInfoFosil-1{ 

 background-image:url(../img/actividad1/ammonites.png);


}


.Css-imgInfoFosil-2{ 

background-image:url(../img/actividad1/wombat.png);


}


.Css-imgInfoFosil-3{ 

background-image:url(../img/actividad1/glyptodon.png);


}


.Css-imgInfoFosil-4{ 

background-image:url(../img/actividad1/armadillo.png);


}

.Css-vtnImgLibro::before {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -87px -151px;
    content: "";
    display: block;
    height: 60px;
    left: -56px;
    position: absolute;
    top: -5px;
    width: 73px;
}

.Css-vtnImgLibro {
    background-color: #118b98;
    border-radius: 0 30px 30px 2px;
    color: white;
    height: 44px;
    margin-bottom: 34px;
    margin-left: 63px;
    margin-top: 21px;
    text-align: center;
    transform: translateZ(2px);
     -webkit-transform:translateZ(2px);
    width: 213px;
    z-index: 1;
}	
/*ACTIVIDAD1 MODULO 2*/
/*formanfosil*/
#css-rotating-item-wrapper {
	position: relative;
	width: 980px;
	height: 347px;
}
.css-rotating-item {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}



.css-fosil-btnLi{ 
list-style:none;
display:inline-block;
	
	
	}

.css-areahuesoTxt::before {
    border-bottom: 19px solid #38a0a3;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    content: "";
    left: 360px;
    position: relative;
    top: -49px;
}

.css-areahuesoTxt {
    background-color: #38a0a3;
    border-radius: 10px;
    box-shadow: 2px 2px 0 1px #0d4b4c;
    color: white;
    display: block;
    font-family: mulilight;
    left: 550px;
    padding: 3px 15px;
    position: relative;
    text-align: justify;
    top: 473px;
    width: 489px;
    z-index: 1;
}

/*ACTIVIDAD 1 MODULO 3*/
/*formanfosil*/

.e-activo {
    background: white none repeat scroll 0 0;
    border-radius: 100%;
    height: 15px;
    width: 15px;
}
	
	
	
	
.Css-final-Preg{ 
background-color:#FFD9AE;
position: relative;
width: 980px;
height: 347px;
}
	
	
	


/*ACTIVIDAD 3 MODULO 1*/

.hudc-huesos-Drop {
    background: rgba(0, 0, 0, 0) url("../img/laboratorio/cajita.png") no-repeat scroll 0 0;
    float: left;
    height: 441px;
    margin-left: 3%;
    margin-top: 20px;
    position: relative;
    width: 221px;
}

.hudc-huesos-Drag {
    background: rgba(0, 0, 0, 0) url("../img/laboratorio/fondo_fosil.png") repeat scroll 0 0;
    float: left;
    height: 526px;
    margin-left: 7%;
    position: relative;
    width: 477px;
}

/*.css-areahueso{
	 background-color:#F0F0F0;
position:absolute;
	}*/
	

.css-areahueso-Drop{
/*	 background-color: #CFFBCD;*/
position:absolute;
	}
	

	
	
	

	.css-areahueso-Drag{
/*		 background-color: #FFFABD; */
	 position:absolute;
	 touch-action: none; /*no mover compatibilidad drag de edge*/
        z-index: 1;

	}

/*.css-hueso-base{ 
pocision
left: 170px;
top: 30px;
/*tamaño
width:51px;
height:82px;	
/*elemento
background-image:url(../img/laboratorio/hueso_base.png);	
background-repeat:no-repeat;
	}*/


.css-hueso-base {
    background-image: url("../img/laboratorio/hueso_base.png");
    background-repeat: no-repeat;
    height: 82px;
    left: 86px;
    text-indent: -9999px;
    top: 32px;
    width: 51px;
}
	
	
.css-hueso1-Drag {
    background-image: url("../img/laboratorio/hueso1.png");
    background-repeat: no-repeat;
    height: 58px;
    left: 223px;
    text-indent: -9999px;
    top: 140px;
    width: 44px;
}
	
.css-hueso2-Drag {
    background-image: url("../img/laboratorio/hueso2.png");
    background-repeat: no-repeat;
    height: 71px;
    left: 343px;
    text-indent: -9999px;
    top: 141px;
    width: 62px;
}
	
.css-hueso3-Drag {
    background-image: url("../img/laboratorio/hueso3.png");
    background-repeat: no-repeat;
    height: 28px;
    left: 346px;
    text-indent: -9999px;
    top: 260px;
    width: 68px;
}

.css-hueso4-Drag {
    background-image: url("../img/laboratorio/hueso4.png");
    background-repeat: no-repeat;
    height: 80px;
    left: 190px;
    text-indent: -9999px;
    top: 246px;
    width: 89px;
}
	
.css-hueso5-Drag {
    background-image: url("../img/laboratorio/hueso5.png");
    background-repeat: no-repeat;
    height: 232px;
    left: 90px;
    text-indent: -9999px;
    top: 120px;
    width: 95px;
}
	
	
	
.css-hueso1-Drop {
    height: 77px;
    left: 76px;
    top: 90px;
    width: 46px;
}

.css-hueso1-img{
	/*elemento*/
background-image:url(../img/laboratorio/hueso1.png);	
background-repeat:no-repeat;
}	
	
.css-hueso2-Drop {
    height: 71px;
    left: 94px;
    top: 74px;
    width: 92px;
}
	
.css-hueso2-img{
	/*elemento*/
background-image:url(../img/laboratorio/hueso2.png);	
background-repeat:no-repeat;
}		
	
.css-hueso3-Drop {
    height: 43px;
    left: 87px;
    top: 135px;
    width: 96px;
}
	
	.css-hueso3-img{
	/*elemento*/
background-image:url(../img/laboratorio/hueso3.png);	
background-repeat:no-repeat;
}	



.css-hueso4-Drop {
    height: 80px;
    left: 73px;
    top: 140px;
    width: 89px;
}


.css-hueso4-img{
	/*elemento*/
background-image:url(../img/laboratorio/hueso4.png);	
background-repeat:no-repeat;
}		

.css-hueso5-Drop {
    height: 238px;
    left: 79px;
    top: 173px;
    width: 83px;
}

.css-hueso5-img{
	/*elemento*/
background-image:url(../img/laboratorio/hueso5.png);	
background-repeat:no-repeat;
}		
	
	
.css-hueso-ejemplo {
    background-image: url("../img/laboratorio/pisa_papel.png");
    background-repeat: no-repeat;
    float: left;
    height: 501px;
    margin-left: 2%;
    position: relative;
    text-indent: -9999px;
    top: 15px;
    width: 259px;
}

.css-hueso-basetxt::after {
    border-left: 1px solid transparent;
    border-right: 20px solid transparent;
    border-top: 27px solid #38a0a3;
    content: "";
    display: block;
    float: left;
    height: 0;
    left: 140px;
    position: absolute;
    width: 0;
}
.css-hueso-basetxt {
    background-color: #38a0a3;
    border-radius: 10px;
    box-shadow: 1px 1px 0 1px #0d4b4c;
    color: white;
    padding: 5px;
    position: absolute;
    right: 0;
    text-align: center;
    top: -7px;
    width: 217px;
}
	
.e-cursor-drag{
	cursor:move;
	}
	
.e-invisible{
	 visibility:hidden;
	}

.css-btn-zoom {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -209px -203px;
    border: 2px solid white;
    border-radius: 100%;
    content: "";
    display: block;
    height: 45px;
    left: 11px;
    position: absolute;
    top: 17px;
    width: 45px;
    z-index: 2;
}
/*
.css-pistas-PregIlustra{ 
 background-color: #f7ffa9;
    background-image: url("../img/ballenas/esqueleto.png");
    background-repeat: no-repeat;
    height: 835px;
    left: -54px;
    position: absolute;
    top: 0;
    width: 834px; 
	}

*/
/*Estlo preguntas*/

.lista-avance {
    float: left;
    margin-top: 2%;
    width: 100%;
}

.lista-avance ul {
    list-style: outside none none;
    padding: 0;
    text-align: center;
}

.css-linea-preguntas > li {
    background: #3e9fa2 none repeat scroll 0 0;
    border: 5px solid transparent;
    border-radius: 100%;
    display: inline-block;
    height: 15px;
    margin: 0 16px;
    text-indent: -9999px;
    width: 15px;
}

.css-pistas-PregIlustra {
    background-color: #1b828e;
    background-repeat: no-repeat;
    float: left;
    height: 301px;
    text-align: center;
    width: 50%;
}
	
.css-pistas-PregIlustra > img {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform:translateY(-50%);
    width: 100%;
}
	
.css-pistas-Preg {
    background-color: #3e9fa2;
    float: left;
    height: 301px;
    width: 50%;
}

/*
.css-linea-preguntas {
    background-color: #99fffa;
    float: right;
    left: 0;
    margin: 0 auto;
    position: absolute;
    width: 100%;
    z-index: 1;
}
*/


.css-Area-preguntas {
    text-align: center;
}

.ul-respuestas {
    padding: 0;
}

.li-respuesta {
    display: inline-block;
    margin-right: 10px;
}
/*UN BALLENA CON PATAS*/
.css-elmtContenedor {
    color: #273d5f;
    font-family: "muliregular";
 padding: 2%;
    text-align: justify;
}

.css-img-Pakicetus {
    text-align: center;
}


.css-txt-FosilP02 .css-glosario.js-btn-glosario {
    color: #0868ce;
}



/*ejercico 2 pantalla 3 ballena con patas barco	*/


.css-contFosilBarco {
    color: #273d5f;
    padding: 2%;
}

.css-txt-FosilP01{
  color: #273d5f;
    font-family: 'muliregular';
    margin-left: auto;
    margin-right: 0;
    padding-right: 117px;
    padding-top: 0px;
    text-align: justify;
    width: 75%;
	}
	
	
.css-img-hudc-01 {
    background-image: url("../img/actividad2/barco.png");
    background-repeat: no-repeat;
    display: inline-block;
    height: 369px;
    margin-right: 2%;
    vertical-align: middle;
    width: 326px;
}

	.css-txt-FosilP02{
  color: #273d5f;
    display: inline-block;
    font-family: 'muliregular'; 
    text-align: justify;
    vertical-align: middle;
    width: 60%;
	}


.css-cetaceo-img-list {
    margin: 62px auto auto;
    padding: 0;
    text-align: center;
}
/*
.mini-ballenas ul {
    margin: 0;
    padding: 1px;
    z-index: 4;
}
*/

.css-cetaceos-li a {
    color: white;
    font-weight: bold;
    text-decoration: none;
    z-index: 1;

/*
    transform: translateZ(1px);
    -webkit-transform:translateZ(1px);
    -ms-transform:translateZ(1px);
*/

}

.css-cetaceos-li {
    display: inline-block;
/*    margin: 8px 0 0;*/
}
	
.css-img-cetaceo {
    display: inline-block;
    height: 182px;
    width: 319px;
}

.css-btn-cetaceo.css-btn-cetaceo-1 {
    background-color: #ffc74c;
    border: 3px solid #e0e0e0;
    border-radius: 100%;
    display: block;
    height: 44px;
    left: 17px;
    line-height: 44px;
    position: relative;
    top: 207px;
    width: 44px;
    z-index: 10;

}

.css-btn-cetaceo.css-btn-cetaceo-2 {
    background-color: #FF8458;
    border: 3px solid #e0e0e0;
    border-radius: 100%;
    display: block;
    height: 44px;
    left: 17px;
    line-height: 44px;
    position: relative;
    top: 207px;
    width: 44px;
    z-index: 10;   
}
	
.css-btn-cetaceo.css-btn-cetaceo-3 {
    background-color: #8BC53F;
    border: 3px solid #e0e0e0;
    border-radius: 100%;
    display: block;
    height: 44px;
    left: 17px;
    line-height: 44px;
    position: relative;
    top: 207px;
    width: 44px;
    z-index: 10;
}


.css-img-cetaceo-1 {
    background-color: #41a2ad;
    background-image: url("../img/actividad1/ballenagris_small.png");
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 15px 15px 0 0;
    line-height:  238px;
}

.css-img-cetaceo-2 {
    background-color: #41a2ad;
    background-image: url("../img/actividad1/elefantemarino_small.png");
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 15px 15px 0 0;
     line-height:  238px;
}

.css-img-cetaceo-3 {
    background-color: #41a2ad;
    background-image: url("../img/actividad1/orca_small.png");
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 15px 15px 0 0;
     line-height:  238px;
}






/*VENTANA DE ZOOM CETACEOS actividad 2*/
/*
 .Css-zoom-vtn{ 
	   height: 530px;
    width: 1024px;
	 }
*/
	.css-img-cetaceo-vtn{
     height: 530px;
    width: 1024px;
	}
	 

/*
.info-ballenas-gris, .info-elefante, .info-orca::after {
    background-color: red;
    content: "";
    display: flex;
    height: 12px;
    position: relative;
    width: 12px;
}
*/

/*
.info-ballenas-gris::before {
    content: ""; 
    position: absolute;
    width: 0;
    height: 0;
    display: block;
    bottom: -11px;
    border-bottom: 7px solid transparent;
    border-left: 6px solid #135562;
    border-top: 0 solid transparent;
    right: 0;
} 
*/

.css-pistaLista {
    color: white;
    margin: 39px 0 0 46px;
}

.css-pistas-Preg > h4 {
    margin-left: 26px;
}

.info-ballenas-gris {
    background-color: #ffc74c;
    border-top: 1px solid #17546c;
    left: 0;
    margin: -1px auto;
    position: absolute;
    right: 0;
    width: 80%;
    z-index: 0;
}

.info-elefante {
    background-color: #FF8458;
    border-top: 1px solid #17546c;
    left: 0;
     margin: -1px auto;
    position: absolute;
    right: 0;
    width: 80%;
    z-index: 0;
}	


.mini-ballenas {
    margin-top: -48px;
    z-index: 8;
}


.info-orca{
    background-color: #8BC53F;
    border-top: 1px solid #17546c;
    left: 0;
    margin: -1px auto;
    position: absolute;
    right: 0;
    width: 80%;
    z-index: 0;
}	


.css-cuadro-Infocetaceo.css-cuadro-tiburon.css-cuadro-tiburon-3 {
    float: right;
    margin-right: 80px;
}

.css-cuadro-Infocetaceo {
    float: left;
    height: auto;
    margin-left: 29px;
    margin-top: 15px;
    padding: 13px;
    width: 41%;
}


.pantalla.js-pntll.laboratorio3 
/*
.css-cuadro-Infocetaceo.css-cuadro-ballena.css-cuadro-ballena-2 {
    float: right;
}
*/

/*Tema EVOLUCION DE LOS CETACEOS*/

.css-img-evolCetaceo{
	 position:relative; 
	 text-indent:-999999px;
	  width:928px;
	  height:336px;
	
	background-image:url("../img/actividad3/colaballena.png");
background-repeat:no-repeat;	
	}


.icons-top a {
    color: #092248;
    display: inline-block;
    padding-left: 35px;
    text-align: center;
    text-decoration: none;
    width: 29%;
}




.pantalla.conservaCetaceo-3 .top_icons a:nth-child(1)::before {
    background: rgba(0, 0, 0, 0) url("../img/actividad3/icon_vaquita.png") repeat scroll 0 0;
    content: "";
    height: 101px;
    margin: -43px -118px -118px -128px;
    position: absolute;
    width: 101px;
    display: block;
}




/*
.css-btn-evolCetaceo.js-btn-evolCetaceo.vaquita-icon::before {
    background: rgba(0, 0, 0, 0) url("../img/actividad3/icon_vaquita.png") repeat scroll 0 0;
    content: "";
    display: block;
    height: 101px;
    margin: 0;
    right: 0;
    top: 0;
    width: 101px;
}
*/



.pantalla.conservaCetaceo-3 a:nth-child(2)::before  {
    background: rgba(0, 0, 0, 0) url("../img/actividad3/icon_ballenas.png") repeat scroll 0 0;
    content: "";
    height: 101px;
    margin: -43px -118px -118px -128px;
    position: absolute;
    width: 101px;
    display: block;
}

.pantalla.conservaCetaceo-3 a:nth-child(3)::before  {
    background: rgba(0, 0, 0, 0) url("../img/actividad3/icon_info.png") repeat scroll 0 0;
    content: "";
    height: 101px;
    margin: -43px -118px -118px -128px;
    position: absolute;
    width: 101px;
    display: block;
}

.css-conte-evolTxt > a {
    color: #043051;
    font-weight: bold;
}


.conservacio-1 {
    padding: 2%;
    position: relativ1e;
}

.css-txt-evolCetaceo {
    margin: 0 auto;
    text-align: justify;
    width: 86%;
}

.css-txt-evolCetaceop2 {
    margin: 2% 0 0 7%;
    position: relative;
    text-align: justify;
    width: 80%;
}


.css-cuadro-orca-2 .css-glosario.js-btn-glosario {
    color: #ab2300;
}
/*
.pantalla.conservaCetaceo-3 a::before {
    background-color: red;
    content: "";
    height: 120px;
    margin: -43px -118px -118px -128px;
    position: absolute;
    width: 120px;
}
*/
.pantalla.conservaCetaceo-3 .top_icons a {
    color: #092248;
    float: left;
    margin-bottom: 53px;
    margin-left: 60px;
    margin-top: 63px;
    padding: 12px 0 0 101px;
    text-align: center;
    text-decoration: none;
    width: 17%;
}

.continuar {
    float: left;
    width: 100%;
}

.css-img-evolCetaceo {
    background-image: url("../img/actividad3/colaballena.png");
    background-repeat: no-repeat;
    float: right;
    height: 240px;
    margin: 0 21px;
    text-indent: -999999px;
    width: 320px;
}

.fosiles {
    position: relative;
    width: 100%;
    padding: 60px 0;
}

/*ESTILO VENTANA CONSEVACION CETACEOS */
.css-conte-evolCetaceo.css-conte-vaquita {
    background: #3e9fa2 none repeat scroll 0 0;
    border-radius: 22px;
    color: white;
    float: left;
    margin: 0 12px;
    padding: 11px;
}

.css-conte-evolCetaceo.css-conte-vaquita::before {
    border-bottom: 27px solid #3e9fa2;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    content: "";
    display: block;
    float: left;
    height: 0;
    left: 34px;
    position: relative;
    top: -35px;
    width: 0;
}

/*
.top_icons {
    margin-top: 63px;
    width: 100%;
}
*/
.css-conte-evolCetaceo.css-conte-azul {
    background: #3e9fa2 none repeat scroll 0 0;
    border-radius: 22px;
    color: white;
    float: left;
    margin: 0 12px;
    padding: 11px;

}


.css-conte-evolCetaceo.css-conte-azul::before {
    border-bottom: 27px solid #3e9fa2;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    content: "";
    display: block;
    float: left;
    height: 0;
    left: 418px;
    position: relative;
    top: -35px;
    width: 0;
}

.css-conte-evolCetaceo.css-conte-info {
    background: #3e9fa2 none repeat scroll 0 0;
    border-radius: 22px;
    color: white;
    float: left;
    margin: 0 12px;
    padding: 11px;
}

.css-conte-evolCetaceo.css-conte-info::before {
    border-bottom: 27px solid #3e9fa2;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    content: "";
    display: block;
    float: left;
    height: 0;
    left: 799px;
    position: relative;
    top: -35px;
    width: 0;
}


.css-conte-info .css-conte-evolTxt {
    float: left;
    margin-right: 6%;
    text-align: justify;
    width: 100%;
}
.css-conte-evolTxt {
    float: left;
    margin-right: 30px;
    text-align: justify;
    width: 42%;
}

/*ESTILO VENTANA CONSEVACION CETACEOS*/


/* .imgEsquema {
    position: relative;
    width: 100%; 
	height:200px;
    max-width: 998px;
    margin: auto;
	 z-index:1;
}*/




/* .btn-info {
    box-shadow: 0 0 1px 1px #9a3864;
    font-size: 1.8em;
    height: 100px;
    line-height: 75%;
    position: absolute;
    width: 100px;
    min-height: 30px;
    min-width: 30px; 
	z-index:-1;
}*/



/*pantallaTapa General*/
.css-pantallaTapa {
    background-color: rgba(255, 199, 76, 0.95);
    bottom: 0;
    margin: 0;
    position: fixed;
    right: 0;
    text-indent: -9999px;
    top: 0;
    width: 100%;
    z-index: 10;
}

	
.css-pantallaTapa.css-blanco {
    background-color: rgba(53, 172, 191, 0.96);
}
  
	

		
/*ACTIVIDAD 2 MODULO 1*/
/*EXCAVACION*/

.hudc {
	 padding-top:50px;
    text-align: center;
}

.hudc-control {
	 position:absolute;
	  width:200px;
	  height:50px
	  z-index:1; 
	  top:200px;
	   left:200px;
}


/*.css-marco {

	
    background-color: rgba(255, 255, 255, 0.76);
    border: 2px solid #9c3767;
    border-radius: 5px;
    color: #044c68;
    font-family: "oswaldlight";
	

  
	    padding: 4px 40px;
		
 margin: auto auto 50px; 
  
    text-align: center;
    text-transform: uppercase;

}


.css-marcoDrop{
    display: inline;
width: 100%;
height: 100%;
  
}*/

.css-marcoDrag{
    display: inline-table;
 height: 60px;
    width: 50px;
  
}


/*BALLENAS CHICAS*/

	
	
.css-ballena-btn-drag {
   border: 2px solid #999999;
    border-radius: 15px;
    font-family: "muliregular";
    height: 40px;
    left: 212px;
    position: absolute;
    text-align: center;
    top: 400px;
    width: 160px;
    line-height: 36px;
	
	}
	
.css-ballena-btn {
border: 2px solid #999999;
    border-radius: 15px;
    color: #00268e;
    font-family: "muliregular";
    height: 36px;
    position: absolute;
    text-align: center;
    text-decoration: none;
    width: 124px;
    line-height: 32px;
	}
	
	
.css-ballena-btn-block {
  border: 2px solid #999999;
    border-radius: 15px;
    color: #00268e;
    display: inline-block;
    font-family: "muliregular";
    height: 46px;
    text-align: center;
    width: 150px;
    line-height: 44px;
}
	
	
.css-hudc-orden{
 height: 50px;
    left: 90px;
    overflow: hidden;
    position: absolute;
    text-align: center;
    top: 500px;
    width: 500px;
}
	
	
.css-pistas {
    background-color: #e8bb49;
    border-radius: 100px;
    box-shadow: 2px 5px 0 #6b5a17;
    color: white;
    height: 44px;
    left: 90px;
    line-height: 44px;
    position: absolute;
    right: auto;
    text-align: center;
    text-decoration: none;
    top: 29px;
    width: 101px;
    z-index: 10;	
	}

.css-pistas::after {
    border-left: 20px solid transparent;
    border-right: 2px solid transparent;
    border-top: 26px solid #e8bb49;
    bottom: -15px;
    content: "";
    height: 0;
    position: absolute;
    width: 0;
}

.css-pistas::before {
    border-left: 20px solid transparent;
    border-right: 2px solid transparent;
    border-top: 26px solid #6b5a17;
    bottom: -15px;
    content: "";
    height: 0;
    left: 79px;
    position: absolute;
    width: 0;
}


.css-botpaseAnt {
 background-color: #3e9fa2;
    border-radius: 23px 0 22px 22px;
    box-shadow: 2px 5px 0 #17546c;
    color: white;
    height: 44px;
    left: 38px;
    line-height: 44px;
    position: absolute;
    right: auto;
    text-align: center;
    text-decoration: none;
    top: 400px;
    width: 160px;
}
.css-botpaseAnt-block {
   background-color: #3e9fa2;
    border-radius: 23px 0 22px 22px;
    box-shadow: 2px 5px 0 #17546c;
    color: white;
    height: 44px;
    left: 8px;
    line-height: 44px;
    position: absolute;
    right: auto;
    text-align: center;
    text-decoration: none;
    top: 1px;
    width: 160px;
}
	
	
	
.css-botpaseSig-block {
  background-color: #3e9fa2;
    border-radius: 0 22px 22px 15px;
    box-shadow: 2px 5px 0 #17546c;
    color: white;
    height: 44px;
    line-height: 44px;
    position: absolute;
    right: 10px;
    text-align: center;
    text-decoration: none;
    top: 0;
    width: 160px;
}
	

.css-botpaseSig {
 background-color: #3e9fa2;
    border-radius: 0 22px 22px 15px;
    box-shadow: 2px 5px 0 #17546c;
    color: white;
    height: 44px;
    left: 392px;
    line-height: 44px;
    position: absolute;
    right: auto;
    text-align: center;
    text-decoration: none;
    top: 400px;
    width: 160px;
}	

.css-zindex {
z-index:9;
	}


.css-btn-esquema{
    background-color: #D6A017;
    border-radius: 22px;
    box-shadow: 2px 5px 0 #6d520f;
    color: white;
    height: 44px;
    left: 269px;
    line-height: 44px;
    position: absolute;
    right: auto;
    text-align: center;
    text-decoration: none;
    top: 427px;
    width: 160px;
	}


.imgCont {
height: 40px;
    position: absolute;
    top: 480px;
    width: 880px;
    z-index: 1;
}




/*OPCION DROP*/
.pakicetus {
    left: 45px;
}

.pakicetus::after { 
background-repeat: no-repeat;
    content: url("../img/actividad2/conector_1.png");
    height: 4px;
    left: 125px;
    position: absolute;
    width: 9px;

}


.ambulocetus {
    left: 179px;
   /* top: 17%;*/
}
.ambulocetus::after { 
background-repeat: no-repeat;
    content: url("../img/actividad2/conector_1.png");
    height: 4px;
    left: 124px;
    position: absolute;
    width: 9px;

}

.rhodocetus {
    left: 312px;
    /*top: 27%;*/
}
.rhodocetus::after { 
background-repeat: no-repeat;
    content: url("../img/actividad2/conector_1.png");
    height: 4px;
    left: 124px;
    position: absolute;
    width: 9px;

}
.dorudon {
    left: 445px;
    /*top: -12%;*/
}
.dorudon::after { 
background-repeat: no-repeat;
    content: url("../img/actividad2/conector_1.png");
    height: 4px;
    left: 124px;
    position: absolute;
    width: 9px;

}
.basilosaurus {
    left: 578px;
   /* top: -2%;*/
}
.basilosaurus::after { 
 background-repeat: no-repeat;
    content: url("../img/actividad2/conector_2.png");
    height: 93px;
    left: 126px;
    position: absolute;
    top: -29px;
    width: 70px;

}


.posidrag1{
left: 775px;
 top: -47px;
  z-index:10;
	}

.posidrag2{
left: 775px;
    top: 43px;
	z-index:10;
	}
/*.misticetos {
left: 775px;
 top: -47px;
}

.odontocetos {
  left: 775px;
    top: 43px;
}*/




/*OPCION CUADRO DE VENTANA*/
.arbol_fosiles {
    width: 100%;
}

	 
/*BALLENAS GRANDES*/	 
	 
.css-ballenaIlustra {
	height: 275px;
    margin-bottom: 42px;
   
    text-align: center;
    width: 480px;
	
	 position: absolute;
   /* display: inline-block;*/

}

 .css-Pakicetus{
	 background-image:url(../img/ballenas/pakicetus.png);	
background-repeat:no-repeat;
	 }


 .css-Ambulocetus{
	 background-image:url(../img/ballenas/ambulocetus.png);	
background-repeat:no-repeat;
	 }



 .css-Rhodocetus{
	 background-image:url(../img/ballenas/rhodocetus.png);	
background-repeat:no-repeat;
	 }


 .css-Dorudon{
	 background-image:url(../img/ballenas/dorudon.png);	
background-repeat:no-repeat;
	 }


 .css-Basilosaurus{
	 background-image:url(../img/ballenas/basilosaurus.png);	
background-repeat:no-repeat;
	 }



 .css-Misticetos{
	 background-image:url(../img/ballenas/misticetos.png);	
background-repeat:no-repeat;
	 }



 .css-Odontocetos{
	 background-image:url(../img/ballenas/odontocetos.png);	
background-repeat:no-repeat;
	 }


/*ELEMENTOS PERMANENTES*/
	
	.css-btn-anterior{ 
 background-color: #c3c3c3;
    height: 56px;
    left:0px;
    position: absolute;
    /*top: 660px;*/
    width: 195px;
		}
		
		
.css-btn-continuar {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -101px;
    color: white;
    height: 48px;
    left: 0;
    line-height: 42px;
    margin: auto;
    padding-left: 12px;
    position: absolute;
    right: 0;
    text-align: left;
    text-decoration: none;
    width: 148px;
    z-index: 10;
    font-weight: bold;
}
		
.vntn--btn-cerrar {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -161px -157px;
    border: medium none;
    height: 46px;
    position: absolute;
    text-indent: -9999px;
    top: 42px;
    width: 46px;
    z-index: 1;
}




		
	/*UNA BALLENA CON PATAS SECCION1*/	
		
.css-area-SupBpatas{
/*font-size:24px;*/
text-align: left;
background-color: #2b6f8c;
color:#dce6ec; 
min-height:300px; 
min-width:830px; 
}	

.css-area-SupBpatas2{ 
padding-top:50px;
text-align: center;  
font-weight: bold;
}



.css-preg-pleca{
background-image: url("../img/actividad2/pleca.png");
    background-repeat: no-repeat;
    height: 30px;
    position: relative;
    text-indent: -99999px;
    top: 28px;
    width: 38px; 
	left:0;
	right:0;
	 margin:auto;
	
	}

		
.css-txt2-cetaceo{
padding-top:20px;
padding-left:120px;
/*padding-bottom:30px;*/
}



/*
.css-preg{
	 display:inline-block;
	  width:auto;
	   color:#0a2149;
	  
	}
*/
	
.css-preg-linea {
    border-bottom: medium solid #0a2149;
    font-family: mulibold;
    font-size: 22px;
    width: 200px;
}
	

	
.Css-vtnTxtIntro .ccs-btn-ventana.vntn-btn-cerrar {
    margin-top: 22px;
}
	
.css-btn-conti {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -353px;
    color: white;
    font-weight: bold;
    height: 50px;
    line-height: 46    px;
    margin-bottom: auto;
    margin-top: 10px;
    padding-left: 14px;
    position: absolute;
    right: 40%;
    text-align: left;
    text-decoration: none;
    width: 147px;
    line-height: 46px;
}


.css-btn-conti01{
	margin-left: 33%;
	}	
		
.css-btn-contiAjuste2 {
    left: 906px;
    top: 475px;
}
		
		
.css-btn-reg {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -253px;
    color: white;
    height: 50px;
    left: 0;
    line-height: 44px;
    margin: auto;
    padding-left: 45px;
    position: absolute;
    right: 0;
    text-align: center;
    text-decoration: none;
    width: 111px;
    font-weight: bold;
}

	.css-btn-reg01{ 
	left: 40%;
    right: 60%;
		}	
			
.css-btn-reg-esquema{
		top:100%;
		}	
		
		
.conservaCetaceo-2 .css-btn-reg {
    margin-top: 12px;
    right: 433px;
}	
		
.conservaCetaceo-2 .css-btn-continuar {
    left: 462px;
    margin-top: 12px;
}


.conservaCetaceo-3 .css-btn-reg {
    display: none;
}
			
	.css-preg-op{
		 padding-top:50px;
		
		}	
	
		
	.css-preg-fin{ 
	 display: inline-block;
    min-width: 860px;
		}
		
			
	
.css-lisTipo {
   
    color: white;
    display: inline-block;
    font-weight: bold;
    height: 82px;
    line-height: 44px;
    text-decoration: none;
    margin-right: 10px;
}		


.ccs-btn-normal {
    background-color: #38a0a3;
    border-radius: 0 1em;
    box-shadow: 0 6px 0 #3f8282;
    height: 44px;
    width: 156px;
}

.ccs-btn-activo{
background: rgba(0, 0, 0, 0) url("../img/actividad2/btn_preg_activo.png") no-repeat scroll 0 0;
}

		
.css-preg-ballena{
	 color:#5A0001;
	}		
		
		
		
		
/*AREA DE BOTONES Navegacion por tetxo*/
		
		
/*Boton subir*/	
	.css-btnArea-subir	{
 color: #4e597f;
    display: inline-flex;
    font-size: 21px;
    font-weight: bold;
    height: 46px;
    left: 50%;
    line-height: 44px;
    margin-left: 10px;
    position: absolute;
    right: 50%;
    text-align: left;
    text-decoration: none;
    top: 35px;
    width: 165px;
	}
	
	
	.css-btn-subir{
		 background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -208px 99px;

    height: 46px;
    width: 46px;
		}
	
	.css-txt-subir{ 
 padding-left: 10px;
	
		}
/*fin Boton subir*/		
		
		
		
		
	/*Boton ver mas*/	
.css-btnArea-VerMas{ 
    color: #4e597f;
    display: inline-flex;
    font-size: 21px;
    font-weight: bold;
    height: 46px;
    left: 50%;
    line-height: 44px;
    margin-left: 10px;
    position: absolute;
    right: 50%;
    text-align: left;
    text-decoration: none;
    top: 545px;
    width: 165px;
	} 



.css-btn-VerMas{
	background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll -209px -109px;
    height: 46px;
    width: 46px;
	}
	
.css-txt-VerMas{ 
padding-left:10px;
	
	}
/*fin Boton ver mas*/		
		
	
	
/*EJERCICIO 2 ESTILO*/
	
.css-txt-Basehudc{
    font-family: mulilight;
    text-align: justify;
		}	
		

		
		
		
		.ccs-bloque-principal{ 
 background-color: #13556d;
    border: 0 solid #000000;
    border-radius: 30px;
    color: #ffffff;
    height: 214px;
    margin: 0 auto;
    padding-left: 10px;
    padding-top: 12px;
    width: 1000px;
 
		}
		
		.ccs-bloque-a1{ 
background-color: #339999;
    border: 0 solid #000000;
    border-radius: 30px 0 0 30px;
    display: inline-flex;
    height: 84%;
    padding-left: 16px;
    padding-right: 14px;
    padding-top: 21px;
    text-align: justify;
    vertical-align: middle;
    width: 43%;
			
			}
		
		
		.ccs-bloque-a2{
  display: inline-block;
    height: 44%;
    padding-left: 15px;
    vertical-align: middle;
    width: 50%;
			}	
		
		
.ccs-txt-ini{
display: inline-block;
    height: 46px;
    left: 34%;
    margin: 0 auto;
    padding-bottom: 40px;
    padding-left: 5%;
    padding-top: 109px;
    width: 89%;
		}	
		
.css-txt-hudFin{
 margin: 0 auto;
    padding-top: 48px;
    position: absolute;
    right: 0;
    width: 65%;
	}	
		
		

/*pantalla 3*/
		
	.css-btn-regAjuste1{
	 left: 50%;
    right: 50%;
		}	
		

.css-btn-contiAjuste1 {
    top: 487px;
}
		
		
	.css-txt-hudc-03{
 display: inline-block;
    height: 500px;
    padding-bottom: 20px;
    padding-left: 116px;
    padding-top: 164px;
    text-align: justify;
    width: 50%;
		}
		
			
	.css-img-hudc-03{ 
background-image: url("../img/actividad2/pinzon.png");
    background-repeat: no-repeat;
    display: inline-block;
    height: 320px;
    margin-left: 65px;
    margin-top: -207px;
    text-indent: 999999px;
    vertical-align: middle;
    width: 292px;
}


/*pantalla 4*/
		
/*.css-ballanaPatas04{
 left: 44px;
  top: 63px;
	}*/
.txt-hudc.js-text-seccion.js-text-01b {
    padding: 2%;
}

.txt-hudc.js-text-seccion.js-text-01b img {
    margin: 20px 0;
    max-width: 100%;
    
  
}

.css-txt-hudc-04 {
    float: left;
    margin: 15px;
    text-align: justify;
    width: 30%;
}

	.css-img-hudc{ 
    background-repeat: no-repeat;
    display: inline-block;
  
}

		.css-img-hudc-1{ 
 background-image: url("../img/actividad2/pakicetus1.png");
  height: 120px;
    width: 200px;
}
		.css-img-hudc-2{ 
 background-image: url("../img/actividad2/pakicetus2.png");
   height: 145px;
    width: 200px;
}
		.css-img-hudc-3{ 
 background-image: url("../img/actividad2/pakicetus3.png");
   height: 109px;
    width: 200px;
}
	
	
	
	/*pantalla 5*/
		
	
		.css-txt-hudc-05{
  display: inline-block;
    height: 135px;
    padding: 230px 37px 13px 113px;
    text-align: justify;
    width: 45%;
		}
	.css-img-hudc-05{ 
 background-image: url("../img/actividad2/pakicetus2.png");
    background-repeat: no-repeat;
    display: inline-block;
    height: 300px;
	  width: 414px;
}


/*pantalla 6*/
				
		
			.css-txt-hudc-06{
  display: inline-block;
    height: 135px;
    padding: 230px 37px 13px 113px;
    text-align: justify;
    width: 45%;
		}
	.css-img-hudc-06{ 
 background-image: url("../img/actividad2/pakicetus3.png");
    background-repeat: no-repeat;
    display: inline-block;
    height: 300px;
	  width: 414px;
}
.css-txt-hudc-07{
  display: inline-block;
    height: 135px;
    padding: 27px 37px 13px 113px;
    text-align: justify;
    width: 75%;
		}			
		
		
		
	/*ACORDION DE LA BALLENA CON PATAS*/	
		
.css-accordion{ 
   height: 500px;
    left: 57%;
    position: absolute;
    top: 11px;
    width: 500px;
}

		
	.ui-accordion-content{
		 height:200px;
		
		}
		
		
		
.img-hudc{
display:inline-block;
 width:252px;
  height:184px;
		}	
		

			
.li-ballena {
    display: inline-block;
    font-size: 16px;
}
		
	
.css-txt-info {
    display: inline-block;
    margin: 14px;
    margin-right: 12px;

}
	
.ui-corner-bottom .css-txt-info {
    display: inline-block;
    margin-right: 12px;
}


.ul-ballena {
    background-color: rgba(255, 255, 255, 0.33);
    border-radius: 4px;
    float: left;
    height: auto;
    margin: 0 16px 0 0;
    text-align: center;
    width: 46%;
}

.ul-ballena p {
    display: block;
    margin: 0;
}
	
.css-ballenaAreaImg {
    display: inline-block;
    height: 305px;
    margin-right: 22px;
    width: 423px;
}	

.Css-BallenaVtn{
width:1024px;
height:650px;
	}


.Css-vtn-img-ballena{
width:1024px;
height:650px;
background-repeat:no-repeat; 	
	}
	


.info-ballenas-gris .css-glosario.js-btn-glosario {
    color: #0868ce;
}


		
			
				
	/*estilo para el plug de carrusel no mover*/		
/*
.owl-carrusel .item img{
    display: block;
    width: 100%;
    height: auto;
}		
*/
	
.owl-carrusel .item img {
    border-radius: 31px;
    display: block;
    height: auto;
    width: 423px;
   touch-action: none; /*no mover compatibilidad drag de edge*/
}
	
/*ESTILO DE VENTANAS INTRODUCCION	*/
	
.Css-vntnIntroFosil {
    background-image: url("../img/actividad1/portada.png");
    background-position: center center;
    background-repeat: no-repeat;
    border: medium none;
    box-shadow: none;
    height: 590px;
    margin-top: 0;
    max-width: 100%;
    padding: 0;
}
	
.Css-vtnTxtIntro {
    color: #493422;
    font-size: 19px;
    margin: 0 auto;
    max-width: 90%;
    width: 90%;
}


.Css-ImgIntro {
    background-image: url("../img/actividad1/fosil.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 238px;
    text-indent: -999999px;
    width: 100%;
}


.Css-txtIntroFosil {
    color: white;
    font-family: "amaranthregular",Arial,Helvetica,sans-serif;
    line-height: 27px;
    position: relative;
    top: 102px;
    width: 600px;
}

.Css-btn-continuarFosil {
    background: rgba(0, 0, 0, 0) url("../img/general/icons_navegacion.png") repeat scroll 0 -51px;
    color: white;
    font-size: 23px;
    font-weight: bold;
    height: 48px;
    left: 50%;
    line-height: 42px;
    margin-left: -84px;
    position: absolute;
    right: 50%;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 3px 2px #a53903;
    top: 525px;
    width: 155px;
}
		
	
	
/*ESTILOS DE VENTANA GLOSARIO*/

	.Css-glosarioVtn{ 
	z-index:50;
		}
	
	.js-vntnIntroFosil{
transition: all .2s ease-in-out;
transform: scale(0.0);
		}
		
	.e-animVentana{
transform: scale(1);
		
		}
		
		
		/*quita oton cerrar permanentemete de la ventana vent-hueso-fin y esquema*/
		
.Css-vent-hueso-fin	.vntn--btn-cerrar{
display:none;
}
.Css-vtnesquema	.vntn--btn-cerrar{
display:none;
}	

.Css-vtn-respPreg.btn-activo .vntn--btn-cerrar{
display:none;
}	

.e-displaynone{
	display:none;
	}

.css-btn-continuar .vntn--btn-cerrar{
display:none;
}	


/* --------------------------
 *   Responsive 
 * ------------------------- */

/* estilos aplican en width < 1280px  (Android 10" landscape) */
@media screen and (max-width: 1280px) {
	
	/* --------------------------------
	 * Incluir aqui los estilos
	 * a los elementos que cambiaran. 
	 * -------------------------------- */

}





/* estilos aplican en width < 1024px  (iPad landscape) */
@media screen and (max-width: 1024px) {
    
    /* --------------------------------
	 * Incluir aqui los estilos
	 * a los elementos que cambiaran. 
	 * -------------------------------- */
    /***********PORTADA*******/ 
    .btn-icono.btn-pertenecefosil::before {
        margin: 5px 1px;
        }
    .btn-icono.btn-conservaCetacio::before {
        margin: 5px 10px;    
    }
    .Css-vntnIntroFosil {
        padding: 0 38px;
    }
    .css-cetaceos-li {
    margin-top: -11px;
     } 
    
.css-btn-contiAjuste2 {
    left: 736px;
    top: 487px;
}
		
    /***********TERMINA PORTADA*******/
    /***********PANTALLA SECCION 1***************/
    .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-elefente {
    height: 103%;
    width: 100%;
    top: -67px;
}
    .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-ballena {
    height: 103%;
    width: 100%;
        top: -67px;
}
        
    .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-orca {
    height: 103%;
    width: 100%;
        top: -67px;
}
     /***********TERMINA PANTALLA SECCION1***************/
    
    .css-conte-evolCetaceo.css-conte-vaquita::before {
    left: 40px;
    } 
    .css-conte-evolCetaceo.css-conte-azul::before {
    left: 357px;   
    } 
    .css-conte-evolCetaceo.css-conte-info::before {
        left: 680px;   
     }

    .css-areahuesoTxt {
    left: 460px;
    top: 462px;
}
    .Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1 {
        top: 6%;
        right: 510px;
    }

    .hudc-huesos-Drop {
    margin-left: 13px;
}   

    .hudc-huesos-Drag {
    margin-left: 0;
     }

    .css-hueso-ejemplo {
 margin-left: 13px;

}  
    .lista-avance {
    margin-bottom: 30px;
    margin-top: 0;
}
    .vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg {
    top: 53%
}
 
    .info-ballenas-gris {
        width: 98%;
    }
    .info-elefante {
        width: 98%;
    }         
    .info-orca {
         width: 98%;
    }  
    
    .css-cetaceo-img-list {
     margin: 52px auto auto;
    }
    
    .css-txt-evolCetaceop2 {
    margin: 0 0 0 2%;
    width: 84%;
}
    
.conservaCetaceo .css-btn-continuar {
    margin-top: -18px;
}
    
.pantalla.conservaCetaceo-3 .top_icons a {  
    width: 15%;
    }

/*CONSERVACION    */
/*
.css-txt-evolCetaceo {
    margin: 0 auto;
    text-align: justify;
    width: 95%;
}

.css-txt-evolCetaceo.tabs-cetaceo {
    top: -280px;
}
    .css-txt-evolCetaceo.tabs-cetaceo > p {
    margin-bottom: 27px;
}
    
    .conservaCetaceo-2 .ui-tabs-panel.ui-widget-content.ui-corner-bottom {
    display: inline-flex;
}
    
    .css-ballenaAreaImg {
    display: inline-block;
    height: 305px;
    margin-right: 22px;
    width: 423px;
}
 .css-area-txt-ballena {
    float: right;
    width: 50%;
}
    
    .ul-ballena {
    background-color: rgba(255, 255, 255, 0.33);
    border-radius: 4px;
    float: left;
    height: auto;
    margin: 0 16px 0 0;
    text-align: center;
    width: 46%;
}
    
    .css-txt-info {
    display: inline-block;
    margin: 14px 12px 14px 14px;
}
*/
/*    TERMINA CONSERVACION*/
    
.css-txt-evolCetaceo {
    margin: 0 auto;
    text-align: justify;
    width: 97%;
}
    
    
.ul-ballena {
    background-color: rgba(255, 255, 255, 0.33);
    border-radius: 4px;
    float: left;
    height: auto;
    margin: 0 16px 0 0;
    text-align: center;
    width: 46%;
}    
    
    
    
    
	/****************************Sección cronología ballena*****************/*  
.css-accordion {
width: 431px;
}


.ballanaPatas05 .ui-accordion-content {
    height: 230px;
}


    
    
        
    
}





/* estilos aplican en width < 1280px  (Android 10" landscape) */
@media screen and (max-width: 927px) {
	
	/* --------------------------------
	 * Incluir aqui los estilos
	 * a los elementos que cambiaran. 
	 * -------------------------------- */
	 
.css-accordion {
width: 424px;
} 
	 

}
/* estilos palican width < 800px (iPad, Android portrait)*/
@media screen and (max-width: 800px) {
    	/* --------------------------------
	 * Incluir aqui los estilos
	 * a los elementos que cambiaran. 
	 * -------------------------------- */
    
    /****************************SECCION FOSIL******************/
    .pantalla {
    position: absolute;
    width: 100%;
}
    
 .vntn.Css-ventana.vtn-hueso.tooltip1 {
     top: 640px;
     right: 570px;
     position: absolute;
    }
    
    
/*   ESTILO MENU*/
    
    .css-subMenuLab > li {
    width: 29%;
}   
    .btn-icono.btn-conservaCetacio::before {
        background: none;
    }
    
    .btn-icono.btn-evolCetacio::before {
         background: none;    
     }
    
      .btn-icono.btn-pertenecefosil::before {
      background: none;
      }  
    /*  TERMINA ESTILO MENU*/
    
/*    ESTILO PANTALLA FOSIL DRAG*/
    
.css-areahuesoTxt {
    left: 6px;
    top: 1002px;
}
    
.css-hueso-ejemplo {
    left: 400px;
    top: -35px;
}
    
.hudc-huesos-Drop {
    margin-left: 114px;
    position: absolute;
    top: 560px;
}
    
.hudc-huesos-Drag {
    margin-bottom: 62px;
    margin-left: 140px;
}
/*   TERMINA  ESTILO PANTALLA FOSIL DRAG*/    
    
.Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1 {
     margin: 0 0 0 157px;
 }   
/*ESTILO PANTALLA FOSIL PREGUNTAS  */
.clearfix.pantalla.laboratorio2 {
    top: 239px;
}    
.css-btn-zoom {    
     top: -93px;
     left: 31px;
 }  
    
.css-pistas-PregIlustra {
    height: 301px;
    width: 100%;
}   
    .css-pistas-PregIlustra > img {
    position: relative;
    top: 36%;
    transform: translateY(-60%);
    -webkit-transform: translateY(-60%);
    width: 100%;
}
.css-pistas-Preg {
    float: left;
    height: 240px;
    list-style-type: none;
    width: 100%;
} 
    .css-pistas-Preg > h4 {
    margin-top: 30px;
    text-align: center;
}
    
    .css-pistaLista {
    color: white;
    margin: auto;
    width: 300px;
        
}
    
.vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg {
    top: 67%;
}
    
.css-cetaceos-li a:nth-child(2)::before {
        top: 153px;
        left: 251px;
    }
    
/*  TERMINA ESTILO PANTALLA FOSIL PREGUNTAS */
    
    .mini-ballenas ul {
    margin: -461px 0 0;
}
    
    .info-elefante {
        margin: 68px auto;  
   }  
    
   .info-orca  {     
   margin: 68px auto;           
}        
   .info-ballenas-gris { 
       margin: 68px auto; 
}       
     
.vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-ballena {
    height: 72%;
    top: 49px;             
 }     
    
 .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-orca {    
   height: 72%;
    top: 49px;      
    
 }     
    
.vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-elefente {
    height: 72%;
   top: 49px;      
 }  
      
.Css-vntnIntroFosil {
    margin-top: 180px;
    padding: 0;
    width: 100%;
}
    
.css-img-cetaceo-vtn.zoom-orca > img {
 margin-top: 4%;
    
 }      
 .css-img-cetaceo-vtn.zoom-elefante > img {
    margin-top: 7%;
}   
 /****************************SECCION FOSIL******************/  
    
    /***********************SECCION BALLENA CON PATAS *********************************/
 .css-contFosilBarco {
     margin-bottom: 262px;
  } 
     
.ballanaPatas03 .css-btn-contiAjuste1 {
    position: absolute;
    top: 961px;
}
    
.ballanaPatas04 .css-btn-contiAjuste1 {
    bottom: 0;
    position: absolute;
}
    
    .css-txt-FosilP01 {
    margin-left: auto;
    margin-right: 0;
    padding-right: 0;
    padding-top: 0;
    width: auto;
} 
    .css-txt-FosilP02 {
        width: auto;
      }  
    .css-img-hudc-01 {
      margin-left: 25%; 
        width: 43%    
  }   
    
.txt-hudc.js-text-seccion.js-text-01b {
    margin-top: -470px;
    padding: 2%;
}    
    
   .css-txt-hudc-04 p {
    float: left;
    position: relative;
    width: 335px;
} 
    
    .txt-hudc.js-text-seccion.js-text-01b img {
    float: left;
    margin: 26px 27px 31px 22px;
    max-width: 100%;
    width: 50%;
} 
    .css-txt-hudc-04 {
    margin: 0;
    text-align: justify;
    width: 100%;
}
  
    .parrafo1 {
    margin-top: 102px;
}   
    
    
    .conservacio-1 {
    margin-top: -488px;
    }  
    
.conservaCetaceo .css-btn-continuar {
    margin-top: 202px;
    margin: 0 auto;
}
    
    
    .css-img-evolCetaceo {
            float: none;
        margin: 0 auto;
        }
    
.ballenaPatas01 .css-elmtContenedor {
     margin-top: -448px;
     }  
 .css-img-Pakicetus {
    margin-bottom: 82px;   
     }   
      
.ballenaPatas01 .css-btn-conti.css-btn-conti01 {
    bottom: 140px;
}



/****************************Sección cronología ballena 800px******************/  

.hudc-zona-horse {
    margin-left: 105px;
    margin-top: -472px;
}

.css-pistas {
top: -430px;
}

.css-botpaseAnt{
top: -70px;
  left: 112px;
}


.css-botpaseSig {
top: -70px; 
left: 500px;

}


.css-zindex.css-ballena-btn-drag{
top: -70px;
 left: 305px;
}


.imgCont {
    left: -41px;
    top: 36px;
}


.posidrag1{
	left: 690px;
 top: -47px;
	}

.posidrag2{
	 left: 690px;
    top: 43px;
	}


.basilosaurus::after {
    content: url("../img/actividad2/conector_3.png");
    height: 93px;
    left: 87px;
    top: -29px;
    width: 24px;
}
/*vertical primera opcion*/
.css-btn-esquema {
   top: -100px;
  left: 307px;
} 


.css-hudc-orden {
left: 142px;
top: -38px;

} 
	 
.css-accordion {
    left: 6%;
    top: 155px;
    width: 711px;
	 height: 345px;
}



.ballanaPatas05 .ui-accordion-content {
    height: 150px;
}

/*vertical segunda opcion*/
.css-accordion-vertical {
    top: 57px;
}



.css-btn-contiAjuste2-vertical {
    left: 340px;
    top: 492px;
}


.vntn.js-vntn.Css-ventana.Css-vtnesquema.vtn-vtnesquema {
    top: 24%;
} 


	   
.css-txt-evolCetaceop2 {
    margin: 0 0 0 2%;
    width: 96%;
}


     /***********************TERMiNA SECCION BALLENA CON PATAS *********************************/
    /***********************SECCION CONSERVACION DE LOS CETACEOS*********************/    
.css-txt-evolCetaceo {
    padding: 2%;
    position: relative;
    width: 96%;
}   

    .conservaCetaceo-2 .ui-tabs .ui-tabs-nav li {
            width: 28%;
}
    
.css-txt-evolCetaceo.tabs-cetaceo {
    position: absolute;
    top: -450px;
}
    
.css-area-txt-ballena {
    display: block;
    left: 0;
    position: absolute;
    top: 452px;
    width: 100%;
}
    
    .ul-ballena {
        padding: 1%;
     margin: 12px;
    width: 44%;
        }
    
.css-txt-evolCetaceo.tabs-cetaceo > p {
    margin-bottom: 27px;
}
    
    .conservaCetaceo-2 .owl-carrusel.owl-theme.owl-carousel {
    left: 35%;
     }   
    
    
    
        .conservaCetaceo-2 .css-btn-reg {
    top: 522px;
}
    .conservaCetaceo-2 .css-btn-continuar {
        top: 522px;
        }
    
    
.pantalla.conservaCetaceo-3 .top_icons a {
    width: 42%;
}
.pantalla.conservaCetaceo-3 .top_icons a {
    float: left;
    margin-bottom: 83px;
    margin-left: 242px;
    text-align: left;
}
.pantalla.js-pntll.conservaCetaceo-3 {
    height: 100%;
}
    
.top_icons {
    margin-top: 100px;
}
 .css-conte-evolCetaceo.css-conte-info::before {
    left: 140px;
    top: -125px;
   -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
}
    
  .css-conte-evolCetaceo.css-conte-azul::before {
    left: 140px;
    top: -313px;
    -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
}
 .css-conte-evolCetaceo.css-conte-vaquita::before {
    left: 140px;
    top: -495px;
    -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
}
     

    /***********************TERMINA SECCION CONSERVACION DE LOS CETACEOS*********************/     
    
}
    


/* estilos palican width < 768px (iPad, Android portrait)*/
@media screen and (max-width: 768px) {
    	/* --------------------------------
	 * Incluir aqui los estilos
	 * a los elementos que cambiaran. 
	 * -------------------------------- */
    
/*****************    PANTALLA LABORATORIO******************/
    .pantalla {
    position: absolute;
     }
        

.css-subMenuLab > li {
        width: 29%;
    }
    
    .pantalla.js-pntll.laboratorio1 {
    max-width: 1280px;
    min-height: 927px;
    min-width: 760px;
    width: 100%;
   }
.css-hueso-ejemplo {
    left: 485px;
    margin-left: 0;
    position: relative;
    top: -322px;
}
.hudc-huesos-Drop {
    left: 2px;
    margin-left: 3%;
    top: 566px;
    width: 221px;
}
    
.css-areahuesoTxt {
    height: 253px;
    left: 325px;
    text-align: left;
    top: 556px;
    width: 372px;
}
    
.hudc-huesos-Drag {
    margin-bottom: 0;
    margin-left: 3px;
    top: 180px;
}
    .Css-ventanavntn.vntn.Css-vent-hueso-fin.vtn-fin1 {
    margin-left: 89px;
    right: 510px;
    top: 19%;
    width: 580px;
}
    .css-btn-continuar.btn-hueso-sig.btn-cerrar1 {
    top: 310px;
}
    .css-areahuesoTxt::before {
    left: 270px;
}
  .css-pistas-PregIlustra {
    height: 189px;
}
    
    .css-pistas-Preg > h4 {
    margin-top: 0;
           }
    .css-pistas-Preg {
    float: left;
    height: 190px;
    list-style-type: none;
    width: 100%;
}
    .css-pistas-PregIlustra > img {
    position: relative;
    top: 19%;
        }
    
    .vntn.js-vntn.Css-vtn-respPreg.vtn-respPreg {
    top: 63%;
}
    /************
    
    *****   TERMINA PANTALLA LABORATORIO******************/

.css-btn-conti{		
     top: 490px;
}	
    .laboratorio2 .css-btn-continuar {
        top: 159px;
    }
     
    .css-btn-continuar.btn-cetaceo-sig.continuar2 {
    margin-top: 452px;
}  
    .css-btn-zoom {
    top: -143px;
}
/*    PANTALLA MINIATURAS BALLENA*/
    .mini-ballenas {
    margin-top: 172px;
        }
    
 .info-ballenas-gris {
    margin: 38px auto;
}   
    
    
    .info-elefante {
    margin: 38px auto;
}
    .info-orca {
    margin: 38px auto;
}
    .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-elefente {
    top: -251px;
    }
    .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-ballena {
  top: -251px;
   }     
    .vntn.vntn-instruccion.Css-ventana.Css-zoom-vtn.vtn-zoo-orca {
    top: -251px;
} 
    .ballenaPatas01 .css-elmtContenedor {
    margin-top: -208px;
}
.css-contFosilBarco {
    margin-bottom: 72px;
} 
    .ballanaPatas03 .css-btn-contiAjuste1 {
    position: absolute;
    top: 781px;
}
    .txt-hudc.js-text-seccion.js-text-01b {
    margin-top: -290px;
        }
    
    .txt-hudc.js-text-seccion.js-text-01b img {
         width: 47%;
        }
.css-btn-conti {
    top: 510px;
}    
    .conservacio-1 {
    margin-top: -248px;
}  
    .css-txt-evolCetaceo.tabs-cetaceo {
    position: absolute;
    top: -280px;
}
    
/*    PANTALLA CETACEOS*/
    .pantalla.conservaCetaceo-3 .top_icons a {
    float: left;
    margin-bottom: 43px;
    margin-left: 292px;
    margin-top: 37px;
    text-align: left;
} 
    .top_icons {
    margin-top: 63px;
}
    
    .Css-vntnIntroFosil {
    margin-top: 100px;
}
    
     .css-conte-evolCetaceo.css-conte-info::before {
    left: 190px;
    top: -85px;
    transform: rotate(90deg);
}
    
  .css-conte-evolCetaceo.css-conte-azul::before {
    left: 190px;
    top: -203px;
    transform: rotate(90deg);
    -webkit- transform: rotate(90deg);
}
 .css-conte-evolCetaceo.css-conte-vaquita::before {
    left: 190px;
    top: -320px;
    transform: rotate(90deg);
      -webkit- transform: rotate(90deg);
}
    
    /*definicion ejer 2*/
/****************************Sección cronología ballena  768 ipad******************/  

.hudc-zona-horse {
    margin-left: 105px;
    margin-top: -472px;
}

.css-pistas {
    top: -237px;
}

.css-botpaseAnt{
top: 47px;
  left: 112px;
}


.css-botpaseSig {
top: 47px ;
left: 500px;

}

.css-zindex.css-ballena-btn-drag{
top: 47px ;
 left: 305px;
line-height: 37px;
}


.imgCont {
    left: -41px;
    top: 147px;
	width: 800px;
}


.posidrag1{
left: 653px;
top: -47px;
}

.posidrag2{
left: 653px;
top: 43px;
}


.basilosaurus::after {
    content: url("../img/actividad2/conector_3.png");
    height: 93px;
     left: 50px;
    top: -29px;
    width: 24px;
}
/*vertical primera opcion*/
.css-btn-esquema {
    left: 307px;
    top: 69px;
}

.css-hudc-orden {
    left: 140px;
    top: 159px;
}



/*accordion vertical primera opcion 768*/ 
.css-accordion {
left: 6%;
top: 238px;
width: 690px;
height: 222px;
}


.ballanaPatas05 .ui-accordion-content {
    height: 132px;
}



.css-btn-contiAjuste2-vertical {
    left: 310px;
    top: 528px;
}


.vntn.js-vntn.Css-ventana.Css-vtnesquema.vtn-vtnesquema {
    top: 24%;
} 


	   
.css-txt-evolCetaceop2 {
    margin: 0 0 0 2%;
    width: 96%;
}

.css-ballenaIlustra {
    margin: 30% 0 0 5%;
}

.descrip-ballena {
    top: 226px;
}

    
    
    
    
}