/* HOJA DE ESTILO */

body {
    font-family: Rosario, sans-serif;
}

h1 {
    font-size: 30pt;
}

section#section-1 {
    background: url(Galeria/background1.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 860px;

}


section#section-2 {
    background: url(Galeria/background2.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 1000px;

}

section#section-3 {
    background: url(Galeria/background3.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 860px;

}


section#section-4 {
    background: url(Galeria/background4.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 1000px;

}

input { 
    width: 98%;
    border: none;
    background-color: #d9d9d9;
    height: 15px;
    padding: 1%;
    font-family: Rosaio, sans-serif;
}

hr {
    color:#818181;
    border: 1px solid;
}

a {
    text-decoration: none;
    color: #666;
}
a:hover {
    color: white;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}


.texto {
    font-size: 10pt;
    line-height: 20px;  
}

.texto2 {
    font-size: 8pt;
}

.texto3 {
    font-size: 8pt;
    color:#818181;
}
.texto3:hover { 
    color: white;
}    

.titulares {
    font-size:30pt; 
}

.destacado {
    font-size:15pt; 
}

.destacado2 {
    font-size:18pt; 
    line-height:32px;
    color:white; 
}
img.galeria {
    width: 235px;
}
img.galeria:hover {
    background: rgba(217, 217, 217, 0.39) ;
}
welcome:hover {
    background: url(logo.svg) ;
}
span#boton1 {
    background-color:white; 
    padding:5px; 
    font-size:9pt; 
    color:#666;
}
span#boton2 {
    background-color:#666; 
    padding:5px; 
    font-size:9pt; 
    color:#c3c3c3;
}
span#boton2:hover {
    background-color:white; 
    padding:5px; 
    font-size:9pt; 
    color:#666;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

div#n1 {
    width:50%; 
    float:left; 
    height:960px; 
    background: #99cc00;   

}
div#n2 {
    width:50%; 
    float:right; 
    height: 1577px;
    background: #c1c1c1;   

}


div#nivel {
    width:50%; 
    float:left; 
    background: url(Galeria/nva1.jpg) center;   
    height:960px; 
    color: white;
}

div#nivel:hover {
    background: #99cc00;   
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}


div#nivel2 {
    width:50%; 
    float:left; 
    background: url(Galeria/nva2.jpg) center;   
    height:960px; 
    color: white;
}

div#nivel2:hover {
    background: #99cc00;   
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

div#alumno:hover {
    background-color:white;
    color: #666;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    
}

div#alumno {
    width:22%; 
    float:left; 
    display: block;
    background-color: #666; 
    height:600px; 
    margin-top:122px;
    color: white;
    margin-right: 4%;
} 

div#biblio {
    width:22%; 
    float:left; 
    display: block;
    height:600px; 
    margin-top:122px;
    color: white;
    margin-right: 4%;
}

div#botcrono {
    background:#666; 
    padding:10px;  
    font-size:8pt;
    color:#c3c3c3;
    }

div#botcrono:hover {
    background:white; 
    color:#666;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    }

div#fecha {
    background:#99cc00;
    color:white;
    border:1px solid; 
    padding:10px; 
}
div#fecha:hover {
    background:#666;
    color:white;
    padding:10px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}







/* --- RÓTULO --- */

 div#pagina { 
    width:960px;
	margin: 0px auto;
}

    

header ul {
    display: inline-block;
    padding: 0;
    
}

header#rotulo { 
    width:100%;
    
}

.tipo_detalle { 
    font-family: Rosario, sans-serif;
    font-size:10px; 
    color: white; 
}
header ul li { 
    display:block;
    width:100%;
    display: inline;
    margin-right: 8px;
}

.float_right { 
    float:right;
    margin-top: 28px;
}

header a { 
    text-decoration: none;
    color: WHITE;
    margin: 0 15px;
}

header a:hover { 
    color: #99cc00;
}

/* LOGOTIPO */

div#logo {
    width:48px; 
    height:48px;
    background-image: url('svg/logo2.svg') ;
    display: inline-block;
    margin-top: 10px;
}

div#logo:hover {
    background-image: url('svg/logo.svg') ;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

/* --- CIERRE DEL LOGOTIPO --- */


/* --- CIERRE DE ROTULO --- */

/* --- FOOTER --- */

footer {
    background-color:#666;
}

div#footer { 
    margin: 0px auto;
    width: 960px;
    height: 85px;
    padding-top: 28px;
    display: block;
    background-color: #666;
    clear: both;
}

div#columna-footer {
    width:320px; 
    float:left; 
    display:block;
    
}

footer a { 
    color: white;
}

footer a:hover { 
    color: #99cc00;
}

/* --- CIERRE DEL FOOTER --- */


.demo_container { width:980px; margin:0 auto; }
#demo_top_wrapper { margin:0 0 20px 0; }
#demo_top { height:100px; padding:20px 0 0 0; }
#my_logo { font:70px Georgia, serif; }

#sticky_navigation_wrapper { width:100%; height:50px; }
#sticky_navigation { position: fixed; width:100%; height:50px; background:url(trans-black-60.png); -moz-box-shadow: 0 0 5px #999; -webkit-box-shadow: 0 0 5px #999; box-shadow: 0 0 5px #999; }

/* ---- GALERIA ---- */


.cbp-bislideshow {
	list-style: none;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	padding: 0;
	margin: 0;
}

.cbp-bislideshow li {
	position: absolute;
	width: 101%;
	height: 101%;
	top: -0.5%;
	left: -0.5%;
	opacity: 0;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	transition: opacity 1s;
}

/* If background-size supported we'll add the images to the background of the li */

.backgroundsize .cbp-bislideshow li {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	background-position: center center;
}

/* ...and hide the images */
.backgroundsize .cbp-bislideshow li img {
	display: none;
}

.cbp-bislideshow li img {
	display: block;
	width: 100%;
}

.cbp-bicontrols {
	position: fixed;
	width: 300px;
	height: 100px;
	margin: -50px 0 0 -150px;
	top: 50%;
	left: 50%;
}

.cbp-bicontrols span {
	float: left;
	width: 100px;
	height: 100px;
	position: relative;
	cursor: pointer;
}

.cbp-bicontrols span:before {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-align: center;
	font-family: 'entypo';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 100px;
	font-size: 80px;
	color: #fff;
	-webkit-font-smoothing: antialiased;
	opacity: 0.7;
}

.cbp-bicontrols span:hover:before {
	opacity: 1;
}

.cbp-bicontrols span:active:before {
	top: 2px;
}

span.cbp-biplay:before {
	content: "\e002";
}

span.cbp-bipause:before {
	content: "\e003";
}

span.cbp-binext:before {
	content: "\e000";
}

span.cbp-biprev:before {
	content: "\e001";
}

.cbp-bicontrols span.cbp-binext {
	float: right;
}

/* Fallback */

.no-js.no-backgroundsize .cbp-bislideshow li:first-child {
	opacity: 1;
}

.no-js.backgroundsize .cbp-bislideshow li:first-child img {
	display: block;
}


/* 2 */


.cbp-bislideshow {
	list-style: none;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	padding: 0;
	margin: 0;
}

.cbp-bislideshow li {
	position: absolute;
	width: 101%;
	height: 101%;
	top: -0.5%;
	left: -0.5%;
	opacity: 0;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	transition: opacity 1s;
}

/* If background-size supported we'll add the images to the background of the li */

.backgroundsize .cbp-bislideshow li {
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	background-position: center center;
}

/* ...and hide the images */
.backgroundsize .cbp-bislideshow li img {
	display: none;
}

.cbp-bislideshow li img {
	display: block;
	width: 100%;
}

.cbp-bicontrols {
	position: fixed;
	width: 300px;
	height: 100px;
	margin: -50px 0 0 -150px;
	top: 50%;
	left: 50%;
}

.cbp-bicontrols span {
	float: left;
	width: 100px;
	height: 100px;
	position: relative;
	cursor: pointer;
}

.cbp-bicontrols span:before {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-align: center;
	font-family: 'entypo';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 100px;
	font-size: 80px;
	color: #fff;
	-webkit-font-smoothing: antialiased;
	opacity: 0.7;
}

.cbp-bicontrols span:hover:before {
	opacity: 1;
}

.cbp-bicontrols span:active:before {
	top: 2px;
}

span.cbp-biplay:before {
	content: url(svg/play.svg);
}

span.cbp-bipause:before {
	content: url(svg/pause.svg);
}

span.cbp-binext:before {
	content: url(svg/der.svg);
    
}

span.cbp-biprev:before {
	content: url(svg/izq.svg);
}

.cbp-bicontrols span.cbp-binext {
	float: right;
}

/* Fallback */

.no-js.no-backgroundsize .cbp-bislideshow li:first-child {
	opacity: 1;
}

.no-js.backgroundsize .cbp-bislideshow li:first-child img {
	display: block;
}

/*	------ */
/* Set all parents to full height */
html, body, 
.container,
.cbp-fbscroller,
.cbp-fbscroller section { 
	height: 100%; 
    padding-bottom: 5%;
}

/* The nav is fixed on the right side  and we center it by translating it 50% 
(we don't know it's height so we can't use the negative margin trick) */
.cbp-fbscroller > nav {
	position: fixed;
	z-index: 9999;
	right: 165px;
	top: 50%;
	width: 26px;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.cbp-fbscroller > nav a {
	display: block;
	position: relative;
	z-index: 9999;
	color: transparent;
	width: 26px;
	height: 26px;
	outline: none;
	margin: 25px 0;
	border-radius: 50%;
	border: 4px solid #fff;
    content: "Hola";
}

.no-touch .cbp-fbscroller > nav a:hover {
	background: rgba(255,255,255,0.6);
}

.cbp-fbscroller > nav a.cbp-fbcurrent {
	background: #fff;
}

/* background-attachment does the trick */
.cbp-fbscroller section {
	position: relative;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}

.no-touch .cbp-fbscroller section{
	background-attachment: fixed;
}

/* ------------------------------- */

/* Accordion style */
.cbp-ntaccordion {
    list-style: none;
    margin: 0;
    padding: 0;
}
 
.cbp-ntsubaccordion {
    list-style: none;
}
 
.cbp-ntaccordion .cbp-nttrigger {
    cursor: pointer;
} 
 
.cbp-ntaccordion h3 {
    margin: 0 0 0.3em;
    padding: 1em 0 0.5em;
    border-bottom: 1px solid #ddd;
    font-size: 2.75em;
    font-weight: 300;
}
 
.cbp-ntaccordion h4 {
    font-size: 12pt;
    padding: 0.5em 0 0.5em;
    margin: 0 0 0.5em;
}
 
.cbp-ntaccordion h5 {
    font-size: 1.2em;
    color: #aaa;
    padding: 0.5em 0 0.5em;
    margin: 0 0 0.5em;
}
 
.cbp-ntaccordion .cbp-ntcontent p {
    font-size: 10pt;
    line-height: 1.5;
    padding: 0.2em 0 1.5em;
    margin: 0;
}
 
/* Arrow icons */
.cbp-ntaccordion > li > .cbp-nttrigger:before,
.cbp-ntsubaccordion > li > .cbp-nttrigger:before {
    font-family: 'icomoon';
    speak: none;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    color: #ddd;
    margin-right: 0.5em;
    -webkit-font-smoothing: antialiased;
}
 
.cbp-ntaccordion > li > .cbp-nttrigger:before {
    font-size: 75%;
}
 
.cbp-ntaccordion > li > .cbp-nttrigger:before {
    content: url(svg/flecha3.svg);
}
.cbp-ntaccordion > li > .cbp-nttrigger:hover:before {
    content: url(svg/flecha4.svg);
    color: inherit;
}
.cbp-ntaccordion > li.cbp-ntopen > .cbp-nttrigger:before,
.no-js .cbp-ntaccordion > li > .cbp-nttrigger:before {
    content: url(svg/flecha5.svg);
    color: inherit;
}
 
.cbp-ntsubaccordion > li > .cbp-nttrigger:before {
    content: url(svg/flecha6.svg);
}
.cbp-ntsubaccordion > li > .cbp-nttrigger:hover:before {
    content: url(svg/flecha7.svg);
    color: inherit;
}
.cbp-ntsubaccordion > li.cbp-ntopen > .cbp-nttrigger:before,
.no-js .cbp-ntsubaccordion > li > .cbp-nttrigger:before {
    content: url(svg/flecha8.svg);
    color: inherit;
}
 
/* Initial height is zero */
.cbp-ntaccordion .cbp-ntcontent {
    height: 0;
    overflow: hidden;
}
 
/* When open, set height to auto */
.cbp-ntaccordion .cbp-ntopen > .cbp-ntcontent,
.cbp-ntsubaccordion .cbp-ntopen > .cbp-ntcontent,
.no-js .cbp-ntaccordion .cbp-ntcontent {
    height: auto;
}
 
/* Example for media query */
@media screen and (max-width: 32em) { 
 
    .cbp-ntaccordion {
        font-size: 70%;
    }
 
}