/* Estilos RESET para limpiar los CSS por default*/
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, font, 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 {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1.2;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

/* No olvides definir estilos para focus */
:focus {
  outline: 0;
}

/* No olvides resaltar de alguna manera el texto insertado/borrado */
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}

/* En el código HTML es necesario añadir cellspacing="0" */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Fin de estilos RESET */

/* Fuentes */
@font-face {
  font-family: 'Mulish Regular';
  font-style: normal;
  src: local("Mulish"), url("../fonts/mulish/Mulish-Regular.ttf");
}

@font-face {
  font-family: 'Mulish Semibold';
  font-style: normal;
  src: local("Mulish Semibold"), url("../fonts/mulish/Mulish-SemiBold.ttf");
}

@font-face {
  font-family: 'Mulish Bold';
  font-style: normal;
  src: local("Mulish Bold"), url("../fonts/mulish/Mulish-Bold.ttf");
}

@font-face {
  font-family: 'Mulish Black';
  font-style: normal;
  src: local("Mulish Black"), url("../fonts/mulish/Mulish-Black.ttf");
}

/*Estilos generales*/
* {
    -webkit-transition: all .3s linear !important;
    -moz-transition: all .3s linear !important;
    -ms-transition: all .3s linear !important;
    -o-transition: all .3s linear !important;
    transition: all .3s linear !important;
}

:root{
  --dark-color:#272727;
  --white-color:#ffffff;
  --mainblue-color:#2A2559;
  --maingold-color:#837531;
  --maingrey-color:#5c5c61;
  --lightgrey-color:#ececec;;
  --lightblue-color:#cacaeb;
}

body{
  background-color: var(--lightgrey-color);
  font-family: 'Mulish Regular';
}

.bg_mainblue{
  background-color: var(--mainblue-color); 
 }

 .bg_maingold{
  background-color: var(--maingold-color); 
 }

 .bg_maingrey{
  background-color: var(--maingrey-color); 
 }

 .color_blue{ 
  color: var(--mainblue-color); 
 }

 .color_white{ 
  color: var(--white-color); 
 }

 .color_gold{ 
  color: var(--maingold-color); 
 }

 .color_grey{ 
  color: var(--maingrey-color); 
 }

h1,h2,h3,h4,h5,h6{
  font-family: 'Mulish Bold';
  text-decoration: none;
  margin-bottom: 0;
}

a,p{
  font-family: 'Mulish Regular';
  text-decoration: none;
  margin-bottom: 0;
}

a{ 
  color: var(--mainblue-color);
}

.principal_container{
  margin-top: 7rem;
  background-color: var(--white-color);
  min-height: 60vh;
}

/* Header estilos */
header{
  box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.40);
  -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.40);
  -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.40);
  z-index: 99;
  position: fixed;
  width: 100%;
  background-color: var(--white-color);
  top:0;
}

.header_container_main{
  min-height: 7rem;
  position: relative;
}

.tepjf_logo{
  min-height: 4.5rem;
}

.icons_socialmedia img{
  height: 1.6rem;
}

.icons_socialmedia a:first-child img{
  height: 2rem;
}

.icons_socialmedia img:hover{
  filter: brightness(1.2);
  transform: scale(1.1);
}

.icons_socialmedia .icon_modo_accesible{
  height: 2rem;
}
/* navigation sección estilos */

.nav-section-general .navbar{
  background-color: #24135F;
  padding: 0;
}

.nav-section-general .navbar .nav-link{
  color: white;
}

.nav-section-general .navbar .nav-item{
  border-left: 1px solid rgba(255, 255, 255, 0.555);
  padding: .2em .3em;
}

.nav-section-general .navbar .nav-item:last-child{
  border-right: 1px solid rgba(255, 255, 255, 0.555);
}

.nav-section-general .navbar .nav-item:hover{
  background-color: #3e2f75;
}

/*NAVBAR LATERAL*/

.btn-flecha[aria-expanded="true"] svg {
  transform: rotate(90deg);
 
}
.btn-flecha[aria-expanded="true"] {
  background-color: #69294c;
}
.btn-flecha:hover{
  background-color: #69294c;
}
/*fin NAVBAR LATERAL*/

/*NAVEGADOR INFERIOR*/
.navbar-toggler-icon{
  background-image: url(../images/menu.svg);
  width: 5rem;
  height: 5rem;
  border: #fff solid .3rem;
  border-radius: 20rem;
  -webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
  box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
  animation: mymenu 2s infinite;
  transition: all ease 1s;
}
@keyframes mymenu{
  0% {}
  50% {
      scale: .8;
      opacity: .9;
    }
  100% {}
}
.fixed-menu{
  position: fixed;
  left: 0;
  top: 12rem;
  right: 0;
  z-index: 1030;
}
.navbar-toggler{
  border: none;
}
.navbar-toggler:focus {
  box-shadow: none
}

.text-bg-purple {
  color: #fff!important;
  background-color: #612670;
}
/* FIN navigation sección estilos */

/*NOTICIAS HEADER*/
.slide-novedades{
  margin-top: 0.2rem;
  text-align: center;
  align-items: center;
  display: flex;
}
.carousel-control-next-icon{
  background-image: url(../images/next-nov.svg);
  rotate: 180deg;
}
.carousel-control-prev-icon{
  background-image: url(../images/next-nov.svg);
}
.carousel-control-next, .carousel-control-prev {
  width: 10%;
  background-color: transparent;
  border: none;
}
.tamano-icon-nav{
  width: 1.4rem;
  height: 1.4rem;
}
.texto-novedades{
  padding-left: 1rem;
  padding-right: 1rem;
  color: #fff;
  font-size: 14px;
}
/*fin NOTICIAS HEADER*/
/*FIN Header estilos */

/*BANNER*/
/* .marg-sup{
  margin-top: 11rem;
}
.banner{
  height: calc(100vh - 0rem);
  width: 100%;
  object-fit: cover;
  object-position: right;
}
.img-ban-responsivo-1{
  object-fit: cover;
  object-position: center;
  height: calc(100vh - 4rem);
  width: 100%;
}
.carousel-inner{
  margin-bottom: -5px;
}
.ocultarBanMovil{
  display: none;
}
.mostrarBanEscritorio{
  display: inherit;
} */
/*fin BANNER*/
/*CAPACITACION*/
.iconos-capacitacion{
  width: 3rem;
  height: 3rem;
  margin-right: 1rem;
}
.bg-gris2{
  background-color: #E0E0E0;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-bottom: 1rem;
  padding-top: 1rem;
  margin-bottom: 1rem;
  margin-top: 1rem;
  border-radius: 3rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.bg-gris2:hover .iconos-capacitacion{
  width: 4rem;
  height: 4rem;
}
.bg-gris2:hover{
  cursor: pointer;
  background-color: var(--lightblue-color);
}
.bg-gris2 [aria-expanded="true"]{
  background-color: var(--lightblue-color);
}
/*fin CAPACITACION*/

/* footer */

footer{
  font-family: 'Mulish Semibold';
  line-height: 1.3rem;
}

.footer_section{
  background-color: var(--lightgrey-color);
  position: relative;
  z-index: 3;
}

.footer_data p, .footer_data a{
  color: var(--black-color);
  font-size: .9rem;
}

.footer_data a:hover{
  text-decoration: underline;
  color: var(--maingold-color);
}
 .bg-btn-carrusel{
  background-color: #69294c;
  width: 4rem;
  height: 2rem;
  border-radius: 5rem;
 }

/* FIN footer */

/*video tiktok*/

.iframe_container {
  height: 87% !important;
  position:relative !important;
  justify-content: center;
}

.iframe{
  left: 0;
  width: 100% !important ;
  height: 100% !important;
  position: absolute !important;
  border: 0 !important;
}
.titulosVideosTikTok{
  color: #2A286E;
  padding: 0.2rem 0.1rem 0.2rem 0.3rem;
  line-height: 1rem;
  font-family: "Ubuntu Bold";
  font-size: 2.3rem;
}
.encabezadosGanadores{
  color: #2A286E;
  padding: 0.2rem 0.1rem 0.2rem 0.3rem;
  line-height: 1rem;
  font-family: "Ubuntu Bold";
  font-size: 2rem;
}
.encabezadosMenciones{
  color: #2A286E;
  padding: 0.2rem 0.1rem 0.2rem 0.3rem;
  line-height: 1rem;
  font-family: "Ubuntu Bold";
  font-size: 1.7rem;
}
.imgEncabezadoGanadores{
  max-width: 4rem;
}
.vertical-align {
  display: flex;
  align-items: center;
}
/* .container-fluid{
  --bs-gutter-x: 0rem !important;
} */
.purpleNav{
  min-height: 2.5rem;
  background: #2b275b;
}
.nav{
  font-size: 1.2rem;
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  letter-spacing: 0.02rem;
  background-color: #271662;
  color:white;
  cursor:pointer;
  background:none;
  border:none;
}
.btn-incolucrate{
  background-color:#271662;
  width: 20rem;
  height: 7rem;
  color:white;
  font-size: 2.2rem;
  border-radius: inherit;
  letter-spacing:0.05rem;
}
.btn-incolucrate span{
  color: #8653a0;
  font-weight: bolder;

}
.btn-incolucrate:hover{
  cursor:pointer;
  background-color: #3a2979;
  color:white;
}
.open-sans {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
.lining{
  border-left: solid #8653a0 0.01rem;
}
.mr-5{
  margin-right: 3rem !important;
}
.ml-1{
    margin-left: 1rem !important;
}
.homeText{
  color: #3a2979;
  font-family: "Open Sans", sans-serif;
  letter-spacing: 0.02rem;
  text-align: start;
  font-size: 1.26rem;
}
p,span{
  font-family: "Open Sans", sans-serif;
}
.btn-carousel{
  cursor:pointer;
  background-color: #8653a0;
  color:white;
  border:none;
  font-size: 1rem;
  font-family: "Open Sans", sans-serif;
  width:10rem;
  height:4rem;
  border-radius: inherit;
  letter-spacing: 0.05rem;
}
.btn-carousel:hover{
  background-color: #80668d;
}
h3{
  font-size: 2rem;
  font-family: "Open Sans", sans-serif;
}
h5{
  font-size: 1.5rem;
  font-family: "Open Sans", sans-serif;
}
h6{
  font-size: 1rem;
  font-family: "Open Sans", sans-serif;
}
@media (min-width: 1275px) {
  .carousel-caption{
    bottom: 12rem;
  }
  .cardsTitle:before,
.cardsTitle:after {
    border-top: 1px solid white;
    display: block;
    height: 1px;
    content: " ";
    width: 12%;
    position: absolute;
    top: 40.3em;
    left: 5rem;
}
.cardsTitle:after {
  right: 5rem;
   left: auto; 
}
/* .cardIcon{
  display:block !important;
}
.cardFloatingTitle{
  display:block !important;
} */
}
@media (max-width: 772px) {
  .carousel-caption{
    display:block !important;
  }
  h5{
    font-size: 1.1rem;
  }
  h3{
    font-size: 1.3rem;
  }
}
.bolder{
  font-weight:bolder;
}
.btn-actividad{
  background-color: transparent;
  color: #3a2979;
  border: solid 0.1rem #8653a0;
  font-family: "Open Sans", sans-serif;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.02rem;
}
.btn-actividad:hover{
  background-color: #8957a1b2;
  border: solid 0.1rem #8653a0;
  color: #3a2979;
}
.purpleContainer{
  background-color: #7a6697;
  text-align: center;
}
.pinkContainer{
  background-color: #a261a3;
  text-align: center;
}
.orangeContainer{
  background-color: #ad6b6b;
  text-align: center;
}
.cardHome{
  width:28rem !important;
}
.whiteArrow{
  color: white;
  rotate: 180deg;
  margin-left: -0.8rem;
}
.cardIcon{
    -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
    width: 4rem;
    height: 4rem;
    border-radius: 1rem;
    align-content: center;
    left: 12rem;
    position: absolute;
    top: 37rem;
    display:block;
}
.cardFloatingTitle{
  -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.75);
  width: 24rem;
  min-height: 5rem;
  border-radius: 1rem;
  align-content: center;
  left: 2rem;
  position: absolute;
  top: 13rem;
  display: block;
  background-color: white;
}
.cardFloatingTitle h6{
  color: #3a2979;
  text-align: left;
  font-weight: bold;
  font-size: 1.2rem;
}
hr {
  height: 1px;
  color: white;
  background: white;
  font-size: 0;
  border: 0;
}
.hrFooter{
  color: #231d3f !important;
  background: #231d3f !important;
  width:93%;
  height: 0.2rem;

}
.lateralTitleCard{
  width: 1rem;
  height: 5rem;
  border-radius: 10px 0px 0px 10px;
}
p{
  font-size:1.2rem;
}
.numberCircle{
  display: flex;
  width: 3.7ch; 
  align-items: center;  
  justify-content: center;
  aspect-ratio: 1 / 1;
  border-radius: 50%;  
  border: 2px solid white;
  color:white;
}
.verMasBtn{
  background-color:#ffffff3b;
  color:white;
  font-family: "Open Sans", sans-serif;
  border: solid white 1px;
  border-bottom: 0px;
  bottom: -2px;
  position: absolute;
  left:11rem;
}
.verMasBtn:hover{
  background-color:#ffffff70;
  color:white;
} 
.no-cursor{
  cursor: auto;
}
.swal2-title{
  font-family: "Open Sans", sans-serif;
}
.swal2-confirm{
background-color: #7a6697 !important;
}
.buttonsInfo{
  border: none !important;
}
.buttonsInfo:hover{
  transform: scale(1.1);
}
iframe {
  width: 50%;
  height: 25rem;
}
.modal-title{
  font-family: "Open Sans", sans-serif;
}
.tableSide {
  background-color: #564c8c !important;
  font-weight: bold;
  color: white !important;
}
.tablink_marco {
  background-color: var(--bg-purple);
  color: white;
  float: left;
  border: none;
  outline: none;
  padding: 14px 16px;
  font-size: 1rem;
  width: 30%;
  box-sizing: border-box;
  line-height: 1.3rem;
  border-radius: .5rem .5rem 0 0;
  margin: 0 .1rem;
  height: 4.5rem;
}
.tabcontent_marco {
  display: none;
  padding:  0;
  height: 100%;
  box-shadow: -4px 4px 6px -1px rgba(0,0,0,0.59);
  -webkit-box-shadow: -4px 4px 6px -1px rgba(0,0,0,0.59);
  -moz-box-shadow: -4px 4px 6px -1px rgba(0,0,0,0.59);
  background-color: var(--bg-purple);
  display:block;
}

.btn_pdf_download{
  border: none;
  width: 3.7rem;
  padding: 1.5rem .5rem;
  border-radius: 0 .5rem .5rem 0;
  position: absolute;
  right: -1.7rem;
  top: 0;
  box-shadow: 3px 3px 6px -1px rgba(0,0,0,0.59);
  -webkit-box-shadow: 3px 3px 6px -1px rgba(0,0,0,0.59);
  -moz-box-shadow: 3px 3px 6px -1px rgba(0,0,0,0.59);
  background-color: var(--darkblue-color);
  justify-content: center;
  display: flex;
}

.btn_pdf_download:hover img{
  transform: scale(1.05);
}

.btn_pdf_download img{
  height: 4rem;
}

.tabcontent_marco iframe{
  padding: 2rem;
}
