* { box-sizing:border-box;}
body { margin:0px; background:#FFFFFF; font-family: Arial, Helvetica, sans-serif; }
.cajo { position:relative; width:60%; margin:40px auto; }
.head { position:relative; overflow:hidden; }
.head h1 { position:relative; color:#CCC; font-size:70px; margin:30px 50px 60px 50px; padding:0px; -webkit-animation: show-it 3s ease 1; animation: show-it 3s ease 1; }
.head h2 { position:absolute; bottom:-5px; left:130px; -webkit-animation: room-it 2s ease 1; animation: room-it 2s ease 1; }
.head img { position:absolute; bottom:0px; left:10px; -webkit-animation: show-it 3s ease 1; animation: show-it 3s ease 1; }
.world { position:relative; border-top:2px solid #000000; border-bottom:2px solid #000000; text-align:center; overflow:hidden; min-height:200px; margin:0px; padding:0px; }
.imgw { position:absolute; transform:scale(0.7); transform-origin:0 0; top:0; left:-400px; -webkit-animation: zoom-it 2s ease 1; animation: zoom-it 2s ease 1; z-index:3; }
.imgd { position: absolute; top:50px; left:400px; -webkit-animation: zoox-it 2s ease 1; animation: zoox-it 2s ease 1;z-index:9999; }
@-webkit-keyframes show-it {
	from { opacity: 0; }
	to { opacity:1; }
	}
@keyframes show-it {
	from { opacity: 0; }
	to { opacity: 1; }
	}
@-webkit-keyframes room-it {
	from { -webkit-transform: translate(1000px); opacity: 0; }
	to { -webkit-transform: translate(0px); opacity:1; }
	}
@keyframes room-it {
	from { -webkit-transform: translate(1000px); opacity: 0; }
	to { -webkit-transform: translate(0px); opacity: 1; }
	}
@-webkit-keyframes zoom-it {
	from { -webkit-transform: scale(0.2); opacity: 0; }
	to { -webkit-transform: scale(0.7); opacity:1; }
	}
@keyframes zoom-it {
	from { -webkit-transform: scale(0.2); opacity: 0; }
	to { -webkit-transform: scale(0.7); opacity: 1; }
	}
@-webkit-keyframes zoox-it {
	from { -webkit-transform: translate(-400px,100px); opacity: 0; }
	to { -webkit-transform: translate(0px,0px); opacity: 1; }
	}
@keyframes zoox-it {
	from { -webkit-transform: translate(-400px,100px); opacity: 0; }
	to { -webkit-transform: translate(0px,0px); opacity: 1; }
	}
.scroll { text-align:center; font-size: 2em; margin: 0px auto; height: 20vh; }
.scroll p { position: fixed; color:#ff0000; margin: 2vh 0; opacity: 0; left: 10vw; width: 80vw; animation: switch 32s linear 1; }
.scroll p:nth-child(2) { animation-delay: 4s}
.scroll p:nth-child(3) { animation-delay: 8s}
.scroll p:nth-child(4) { animation-delay: 12s}
.scroll p:nth-child(5) { animation-delay: 16s}
@-webkit-keyframes switch {
	0% { opacity: 0;filter: blur(20px); transform:scale(12)}
	3% { opacity: 1;filter: blur(0); transform:scale(1)}
	10% { opacity: 1;filter: blur(0); transform:scale(.9)}
	13% { opacity: 0;filter: blur(10px); transform:scale(.1)}
	80% { opacity: 0}
	100% { opacity: 0}
	}
@keyframes switch {
	0% { opacity: 0;filter: blur(20px); transform:scale(12)}
	3% { opacity: 1;filter: blur(0); transform:scale(1)}
	10% { opacity: 1;filter: blur(0); transform:scale(.9)}
	13% { opacity: 0;filter: blur(10px); transform:scale(.1)}
	80% { opacity: 0}
	100% { opacity: 0}
	}
.skip { font-weight:700; text-align:right; }
.caja { position:relative; width:70%; margin:0px auto; border:1px solid #92907a; }
.cabe { position:relative; background: #009456; padding:10px 25px; }
.cabe h2::before { content:url("../images/book2.png"); display: block; }
.cabe h2 { position:absolute; width:50%; right:25px; bottom:0px; font-size:18px; font-weight:normal; text-align:right; }
.cabe::after { content:''; display:block; clear:both; }
.scale80 { width:80%; height:auto; }
.aleft { text-align:left !important; }
.center { text-align:center !important; }
.peqb { color: #FFFFFF; font-size: 12px; }
.peq { font-size:12px; color:#666; }
.conte { background:#f1f2e5; display:block; padding:0px; margin:0px; }
.conte:after { content:''; display: block; clear:both; }
.pad { padding:10px 15px; }
.pad20 { padding:25px 35px; }
.breath { margin:30px auto; }
.menu, .con { float:left; display:inline; }
.menu { width:20%; font-size:12px; }
.con { width:80%; min-height:450px; background:#FFF; border-left:1px solid #92907a; font-size:13px; }
.menu ul { list-style:none; margin:0px; padding:0px; }
.menu .tit, .titu { background:#dbd9b7; color:#006666; font-weight:bold; padding:5px 10px; border-top:1px solid #92907a; border-bottom:1px solid #92907a; }
.menu .tit::before, .titu::before { content:url("../images/rg2.png"); display:inline-block; margin-right:10px; }
.titu { font-size:12px; color:#000; font-style:italic; font-family: Verdana, Arial, Helvetica, sans-serif; }
.menu ul li { background:#f1f2e5; font-weight:normal; padding:5px 15px; border-bottom:1px solid #dbd9b7; }
.menu ul li::before { content:url("../images/fl00.png"); display:inline-block; margin-right:10px; }
.menu a, .con a { color: #006666; text-decoration:none; }
.menu a:hover, .con a:hover { font-weight:bold; }
.con p { color:#333; margin:15px 5px; text-align:left; }
.border { border:1px solid #CCC; border-radius:10px; }
.dark { background:#666; color:#FFF; padding:15px 30px; margin:0px; }
.teach, .stud { text-align:center !important; padding:15px; margin:0px; }
.teach { background:#dbd9b7; }
.stud { background:#f1f2e5; }

@media (max-width:1024px) {
	.caja { width:100%; }
	.pad20 { padding:10px; }
}