/* CSS Document */
@import url("colores.css");
@import url("size.css");
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600|Indie+Flower);
@import url("../fuentes/iconmoon/style.css");
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%;vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}body { line-height: auto;}ol, ul { list-style: none;}blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;}table { border-collapse: collapse; border-spacing: 0;}
body, html{
min-width:100%;
min-height:100%;
color:#2B2B2B;
position:absolute;
}
html{
background-image: url(../img/arbol-01.svg);
background-size:auto 108vh;
background-position: 86% bottom;
background-repeat: no-repeat;
background-attachment:fixed;
background-color: #E1EFF9;
}
body {
font-size: 13px;
font-family: 'Open Sans', sans-serif;
font-weight:300 !important;
background-image: url(../img/Ajax_loader_metal_512.gif);
background-size: 50px;
background-position: -100%;
background-repeat: no-repeat;
background-attachment:fixed;
}
body.cargando{
background-position: center, 86% bottom;
}
#intro{
background-image: url("../img/itesoLogo.svg");
background-position: center;
background-repeat: no-repeat;
background-size: 60vmin auto;
position: fixed;
width: 100%;
height: 100%;
}
.logoContainer{
position: absolute;
top: 2vh;
right: 1vw;
width: 100vw;
max-width: 380px;
min-width: 240px;
}
.logoContainer{
position: absolute;
top: 2vh;
right: 1vw;
width: 100vw;
max-width: 380px;
min-width: 240px;
}
.miToolTip{
background-color: #E1EFF9 !important;
color: #007CA1 !important;
border:2px solid #007CA1 !important;
font-family: 'Open Sans', sans-serif !important;
border-radius: 14px !important;;
}
.slogan{
color: #007CA1;
font-size: 20px;
position: fixed;
right: 2vw;
top: 2vh;
}
.slogan .s_tit{
font-weight: 400;
}
.slogan .s_subtit{
font-weight: 300;
}
.menuMainCarr {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 100%;
min-width: 100%;
position: absolute;
}
.menuMainCarr button{
text-align: left;
padding-left: 30vw;
letter-spacing: 4px;
margin-bottom:10px;
}
.videoContainer button{
text-align: left;
padding-left: 11vw;
letter-spacing: 4px;
margin-top: 2vh;
margin-left: -10px;
}
.menuMainCarr button.carrera, .menuMainCarr button.inicio{
letter-spacing: 2px;
margin-bottom:0px;
text-align: right;
padding-right: 50vw;
padding-left: 3vw;
}
.menuAlumnos{
position: fixed !important;
left: 0px;
top:5%;
height: 90%;
max-width: 400px;
width: 100%;
overflow: auto;
z-index: 9;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
border-right: 2px solid #FFF;
}
.menuAlumnos button{
letter-spacing: 1px;
text-align: right;
padding-right: 1vw;
padding-left: 10px;
display: block;
width: 100%;
font-weight: 100;
}
#fotosAlumnosContainer{
width: calc(100% - 400px);
position: absolute;
right: 0px;
top: 0px;
min-height: calc(100%);
box-sizing: border-box;
display: flex;
align-content: center;
justify-content: center;
flex-direction: column;
}
#fotosAlumnos {
width: 80%;
display: block;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
padding: 4px;
padding-top: 20px;
padding-bottom: 4vh;
text-align: center;
}
#fotosAlumnos img{
height: 12vh;
margin: 4px;
border: 3px solid #34678B;
border-radius: 2px;
}
#fotosAlumnosCarrera{
font-weight: 300;
color: #007CA1;
font-size: 20px;
text-align: center;
padding: 10px;
width: 80%;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
margin-top: 70px;
text-transform: uppercase;
letter-spacing: 3px;
}
#RegresarListadoBTN{
position: absolute;left: 10px;top: 1vh;
}
#RegresarVidPorSiempreBTN{
position: absolute;left: 10px;top: 1vh;
}
#grupal{
width: 100%;
height: 100%;
position: absolute;
display: block;
box-sizing: border-box;
padding: 3vh;
padding-top: 4vh;
padding-bottom: 4vh;
text-align: center;
}
#grupal.fullGrupal{
width: 100%;
height: 100%;
position: absolute;
display: block;
box-sizing: border-box;
padding: 0vh;
padding-top: 4vh;
padding-bottom: 4vh;
text-align: center;
}
#grupal #grupal_img{
width: 100%;
height: auto;
}
#fotoGrupalImg{
width: 100%;
height: 100%;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.thumbGrupalContenedor {
position: absolute;
bottom: 2vh;
left: 0px;
width: 100%;
}
.thumGrupal {
display: inline-block;
width: 100px;
height: 70px;
background-size: cover;
background-position: center;
margin: 10px;
border: 2px solid #01467f;
box-shadow: 0px 0px 8px -3px #000;
backface-visibility: hidden;
background-color: #cc132a;
}
.thumGrupal:not(.actual):hover {
box-shadow: 0px 0px 10px -4px #000;
transform: scale(1.2);
}
.thumGrupal.actual {
border: 2px solid #FFF;
}
#fotosAlumnos img.menos10 {
height: 24vh;
}
#fotosAlumnos img.menos30{
height: 18vh;
}
#fotosAlumnos img:hover{
transform: scale(1.1);
}
.menuAlumnos button:hover{
padding-right: 1.4vw;
}
#alumnoSolo{
text-align: center;
position: relative;
padding-left: 2vw;
padding-right: 2vw;
}
#alumnoSolo img{
border:10px solid #34678B;
border-bottom-width:10px;
/*transform: rotate(-2deg);*/
box-shadow: 0px 0px 17px -13px #000;
vertical-align: middle;
width: 40%;
}
.mensajeAlumno{
text-align: left;
display: inline-block;
font-size:20px;
max-width: 457px;
width: 50%;
vertical-align: middle;
padding-bottom: 0px;
padding-left: 30px;
color:#434343;
}
.mensajeAlumno .mensajeTXT{
font-family: 'Indie Flower', cursive;
}
.mensajeAlumno .nombreAlumno{
color: #34678B;
font-weight: 400;
font-size: 18px;
margin-bottom: 1vh;
}
.mensajeAlumno .carreraAlumno{
color: #34678B;
font-weight: 300;
font-size: 14px;
margin-bottom: 3vh;
}
#fotosActosContainer, #fotosPorSiempreContainer{
width: 100%;
position: absolute;
left: 0px;
top: 0px;
min-height: 100%;
box-sizing: border-box;
display: flex;
align-content: center;
justify-content: center;
flex-direction: column;
}
#fotosActos, #fotosPorSiempre {
width: 90%;
display: block;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
padding: 2vw;
padding-top: 60px;
padding-bottom: 4vh;
text-align: center;
line-height: 0px;
}
#fotosPorSiempre div{
width: 10vw;
height: 6vw;
max-width: 180px;
max-height: 116px;
margin: 1px;
border: 0px solid #34678B;
border-radius: 0px;
display: inline-block;
background-size: 100% auto;
background-color: rgba(142,206,226,1.00);
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
#fotosActos div{
width: 10vw;
height: 10vw;
max-width: 120px;
max-height: 120px;
margin: 1px;
border: 0px solid #34678B;
border-radius: 0px;
display: inline-block;
background-size: 100% auto;
background-color: rgba(142,206,226,1.00);
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
#fotosPorSiempre div:hover{
background-size: 110% auto;
}
#fotosActos div:hover{
background-size: 110% auto;
}
.videoContainer{
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
display: flex;
align-content: center;
justify-content: center;
flex-direction: column;
}
.videoTube{
width: 80%;
height: 80%;
display: block;
margin-left: auto;
margin-right: auto;
border: 3px solid #34678B;
}
.menuInternoSuperior{
position:fixed;
top:4px;
left: 4px;
padding: 0px;
}
.menuInterno {
position: fixed;
left: calc(100% - 78px);
bottom: 20%;
width: 260px;
}
.menuInterno button{
display: block;
width: 293px;
white-space: nowrap;
}
.menuInterno button span.icono {
font-size: 26px;
display: inline-block;
margin-right: 30px;
margin-left: 20px;
vertical-align: middle;
}
.menuGrupal {
width: 100%;
position: fixed;
top: 2vh;
left: 0px;
opacity: .8;
}
.menuGrupal:hover {
opacity: 1;
}
.menuGrupal button, .menuGrupal a{
font-size: 20px;
}
.menuInterno.grupalZona button, .menuGrupal button, .menuGrupal a,.menuGrupal a:visited{
background-color: rgba(202,232,241,0.80);
border-radius: 0px;
border:none;
z-index: 10;
vertical-align: middle;
}
.menuInterno.grupalZona button:hover{
border-radius: 5px;
}
.menuGrupal button:hover, .menuGrupal a:hover{
background-color:rgba(142,206,226,1.00);
color:#FFF;
}
.descargar{
margin-left: .2vw;
}
.IOS .descargar{
/*display: none !important;*/
}
.cerrarGrupal {
margin-right: .2vw;
}
.menuInterno button:hover span.icono {
margin-right: 10px;
margin-left:10px;
}
.menuInterno button:hover{
/*margin-left: calc(-100% + 60px);
width: 280px;*/
margin-left: calc(-100% + 10px);
width: 336px;
background-color:rgba(142,206,226,0.95);
color:#FFF;
}
.textAreaVLO{
border:2px dashed #FFFFFF !important;
border-radius:20%;
}
.atras, .adelante{
font-size:40px;
cursor: pointer;
position: absolute;
top:0px;
height: 100%;
width: 30%;
line-height: 1200%;
opacity: .2;
}
.atras .icono, .adelante .icono{
position: absolute;
top: 20%;
width: calc(100% - 2vw);
}
.atras:hover, .adelante:hover{
opacity: .6;
}
.full .atras,.full .adelante{
color:#fff;
text-shadow: 1px 1px 1px black;
opacity: .6;
}
.full .atras .icono,.full .adelante .icono{
display: block;
position: absolute;
top:38%;
}
.full .adelante .icono{
/*right: 0vw; */
}
.full .atras:hover,.full .adelante:hover{
opacity: 1;
}
.full .total {
color: #fff;
text-shadow: 1px 1px 1px #000;
position: absolute;
bottom: 2vh;
width: 100%;
left: 0px;
}
.atras{
left:0px;
text-align: left;
padding-left: 2vw;
}
.adelante{
right:0px;
text-align: right;
padding-right: 2vw;
}
.font_indie{
font-family: 'Indie Flower', cursive;
}
.font_fredericka{
font-family: 'Fredericka the Great', cursive;
}
.font_Conforta{
font-family: 'Comfortaa', cursive;
}
.font_openSans{
font-family: 'Open Sans', sans-serif;
}
.w300{
font-weight:300 !important;
}
.w400{
font-weight:400 !important;
}
.w600{
font-weight:600 !important;
}
.w700{
font-weight:700 !important;
}
.w800{
font-weight:700 !important;
}
a{
color:#1a84f2;
text-decoration:none;
}
.miBlur{
-webkit-filter: blur(6px);
-moz-filter: blur(6px);
-o-filter: blur(6px);
-ms-filter: blur(6px);
filter: blur(6px);
}
button, .grid tr, .grid tbody tr, .grid td, .grid tbody td, .animado, .cell, .botonMenu, .button, #devB, .tableLayout,.hoverDefault, .menuPrincipalVerticalContainer, .ani, .ani * {
-webkit-transition: all 300ms ease-in-out 0s;
-moz-transition: all 300ms ease-in-out 0s;
-ms-transition: all 300ms ease-in-out 0s;
-o-transition: all 300ms ease-in-out 0s;
transition: all 300ms ease-in-out 0s;
}
.ani150, .ani150 *{
-webkit-transition: all 150ms ease-in-out 0s;
-moz-transition: all 150ms ease-in-out 0s;
-ms-transition: all 150ms ease-in-out 0s;
-o-transition: all 150ms ease-in-out 0s;
transition: all 150ms ease-in-out 0s;
}
.aniSoloPadre{
-webkit-transition: all 150ms ease-in-out 0s;
-moz-transition: all 150ms ease-in-out 0s;
-ms-transition: all 150ms ease-in-out 0s;
-o-transition: all 150ms ease-in-out 0s;
transition: all 150ms ease-in-out 0s;
}
/*-----------------------------------*/
/*COMBOUI*/
.ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
}
.textShadow{
text-shadow:1px 1px 0px #0F0F0F;
}
.textBorder{
text-shadow:
2px 1px 0 #000,
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000;
}
.textBorderWithShadow{
text-shadow:
3px 3px 0 #000,
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000;
}
/*HEADER */
.shadowBottom{
box-shadow:0 11px 17px -17px #000000;
}
.shadowTop{
box-shadow:0 0px 7px 0px #000;
}
.clear{
clear:both;
height:0px;
}
.clearLeft{
clear:left;
}
.clearRight{
clear:right;
}
.right{
float:right !important;
}
.left{
float:left !important;
}
.container{
box-sizing:border-box;
color:#2B2B2B;
margin-left:auto;
margin-right:auto;
max-width:1024px;
}
.noBorder{
border:none !important;
}
.innerShadow{
box-shadow: inset 0 -1px 10px 0 rgba(0, 0, 0, 0.1);
-webkit-box-shadow: inset 0 -1px 10px 0 rgba(0, 0, 0, 0.1);
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
hr{
background-color:#F3F3F4;
border:0px solid;
height:1px;
width:86%;
}
/*-------------------*/
/* CONFIGURACION */
.alpha50{
opacity:.5;
}
.alpha80{
opacity:.8;
}
.alpha40{
opacity:.4;
}
.alpha20{
opacity:.2;
}
.noMargin{
padding:0px !important;
margin:0px !important;
}
.showBorder{
border:1px solid #EAEAEA;
}
button.showBorder{
border:1px solid #68AEF6;
}
b, strong, .bold{
font-weight:600;
}
.overHidden{
overflow:hidden;
}
/* FORMAS */
.block{
display:block;
}
.extraPadding{
padding-top:2vh;
padding-bottom:2vh;
}
.noRadius{
border-radius:0px;
}
input.textField.simple{
border-top:none;
border-left:none;
border-right:none;
border-radius:0px;
background-color:transparent;
}
.outOfSight{
position:fixed !important;
left:-200%;
}
button, .button, .buttonB{
font-family:"Open Sans",sans-serif;
font-weight:400;
display: inline-block;
*display:inline;
*zoom:1;
vertical-align: top;
border: none;
/*box-shadow: inset 0 -1px 10px 0 rgba(0, 0, 0, 0.1);
-webkit-box-shadow: inset 0 -1px 10px 0 rgba(0, 0, 0, 0.1);*/
text-align: left;
padding: 8px;
font-size:16px;
letter-spacing:1px;
cursor:default;
background-color:transparent;
}
.button, .buttonB{
border:1px solid #1a84f2;
border-radius:5px;
}
.buttonB{
padding:4px;
border:1px solid #1a84f2;
background-color:#008ad6;
color:#FFFFFF;
color:rgba(255,255,255,0.80);
border-radius:3px;
}
.buttonB:hover{
padding:4px;
border:1px solid #1a84f2;
background-color:#005381;
color:#FFFFFF;
color:rgba(255,255,255,0.90);
border-radius:3px;
}
.scaleYtoHide{
-webkit-transition: all 600ms ease-in-out 0s !important;
-moz-transition: all 600ms ease-in-out 0s !important;
-ms-transition: all 600ms ease-in-out 0s !important;
-o-transition: all 600ms ease-in-out 0s !important;
transition: all 600ms ease-in-out 0s !important;
transform-origin:top;
transform:scale(1,0);
}
button, .button{
cursor:pointer;
}
button:hover, .button:hover{
background-color:rgba(142,206,226,.3);
}
button.actual, .button.actual{
background-color:rgba(28,91,111,0.80) !important;
color: #FFF;
cursor: default;
}
button.field,.button.field{
height: 27px;
padding-top: 5px;
vertical-align: middle;
}
button:active, .button:active{
/*padding-top:12.5px;
padding-bottom:9.5px; */
}
.hiddenImportant{
display:none !important;
}
.inline{
position:relative;
display:inline-block;
*diplay:inline;
*zoom:1;
}
h1, h2, h3{
margin-bottom:4px;
margin-top:4px;
font-weight:400;
}
.maxWidthParagrap{
max-width:680px;
}
h1{
font-size:16px;
line-height:18px;
}
h2{
font-size:14px;
line-height:16px;
}
h3{
font-size:12px;
line-height:14px;
}
.lectura{
line-height:16px;
letter-spacing:1px;
padding:20px !important;
margin-top:16px;
margin-bottom:14px;
}
.onlySmall, .hideBig, .only500, .onlyMed, .onlyBig, .show840px_td, .show840px_inline, .show840px_inlineBlock, .show840px_block{
display:none;
}
.hidden{
display:none;
}
.noPadding{
padding:0px !important;
}
.topRightAbs{
position:absolute;
top:0px;
right:0px;
display:block;
z-index:0;
}
.verticalTop{
vertical-align:top !important;
}
.verticalBottom{
vertical-align:bottom !important;
}
.notSelectable{
-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */
/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;
}
/*-----------------------------------*/
.inferiorDerecha{
position:absolute;
right:8px;
bottom:8px;
}
.textoCentrado{
text-align:center !important;
}
.textoIzquierda{
text-align:left;
}
.textoDerecha{
text-align:right;
}
.onlyPrint{
display:none;
}
.menuBurguer{
display:none;
}
.fullContenedor .menuInterno{
display: none;
}
.rotando {
display:inline-block;
-webkit-animation-name: spin;
-webkit-animation-duration: 1500ms;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-webkit-transform-origin: center;
-moz-animation-name: spin;
-moz-animation-duration: 1500ms;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
-moz-transform-origin: center;
-ms-animation-name: spin;
-ms-animation-duration: 1500ms;
-ms-animation-iteration-count: infinite;
-ms-animation-timing-function: linear;
transform-origin: center;
animation-name: spin;
animation-duration: 1500ms;
animation-iteration-count: infinite;
animation-timing-function: linear;
transform-origin: center;
}
.show620_block,.show620_inline,.show620_inline_block,.show600_block,.show600_inline,.show600_inline_block{
display: none;
}
@-ms-keyframes spin {
from { -ms-transform: rotate(0deg); }
to { -ms-transform: rotate(360deg); }
}
@-moz-keyframes spin {
from { -moz-transform: rotate(0deg); }
to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
from {
transform:rotate(0deg);
}
to {
transform:rotate(360deg);
}
}
.noScroll{
overflow: hidden;
position: fixed;
}
@media screen and (max-width: 1500px){
#alumnoSolo img {
width: 30%;
}
.mensajeAlumno {
font-size: 18px;
width: 40%;
}
}
@media screen and (max-width: 1240px){
.menuAlumnos {
width: 33%;
}
#fotosAlumnosContainer {
width: 66%;
/*padding-top: 70px;*/
}
}
@media screen and (max-width: 1100px){
#alumnoSolo img {
width: 40%;
}
.mensajeAlumno {
font-size: 18px;
width: 40%;
width: 80%;
max-width: none;
text-align: center;
padding-left: 0px;
margin-top: 3vh;
}
.menuInterno {
top: 8%;
bottom: auto;
}
.atras .icono, .adelante .icono {
top: 44%;
}
#fotosActos div{
width: 12vw;
height: 12vw;
}
#fotosPorSiempre div{
width: 12vw;
height: 6vw;
}
}
@media screen and (max-width: 944px){
.sizeBig {
font-size: 26px !important;
}
.sizeMed{
font-size: 16px !important;
}
.menuMainCarr button.carrera, .menuMainCarr button.inicio {
padding-right: 45vw;
}
.menuAlumnos .size14px {
font-size:13px !important;
white-space: nowrap;
font-weight: 400;
width: 100%;
margin-left: auto;
min-height: 26px;
box-sizing: border-box;
padding-top: 6px;
padding-bottom: 6px;
padding-right: 2vw;
padding-left: 2vw;
}
#RegresarListadoBTN{
top: 8vh;
}
}
@media screen and (max-width: 800px), screen and (max-height: 700px){
.menuMainCarr button.carrera, .menuMainCarr button.inicio {
padding-right: 10vw;
}
}
@media screen and (max-width: 720px), screen and (max-height: 700px){
.menuAlumnos {
width: 40%;
top: 68px;
}
#RegresarListadoBTN{
width: 100%;
text-align: center;
left: 0px;
}
#RegresarVidPorSiempreBTN{
width: 100%;
text-align: center;
left: 0px;
top:auto;
bottom:10px;
}
.videoContainer button {
padding-left: 0px;
margin-left: 0px;
width: 100%;
text-align: center;
}
#fotosAlumnosCarrera{
font-size: 18px;
letter-spacing: 2px;
}
#fotosAlumnosContainer {
width: 60%;
}
#fotosAlumnos {
width: 100%;
padding-top: 5px;
}
.menuInterno {
position: fixed;
left: 0px;
top: 0px;
bottom:auto;
width: 100%;
display: flex;
}
#zonaAlumnos .slogan,#zonaGrupal .slogan, #zonaActos .slogan, #zonaVideo .slogan,#zonaPorSiempre .slogan{
display: none;
}
#zonaInicio .slogan{
width: 100%;
text-align: center;
right: 0px;
font-size: 18px;
padding-left: 2vw;
padding-right: 2vw;
box-sizing: border-box;
}
.menuInterno.grupalZona button {
background-color: rgba(202,232,241,0.95);
border-radius: 0px;
border: none;
}
.menuInterno button {
display: inline-block;
width: calc(100% / 5);
white-space: nowrap;
text-align: center;
}
.menuInterno button:hover {
margin-left: 0px;
width: calc(100% / 5);
background-color: rgba(142,206,226,1.00);
color: #FFF;
border-radius: 0px !important;
}
.menuInterno button:hover span.icono {
margin-right: 0px;
margin-left: 0px;
}
.menuInterno button span.icono {
font-size: 22px;
display: block;
margin-right: 0px;
margin-left: 0px;
}
.menuInterno .sizeSmall{
font-size: 10px !important;
}
.hide620{
display:none !important;
}
.show620_block{
display: block;
}
.show620_inline{
display: inline;
}
.show620_inline_block{
display: inline-block;
}
.menuGrupal {
bottom: 6vh;
top:auto;
}
.menuGrupal button, .menuGrupal a{
font-size: 30px;
}
#fotosActos div{
width: 120px;
height: 180px;
max-width: none;
}
#fotosPorSiempre div{
width: calc(100% / 4);
height: 10vw;
max-width: none;
}
#fotosActos, #fotosPorSiempre {
width: 100%;
padding-top: 66px;
padding-bottom: 4vh;
}
}
@media screen and (max-width: 600px), screen and (max-height: 700px){
.menuAlumnos {
width: 94%;
top: 52px;
z-index: 1;
background-color: #CEE5F5;
max-width: 340px;
height: calc(100% - 52px);
padding-bottom: 20px;
padding-top: 20px;
}
.menuAlumnos.oculto{
left: calc(-90%);
}
.show600_block{
display: block;
}
.show600_inline{
display: inline;
}
.show600_inline_block{
display: inline-block;
}
#fotosAlumnosContainer .verOcultar {
position: fixed;
left: 0px;
top: 50%;
display: block;
font-size: 34px;
width: 30px;
height: 78px;
border: 1px solid #34678B;
background-color: #CEE5F5;
border-left: none;
border-radius: 0px 10px 10px 0px;
padding: 0px;
z-index: 2;
}
#fotosAlumnosContainer .verOcultar .icono {
padding-top: 21px;
text-align: left;
margin-left: -3px;
}
#fotosAlumnosContainer .verOcultar .textoListadoBTN{
transform: rotate(-90deg);
font-size: 14px;
font-weight: 700;
letter-spacing: 2px;
position: absolute;
left: -3px;
top: 36px;
}
#fotosAlumnosContainer {
width: 100%;
}
#fotosAlumnosContainer.alumnoSoloContainer{
padding-top: 54px;
}
#alumnoSolo img{
width: 34vmin;
}
.mensajeAlumno {
text-align: center;
width: 80%;
padding-bottom: 20px;
padding-left: 0px;
color: #434343;
margin-top: 20px;
}
.mensajeAlumno {
font-size: 2.1vmax !important;
display: block;
margin-left: auto;
margin-right: auto;
}
.atras, .adelante {
position: fixed;
top: 0px;
height: 100%;
width: 30%;
line-height: 1200%;
opacity: .5;
}
.atras .icono, .adelante .icono{
position: absolute;
top:40%;
}
.adelante .icono{
position: absolute;
width: 86%;
}
}
@media screen and (max-width: 500px){
.menuMainCarr button.carrera, .menuMainCarr button.inicio {
padding-right: 5vw;
}
.menuMainCarr .sizeSmall {
font-size:14px !important;
font-weight: 400 !important;
}
#fotosActos div{
width: 110px;
height: 120px;
max-width: none;
}
#fotosPorSiempre div{
width: calc(100% / 2.2);
height: 12vw;
max-width: none;
}
#fotosAlumnosCarrera{
font-size: 16px;
letter-spacing: 1px;
}
#fotosAlumnosContainer {
justify-content: start;
}
#fotosAlumnosContainer.alumnoSoloContainer {
padding-top: 106px;
}
}
@media screen and (max-width:420px){
#contenedorNombre, #contenedorInicio, #contenedorFotos {
box-sizing:border-box;
padding-left:3vw;
padding-right:3vw;
}
.mensajeAlumno {
font-size: 18px !important;
}
.menuAlumnos {
top: 49px;
height: calc(100% - 49px);
}
.menuInterno .sizeSmall{
font-size: 8px !important;
}
}