@charset "utf-8";
/* CSS Document */
.tablonnn {
padding:0!important;
margin:0!important;
top:-10000000000px;
width:100%;
visibility:hidden;
position:absolute;
z-index: 989;
min-height: 100vh;
display:block;
-webkit-transition:  0.2s; /* Safari */
    transition: 0.2s;
}
.tablonnn.mostrar {
top:0!important;
visibility:visible!important
}


.tablonnn.degrade {
background: rgba(180,220,209,1);
background: -moz-linear-gradient(top, rgba(162,198,188,1) 0%, rgba(162,198,188,1) 70%, rgba(180,220,209,1) 70%, rgba(180,220,209,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(162,198,188,1)), color-stop(70%, rgba(162,198,188,1)), color-stop(70%, rgba(180,220,209,1)), color-stop(100%, rgba(180,220,209,1)));
background: -webkit-linear-gradient(top, rgba(162,198,188,1) 0%, rgba(162,198,188,1) 70%, rgba(180,220,209,1) 70%, rgba(180,220,209,1) 100%);
background: -o-linear-gradient(top, rgba(162,198,188,1) 0%, rgba(162,198,188,1) 70%, rgba(180,220,209,1) 70%, rgba(180,220,209,1) 100%);
background: -ms-linear-gradient(top, rgba(162,198,188,1) 0%, rgba(162,198,188,1) 50%, rgba(180,220,209,1) 70%, rgba(180,220,209,1) 100%);
background: linear-gradient(to bottom, rgba(162,198,188,1) 0%, rgba(162,198,188,1) 70%, rgba(180,220,209,1) 70%, rgba(180,220,209,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a2c6bc', endColorstr='#b4dcd1', GradientType=0 );
}

.bktablonbackground {background:rgba(0,0,0,.2); position:absolute;width:100%; margin:auto; height:30vh; bottom:0px; opacity:0; display:block; z-index:4}
.tablonnn {
padding:0!important;
margin:0!important;
background:#b4dcd1;
-webkit-transition:  0.2s; /* Safari */
    transition: 0.2s;
}
.tablonnn section {/*padding:0!important;*/ margin:0!important; /*height:100vh; */position:relative; vertical-align:middle; display:none; width:100vw; overflow:hidden; padding:100px 0 0 0!important; min-height:100vh}


.tablonnn section.active {display:table}
.tablonnn .titulo {
color:#fff;
text-align:center;
font-weight:normal;
font-size:80px;
line-height:1.2;
display:table-cell;
vertical-align:middle;
position:relative;
top:-400px;
opacity:0;
font-family: 'GothamUltra';
cursor:auto!important

}
.tablonnn .titulo-ch {
color:#fff;
text-align:center;
font-weight:normal;
font-size:55px;
line-height:1.2;
font-family: 'GothamUltra';
position:relative;
opacity:0;
top:-100px;
display:block;
cursor:auto!important
}

.tablonnn contenido {
display:table-cell;
vertical-align:middle;
position:relative;
text-align:center;
position:relative
}

.tablonnn .contenido div.bktablon {position:relative;width:795px; /*657px;*/ margin:auto; top:-260px; opacity:0; z-index:5}
.tablonnn .contenido div.bktablon a {height:auto!important; position:absolute; /*7%*/  margin:0!important; padding:0!important; z-index:100}
.tablonnn .contenido div.bktablon a img {border:0!important; display:block; margin:0!important; padding:0!important; opacity:0; transform: scale(2.5);}
.tablonnn .contenido div.bktablon a:hover {z-index:999!important; transform: scale(1.5)!important;}
.tablonnn .tablon { width:795px; /*657px;*/ height:auto; position:relative!important; opacity:1!important; transform: scale(1)!important;}

.tablonnn .cerrar {width:68px; left:-20px; top:18px;}

.tablonnn #tabloninstitucional.solo .titulo-ch {top:0; opacity:1}
.tablonnn #tabloninstitucional.solo .bktablonbackground {opacity:1}
.tablonnn #tabloninstitucional.solo .bktablon {top:60px; opacity:1}

.tablonnn #tabloninicial .elemento01 {width:57px; left:45px; top:15px;}
.tablonnn #tabloninicial .elemento02 {width:218px; left: 61px; top: -17px; }
.tablonnn #tabloninicial .elemento03 {width:171px; left: 391px; top: -26px; }
.tablonnn #tabloninicial .elemento-moodle {width:85px; left: -40px; top: 62px; }

.tablonnn #tabloninicial .elemento04 {width:178px; left: 481px; top: 55px;}
.tablonnn #tabloninicial .elemento05 {width:169px; left:68px; top:226px}
.tablonnn #tabloninicial .elemento06 {width:131px; left: 272px; top: 176px}
.tablonnn #tabloninicial .elemento08 {width:72px; left: 440px; top: 169px;}
.tablonnn #tabloninicial .elemento09 {width:71px; left: 519px; top: 169px;}
.tablonnn #tabloninicial .elemento07 {width:71px; left: 596px; top: 169px;}
.tablonnn #tabloninicial .elemento10 {width:53px; left: 685px; top: 73px }
.tablonnn #tabloninicial .elemento11 {width:53px; left: 685px; top: 108px;}
.tablonnn #tabloninicial .elemento12 {width:53px; left: 685px; top: 142px;}
.tablonnn #tabloninicial .elemento13 {width:53px; left: 685px; top: 177px;}
.tablonnn #tabloninicial .elemento14 {width:53px; left: 685px; top: 211px;}
.tablonnn #tabloninicial .elemento15 {width:53px; left: 685px; top: 245px;}
.tablonnn #tabloninicial .elemento16 {width:53px; left: 685px; top: 279px;}
.tablonnn #tabloninicial .elemento17 {width:63px; left: 114px;/*134px;*/ top: 278px;}
.tablonnn #tabloninicial .elemento18 {width:81px; left: 290px!important; /*310px*/ top: 274px;}
.tablonnn #tabloninicial .elemento19 {width:81px; left: 430px;/*452px;*/ top: 303px;}
.tablonnn #tabloninicial .elemento20 {width:63px; left: 372px; /*392px;*/ top: 288px;}
.tablonnn #tabloninicial .elemento21 {width:63px; left: -7px;/*13px;*/ top: 285px;}
.tablonnn #tabloninicial .elemento22 {width:89px; left: 86px; top: 150px;}

.tablonnn #tabloninicial .elemento33 {width:110px; /*126px*/ left: 735px;/*705px;*/ top: 318px;}

/*1B*/.tablonnn #tabloninicial .elemento21b {width:63px; left: 49px;/*69px;*/ top: 290px; }
/*2B*/.tablonnn #tabloninicial .elemento17b {width:63px; left: 171px;/*191px;*/ top: 288px;}
/*4B*/.tablonnn #tabloninicial .elemento20b {width:63px; left: 452px; top: 291px;}

/*3EKO*/.tablonnn #tabloninicial .elemento18b {width:63px; left: 227px;/*247px;*/ top: 284px;}
/*5B*/.tablonnn #tabloninicial .elemento19b {width:81px; left: 495px; /*515px;*/ top: 283px;}
/*5tEco*/.tablonnn #tabloninicial .elemento19c {width:63px; left: 582px; /*515px;*/ top: 288px;}

/*ecoverde*/ .tablonnn #tabloninicial .elemento34 {width:165px; left: 185px; top: 82px;}
/*kisko*/ .tablonnn #tabloninicial .elemento35 {width:93px; left: 60px; top: 86px;}
/*acapadres*/ .tablonnn #tabloninicial .elemento36 {width:108px; left: 363px; top: 60px;}
/*nivInicia*/ .tablonnn #tabloninicial .elemento37 {width:140px; left: 484px; top: 141px}
/*grados*/ .tablonnn #tabloninicial .elemento38 {width:89px; left: 666px; top: 42px;}
/*campamentos primario*/ .tablonnn #tabloninicial .elemento40 {width:108px!important; /*116px*/ left: 653px!important; /*595px*/ top: 294px!important;}
.tablonnn #tabloninicial .acticultural {width:81px!important; left: 752px!important; top: 189px!important;}


.tablonnn #tabloninstitucional .titulo-ch {top:0; opacity:1}
.tablonnn #tabloninstitucional .bktablonbackground {opacity:1}
.tablonnn #tabloninstitucional .bktablon {top:60px; opacity:1}
.tablonnn #tabloninstitucional .elemento01 {width:224px; left:321px; top:-31px;}
.tablonnn #tabloninstitucional .elemento02 {width:354px; left: 55px; top: 75px; }
.tablonnn #tabloninstitucional .elemento03 {width:115px; left:100px; top:146px; }
.tablonnn #tabloninstitucional .elemento04 {width:185px; left: 100px; top: 250px;}
.tablonnn #tabloninstitucional .elemento05 {width:193px; left: 306px; top: 252px;}
.tablonnn #tabloninstitucional .elemento06 {width:185px; left: 100px; top: 165px;}
.tablonnn #tabloninstitucional .elemento07 {width:193px; left: 306px; top: 166px;}
.tablonnn #tabloninstitucional .elemento08 {width:101px; left: 572px; top: 185px}

.tablonnn #tablonadministracion .titulo-ch {top:0; opacity:1}
.tablonnn #tablonadministracion .bktablonbackground {opacity:1}
.tablonnn #tablonadministracion .bktablon {top:60px; opacity:1}
.tablonnn #tablonadministracion .elemento01 {width: 357px; left: 321px; top: -21px;}
.tablonnn #tablonadministracion .elemento02 {width:159px; left: 190px; top: 166px; }

.tablonnn #tablonacademia .titulo-ch {top:0; opacity:1}
.tablonnn #tablonacademia .bktablonbackground {opacity:1}
.tablonnn #tablonacademia .bktablon {top:60px; opacity:1}
.tablonnn #tablonacademia .elemento01 {width:144px; left:135px; top:-42px;}
.tablonnn #tablonacademia .elemento02 {width:126px; left: 91px; top: 175px;}
.tablonnn #tablonacademia .elemento03 {width:136px; left: 239px; top: 97px;}
.tablonnn #tablonacademia .elemento04 {width:126px; left: 408px; top: 42px;}
.tablonnn #tablonacademia .elemento05 {width:126px; left: 568px; top: 149px;}
.tablonnn #tablonacademia .elemento06 {width:126px; left: 65px; top: 150px;}


.tablonnn #tablonaccsolidaria .titulo-ch {top:0; opacity:1}
.tablonnn #tablonaccsolidaria .bktablonbackground {opacity:1}
.tablonnn #tablonaccsolidaria .bktablon {top:60px; opacity:1}
.tablonnn #tablonaccsolidaria .elemento01 {width:178px; /*left:76px; top:-18px;*/left:287px; top:-28px;}
.tablonnn #tablonaccsolidaria .elemento04 {width:108px; left:458px; top:60px}
.tablonnn #tablonaccsolidaria .elemento02 {/*width:96px; left:260px; top:56px;*/ width:108px; left: 156px; top: 200px; }
.tablonnn #tablonaccsolidaria .elemento05 {width:108px; left:84px; top:70px}
.tablonnn #tablonaccsolidaria .elemento03 {/*width:96px; left:350px; top:55px;*/ width:108px; left:271px; top:110px; -ms-transform: rotate(-10deg); /* IE 9 */
    -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
    transform: rotate(-10deg); }
	
.tablonnn #tablonaccsolidaria .elemento03:hover { transform: scale(1.5) rotate(-10deg)!important; -ms-transform: scale(1.5) rotate(-10deg); /* IE 9 */
    -webkit-transform: scale(1.5) rotate(-10deg); /* Chrome, Safari, Opera */}
.tablonnn #tablonaccsolidaria .elemento06 {width:108px; left:594px; top:50px}
.tablonnn #tablonaccsolidaria .elemento07 {width:138px; left:554px; top:180px}
.tablonnn #tablonaccsolidaria .elemento08 {width:108px; left:384px; top:210px}


.tablonnn #tablonacademiaingles .titulo-ch {top:0; opacity:1}
.tablonnn #tablonacademiaingles .bktablonbackground {opacity:1}
.tablonnn #tablonacademiaingles .bktablon {top:60px; opacity:1}
.tablonnn #tablonacademiaingles .elemento01 {width:249px; left:256px; top:-14px;}
.tablonnn #tablonacademiaingles .elemento02 {width:122px; left: 187px;  top: 114px; }
.tablonnn #tablonacademiaingles .elemento03 {width:150px; left: 471px; top: 118px; }


.tablonnn #tablonviajes .titulo-ch {top:0; opacity:1}
.tablonnn #tablonviajes .bktablonbackground {opacity:1}
.tablonnn #tablonviajes .bktablon {top:60px; opacity:1}
.tablonnn #tablonviajes .elemento01 {width: 146px; left: 323px; top: -21px}
.tablonnn #tablonviajes .elemento02 {width: 184px; left: 73px; top: 154px;}
.tablonnn #tablonviajes .elemento03 {width: 184px; left: 304px; top: 164px }
.tablonnn #tablonviajes .elemento04 {width: 184px; left: 543px; top: 154px }


.tablonnn #tablonpadres .titulo-ch {top:0; opacity:1}
.tablonnn #tablonpadres .bktablonbackground {opacity:1}
.tablonnn #tablonpadres .bktablon {top:60px; opacity:1}
.tablonnn #tablonpadres .elemento01 {width: 108px; left: 336px; top: -31px}
.tablonnn #tablonpadres .elemento02 {width: 70px; left: 82px; top: 134px;}
.tablonnn #tablonpadres .elemento03 {width: 108px; left: 206px; top: 160px }
.tablonnn #tablonpadres .elemento04 {width: 108px; left: 361px; top: 140px }
.tablonnn #tablonpadres .elemento05 {width: 173px; left: 511px; top: 204px }


.tablonnn #tablonagenda .titulo-ch {top:0; opacity:1}
.tablonnn #tablonagenda .bktablonbackground {opacity:1}
.tablonnn #tablonagenda .bktablon {top:60px; opacity:1}
.tablonnn #tablonagenda .elemento01 {width: 108px; left: 336px; top: -31px}
.tablonnn #tablonagenda .elemento02 {width: 200px; left: 122px; top: 164px;}
.tablonnn #tablonagenda .elemento03 {width: 200px; left: 478px; top: 170px }

.tablonnn #tabloninstitucional .elemento01, .tablonnn #tablonacademia .elemento01, .tablonnn #tablonaccsolidaria .elemento01, .tablonnn #tablonacademiaingles .elemento01, .tablonnn #tablonviajes .elemento01,.tablonnn #tablonpadres .elemento01, .tablonnn #tabloninicial .elemento38, .tablonnn #tabloninicial .elemento37, .tablonnn #tablonagenda .elemento01 { cursor:auto!important}

.tablonnn #tabloninstitucional .elemento01:hover, .tablonnn #tablonacademia .elemento01:hover, .tablonnn #tablonaccsolidaria .elemento01:hover, .tablonnn #tablonacademiaingles .elemento01:hover, .tablonnn #tablonviajes .elemento01:hover, .tablonnn #tablonpadres .elemento01:hover, .tablonnn #tabloninicial .elemento38:hover, .tablonnn #tabloninicial .elemento37:hover, .tablonnn #tablonagenda .elemento01:hover {z-index:999!important; transform: scale(1)!important;}


.tablonnn .btn-cerrar {visibility:hidden}


.videosss .poptablon.activameTablon { z-index:989!important; position: absolute!important}

.videosss .poptablon {
background:#7bacbe;
width: 100%;
height: 100%;
position: fixed;
top:-100%;
left:0;
vertical-align: middle;
display:table;
z-index:0;/*120;*/
opacity:0;
}
.videosss .poptablon .contenido {padding-top:150px;/*100px*/}
.videosss .poptablon .tag {position:absolute; /*top:45px; left:45px;*/padding-top:7px; padding-left:268px; width:100%; top:0; left:0; z-index:5; -webkit-transition:  0.2s; /* Safari */
    transition: 0.2s;
	display: table;
    vertical-align: middle;
    height: 91px;
}

.videosss .poptablon .tag:before {content:' '; display:table-cell; width:33px; height:91px; background:url(../../images/division-header.png) top left no-repeat}

.videosss .poptablon .tag img {height:77px; width:auto; display:table-cell; margin-top:8px; -ms-transform: rotate(-10deg); /* IE 9 */
    -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
    transform: rotate(-10deg); -webkit-transition:  0.2s; /* Safari */
    transition: 0.2s;
}

	
/*SCROLLADO*/
.videosss .poptablon .tag.scrolleadoTab { background:rgba(255,255,255,0.5); padding:10px 30px 10px 268px!important; }	
.videosss .poptablon .tag.scrolleadoTab img { height:41px!important; margin-top: 18px!important}


	
.videosss .poptablon .titpop {
color:#fff;
text-align:center;
font-weight:normal;
font-size:41px;
line-height:1.2;
font-family: 'GothamUltra';
position:relative;
display:block;
text-transform:uppercase
}
.videosss .poptablon .titpop span {
font-family: 'GothamBook'!important;
}
.videosss .poptablon .subtitpop {
font-size:20px;/*30px;*/
line-height:1.2;
color:#fff;
display:block;
text-align:center;
padding:0;
margin:0 0 20px 0;
font-weight:normal!important; /*400*/
/*font-family: 'Grand Hotel', cursive;*/
font-family: 'GothamMedium', cursive;
text-transform:uppercase;


}
.videosss .poptablon.activameTablon .contenido{
display: block!important;
    vertical-align: top!important;
    overflow: auto!important;
    /* min-height: 100%!important; */
    /* height: auto!important; */
    /*height: 100%!important;*/
	height: 100vh!important;
}

.notificacion:before {
	content:' ';
	display:block;
	left:-10px;
	top:-10px;
	width:30px;
	height:30px;
	position:absolute;
	z-index:5;
	background:url(../images/notificacion.png) top left no-repeat;
	background-size:100%!important;
	-webkit-transition:  0.2s; /* Safari */
    transition: 0.2s;
	animation-name: atencion;
	animation-duration: 1.0s;
	animation-iteration-count: infinite;
	-webkit-animation-name:atencion;
	-webkit-animation-duration: 1.0s;
	-webkit-animation-iteration-count: infinite;
}
@keyframes atencion {
  0% {
    transform : scale(1)
  }
  50% {
    transform : scale(1.2)
  }
  100% {
    transform : scale(1)
  }
}