[v-cloak] {
  display: none;
}
.title{
    color: #202020 !important;
}
/* ESTILOS PAGINAS SIN SVG */
ul.pagination .page-item{
  color: #202020;
  width: 30px;
  height: 30px;
  justify-content: center;
  align-items: center;
}
ul.pagination .page-item .page-link{
  margin: auto;
}
ul.pagination .page-item.active{
  background-color : #699E3F;
  border-radius: 50px;
  color : #FFF !important;
}
.indexBox{
  border-radius : 0;
  box-shadow: none !important;
  padding: 20px;
}

.escalaCard-image{
  transition: 0.2s;
  width: 100%;
  border: 1px solid #707070;
  margin-bottom: 13px;
  background-size: cover;
  background-position: center;
  background-repeat : no-repeat;
  overflow: hidden;
}
.escalaCard-icon{
  /* width: 482px; */
  display:block;
  margin: 0 auto 13px auto;

}
.escalaCard-title{
  color : #202020;
  font-weight: bold;
  font-size: 1.5rem;
  margin-bottom: 8px;
}
.escalaCard-subtitle{
  color : #202020;
  font-size: 1rem;
}
.escalaCard{
  transition: 0.5s;
  vertical-align: top;
  border: 4px solid #686868;
  /* min-height: 456px; */
  background-color: white;
  box-shadow: 0px 3px 10px #00000029;
}
.verMasCurso{
  transition: 0.2s;
  cursor: pointer;
  color :#FFF;
  font-weight: bold;
  font-size: 1rem;
  float:right;
}
.escalaCard:hover .verMasCurso{
  color :#19BAB2;

}
/* ESTILOS HOME: HECHOS CON SVG */
html, body {
    background-color: #fff;
    color: #636b6f;
    font-family: 'Lato', sans-serif !important;
}
svg foreignObject * {
  position:static !important;
}
.footer{
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.navbar a, .navbar span{
  color : #202020;
}
.dropdown-trigger span{
  font-family: 'Lato', sans-serif !important;
}
#menuPerfil .button.is-focused:not(:active), #menuPerfil .button:focus:not(:active){
  box-shadow: none !important;
}
.navbar a.verdeColor, .navbar a:hover, .navbar span.active:hover{
  color : #699E3F;
}

@media screen and (min-width: 1024px){
  #menuPerfil #dropdown-menu .navbar-item{
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
  #menuPerfil #dropdown-menu .navbar-item a{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  #menuPerfil #dropdown-menu .dropdown-content{
    border-radius: 0px !important;
    border: 1px solid #686868;
  }
}
.navbar a.active, .navbar span.active{
  border-bottom: 3px solid #699E3F;
}
.contactBtn, .btnEscala{
  color: white !important;
  transition: 0.1s;
  background-color: #19BAB2;
  font-weight: bold;
  border-radius: 25px;
  border: 4px solid #19BAB2;
  padding: 5px 15px;
  cursor: pointer;
  font-family: 'Lato', sans-serif;
}
.contactBtn:hover{
  color: #19BAB2 !important;
  background-color: white;
}
.navbarTransparent{
  background-color: transparent;
}
.navbarBlanco{
  background-color: #FFF;
  box-shadow: 0px 1px 10px #0000001A;
}
.title-intro{
  color: #202020;
  font-size: 70px;
  font-weight: 900;
}
.subtitle-intro{
  margin-top:20px !important;
  color: #202020;
  font-size: 30px;
}
.title-agenda{
  color: #202020;
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 0px;
}
svg .escalaCard-image{
  transition: 0.2s;
  width: 482px;
  height: 247px;
  border: 1px solid #707070;
  margin-bottom: 13px;
  background-size: cover;
  background-position: center;
  background-repeat : no-repeat;
  overflow: hidden;
}
.escalaCard-innerImage{
  transition: 0.2s;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat : no-repeat;
}
.escalaCard:hover .escalaCard-innerImage{
  /* background-size: 115% 115%; */
  /* margin-top: -7.5%; */
  margin-left: -7.5%;
  width: 115%;
  height: 115%;
}
svg .escalaCard-icon{
  /* width: 482px; */
  display:block;
  height: 180px;
  margin: 0 auto 13px auto;

}
svg .escalaCard-title{
  color : #202020;
  font-weight: bold;
  font-size: 30px;
  margin-bottom: 8px;
}
svg .escalaCard-subtitle{
  color : #202020;
  font-size: 23px;
}
svg .escalaCard{
  transition: 0.5s;
  vertical-align: top;
  border: 4px solid #686868;
  min-height: 456px;
  background-color: white;
  box-shadow: 0px 3px 10px #00000029;
}
svg .verMasCurso{
  transition: 0.2s;
  cursor: pointer;
  color :#FFF;
  font-weight: bold;
  font-size: 20px;
  float:right;
}
svg .escalaCard:hover .verMasCurso{
  color :#19BAB2;

}
svg .servicios-container .escalaCard, .materias-container .escalaCard{
  width: 388px;
  display:inline-block;
}
svg .cursos-container .escalaCard{
  width: 534px;
  min-height: 553px;
  display:inline-block;
}
svg .escalaCard:not(:last-child){
  margin-right:50px;
}
svg .escalaBox{
  min-height: 111px;
  width: 100%;
  display:block;
  padding: 25px;
  margin-top: 20px;
  background-color: #FFF;
  border: 4px #686868 solid;
}
#materias .escalaBox a{
  color: #19BAB2;
  float: right;
  font-size: 23px;
}
svg .escalaBox .valor-text{
  text-align: left;
  font-size: 30px;
  letter-spacing: 0px;
  color: #202020;
  line-height: 36px;
}
svg .escalaBox .tipo-text{
  text-align: left;
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 0px;
  color: #699E3F;
  line-height: 36px;
}
svg .escalaBox .nombre{
  color : #202020;
  font-size: 23px;
  font-weight: bold;
}
svg .escalaBox .fecha{
  color : #202020;
  font-size: 23px;
}
svg .materias-text{
  margin-top: 15px;
  color: #353535;
  font-size: 23px;
}
svg .materias-container .escalaCard{
  transition: 0.5s;
  vertical-align: top;
  border: 4px solid #686868;
  min-height: 286px;
  background-color: white;
  box-shadow: 0px 3px 10px #00000029;
}
svg .escalaCard-table{
  width: 100%;
  min-height: 286px;

}
svg .escalaCard-table tr:not(:last-child){
  border-bottom: 1px solid #F1F1F1;
}
svg .escalaCard-table td{
  vertical-align: middle;
  padding: 0 1.5rem;
  height: calc(100% / 6);
}
svg .materia-anio{
  color: #353535;
  font-size: 23px;
  text-align: right;
  margin-top: auto;
  float:right;
}
svg .materia-nombre{
  color : #353535;
  font-size: 23px;
  font-weight: bold;
  margin-top: auto;
}
svg .btnServicios{
  cursor: pointer;
  transition: 0.5s;
  min-width: 336px;
  min-height: 50px;
  border: 3px solid #19BAB2;
  border-radius: 29px;
  color : #19BAB2;
  font-weight: bold;
  font-size: 23px;
  text-align: center;
  padding-top: 6px;
  padding-bottom: 6px;
  margin-top: 20px;
  background-color: #FFF;
  vertical-align: bottom;
}
.footer ul, .footer a{
  color : #686868;
  /* font-size : 23px; */
}
.footer .ulHeader{
  font-weight: bold;
  color: #202020;
}
.servicios-container .escalaCard:hover{
  margin-top: 2px !important;
}
.servicios-container .escalaCard:hover .btnServicios{
  color : #FFF;
  background-color: #19BAB2;
}
.formEscala .label{
  text-align: left;
  color : #686868;
}
.formEscala input{
  transition: 0.2s;
  color : #202020;
  background-color: transparent;
  border-top : 0px !important;
  border-left : 0px !important;
  border-right: 0px !important;
  box-shadow: none !important;
  border-radius: 0px !important;
  border-bottom : 2px #D6D6D6 solid !important;
}
.formEscala input:focus, #formContacto input:focus, #formContacto textarea:focus, #formContactoMobile input:focus, #formContactoMobile textarea:focus{
  border-top : 0px;
  border-left : 0px;
  border-right: 0px;
  box-shadow: none;
  border-bottom : 2px #D6D6D6 solid;
}
#formContacto .label{
  text-align: left;
  color : #686868;
  font-size: 23px;
}
#formContacto input, #formContacto textarea{
  color : #202020;
  background-color: transparent;
  font-size: 30px;
  border-top : 0px !important;
  border-left : 0px !important;
  border-right: 0px !important;
  box-shadow: none !important;
  border-bottom : 2px #D6D6D6 solid !important;
}
.tituloCursos{
  margin: 20px 5%;
}
@media screen and (min-width: 1024px){
  /* Estas lineas son unicamente para alinear el contenido del navbar y el contenido del footer con el contenido de los SVGs */
  #navHeader{
    min-height: 68px;
    transition: 0.2s;
  }
  .container{
    max-width: 88.4375% !important;
  }
  footer{
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  footer.footer .contenido{
    padding: 0px 5.78125%;
  }
}
  .cuadriculadoMobile .a,.cuadriculadoMobile .b{fill:none;stroke:#d6d6d6; stroke-width:0.5px;}
  .cuadriculadoMobile .b{stroke-linecap:square;}
  #cuadriculado .a,#cuadriculado .b{fill:none;stroke:#d6d6d6;stroke-width:1px;}
  #cuadriculado .b{stroke-linecap:square;}
  #trianguloVerde{fill:#d3ffb1;}
  #trianguloGris{fill: #D6D6D6;}
  #resta{fill:none;stroke:#d6d6d6;stroke-width:25px;}
  #division .a,#division .b, #division .c{stroke:#d6d6d6;}
  #division .a{stroke-width:25px;}
  #division .b{fill:#d6d6d6;}
  #suma .a{fill:none;stroke:#d6d6d6;stroke-width:25px;}
  #multiplicar .a{fill:none;stroke:#699e3f;stroke-width:25px;}
  #logoSVG .a{fill:#202020;}
  #logoSVG .b{fill:#699e3f;}
  #logoSVG .c{fill:#19bab2;}
  #logoSVGfooter .a{fill:#699e3f;}
  #logoSVGfooter .b{fill:#699e3f;}
  #logoSVGfooter .c{fill:#699e3f;}
  .sectionTitle{
    font-size: 70px;
    font-weight: 900;
    line-height: 84px;
    color : #686868;
    letter-spacing: 21px;
  }
  .sectionSubtitle{
    margin-top : 10px;
    line-height: 36px;
    font-size: 30px;
    letter-spacing: 0px;
    color: #686868;
  }
#imgMarco .a,#imgMarco .c{fill:none;}
#imgMarco .a{stroke:#699e3f;stroke-width:25px;}
#imgMarco .b{stroke:none;}
#imgMarco.d{filter:url(#a)}
.cuadriculadoMaterias .a,.cuadriculadoMaterias .b{fill:none;stroke:#d6d6d6;stroke-width:1px;}
.cuadriculadoMaterias .b{stroke-linecap:square;}
#recuadroAgenda,#recuadroAgenda .c{fill:none;}#recuadroAgenda{stroke:#699e3f;stroke-width:25px;}#recuadroAgenda .b{stroke:none;}
#cuadriculadoCursos .a, #cuadriculadoCursos .b{fill:none;stroke:#d6d6d6;stroke-width:1px;}
#cuadriculadoCursos .b{stroke-linecap:square;}
.hero-body{
  padding: 0px;
}
#rectContacto,#rectContacto .c{fill:none;}
#rectContacto{stroke:#699e3f;stroke-width:25px;}
#rectContacto .b{stroke:none;}
#imgMarcoMobile,#imgMarcoMobile .c{fill:none;}
#imgMarcoMobile{stroke:#699e3f;stroke-width:10px;}
#imgMarcoMobile .b{stroke:none;}
#restaMobile{fill:none;stroke:#d6d6d6;stroke-width:10px;}
#divisionMobile .a,#divisionMobile .d{fill:none;}#divisionMobile .a,#divisionMobile .b{stroke:#d6d6d6;}#divisionMobile .a{stroke-width:10px;}#divisionMobile .b{fill:#d6d6d6;}#divisionMobile .c{stroke:none;}
#sumaMobile .a{fill:none;stroke:#d6d6d6;stroke-width:10px;}
#multiplicarMobile .a{fill:none;stroke:#699e3f;stroke-width:10px;}
/* HOME MOBILE */
@media screen and (max-width: 1024px){
  svg .verMasCurso{
    transition: 0.2s;
    cursor: pointer;
    color :#FFF;
    font-weight: bold;
    font-size: 12px;
    float:right;
  }
  .servicios-container .escalaCard:hover{
    margin-top: 0px !important;
  }
  .sectionTitle{
    font-size: 30px;
    font-weight: 900;
    line-height: 36px;
    color : #686868;
    letter-spacing: 9px;
  }
  .sectionSubtitle{
    margin-top : 10px;
    line-height: 22px;
    font-size: 18px;
    letter-spacing: 0px;
    color: #686868;
  }
  svg .escalaCard-icon{
    /* width: 482px; */
    display:block;
    height: 180px;
    margin: 0 auto 13px auto;

  }
  svg .escalaCard-title{
    color : #202020;
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 5px;
  }
  svg .escalaCard-subtitle{
    color : #202020;
    font-size: 15px;
  }
  svg .escalaCard{
    transition: 0.5s;
    vertical-align: top;
    border: 2px solid #686868;
    min-height: 353px;
    background-color: white;
    box-shadow: 0px 3px 10px #00000029;
  }
  svg .btnServicios{
    cursor: pointer;
    transition: 0.5s;
    min-width: 150px;
    min-height: 37px;
    border: 2px solid #19BAB2;
    border-radius: 22px;
    color : #19BAB2;
    font-weight: bold;
    font-size: 15px;
    text-align: center;
    padding-top: 9px;
    padding-bottom: 9px;
    margin-top: 10px;
    background-color: #FFF;
    vertical-align: bottom;
  }
  svg .escalaCard{
    margin:0px;
  }
  svg .servicios-container .escalaCard{
    margin-left:20px;
    margin-right: 0px;
  }
  svg .cursos-container .escalaCard{
    width: 320px;
    min-height: 353px;
    display:inline-block;
  }
  svg .escalaCard-image{
    transition: 0.2s;
    width: 290px;
    height: 149px;
    border: 1px solid #707070;
    margin-bottom: 13px;
    background-size: cover;
    background-position: center;
    background-repeat : no-repeat;
    overflow: hidden;
  }
  svg .materias-container .escalaCard{
    transition: 0.5s;
    vertical-align: top;
    border: 2px solid #686868;
    min-height: 308px;
    background-color: white;
    box-shadow: 0px 3px 10px #00000029;
  }
  svg .escalaCard-table{
    width: 100%;
    min-height: 308px;

  }
  svg .escalaCard-table tr:not(:last-child){
    border-bottom: 1px solid #F1F1F1;
  }
  svg .escalaCard-table td{
    vertical-align: middle;
    padding: 0 1.5rem;
    height: 10%;
  }
  svg .materia-anio{
    color: #353535;
    font-size: 15px;
    text-align: right;
    margin-top: auto;
    float:right;
  }
  svg .materia-nombre{
    color : #353535;
    font-size: 15px;
    font-weight: bold;
    margin-top: auto;
  }
  svg .materias-text{
    margin-top: 7px;
    color: #686868;
    text-align: left;
    letter-spacing: 0px;
    line-height: 18px;
    font-size: 15px;
  }
  .title-agenda{
    color: #202020;
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
    letter-spacing: 0px;
  }
  svg .escalaBox{
    min-height: 69px;
    width: 100%;
    display:block;
    padding: 14px;
    margin-top: 10px;
    background-color: #FFF;
    border: 3px #686868 solid;
  }
  #materias .escalaBox a{
    color: #19BAB2;
    float: right;
    font-size: 15px;
  }
  svg .escalaBox .nombre{
    color : #202020;
    font-size: 15px;
    font-weight: bold;
  }
  svg .escalaBox .fecha{
    color : #202020;
    font-size: 15px;
  }
  svg .escalaBox .valor-text{
    text-align: left;
    font-size: 18px;
    letter-spacing: 0px;
    color: #202020;
    line-height: 32px;
  }
  svg .escalaBox .tipo-text{
    text-align: left;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0px;
    color: #699E3F;
    line-height: 32px;
  }
  #formContactoMobile .label{
    text-align: left;
    color : #686868;
    font-size: 12px;
  }
  #formContactoMobile input, #formContactoMobile textarea{
    color : #202020;
    background-color: transparent;
    font-size: 15px;
    border-top : 0px !important;
    border-left : 0px !important;
    border-right: 0px !important;
    box-shadow: none !important;
    border-bottom : 2px #D6D6D6 solid !important;
  }
}
@media screen and (max-width: 768px){
  .navbarTransparent{
    background-color: #FFF !important;
  }
  .logoHeader{
    padding-left: 1.5rem;
  }
  .tituloCursos{
    margin: 20px 0 !important;
  }
  .burgerMenu{
    margin-right: 0.25rem;
  }
}

.animCirculo{
  animation-name: circulo;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@keyframes circulo {
  0%   {transform: translate(0px, 0px);}
  25%  {transform: translate(0px, 30px);}
  50%  {transform: translate(0px, 15px);}
  75%  {transform: translate(0px, -15px);}
  100% {transform: translate(0px, 0px);}
}
