@charset "utf-8";

/* CSS Document */



html            		   			{ background:#c1c1c1/*COLOR SEGUN NIVEL*/;}

body    		           			{ background:#c1c1c1/*COLOR SEGUN NIVEL*/;}





/* * * * * *  layout  * * * * * */



.botonera					{ top:-100px /*Ajuste vertical de botones de home*/;}

.columnaDrVid				{ top:80px/*Centrado vertical video seccion video*/;}





/* * * * * *  elements  * * * * * */



.navegacion1				{ min-width:265px; height:55px; padding-top:13px/*Ajuste vertical según el logo de método*/;}

#logoCia					{ width:240px; height:48px;}/*AJUSTAR SEGUN IDIOMA*/

.iconos						{ min-width:220px/*AJUSTE SEGÚN Nº DE BOTONES*/; margin-top:9px/*AJUSTE VERTICAL ICONOS*/;}

#logo						{ width:192px; height:140px;}

.contenedorVideo			{ padding-bottom:75%/*PORCENTAJE SEGÚN PROPORCIÓN DEL VÍDEO*/;}

.portadaVideoRecursos		{ max-width:335px/*TAMAÑO DE VÍDEO MÁXIMO*/;}

.contVideoRecursos			{ padding-bottom:55.688%/*PORCENTAJE SEGÚN PROPORCIÓN DEL VÍDEO*/;}





/* * * * * * popup whats my webpage * * * * * */

.whatsMWP > p.txtDownAudio	{ clear:both; padding-top:15px;}

.whatsMWP ul				{ margin-top:10px;}

.whatsMWP li				{ margin-bottom:10px; list-style:none; padding-left:16px; background:url(../imagenes/bullet.png) no-repeat 0 5px;}

.whatsMWP li li				{ background-image:url(../imagenes/bullet2.png);}

.whatsMWP .resaltado		{ color:#e3004c; font-weight:bold;}

.whatsMWP .vinculo			{ color:#e3004c; text-decoration:underline;}

.whatsMWP .vinculo:hover	{ color:#747474;}





/* * * * * *  buttons  * * * * * */



/* * navegacion ppal * */

.home, .audio, .about, .videoFiles, .logout, .digital, .cutouts, .portfolio

							{ margin-left:5px;}

.home 						{ width:55px;}/*AJUSTAR SEGÚN TEXTO*/

.audio 						{ width:95px;}

.about 						{ width:55px;}

.videoFiles					{ width:70px;}

.digital					{ width:85px;}

.logout						{ width:64px;}/*AJUSTAR SEGÚN TEXTO*/





/* * botones demos * */

.botonesWebs				{ width:165px; height:73px; margin:25px 0/*TAMAÑO DE IMÁGENES SEGÚN MÉTODO*/; }

.acceso						{ width:118px; height:116px/*TAMAÑO DE IMÁGENES SEGÚN MÉTODO*/;}



/* *  navegación niveles  * */





/* *  navegación doc intro  * */

.botDocPrevio, .botDocSig	{ display:inline-block; width:27px; height:30px; margin:0 10px; vertical-align:middle;}

.botDocPrevio				{ background:url(../imagenes/previousPage.png) no-repeat left;}

.botDocSig					{ background:url(../imagenes/nextPage.png) no-repeat left;}





/* * botones audio recursos * */

.botAudioTitulos			{ margin:3%;}



/* * botones productos extra * */

#prod-WDA_1, #prod-WDA_2, #prod-WDA_3, #prod-WDA_4

							{ background-image:url(../imagenes/botWebDiscovery.png);}

#prod-LearnLinks_1, #prod-LearnLinks_2, #prod-LearnLinks_3, #prod-LearnLinks_4

							{ background-image:url(../imagenes/botLearningLinks.png);}

.botProd:hover				{ background-position:right;}



.tituloMarco, .tituloMarcoDerecha		{ display:inline-block; margin-left:1.25em; font-size:1.3em; color:#909090;}

.tituloMarcoDerecha 			{ float:right; margin-right:1.25em;}



/* * * * * *  media queries  * * * * */



@media screen and (max-width: 840px) {

a#btTeachers				{ background: left url(../imagenes/botTeachersPQ.png);}

a#btStudents				{ background: left url(../imagenes/botStudentsPQ.png);}

div#btTeachers				{ background: url(../imagenes/botTeachersPQOff.png);}

div#btStudents				{ background: url(../imagenes/botStudentsPQOff.png);}

.botonesWebs				{ width:124px; height:55px;}

.botonera					{ top:-95px;/*Ajuste vertical de botones*/}

.columnaIzVid,	.columnaDrVid

							{ width:90%; margin:0 auto;}

.columnaIzVid				{ display:inline; padding:0;}

.columnaDrVid				{ float:none; position:static; margin-bottom:1em;}

.contVideoRecursos			{ max-width:334px;}

.navegacion2				{ text-align:center;}

.navegacion2 *				{ margin-left:0;}

.navegacion1 .iconos		{ visibility:hidden;}

}

@media screen and (max-width: 725px) {

#logo						{ width:0px; height:0px; overflow:hidden;}

.navegacion1				{ margin:0 10px;}

.navegacion2				{ width:auto; margin:0;}

.tituloMarco				{ display:block; font-size:1.2em;}

.tituloMarcoDerecha			{ float:none; font-size:1.2em;}

}



@media screen and (max-width: 690px) {

/*.audiojs 					{ width:220px;}*/

#richmond 					{ padding-left: 0.5em;}

.portada					{ display:block; width:100%; text-align:center;}

.botonera					{ display:block; width:100%; height:auto; text-align:center; position:static;}

.tabla						{ padding:0;}

.botonesWebs				{ margin:1em;}

.demos img					{ width:70%;}

.botLevel:focus 			{ margin:0 0;}

.columna					{ width:100%}

}

/* * * * * *  banner márketing  * * * * */

.banner{ margin-top:-1rem; margin-bottom:4rem; padding:0 1rem; -webkit-box-sizing:border-box; box-sizing:border-box }
.banner *{ -webkit-box-sizing:border-box; box-sizing:border-box }
@media screen and (max-width:767px){
.banner{ margin-bottom:5.5rem }
 }
.banner a{ display:block; width:100%; padding:1vw; border-radius:2rem; border:1px solid #747474 }
@media screen and (max-width:500px){
.banner a{ border:none }
 }
.banner img{ display:block; width:700px; max-width:100%; height:auto; margin:0 auto; border-radius:1.6rem }
@media screen and (max-width:767px){
.banner img{ width:auto }
 }