/***FONTS***/
@font-face {font-family: Inter Light;src: url(fonts/Inter-Light.ttf);}
@font-face {font-family: Inter Medium;src: url(fonts/Inter-Medium.ttf);}
@font-face {font-family: Inter Bold;src: url(fonts/Inter-Bold.ttf);}
@font-face {font-family: Inter Bolder;src: url(fonts/Inter-ExtraBold.ttf);}
@font-face {font-family: Inter Black;src: url(fonts/Inter-Black.ttf);}

/* @import url('https://fonts.googleapis.com/css?family=Ubuntu:300,300i,400,400i,500,500i,700,700i'); */



body{
  /*font-size: 1.1em;*/
  font-weight: normal;
  text-decoration: none;
  margin:0;
  padding:0;
  scroll:auto;
  max-width:100%;
  overflow-x:hidden;
  line-height: 1.15!important;
}

body,input,button,a:link {
font-family: 'Inter Light', sans-serif;
}

ul,li {
	margin:0;
	padding:0px;
	list-style: none;
}

img {
	/* max-width:100%; */
	/* height:auto; */
}

input, input:active, input:focus {
	border:none;
	box-shadow:none;
	border-radius:0;
	outline: none;
}

.row>*{
	padding-right: 10px;
	padding-left: 10px;
}

.clearfix {
	clear:both;
}

@property --color1 {
  syntax: "<color>";
  inherits: false;
  initial-value: #F14902;
}

@property --color2 {
  syntax: "<color>";
  inherits: false;
  initial-value: #F4B324;
}

@property --colorGreen {
  syntax: "<color>";
  inherits: false;
  initial-value: #599958;
}

@property --colorTxt {
  syntax: "<color>";
  inherits: false;
  initial-value: #282320;
}

/*****home*****/
.loginBox {
	float:left;
	width:50%;
}

.loginBoxLogo, .loginBoxLogin{
	float:right;
	width:100%;
	height:50vh;
	position:relative;	
}
.signupBoxLogin {
	height:73vh;
}

.signupBoxLogo {
	background:var(--colorGreen);
	width:100%;
	padding-left:50px;
	height:27vh;
	overflow:hidden;
}
.signupBoxLogo>div {
	width:100%;
	height:100%;
}

.loginBoxLogo, .signupBoxLogo>div {
	background:var(--color1);
}
.loginLogo{
	position:absolute;
	top:20px;
	right:20px;
	width:11vw;
}
.loginBoxLogin {
	background:#fff;
	border-right:50px solid var(--color2);
}

.loginImg{
	float:left;
	width:50%;
	background:var(--colorGreen);
	height: 100vh;
	position:relative;
}
.signupImg{
	height: 73vh;
}

.loginImg>div{
	height:100%;
	width:calc(100% - 50px);
	/* background-image:url('../images/img_home.png'); */
	background-color:var(--color2);
	background-size:cover;
	float:right;
	background-position-y: bottom;
	background-position-x: right;
}
.signupImg>div{
	background-position-y: top;	
}

.loginTit, .signupTit {
	color: var(--colorTxt);
    font-weight: 500;
    font-size: 6vw;
    float:left;
    margin:60px 0 0 50px;
    clear:both;
    
}
.signupTit {
	font-size:4vw;
	margin: 40px 0 0 40px;
	font-weight:bold;
}

.loginSub {
	color: #14110e;
    font-weight: 00;
    /* font-size: 40px; */
    font-size:3vw;
    float: left;
    margin: 20px 0 0 50px;
    letter-spacing: -2px;
    clear:both;
}
.loginTxt, .signupTxt {
	color: #fff;
/*     font-size: 45px;
    margin:70px 0 0 50px; */
    /* font-size: 43px; */
    font-size:2.1vw;
    line-height: 44px;
    margin:45px 0 0 50px;
    float:left;
    
   clear:both;
   font-weight:bold;
   
   position: absolute;
   bottom: 10px;
   width: calc(100% - 60px);
   line-height: 1.2;
}
.signupTxt {
	font-size: 1.8vw;
	font-weight: normal;
	margin: 15px 0 0 40px;
	width: calc(100% - 280px);
	line-height: 1.2;
}

.loginBoxLogin>div {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
	width:50%;
	text-align:center;
}

.loginBoxLogin>div input{
	border:none;
	border-bottom:2px solid #707c8f;
	text-align:center;
	width:100%;
	clear:both;
	margin-bottom:30px;
	padding:5px 0;
}

.loginBoxLogin>div input:focus{	
	border:none;
	box-shadow:none;
	border-bottom:2px solid var(--color1);
}
input::placeholder {
/*	text-transform:uppercase;*/
	color:#c6c6c6;
	font-size:14px;
}

.loginBoxLogin>div div{
	position:relative;
}
.loginBoxLogin>div i{
	position: absolute;
    top: 5px;
    right: 0;
    color: #c6c6c6;
    cursor:pointer;
}

.loginBoxLogin>div button{	
	color:#fff;
	background:var(--color1);
	font-size:18px;	
	border:none;
	padding:20px;
	border-radius:30px;
	font-weight:bolder;
/*	text-transform:uppercase;*/
	width:60%;
	margin-top:30px;
	cursor:pointer;
}

/*****header*****/
/* header {
	width: calc(100% - 20px);
	padding:5px 10px;
	background:#e6e6e6;
	overflow:auto;
	padding:0 10px 3px 0;
} */

/* header .logoHeader {
	height:20px;
	float:left;	
} */

/* .usuario {
	float:right
} */
/* .logueo, a:link.logueo {
	color: #fff;
    background: var(--color1);
    font-size: 18px;
    border: none;
    padding: 20px;
    border-radius: 30px;
    font-weight: bolder;
    text-transform: uppercase;
    width: 60%;
    margin-top: 30px;
    cursor: pointer;
    text-decoration:none;
    transition: transform 0.8s;
  	transform-style: preserve-3d;
}

.logueo:hover, a:link.logueo:hover {
	background:#fff;
	color:var(--color1);
	border: 1px solid var(--color1);
	transform: rotateY(180deg);
	
} */
.idiomas, a.idiomas:link {font-weight:normal;}
.idiomasSelected, a.idiomasSelected:link {font-weight:bold;}

.btn-flip {
  opacity: 1;
  outline: 0;
  color: #fff;
  line-height: 40px;
  position: relative;
  text-align: center;
  letter-spacing: 1px;
  display: inline-block;
  text-decoration: none;
/*  text-transform: uppercase;*/
  font-size:20px;
}
.btn-flip:hover:after {
  opacity: 1;
  transform: translateY(0) rotateX(0);
}
.btn-flip:hover:before {
  opacity: 0;
  transform: translateY(50%) rotateX(90deg);
}
.btn-flip:after {
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  color: var(--color1);
  display: block;
  transition: 0.5s;
  position: absolute;
  background: #fff;
  border:1px solid var(--color1);
  font-size:20px;
  content: attr(data-back);
  transform: translateY(-50%) rotateX(90deg);
}
.btn-flip:before {
  top: 0;
  left: 0;
  opacity: 1;
  color: #fff;
  display: block;
  padding: 0 30px;
  line-height: 40px;
  transition: 0.5s;
  position: relative;
  border:1px solid var(--color1);
  background: var(--color1);
  content: attr(data-front);
  transform: translateY(0) rotateX(0);
}


.logoInvitado {
	float:left;
	margin:50px 40px 40px 40px;
	
}
.logoInvitado img {
	width:90px;
}

.logoFijo {
	position:absolute;
	top:30px;
	right:20px;
}
.logoFijo img {
	height:115px;
}

.bloqueImg {
	width:77%;
	aspect-ratio:1/1;
	/* border:4px solid #fff; */
	/* border-radius:50%; */
	background-size:cover;
	float:right;
}

.bloqueTxt {
	font-size: 46px;
	font-size: 2.5vw;
    font-weight: bold;
    color: #fff;
    background: var(--colorAdmin);
    width: 84%;
    aspect-ratio:4/2;
    border-radius: 15px;
    top: 65%;
    z-index: -1;
    left: 10%;
    float:right;
    position:absolute;
    font-family: 'Inter Bolder';   
}
.bloqueTxt>div {
	position:absolute;
	bottom:10%;
	left:7%;
}

.bloqueImg:hover, .bloqueTxt:hover {
	cursor:pointer;
}


.bloque1, .bloque2, .bloque3, .bloque4 {
	width:25%;
	position:absolute;
}

.bloque1 {
	top:34%;
	left:0%;
}

.bloque1Pro {
	top:16%;
	left:4%;
}

.bloque2 {
	top:6%;
	left:25%;
}
.bloque2 .bloqueTxt{background:#A8A59F;}
.bloque3 {
	top:auto;
	left:45%;
	bottom:14%;
}
.bloque3Pro {
	left:34%;
	bottom: 14%;
    top: auto;
}
.bloque3 .bloqueTxt{background:#F14902;}
.bloque4 {
	top:25%;
	left:72%;
}
.bloque4Pro {
	top:27%;
	left:69%;
}
.bloque4 .bloqueTxt{background:#F4B324;}

#web_footer {
	position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #f6f6f6;
    font-size: 11px;
    padding: 5px;
    color: #999;
}


/*pantalla espacios*/
.espacioLog {
	float:left;
	margin:40px;
}
.espacioLog img {
	width:100px;
}

.espacioTit {
	float:left;
	color:#A8A59F;
	font-size:50px;
	margin-top:60px;
	font-weight:bold;
}
.espacioTit span {
	font-weight:lighter;
}

.espacioTitAdm, .headerTitAdm {
	color:var(--colorAdmin);
}

.espacioTitAlu {
	color:var(--color1);
}

.espacioImg {
	float:left;
	clear:left;
	width:20%;
	aspect-ratio:3/4;
	border-radius:20px;
	background-size:cover;
	margin-left:40px;
}

.espacioImg2 {
	float:left;
	clear:left;
	width:22%;
	aspect-ratio:3/4;
	border-radius:20px;
	background-size:cover;
	margin-left:40px;
	background-position:center;
	margin-top:50px;
}

.espacioBlo1 {
	position:absolute;
	/* top:10%;
	left:26%;
	width:40%; */
	/* height: 100%;
    height: -moz-available;
    height: -webkit-fill-available;
    height: fill-available; */
    
    /* height: calc(100% - 200px); */
    
    top: 10vh;
    left: 25vw;
    width: 31vw;
    height: 64vh;
    
}

/* .espacioBlo1Alu {
    top: 15vh;
    left: 27vw;

}
 */
.espacioBlo1>div>div, .espacioBlo2>div>div  {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
	text-align:center;
	font-weight:bold;
	width:95%;
}

.espacioBlo1 .espacioGlo1{
    position: absolute;
    left:45%;
    top:20%;
    width: 50%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #A8A59F;
    border: 3px solid #A8A59F;
    font-size: 1.7vw;
    cursor:pointer;
}

.espacioBlo1 .espacioGlo2{
    position: absolute;
    left:55%;
    top:55%;
    width: 35%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #A8A59F;
    border: 3px solid #A8A59F;
    font-size: 1.5vw;
    z-index:2;
    cursor:pointer;
}

.espacioBlo1 .espacioGlo3{
    position: absolute;
	left: 80%;
    top: 70%;
    width: 35%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #A8A59F;
    color: #fff;
    border: 3px solid #F2F2F2;
    font-size: 1.5vw;
    z-index:3;
    cursor:pointer;
}

.espacioBlo1 .espacioGlo4{
    position: absolute;
	left: 40%;
    top: 0%;
    width: 35%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #A8A59F;
    border: 3px solid #A8A59F;
    font-size: 1.5vw;
    z-index:1;
    cursor:pointer;
}

.espacioBlo1 .espacioGlo5{
    position: absolute;
	left: 15%;
    top: 15%;
    width: 35%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #A8A59F;
    border: 3px solid #A8A59F;
    font-size: 1.5vw;
    z-index:1;
    cursor:pointer;
}

.espacioBlo2 {
	position:absolute;
	/* top:27%;
	left:63%;
	width: 30%; */

/*     height: 100%;
    height: -moz-available;
    height: -webkit-fill-available;
    height: fill-available; */
    
    /* height: calc(100% - 200px); */
    
    top: 8vw;
    left: 63%;
    width: 26vw;
    height: 53vh;
}

 .espacioBlo2Alu {
    top: 20vh;
/*
    left: 66%;
 */
}
.espacioBlo2 .espacioGlo1{
    position: absolute;
    top:5%;
    left:35%;
    width: 45%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #A8A59F;
    border: 3px solid #A8A59F;
    font-size: 1.5vw;
    z-index:1;
    cursor:pointer;
}

.espacioBlo2 .espacioGlo2{
    position: absolute;
    top:27%;
    right:-15%;
    width: 50%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #fff;
    border: 3px solid #F2F2F2;
    font-size: 1.5vw;
    z-index:0;
    cursor:pointer;
}

.espacioBlo2 .espacioGlo3{
    position: absolute;
    top:40%;
    left:30%;
    width: 45%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #fff;
    border: 3px solid #F2F2F2;
    font-size: 1.5vw;
    z-index:1;
    cursor:pointer;
}

.espacioBlo2 .espacioGlo4{
    position: absolute;
    top:65%;
    left:80%;
    width: 45%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: #F2F2F2;
    color: #fff;
    border: 3px solid #F2F2F2;
    font-size: 1.5vw;
    z-index:1;
    cursor:pointer;
}

.espacioGlo1Alu, .espacioGlo3Alu, .espacioGlo5Alu {
	border-color:#fff!important;
	background:#F14902!important;
	color:#fff!important;
}

/* .espacioBlo1 .espacioGlo1Alu {
	width:52%!important;
} */

/*  .espacioBlo1 .espacioGlo2Alu {
	width:50%!important;
	font-size:2.1vw;
	left: 29%;
    top: 27%;
}
 */
.espacioBlo1 .espacioGlo2Alu, .espacioBlo1 .espacioGlo4Alu, .espacioBlo2 .espacioGlo2Alu {
	border-color:#F14902!important;
	color:#F14902!important;
	background:#F2F2F2!important;
}

.espacioBlo1 .espacioGlo2Adm, .espacioBlo1 .espacioGlo4Adm, .espacioBlo2 .espacioGlo2Adm {
	border-color:var(--colorAdmin)!important;
	color:var(--colorAdmin)!important;
}

.espacioBlo1 .espacioGlo1Adm, .espacioBlo1 .espacioGlo3Adm, .espacioBlo1 .espacioGlo5Adm, .espacioBlo2 .espacioGlo1Adm, .espacioBlo2 .espacioGlo3Adm, .espacioBlo2 .espacioGlo4Adm, .espacioBlo4 .espacioGlo4Adm  {
	border-color:#fff!important;
	background:var(--colorAdmin)!important;
	color:#fff!important;
}

.espacioBlo1 .espacioGlo1Pro, .espacioBlo1 .espacioGlo2Pro, .espacioBlo2 .espacioGlo1Pro, .espacioBlo2 .espacioGlo2Pro {
	border-color:var(--color1)!important;
	color:var(--color1)!important;
}

.espacioBlo1 .espacioGlo3Pro, .espacioBlo2 .espacioGlo3Pro {
	background:var(--color1)!important;
	color:#fff!important;
}




.espacioBoxBut {
	width:95%;
	clear:both;
	margin-top:40px;
	z-index:10;
	position:fixed;
	bottom:6%;
	left:50%;
	transform:translateX(-50%);
}

.espacioBut {
    width: 300px;
    font-size: 38px;
    color: #fff;
    text-align: center;
    padding: 20px 10px;
    background: #A8A59F;
    font-weight: bold;
    border-radius: 20px;
    margin: 0 auto;
    cursor: pointer;
    float:left;
}

.espacioBoxButLeft {
	 float:left;
	 width:20%;
	 text-align:center;
}

.espacioBoxButLeft>div{
	float:none;
}

.espacioBoxButRight {
	float:right;	
}
.espacioBoxButRight>div {
	margin-left:20px;
	
}
.espacioBoxButRight button {
	float:left;
	margin-top:5px;
}


.espacioOrange {background: #F14902;}
.espacioGreen {background: var(--colorAdmin)}
.espacioSoftGreen {background: #7dd26f;}

.boxAlumno {
	margin:5px 5px 22px 5px;
	width:calc(14.27% - 10px);
	float:left;
	font-size:10px;
	font-weight:bold;
	line-height:10px;
	color:#666;
	text-align:center;
	position:relative;
}


.boxEspaciosAlumnos50 .boxAlumno {
	width:calc(23% - 10px);
	margin-top:0;
	max-width:160px;
}

.imgAlumno {
	width:100%;
	aspect-ratio:16/19;
	border-radius:10px;
	border:3px solid #e6e6e6;
	overflow:hidden;
	position:relative;
	cursor:pointer;
}

/* .imgAlumnoDiv {
	border-top-right-radius:0!important;
} */


.imgAlumnoDiv + div::after {
position: absolute;
    content: "";
    width: 30px;
    height: 8px;
    bottom: -1px;
    right: -11px;
    background: #e6e6e6;
    transform: rotate(-45deg);
}

/* .boxAlumnoSelected .imgAlumnoDiv::after {
	background: var(--colorAdmin);
} */


/* .boxAlumno:has(.imgAlumnoDiv)::after{
position: absolute;
    content: "";
    width: 14px;
    height: 14px;
    border-top: 2px solid #999;
    border-right: 2px solid #999;
    top: 0px;
    right: 0px;
    background: #fff;
    transform: rotate(45deg);
    z-index: 11111111111111;
    border-top-right-radius: 7px;
} */

.imgAlumno:hover, .txtAlumno:hover, .boxAlumno:hover .txtAlumno {
	border:3px solid var(--colorAdmin);
}


.txtAlumno:hover, .boxAlumno:hover .txtAlumno {
	border:1px solid var(--colorAdmin);
	background: var(--colorAdmin);
	color:#fff;
}

.boxEspaciosAlumnosAlu .txtAlumno:hover {
	border:1px solid var(--color1);
	background: var(--color1);
}

.imgAlumno img {
	width:105%;
	height:auto;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);	
}

.txtAlumno {
	position:absolute;
	bottom:-16px;
	left:50%;
	transform:translateX(-50%);
	border-radius:5px;
	border:1px solid #d6d6d6;
	background:#fff;
	overflow:hidden;
	height:29px;
	width:105%;
}
.txtAlumno>div {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:98%;
	/* max-height: 90%; */
	max-height:24px;
    overflow: hidden;
    line-height:12px;
}

.txtAlumno>div>.txtAlumnotxt {
margin-top: -1px;
 height: 14px;
 line-height: 13px;
 overflow: hidden;
}

.boxAlumnoEspacio .txtAlumno>div {
	max-height: 90%;
}

.collapse.show {margin-bottom:10px;}

/*espacios*/
.topButtons {
	/* border:1px solid #e6e6e6; */
	border-radius:10px;
	float:left;
	width:max-content;
	padding:3px;
	margin:2px 0;
	/* overflow:auto; */
}
.topButtons .customButton {
	width:10vw;
}

.topButtons .customButton.selected {
	background:var(--colorAdmin);
	color:#fff;
}

.topButtonsAut {
	width:max-content;
	margin-right:5px;
	max-width: 100%;
}
.topButtonsAut .customButton {
	width:200px;
}

.customButtonWidth {
	width: calc(33.3% - 8px)!important;
}

.topButtonsShedulesBox {
	width:80%;	
}

.topButtonsShedulesArrow {
	width:34px!important;
}
.topButtonsShedules {
	width:calc(100% - 84px)!important;
	float:left;
}
.topButtonsShedules>a {
	width:calc(20% - 8px)!important;
	margin:4px;
}

.boxEspacioContainer {
	width:100%;
	aspect-ratio:1/1;
	position:relative;
	margin-top:60px;
}

.boxEspacios {
	width:100%;
	padding:6px 25px;
	clear:both;
	float:left;
}

.boxEspaciosGrupos {
	float:left;
	width:12%;
	overflow:auto;
	border-right:1px solid #d6d6d6;
	padding-right:10px;
	height:100vh;
}
.boxEspaciosGrupos a, .boxEspaciosMicro a {
	color: var(--colorAdmin);
    border: 2px solid var(--colorAdmin);
    background: #F2F2F2;
    font-size: 18px;
    line-height:18px;
    width: 100%;
    padding: 13px 18px;
    text-align: center;
    border-radius: 10px;
    float: left;
    margin: 5px 0;
    font-weight: bold;
    position: relative;
}

.boxEspaciosMicro a {
    width: 97%;
    float: right;
    background-size:cover;
    background-position:center;
}


.boxEspaciosGrupos a:hover, .boxEspaciosMicro a.boxEspaciosMicroTxt:hover {
	color: #fff;
	background: var(--colorAdmin);
}

.boxEspaciosGrupos a.selected , .boxEspaciosMicro a.boxEspaciosMicroTxt.selected {
	color:#fff;
	background: var(--colorAdmin);
}


.boxEspaciosGrupos a {
	height: 55px;
	padding:0;
}
.boxEspaciosGrupos a>div {
	max-height: 44px;
	min-height: 25px;
	line-height: 1.1;
	transform: translate(-50%, -50%);
	overflow: hidden;
	width: 96%;
	position: absolute;
	top: 50%;
	left: 50%;
}

.boxEspaciosGruposImg {
	height:100px!important;
}

.boxEspaciosGruposImg div img {
	height: 70px;
}
.boxEspaciosGruposImg div{
	max-height:fit-content!important;
}

.boxEspaciosGruposImg2 div img {
	height: 55px;
}
.boxEspaciosGruposImg2>div{
	height:98px!important;
	max-height:98px!important;
}

.boxEspaciosGruposImg2 div>div:first-child {
 height:55px;
 margin-top:2px;
}

.boxEspaciosGruposImg2 div>div:nth-child(2){
	position: absolute;
	width: 98%;
	bottom: 5px;
    padding: 0 3px;
    line-height:1;
}

.boxEspaciosMicroImg {
	color: var(--colorAdmin);
    border: 2px solid var(--colorAdmin);
    background: #fff!important;
    font-size: 21px;
    width: 100%;
    padding: 5px 18px 5px 18px!important;
    text-align: center;
    border-radius: 10px;
    float: left;
    margin: 5px 0;
    font-weight: bold;
    position: relative;
}


.boxEspaciosMicroImg a{
	padding:10px
}

.boxEspaciosMicroImg img{
	height:60px;
}

a.boxEspaciosMicroImg:hover {
	box-shadow:none;
}

/* a.boxEspaciosMicroImg:hover img {
	transition: transform .2s;
	transform: scale(1.1);
} */

a.boxEspaciosMicroImg:hover, a.boxEspaciosMicroImg.selected {
	color:#fff;
	background: var(--colorAdmin)!important;
}

.boxEspaciosAlumnos, .boxEspaciosAlumnosDatosAlumno {
	float:left;
	width:calc(70% - 20px);
	margin:10px;
	padding:0 10px;
	/* border-left:1px solid #e6e6e6; */
	border-right:1px solid #e6e6e6;
}

.boxEspaciosAlumnos50 {
	width:calc(50% - 20px);
}

.boxEspaciosAlumnos2col {
	width:calc(80% - 20px);
}

/* .boxEspaciosAlumnosDatosAlumno {
	width:calc(60% - 20px);
} */

.boxEspaciosAlumnosDatosAlumno .boxAlumno {
	width: calc(14.27% - 10px);
}

.boxEspaciosDatosAlumno {
	float:left;
	width:calc(19% - 20px);
}



/* .boxEspaciosAlumnos .boxAlumno {
	margin:0px 10px 24px 10px;
	width: calc(14.28% - 20px);
} */
/* .boxEspaciosAlumnos2col .boxAlumno {
	width: calc(14.28% - 20px);
} */

.boxAlumnos10 .boxAlumno {
	width: calc(10% - 20px);
}

.boxAlumnos8 .boxAlumno {
	width: calc(12.5% - 20px);
}
.boxAlumnos5 .boxAlumno {
	width: calc(20% - 10px);
}

.boxAlumnos4 .boxAlumno {
	width: calc(25% - 10px);
}

.boxEspaciosAlumnos .imgAlumno {
    aspect-ratio: 16 / 19;
}

.boxEspaciosAlumnos .txtAlumno {
    width: 90%;
    height:32px;
    bottom:-16px;
}

.boxAlumnoSelected .imgAlumno {
	border: 4px solid var(--colorAdmin)!important;
	box-shadow:0 0 7px #333;
}
.boxAlumnoSelected .txtAlumno {
	border: 1px solid var(--colorAdmin);
	background:var(--colorAdmin);
	color:#fff!important;
}

.boxAlumnoSelected .imgAlumnoIcono:after {
	color:var(--colorAdmin);
}

.boxEspaciosAlumnosAlu .boxAlumnoSelected .imgAlumnoIcono:after {
	color:var(--color1);
}

.boxEspaciosAlumnosAlu.boxAlumnoSelected .imgAlumno {
	border: 4px solid var(--color1)!important;
}
.boxEspaciosAlumnosAlu.boxAlumnoSelected .txtAlumno {
	border: 1px solid var(--color1);
	background:var(--color1);
}


.boxAlumnoEspacio .txtAlumno {
	border: 2px solid var(--colorAdmin);
	background: #f2f2f2;
	color:var(--colorAdmin);
	font-weight:bold;
}

.boxAlumnoEspacio.boxAlumnoSelected .txtAlumno {
	color:var(--colorAdmin)!important;
}

.boxAlumnoEspacio.boxAlumnoSelected:hover .txtAlumno {
	color:#fff!important;
}
.boxAlumno.boxEspaciosAlumnosAlu:hover .txtAlumno{
	background:var(--color1);
	border-color:var(--color1);
}

.boxEspaciosAlumnosAlu .boxAlumnoEspacio .txtAlumno {
	border: 2px solid var(--color1);
    background: #f2f2f2;
    color: var(--color1);
    font-weight: bold;
	
}

.boxAlumnoEspacio.boxAlumnoSelected>div>.txtAlumno {
	color: var(--colorAdmin);
}

.boxAlumnoAssigned .imgAlumno {
	border: 3px solid var(--colorAdmin);
	opacity:0.2;	
}

.boxAlumnoActive .imgAlumno {
	border: 3px solid var(--colorGreen);	
}

.boxAlumnoActive .txtAlumno {
	border-color: var(--colorGreen);	
	color:var(--colorGreen);
}

.boxEspaciosAlumnosAlu.boxAlumnoActive .imgAlumno {
	border: 3px solid var(--color1);	
}

.boxEspaciosAlumnosAlu.boxAlumnoActive .txtAlumno {
	border-color: var(--color1);	
	color:var(--color1);
}

.boxEspaciosAlumnosAlu.boxAlumnoActive:hover .txtAlumno {
	color:#fff!important;
	color:var(--color1);
}

.boxAlumnoDisabled .imgAlumno {
	border: 3px solid var(--colorSoftGray);
	opacity:0.2;	
}

/* .boxEspaciosAlumnos .imgAlumno:hover {
    border: 4px solid #F14902;
}

/* .boxEspaciosAlumnos .boxAlumno:hover .txtAlumno {
	display:block;
} */


.boxEspaciosDatosAlumno .boxAlumno {
	margin: 15px auto;
    width: calc(80% - 20px);
    float: none;
}

.boxEspaciosDatosAlumno .boxAlumno .txtAlumno {
	font-size: 14px;
    line-height: 14px;
    height: 35px;
}

.boxEspaciosDatosAlumno .boxEspacio {
	margin: 0px auto;
    width: calc(80% - 20px);
    float: none;
    aspect-ratio:1/1;
    background:#A8A59F;
 	margin-top:10px;
 	border-radius:50%;
 	/* font-size:28px;
 	line-height:28px; */
 	font-size:1.7vw;
 	line-height:1;
 	color:#fff;
 	font-weight:bold;
/* 	text-transform:uppercase;*/
}

.boxEspacioContainer .boxEspacio{
	position:relative;
    width: 86%;
    position: absolute !important;
    right:5%;
    top:90px;
	overflow:hidden;
	background:var(--colorAdmin);
	border:2px solid var(--colorAdmin);
}
.boxEspacioContainer .boxEspacio>div{
	z-index:10;
	color:#fff;
	font-size: 2vw;
}

.boxEspacio:has(.locMicroAmbientNom)::after{
	width:100%;
	height:100%;
	position:absolute;
	content:"";
	top:52%;
	background:#f6f6f6;

	z-index:1;
}
.boxEspacioContainer .boxEspacio2::after{
	display:none;
}


.boxEspaciosDatosAlumno .boxEspacio .locMicroAmbientNom{
	font-size: 17px;
    line-height: 20px !important;
    margin-top: 40px;
}

.boxEspaciosDatosAlumno .boxEspacio2 {
	background:#F2F2F2;
	left: 5%;
	right:auto;
    width: 150px;
    position: absolute !important;
    top:-15px;
    bottom:auto;
    border:2px solid #999;
}
.boxEspaciosDatosAlumno .boxEspacio2>div {
	font-size: 1.2vw;
	color:#999;
}

.boxEspacioContainer .boxEspacio .locMicroAmbientNom{
	color:var(--colorAdmin)!important;
	font-size: 1.5vw;
}


.boxEspaciosMicro {
	float:left;
	width:18%;	
}

.espaciosMicroNum, .espaciosMicroNum2 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -16px;
    width: 35px;
    height: 40px;
    border-radius: 7px;
    border: 2px solid var(--colorAdmin);
    background: #FFF;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    line-height: 36px;
    color: var(--colorAdmin)!important;
    z-index:1;
}

.espaciosMicroNum2 {
	position: absolute;
    top: 13px;
    right: -2px;
    left: auto;
    font-size: 16px;
    width: 30px;
    height: 30px;
    line-height: 27px;
}

.boxEspaciosMicroAlu .boxEspaciosMicroTxt .espaciosMicroNum2 {
	border-color:var(--color1);
	color:var(--color1)!important;
}

.boxEspaciosMicroImg .espaciosMicroNum {
	left: -16px;
}

/*custom alumno*/
.customButtonAlu,
 .boxEspaciosGruposAlu a, .boxEspaciosMicroAlu a
{
	border: 2px solid var(--color1);
	color:var(--color1);
}


.customButtonAlu:hover,
.topButtons .customButtonAlu.selected,.customButtonAlu.selected,
.boxEspaciosGruposAlu a:hover, .boxEspaciosMicroAlu a.boxEspaciosMicroTxt:hover,
.boxEspaciosGruposAlu a.selected , .boxEspaciosMicroAlu a.boxEspaciosMicroTxt.selected:hover,
.adminTitleAlu::before, .adminSubtitleAlu::before, .boxEspaciosMicroAlu a:hover,.boxEspaciosMicroAlu .boxEspaciosMicroImg.selected,
.boxEspaciosMicroAlu .boxEspaciosMicroTxt.selected
{
    background: var(--color1)!important;
    border: 2px solid var(--color1)!important;
}


.boxEspaciosAlumnosAlu .boxAlumnoSelected .imgAlumno {
	border: 3px solid var(--color1)!important;
}
.boxEspaciosAlumnosAlu .boxAlumnoSelected .txtAlumno,
.boxEspaciosAlumnosAlu .txtAlumno:hover, .boxEspaciosAlumnosAlu .boxAlumno:hover>.txtAlumno {
	border: 1px solid var(--color1)!important;
	background: var(--color1)!important;
	color:#fff!important;
}
.boxEspaciosAlumnosAlu .boxAlumnoAssigned .imgAlumno,
.boxEspaciosAlumnosAlu .imgAlumno:hover , .boxEspaciosAlumnosAlu .txtAlumno:hover, .boxEspaciosAlumnosAlu .boxAlumno:hover>.txtAlumno {
	border: 1px solid var(--color1)!important;
	background: var(--color1)!important;
}

.boxEspaciosMicroAlu .espaciosMicroNum, .boxEspaciosMicroAlu .espaciosMicroNum2 {
    color: var(--color1) !important;
    border: 2px solid var(--color1)!important;
}

.boxEspaciosGrupos, .boxEspaciosAlumnos, .boxEspaciosDatosAlumno, .boxEspaciosMicro, .rightCol, .colBotons {
	padding-bottom:140px;
}


.tablaCurriculum, .tablaCriterio {
	width:100%;
}
.tablaCurriculum td, .tablaCurriculum th {
	width:20%;
	align-content: baseline;
	vertical-align:top;
}
.tablaCurriculum thead tr{
	font-size:12px;
	line-height:12px;
	text-align:center;
	border-bottom:1px solid var(--colorAdmin);
	color: var(--colorAdmin) !important;
	color:#fff;
}

.tablaCriterio td, .tablaCriterio th {
	align-content: start;
}

.tablaCurriculum th>div, .tablaCriterio th>div{
	border-radius:5px;
	border:1px solid #e6e6e6;
	background:#A8A59F;
	color:#fff;
	width:calc(100% - 4px);
	margin:0 2px;
	text-align:center;
	position:relative;
	height:40px;
	font-size:13px;
}
.tablaCriterio .tablaCriterioTit {
	border-radius:5px;
	/* border:1px solid #e6e6e6; */
	background:#A8A59F;
	color:#fff;
	margin:0px;
	text-align:center;
	position:relative;
	height:30px;
	font-size:12px;
	margin-bottom:5px;
}

.tablaCriterio .tablaCriterioTit>div {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
}

.tablaCriterio .tablaCriterioTitLeft>div {
	left: 10px;
    transform: translateY(-50%);
}

.tablaCriterio .tablaCriterioCampo {
	font-size: 14px;
    padding: 8px 8px;
    overflow: hidden;
    height: 33px;
    line-height: 20px;
}
.tablaCriterio .tablaCriterioCampo2 {
	height:auto;
	line-height: 15px;
	font-size: 13px;
}
.tablaCriterio .tablaCriterioCampoSeparador {
	height: 1px;
	background:#A8A59F;
	width:100%;
}


.tablaCriterio .row>* {
    padding-right: 2px;
    padding-left: 2px;
}

.tablaCurriculum button/* , .tablaCriterio button */ {
	border-radius:5px;
	border:1px solid #A8A59F;
	background:#f6f6f6;
	width:calc(100% - 10px);
	margin:3px 5px;
	text-align:center;
	position:relative;
	font-size:14px;
	padding:5px 2px;
	max-height:80px;
	overflow:hidden;
	color:#000;
	line-height: 15px;
}


.tablaCurriculum th>div>div, .tablaCurriculum td>div>div, .tablaCriterio th>div>div, .tablaCriterio td>div>div  {
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	position:absolute;
}

.tablaCriterio .inputContainer {
	width: 100% !important;
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    margin: 0px;
}

.tablaCriterio .active {
	background:#f6f6f6;
}

.tablaCriterio td div {
	margin: 0px 2px;
    padding: 0px;
    font-size: 14px;
    height: 40px;
    line-height: 21px;
}

.tablaCriterioAutoheight th{
	position:relative;
}

.tablaCriterioAutoheight td div {
	margin: 0px 2px;
    padding: 0px;
    font-size: 14px;
    height: auto;
    line-height: 14px;
}
.tablaCriterioAutoheight td{
	font-size:0.75em;
	line-height:1;
	padding:4px;
}

.tablaCriterio .inputContainer .input {
	font-size: 12px;
}

.tablaCriterio .colIco{
	padding:0;
	text-align:center;
}
.tablaCriterio .colIco button{
	margin: 0 2px;
	float: none;
	font-size: 12px;
	width: 28px;
	height: 28px;
	text-align: center;
}

.tablaCriterio textarea{
	overflow:hidden;
	resize: none;
	padding-top:5px;
}

.tablaCriterio .inputContainer:has(textarea) {
	height:auto!important;
}

#dataTable {
    table-layout: fixed;
    width: 100%;
}

.resizer {
	background-color: #e6e6e6 !important;
	cursor: ew-resize;
	width: 3px !important;
	height: 33px !important;
	position: absolute !important;
	right: -4px;
	top: -3px;
	border: 0 !important;
	border-radius: 0 !important;
	z-index:1010!important;
	transition: transform 0.3s ease-in-out;
}
.resizer:hover, .resizer:active {
	transform: scale(1.2);
	background-color:#A8A59F!important;
}

.truncate {
  white-space: nowrap; 
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 24px);
}
.label.truncate {
	max-width: calc(100% - 5px);
}

/* .tablaCriterio textarea:focus {
	height:150px!important;
	z-index:100;
	background:#fff;
	box-shadow:0 0 5px #666;
	border:3px solid var(--colorAdmin)!important;
	overflow-y:scroll;
} */

.boxGris {
	border:2px solid #A8A59F;
	border-radius:10px;
	padding:20px;
	width:100%;
	float:left;
}

.boxGris button {
	text-align:left;
	width:100%;
}

.boxGrisCol1 {
	float:left;
	width:calc(45% - 10px);
	margin-right:10px;
}
.boxGrisCol1 .customButton {
	width: 100%;
}

.boxGrisCol2 {
	float:left;
	width:calc(55% - 10px);
	margin-left:10px;
}

.bloqueTablaTit>div>div {
	background:#A8A59F;
	border-radius:5px;
	padding:5px;
	color:#fff;
	text-align:center;
	margin:0 5px;
	font-size: 14px;
}

.bloqueTablaLinea {
	clear:both;
}

.bloqueTablaLinea img {
	margin:5px;
	height:43px;
}

.msgInfo {
	width:100%;
	padding:10px;
	background:cornsilk;
	color:#333;
	border:1px solid #e6e6e6;
	border-radius:10px;
	margin:0 0 15px 0;
}

.heightAuto {
	height:auto!important;
	margin-bottom:5px!important;
}

.menuSm {
	display:none;
}

.textInfo {
	background: #fff;
    padding: 7px 15px;
    margin-bottom: 15px;
    border-radius: 10px;
	border:1px solid var(--colorTxt);
	color: var(--colorTxt);
    font-size: 15px;
}

.textInfoAlu {
	background: #fff;
    padding: 7px 15px;
    margin-bottom: 15px;
    border-radius: 10px;
    border: 1px solid #F14902;
    color: #F14902;
    font-size: 15px;
}

.textNoResults {
	background: #f6f6f6;
    padding: 5px 10px;
    margin-bottom: 15px;
    border-radius: 5px;
    color: #888;
    font-size: 13px;
}

.ampliarTextarea{
	position:fixed!important;
	width:25%!important;
	height:20%!important;
	z-index:10002!important;
	top:50%!important;
	left:50%!important;
	transform:translate(-50% , -50%)!important;
	background:#fff!important;
	font-size:14px!important;
	overflow-y:scroll!important;
	border: 1px solid #A8A59F!important;
	border-radius:0!important;
}

.modal {
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:#fff;
	opacity:40%;
	z-index:10000;
	display:none;
}

.modal-box 	{
	position:fixed;
	width:30%!important;
	height:40%!important;	
	top:50%!important;
	left:50%!important;
	transform:translate(-50% , -50%)!important;
	z-index:10001;
	display:none;
	width:max-content;
	width:130px;
	background:#fff;
	box-shadow:0 0 5px #666;
	border-radius:10px;
}

.modal-btn 	{
	width:130px;
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	bottom:15px;
	height:35px!important;
}
.modal-txt 	{
	width:85%;
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	top:10%;
}


/*reducir pantalla*/
.boxAlumnoMin {
	width:calc(10% - 10px);
}

.boxAlumnos5Min .adminTitle, .boxAlumnos4Min .adminTitle {
	padding-left: 85px;
	height: 45px;
}

.boxAlumnos5Min .adminTitleTxt, .boxAlumnos4Min .adminTitleTxt {
	padding-left: 90px;
	height: 31px;
	font-size: 18px;
}

.boxAlumnos5Min .adminTitle::before, .boxAlumnos4Min .adminTitle::before  {
	width: 85px;
}

.boxAlumnos5Min .adminTitImg>div:nth-child(1), .boxAlumnos4Min .adminTitImg>div:nth-child(1) {
    height: 45px;
    margin-right: 15px;
    width: 45px;
}
.boxAlumnos5Min .adminTitImg>div>img, .boxAlumnos4Min .adminTitImg>div>img {
    height: 45px;
}

.boxAlumnos5Min .boxAlumno {
	margin: 4px 2px 18px 2px;
	width:calc(16.6% - 4px);
}

.boxAlumnos4Min .boxAlumno {
	margin: 4px 2px 18px 2px;
	width:calc(20% - 4px);
}

.boxEspaciosMicroTxtMin {
	font-size: 17px!important;
    padding: 5px 10px!important;
    margin: 5px 0!important;
}


/*reducir pantalla espacios*/
.boxEspaciosMicroImgMin>div.boxEspaciosMicroImgBox{
	float: left;
	margin: 0px 5px;
	width:60px;
	height:60px;
	position:relative;
	overflow:hidden;
}
.boxEspaciosMicroImgMin>div.boxEspaciosMicroImgBox img{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
}

.boxEspaciosMicroImgMin>div.boxEspaciosMicroImgTxt{
	float: none;
	text-align: left;
	width: calc(100% - 115px);
	position: absolute;
	right: 25px;
	top: 50%;
	transform: translateY(-50%);
	font-size:17px;
}

a.boxEspaciosMicroImgMin2 {
	height:7vh;
}

.boxEspaciosMicroImgMin2>div.boxEspaciosMicroImgBox{
	float: left;
	margin: 0px 10px;
	height:100%;
	position:relative;
	overflow:hidden;
	aspect-ratio: 1 / 1;
}
.boxEspaciosMicroImgMin2>div.boxEspaciosMicroImgBox img{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
	height: 100%;
}

.boxEspaciosMicroImgMin2>div.boxEspaciosMicroImgTxt{
	float: none;
	text-align: left;
	width: calc(100% - 115px);
	margin-left: 10px;
	position: absolute;
	right: 25px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 19px;
	line-height: 1;
}


.boxEspaciosGruposImgMin {
	height: 50px!important;
}

.boxEspaciosGruposImgMin div{
	max-height:initial!important;
}

.boxEspaciosGruposImgMin div>div:nth-child(1) {
	height: 40px;
	width: 40px;
	float:left;
	overflow:hidden;
	position:relative;
}
.boxEspaciosGruposImgMin div img {
	position:absolute;
	height:40px;
	top:50%;
	left:50%;
	transform:translate(-50% , -50%);
}

.boxEspaciosGruposImgMin div>div:nth-child(2) {
	width: calc(100% - 45px);
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}

.boxEspaciosGruposImg2.boxEspaciosGruposImgMin div:nth-child(1) {
	position: absolute !important;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0 !important;
    left:3px;
}
.boxEspaciosGruposImg2.boxEspaciosGruposImgMin div:nth-child(2) {
	height:fit-content;
	font-size: 16px;
	width: calc(100% - 42px);
}

.imgAlumnoIcono:after {
	content:"\f252";
	font-family:"Font Awesome 5 Free";
	font-weight:bold;
	position:absolute;
	top:4px;
	right:5px;
	color:#A8A59F;
	font-size:10px;
}