/* estilos globales  */


@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,200;6..12,300;6..12,400;6..12,600;6..12,700;6..12,800&display=swap');



:root {
  --naranjo: #EF8100;
  --naranjo-suave: #FFF8F1; 
  --blanco: #ffffff;
  --negro: #000000;
  font-size: 18px;
}



/* Chrome, Edge and Safari */
*::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}
*::-webkit-scrollbar-track {
  border-radius: 5px;
  background-color: #e9ebeb;
}

*::-webkit-scrollbar-track:hover {
  background-color: #e9ebeb;
}

*::-webkit-scrollbar-track:active {
  background-color: #e9ebeb;
}

*::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: #868686;
}

*::-webkit-scrollbar-thumb:hover {
  background-color: #868686;
}

*::-webkit-scrollbar-thumb:active {
  background-color: #868686;
}




body {
  font-family: 'Poppins', sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: normal;
  box-sizing: border-box;
  color: var(--negro);
  background-color: var(--naranjo-suave);
}

.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1024px;
}

.py-6 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.pt-6 {
  padding-top: 6rem;
}

.mt-7 {
  margin-top: 7rem;
}


.txt-color-naranjo {
  color: var(--naranjo);
}

.txt-color-blanco {
  color: var(--blanco);
}

.txt-color-negro {
  color: var(--negro);
}


.bg-color-naranjo {
  background-color: var(--naranjo);
}

.bg-color-naranjo-suave {
  background-color: var(--naranjo-suave);
}

.bg-color-negro {
  background-color: var(--negro);
} 

.bg-color-gris {
  background-color: var(--gris);
} 


.bg-color-blanco {
  background-color: var(--blanco);
} 






.card {
  border: 1px solid #E0DEDD;
}

.card .card-img, .card .card-img-top {
  width: 100%;
  height: 180px;
  object-fit: cover;
}



h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
}


p, ul, li, a {
  font-family: 'Nunito Sans', sans-serif;
}


a.link {
  text-decoration-color: var(--blanco);
  position: relative;
  top: 0;
  transition: all 0.3s;
  display: inline-block;
  
}


/* botones  */

.btn-primary {
  transition: all 0.3s;
  border: 2px solid transparent !important;
  text-decoration: none;
}

.btn-uno:hover {
  background-color: transparent;
  border: 2px solid #fff !important;
  text-decoration: none;
  color: var(--blanco) !important;
}


.btn-dos:hover {
  background-color: transparent;
  color: #000 !important;
  border: 2px solid #000000 !important;
  text-decoration: none;
}


.btn-tres {
  background-color: #00000045;
  border: 2px solid var(--naranjo) !important;
  text-decoration: none;
}


.btn-tres:hover {
  background-color: var(--naranjo);
  border: 2px solid var(--naranjo) !important;
  text-decoration: none;
  color: var(--blanco) !important;
}

/* video */




#video .btn {
width: fit-content;
}





/* slider  */

#slider-home img.logo {
  object-fit: contain;
  width: 150px;
  object-position: center;
  margin-right: 1rem;
  position: relative;
}



/* pilares  */

#pilares .row {
  margin: auto;
  left: 0%;
  right: 0%;
  
}


#pilares .link-box {
  transition: all 0.3s;
  position: relative;
  top: 0px;
  color: var(--negro);
  text-decoration: none;
  height: 100%;
  text-align: center;
}



#pilares .link-box .box {
  transition: all 0.3s;
  box-shadow: 0px 5px 10px 0px rgba(214, 214, 214, 0.50);
    background-color: var(--blanco);
    border: 1px solid #e3e3e3;
}

#pilares .box .icon-link {
  text-decoration: underline;
  display: inline-block;
}

#evento-destacado .card a:hover {
  top: -3px;  
}


#pilares .feature-icon img {
  height: 80px;
  
}

#pilares h3 {
font-size: 1em;
font-weight: 600;
margin-top: 0.5rem;
margin-bottom: 0;
}

#pilares .feature-icon {
  margin-inline: auto;
  margin-top: -60px;
}



/* banner edicion  */

#banner-edicion { 
  position: relative;
}

#banner-edicion .img-portada {
position: absolute;
bottom: 0;
width: 60%;
left: 15%;
right: 15%;
}



/* evento  */

#evento .evento-content {
  max-height: 380px;
  scrollbar-width: thin;
  scrollbar-color: #ffdf5f #ef8100;
}

#evento .evento-content ul li a {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 1.1rem 1.2rem;
border-radius: 0.6rem;
margin-bottom: 0.5rem;
text-decoration: none;
color: #ffffff;
transition: all 0.3s;
background-color: #ffebdc30;
}


#evento .evento-content h5 {
font-size: 0.99em;
font-weight: bold;
margin-bottom: 0.15rem;
}

#evento .evento-content p {
margin: 0;
font-size: 0.9em;
color: var(--gris-medio)
} 


#evento .evento-content img {
margin-right: 1rem;
width: 80px;
height: 80px;
border: 3px solid #fff;
border-radius: 50%;
} 


#evento .btn-primary {
font-size: 0.9rem;
} 

.card-uno {
border-top-right-radius: 0px !important;
border-bottom-right-radius: 0px !important;
}

.huincha-transmision {
width: 100%;
background-color: #ce3d96;
padding: 0.5rem 1.5rem 0.5rem 1.5rem;
margin-bottom: 1.1rem;
}

.huincha-transmision img {
max-width: 260px;
}





#portadas {
background-image: url(../img/bg-2.jpg);  
background-repeat: no-repeat;
background-size: cover;
box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2);
background-attachment: fixed;
position: relative;
overflow: hidden;
}

#portadas::after {
  display: block;
  clear: both;
  content: "";
  background: -moz-linear-gradient(125deg, rgba(0, 0, 0, 0.80015756302521) 0%, rgba(0, 0, 0, 0) 50%);
  background: -webkit-linear-gradient(125deg, rgba(0, 0, 0, 0.80015756302521) 0%, rgba(0, 0, 0, 0) 50%);
  background: linear-gradient(125deg, rgba(0, 0, 0, 0.80015756302521) 0%, rgba(0, 0, 0, 0) 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}





/* Estilos mobile  */

@media only screen and (max-width: 768px) { 

.carousel-inner::after {
background: #00000075 !important;
}

#slider-home .carousel-caption {
z-index: 20;
}

#banner-edicion .col-left {
  min-height: 200px;
}

#banner-edicion .col-right {
  flex-direction: column;
}

#banner-edicion .col-right .w-50 {
  width: 100% !important;
  text-align: center;
}


#slider-home .carousel-caption {
  max-width: 100%;
  justify-content: center;
}

#slider-home .btn-primary {
  width: 100%;
}

#slider-home img.logo {
  width: 70%;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 0.7rem;
}

#slider-home .carousel-item:before {
  content: "";
  display: block;
  background-color: var(--negro);
  width: 100%;
  height: 100%;
  position: absolute;
  opacity: 0.5;
}

#slider-home .carousel-caption .d-flex {
flex-direction: column;
text-align: center;
}

#slider-home .bd-placeholder-img {
object-position: right;
width: 140%;
}

.carousel-inner::after {
  background: -moz-linear-gradient(125deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 50%);
  background: -webkit-linear-gradient(125deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 50%);
  background: linear-gradient(125deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
}






#featured {
  padding: 0rem !important;
}

#pilares .box {
  text-align: center;
}

#pilares .box h3 br {
  display: none;
}

#pilares .feature-icon img {
  margin-left: auto;
  margin-right: auto;
}


#pilares .row {
    position: relative;
    top: 0;
}

#pilares .feature-icon {
  margin-top: 0;
}


.py-6 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.px-5 {
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}



#evento .evento-content h5,
#eventos .agenda-content .info h5 {
  font-size: 0.8em;
}

#evento-destacado .card h5 {
  font-size: 1em;
}

#evento .btn-primary {
font-size: 0.75rem;
}

.card-uno {
margin-bottom: 1.5rem !important;
}

#info-beneficios .card {
  flex-direction: column;
}

#info-beneficios .card .img-beneficio {
  width: 100%;
  height: 150px;
}


#video .row .col {
padding-left: 0;
padding-right:0;
}


#video {
text-align: center;
}

#video .btn {
margin: auto;
}





}