/*text-shadow:0px 0px 20px rgba(0,0,0,0.1);
font-family: 'Open Sans', sans-serif;
font-family: 'Montserrat', sans-serif;
*/
* { margin: 0px; padding: 0px; }
.clear { clear: both; }

body { font-size: 1.2vw; font-family: 'Open Sans', sans-serif; line-height: 1.5em; font-weight: normal;}
.page { position: relative; width:100%; }
.centrado { width: 85%; left:50%; position: relative; transform: translate(-50%); max-width: 1250px; }
.centrado2 { width: 70%; left:50%; position: relative; transform: translate(-50%); max-width: 1100px; }

.centradomini { width: 55%; left:50%; position: relative; transform: translate(-50%); }

.yellow { color: #f0b80e; }
#logo { width: 8.7em; height: 8.7em; display: block; position: relative; margin: 0 auto; margin-top: 30px; }
#logo img { width: 100%; }

#loginbots { right: 0.5rem; top:1em; z-index: 20; position: fixed; display: flex;}
.respcol50 { float: left; width: 50%; }
.respcol33 { float: left; width: 33%; }

.headercol1 { background-color: #fff; font-weight: 600;}
.headercol2 { position: absolute; width: 50%; left:50%; height: 100%; z-index: 8; background-size: cover;}
.swiper-container-home { height: 100%; }
.swiper-head { width: 100%;  height: 100%;  background-color: #ff0000; background-size: cover; }
.pagfotos { bottom: 2em !important; }
.pagfotos  .swiper-pagination-bullet { margin: 0.2em; width: 1em !important; height: 1em !important; background-color: #000 !important; }

.pagreviews  .swiper-pagination-bullet { margin: 0.2em; width: 1em !important; height: 1em !important; background-color: #007aff !important; }

.pad1 { padding: 2em; }
.padh { padding: 0px 4em; }
.padh2 { padding: 0px 8em; }

.headercol1 h1 { font-weight: 900; font-size: 3.2em; line-height: 0.9em; width: 100%; }
.headercol1 h2 { font-weight: 100; font-size: 1.2em; line-height: 1em; padding-bottom: 0.3em; font-style: italic; }
.headercol1 p { width: 100%; }
.latri { position: absolute; width: 1.7em; height: 100%; background-image: url(../img/trii.png);
	background-size: 100% 100%; background-repeat: no-repeat;  left: -0.2em; z-index: 19;
 }

.profe { position: relative; }
.profeimg { display: inline-block; position: relative; vertical-align: middle; 
	border-radius: 80px; width: 5em; height: 5em; background-size: cover;  }
.profeimg img { width: 100%; }
.profedesc { display: inline-block; vertical-align: middle; font-style: italic; margin-left: 0.5em; line-height: 1.2em;
	font-weight: 100;
 }
.adobebadge { position: absolute; width: 1em; height: 1em; background-image: url(../img/home/icons/Adobe.svg); 
	background-size: cover; right: 0em; }
.linesep { width: 40%; height: 3px; background-color: #bbb; }
.totalumnos { position: relative; padding: 2em; padding-left: 3.8em; background-image: url(../img/home/students.svg);
	background-size: 2.8em; background-repeat: no-repeat; background-position: left center;
 }

.totalumnoscalendar { position: relative; padding: 2em; padding-left: 3.8em; background-image: url(../img/calendar-icon.png);
	background-size: 2.8em; background-repeat: no-repeat; background-position: left center;
 }

.totalumnosreloj { position: relative; padding: 2em; padding-left: 3.8em; background-image: url(../img/clock_icon.png);
	background-size: 2.8em; background-repeat: no-repeat; background-position: left center;
 }

.totmodalidad { position: relative; padding: 2em; padding-left: 3.8em; background-image: url(../img/megaphone.svg);
  background-size: 2.8em; background-repeat: no-repeat; background-position: left center;
 }

.botonpvp { position: relative; border-radius: 4em; display: inline-block; 
	cursor: pointer; font-size: 1.3em; font-weight: bold; transition: all 0.3s;
	box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.2);  
	background:  linear-gradient(to bottom, #feda48, #fb7396 100%); 
	text-decoration: none; color: inherit;
	}
.botonpvp:hover {background:  linear-gradient(to bottom, #feda48, #feda48 100%); color:#000; }	

.botonpvp span { display: inline-block; padding: 1.4em 1.8em; }
.botonpvp img { display: inline-block; width: 1.1em; vertical-align: middle; margin-top: -0.2em; }
.botonpvp span:last-child { border-left: 1px solid rgba(0, 0, 0, 0.2); font-weight: 400; }
.botonpvp del { opacity: 0.5; }

.boton { position: relative; border-radius: 4em; display: inline-block; 
	cursor: pointer; font-size: 1em; font-weight: bold; padding: 1.2em 2em;
	background-color: #f0b80e; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.2); 
	background:  linear-gradient(to bottom, #feda48, #fb7396 100%);
	text-decoration: none; color: inherit;
}
.boton img { display: inline-block; width: 1em; vertical-align: middle; margin-right: 0.6em; }
.loginbot { background:  linear-gradient(to bottom, #000, #000 100%); color:#fff; margin: 0.5rem; }
.loginbot a { background:  linear-gradient(to bottom, #000, #000 100%); color:#fff; }

.regbot { margin: 0.5rem;  }
.boton span { display: inline-block; vertical-align: middle; }
.boton:hover {background:  linear-gradient(to bottom, #feda48, #feda48 100%); color:#000; }	

.loginbot:hover {background:  linear-gradient(to bottom, #000, #000 100%); color:#fff; }	


h1 { line-height: 1em; font-size: 2.6em; }
h3 { font-weight: 100; line-height: 1em; margin:0.3em 0; }
h4 { font-size: 1.5em; font-weight: 600; line-height: 1em; margin:0.3em 0; }
h5 { font-size: 1.2em; font-weight: 600; line-height: 1em; margin:0em 0; }

.totalcol { width: 32.5%; display: inline-block; vertical-align: middle; text-align: center; line-height: 1.1em; font-size: 19px; }
.totalcol strong {  font-size: 4em; display: block; line-height: 1em; white-space: nowrap; }
.totalcolpad { padding: 20px; display: block; }
.totalcol:first-child { border-right: 1px solid #fff; }
.totalcol:last-child { border-left: 1px solid #fff; }
.totalcol strong img { display: inline-block; width: 48px; }
.totalcol:last-child strong { color: #f0b80e; }

.videodiv { width: 85%; left:50%; transform: translate(-50%); position: relative; }
.razonescol { text-align: center; font-weight: 100; position: relative;}
.razonesimg { width: 6em; background-color: #111420;  position: absolute; left:50%; transform: translateX(-50%); top:-1.5em; }
.razonesimg img { width: 80%; }
.razonescol p { padding-top: 0.5em; }
.razonespad { margin: 1em 1em; padding: 3em; border: 1px solid #999; border-radius: 2em; }

.profetxt { width: 70%; }
.profetxt p { width: 65%; }
.profebadge { display: inline-block; width: 4em; margin-left: 0em; }
.profesuperimg { position: absolute;  right: -2em;  height: 80%; bottom: -1em; }

.rrssicon { width: 1.8em; display: inline-block; margin-right: 0.5em; text-decoration: none;}
.rrssicon img { width: 100%; }

.swiper-container-works { height: 300px; }
.swiper-reviews { height: 300px !important; }
.swiper-work { width: 20%; top: 0px;  height: 100%;  background-color: #ff0000; background-size: cover; background-position: top center; }
.pagworks { bottom: 2em !important; }
.pagworks  .swiper-pagination-bullet { margin: 0.2em; width: 0.5em !important; height: 0.5em !important; background-color: #fff !important; }

.faqcol h2 { font-size: 1.2em; margin-bottom: 0.5em; }

.footer { width: 100%; background-color: #000; color: #fff; font-size: 0.7em; padding: 1em 0px; line-height: 1.8em; padding-top: 1em; position: relative;

 }
.footerlogo { display: inline-block; vertical-align: middle; width:8.5em; }
.footercurso { display: inline-block; vertical-align: middle; width:10em; margin-left: 0.5em;
	font-size: 2em; font-weight: 900; line-height: 1.05em;
 }
.footercurso small { font-size: 0.7em; display: block; font-weight: 100; font-style: italic; }
.footcol { float: left; }
.footcol1 {  }
.footcol a { color:inherit; text-decoration: none; }

.footcol2, .footcol3 { float: right !important; padding: 0px 2em;  }
.pagepvp { width: 100%;  position: absolute; top:-6em; color:#000; padding: 4em 5em; background-color: #f0b80e;
	width: 65%; left:50%; transform: translate(-50%); max-width: 1250px; border-radius: 4em;
	font-size: 1.2em;
  }
 .pagepvp h1 { font-weight: bold; font-size: 2.6em; line-height: 1em; margin-bottom: 0.12em; }
  .pagepvp h2 { font-weight: 100; font-size: 1.6em;}

.pagepvp #loginbots { top:50%; right: 4em; transform: translateY(-50%); font-size: 1.4em; }

.pagepvp .regbot { background:  linear-gradient(to bottom, #fff, #fff 100%); color: #000; }
.regbot a { color: #000; }
/*Temario*/

#temariospage .centrado { z-index: 2 !important;  }
.bacbotdiv { position: absolute; bottom:0px; height: 10em; width: 100%; z-index: 1; }

/* TEMARIO */
.capitulos { display: flex; flex-direction:row; flex-wrap: wrap; }
.tem_capitulo { width: 23%; position: relative; background-color: #fff;
	  position: relative;
 margin:0.8%; border-radius: 2em; box-shadow: 5px 5px 50px rgba(0, 0, 0, 0.2); }
.tem_pad { padding: 1em 2em 2em 2em; padding-bottom: 2em;}
.tem_par { box-shadow: none; }
.tem_cap_img { width: 100%; height: 0px; padding-top: 50%; 
	background-size: cover; background-position: center;
	position: relative; border-top-left-radius: 2em; border-top-right-radius: 2em;}
.tem_capitulo h2 { font-size: 1.8em; line-height: 1em; margin-bottom: 0.3em; }
.tem_capitulo h3 { font-size: 1.5em; }
.tem_capitulo p {     position: relative;
    display: block;
    font-size: 1em;
    line-height: 1.45em;
    font-style: normal;
    opacity: 1;}
.tem_tot_lecciones { font-size: 1.2em; padding: 0.7em; padding-left: 2em; padding-top: 1em; background-image: url(../img/home/icon_lesson.svg);
	background-repeat: no-repeat; background-position: left 55%; background-size: 1.5em;
 }
.tem_leccion { padding: 0.4em; border-bottom: 1px dashed #999; font-size: 0.9em; }
.tem_lessdur { float: right; }
.tem_leccion strong { display: inline-block; margin-right: 0.6em; vertical-align: top; }
.tem_lesstxt { display: inline-block; width: 100%;vertical-align: top; }

.temabot { padding: 1em 0px; width: 100%; color:#000; background-color: #d8af48;
	text-align: center; border-radius: 2em; font-weight: bold; font-size: 1.1em;
	transition: all 0.4s;
	box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.2); cursor: pointer;
 }
.temabot:hover { background-color: #fff; background-position: 1.2em center;}

.temasel .tema_moreinfo { display: block;  }
.temasel .tema_foto img { display: block; }

/* ZOOM Y VIDEO */
.fotoampli { max-width: 100%; }
#zoom_content { width: 90%; left:50%; position: absolute; transform: translateX(-50%);  }
#zoom { display:none; z-index:99999;  }
#fancyback { position:fixed; width:100%; height:100%; top:0px; left:0px; background-color:#000; opacity:0; display:none; z-index:997; }

#videoback { position: fixed; width: 100%; left:0%; top: 0%; height: 100%; background-color: rgba(0, 0, 0, 0.8);
z-index: 9; display: none; }
#videocont { position: fixed; width: 68%; left:50%; top: 50%; height: 0px; padding-top: 38.3%;
	background-color: #000;z-index: 9; box-shadow: 5px 5px 45px rgba(0, 0, 0, 0.5);display: none;
 transform: translateX(-50%) translateY(-50%); }
 #videocont iframe { position: absolute; top:0px; width: 100%; }
.videoclose { position: absolute; width: 3em; right: -3em; top:0px; cursor: pointer; }
.videoclose img { width: 100%; }
.botplay { position: absolute; left:50%; top: 50%; height: 4em; width: 4em; opacity: 0.5;
 transform: translateX(-50%) translateY(-50%); cursor: pointer; display: block;  }
.botplay img { width: 100%; }
.botplay:hover { opacity: 1 }
.star { width: 25px; }
.fila1-review { background-image: url(../img/google_logo.png); background-size: 1.5em; background-repeat: no-repeat; background-position-x: 100%; padding-bottom: 10px; }
.bloque-nombre-reviewer { width: 70%; float: left; background-size: 40px; background-repeat: no-repeat; height: 40px; }
.reviewer-name { padding-left: 40px; }
.bloque-tiempo-reviewer { width: 30%; float: right; text-align: right; }
.bloque-review { padding-left: 20px; padding-right: 20px; }
.fila2-review { height: 40px;  }
.fila3-review {
    font-size: 15px;
    line-height: 20px;
}
.logo_payment_error {
    width: 30%;
    display: block;
    position: relative;
    margin: 0 auto;
}

.modal {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 100%;
}
.modal[open] {
  display: flex;
}
.model-inner {
  background-color: transparent;
  border-radius: 0.5em;
  max-width: 1000px;
  padding: 0;
  margin: auto;
}
.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid black;
}
#modal-overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
  background-color: black;
  opacity: 0.5;  
}

.boton222:hover {
    background: linear-gradient(to bottom, #feda48, #fb7396 100%);
}