@charset "utf-8";
/* CSS Document */

/*PALETA DE COLORES
VERDE: #408267
GRIS: #E5DECF
NARANJA: #F48125
VERDE CLARO: #ACD489
AZUL: #54C6C3
*/

@font-face {
    font-display: Oswald;
	font-family: 'Oswald';
    src: url('fonts/Oswald-Regular.woff') format('woff'),
         url('fonts/Oswald-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-display: Oswald;
	font-family: 'Oswald';
    src: url('fonts/Oswald-SemiBold.woff') format('woff'),
         url('fonts/Oswald-SemiBold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

html, body {margin: 0;}
body {
	padding:0;
	font-family: 'Oswald', sans-serif;
    font-size: 1rem;
    font-weight: normal;
	color: #252525;
}
@media (max-width:768px) {
    body {font-size: 0.9rem;}
}

h1 {font-size: 2rem;}
h2 {font-size: 1.6rem;}
h3 {font-size: 1.4rem;}
h4 {font-size: 1.2rem;}

.h1 {font-size: 2rem;}
.h2 {font-size: 1.6rem;}
.h3 {font-size: 1.4rem;}
.h4 {font-size: 1.2rem;}

strong {font-weight: 700;}
.display-1, .display-2, .display-3, .display-4 {font-weight: 700;}
.hr-white {border: 0; border-bottom: solid 2px #FFF;}
.hr-grey {border: 0; border-bottom: solid 2px rgba(0,0,0,0.2);}

/*containers*/
.container-1200 {max-width: 1200px; margin: auto;}
.container-1000 {max-width: 1000px; margin: auto;}
.container-900 {max-width: 900px; margin: auto;}
.container-800 {max-width: 800px; margin: auto;}
.container-600 {max-width: 600px; margin: auto;}
.container-400 {max-width: 600px; margin: auto;}

/*textos*/
.text-primary {color: #408267!important;}
.text-primary-light {color: #ACD489;}
.text-secondary {color: #F48125!important;}
.text-tertiary {color: #54C6C3;}
.text-dark {color: #252525!important;}


a.text-black {color: #252525;}
a.text-black:hover {color: #000;}

/*fondos*/
.bg-primary {background-color: #408267!important;}
.bg-primary-light {background-color: #ACD489;}
.bg-secondary {background-color: #F48125!important;}
.bg-tertiary {background-color: #54C6C3;}

/*IMAGES FIT*/
.img-fit {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*iconos home info*/
.icons-home .box {padding: 1px;}
.box {overflow: hidden;}
.box * {transition: all 0.3s linear;}
.box:hover .up {transform: scale(0.9) rotate(-15deg);}
.box:hover .down {transform: scale(1.2);}

/*cuadros botones home*/
.square-btn {overflow: hidden;}
.square-btn * {transition: all 0.3s linear;}
.square-btn:hover .up {transform: scale(1.2);}
.square-btn:hover .down {transform: scale(0.9);}

/*contador home*/
#Countdown div {display: inline-block; border-radius: 0.5rem; background-color: #FFF; padding: 0.2rem 0 0 0; margin: 0 0.2rem; box-shadow: rgba(0,0,0,0.3) 0 3px 5px;}
#Countdown strong, #Countdown span {display: block; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem;}
#Countdown strong {font-size: 2rem; width: 70px; color: #408267;}
#Countdown span {background-color: #E8E8E8;}

/* Rotador de banners home */
#banner-rotator {
  position: relative;
  width: 100%;
  aspect-ratio: 5 / 2;
  overflow: hidden;
  display: flex;
  align-items: center;
}

/*rotador de banners*/
.banner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.banner.active {
  opacity: 1;
  z-index: 1;
}

.banner img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 100%;
  background-color: white;
  transform: scaleX(0);
  transform-origin: left;
}

.banner-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  cursor: pointer;
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: background 0.3s ease;
}

.banner-nav:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

.banner-prev { left: 0; }
.banner-next { right: 0; }
/*Rotador de banners home fin*/

/*boton flotante inscripciones*/
.inscribete {width:20%; max-width:180px; top: 15vw; left: 40px; z-index:10;}
.inscribete img {width: 100%; animation: pulse 1s infinite ease-in-out;}
@media (max-width:992px) {
	.inscribete {width:30%; top: 130px; left: 20px;}
}

/*menu ppl*/
/*#main-nav {position: absolute; z-index: 100;}
@media (max-width:992px) {#main-nav {background-color: #408267; position: relative;}}*/
#main-nav {background-color: #408267;}
#main-nav .navbar-nav .nav-link {color: #a8d582!important; transition: all 0.15s linear;}
#main-nav .navbar-nav .nav-link:hover {color: #FFF!important; transform: scale(1.1); }
#main-nav .navbar-toggler {color: #FFF; border: 0;}
#main-nav .dropdown {margin-top: 0;}
#main-nav .dropdown:hover .dropdown-menu {display: block;}


/*slider*/
img.img-desk {display: block;}
img.img-mob {display: none;}
@media (max-width:768px) and (orientation:portrait) {
	img.img-desk {display: none;}
	img.img-mob {display: block;}
}

/*header*/
header.head_sections {
    background-image: url("../img/header-img.jpg");
    background-size: cover;
    background-position: top center;
}

.logo {width: 45%; max-width: 280px;}
.patrocinadores-cont {position: absolute; z-index: 10; margin-top: 2rem;}

/*BOTONES*/
.btn {border-radius: .75rem;}
.btn-primary {background-color: #408267!important; border: solid 3px #FFF; color: #FFF;}
.btn-primary:hover {background-color: #2F5E4B!important; color: #FFF;}

/*pastilla patrocinadores*/
.logos {display: -ms-flexbox!important; display: flex!important; -ms-flex-pack: justify!important; justify-content: space-between!important;}
.patrocinan {width: 35%; max-width: 350px;}
.pastilla {width:100%; background-color: #408267; border-bottom-right-radius: 1rem; border-top-right-radius: 1rem;}

@media (max-width:768px) and (orientation:portrait) {
    .patrocinadores-cont {position: relative; margin-top: 0.5rem;}
    .patrocinan {width: 55%;}
}


/*transiciones generales*/
.scale-up, .scale-rotate {transition: all 0.3s linear;}
.scale-up:hover {transform: scale(1.2); z-index: 10;}
.scale-rotate:hover {transform: scale(1.2) rotate(-15deg);}

/*BLOG***/
.article-link {margin-bottom: 7px;}
.article-link small {display: block;}

/*SECCION PATROCINADORES*/
.logos-patro img {width: 100%;}
.logo-box {border: solid 1px #CCC; background: #FFF;}
.logo-box:hover {transform: translateY(-4px); box-shadow: 2px 0 5px rgba(0,0,0,0.2);}
.cycle-controls {cursor: pointer; padding: 3px 8px;}
.cycle-controls:hover {background-color: #545657;}
.d-34 {width: 34,375%;}
.d-31 {width: 31,25%;}
.d-50 {width: 50%;}

/*redes sociales*/
.socials {position: fixed; left: 0; top: 0; width: 40px; height: 100%; font-size: 1.2rem; z-index: 15;}
.socials .container-fluid {padding: 0;}
.socials .row {margin: 0;}
.socials .col {overflow: hidden;}
.socials .col * {transition: all 0.15s linear;}
.socials a:hover {transform: scale(1.3);}
.bg-ig {background-color: magenta;}
.bg-fb {background-color: darkblue;}
.bg-tw {background-color: black;}
.bg-yt {background-color: red;}
.bg-wp {background-color: #25d366;}

@media (max-width:768px) {
    .socials {bottom: 0; top: auto; width: 100%; height: auto;}
}


/*footer*/
.roadrace-label {width:25%; max-width:80px; height: auto;}
.jk-credit{width: 36%; max-width: 130px;}

footer {font-size: 0.8rem;}
footer .footer_data {font-size: 0.9rem;}
footer .logos_footer img {width: 65%; max-width: 100px; height: auto;}
footer .footer_data i {color: #252525; margin-right: 3px;}
footer a, footer a:hover {color: #252525;}
footer a:hover {text-decoration: underline;}
@media (max-width:768px) {footer .footer_data span {display: block;}}

