@charset "utf-8";
@font-face {
    font-family: 'Big Heroes Free Trial';
    src: url('../fonts/BigHeroesFreeTrial.woff2') format('woff2'),
        url('../fonts/BigHeroesFreeTrial.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Dimbo';
    src: url('../fonts/DimboRegular.woff2') format('woff2'),
        url('../fonts/DimboRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

html, body {	
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;    
	font-family: 'Poppins', sans-serif;
}
* {
  -webkit-backface-visibility: hidden;
}

:root {    
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: #020f5d;
    --bs-secondary: #6c757d;
    --bs-success: #217a1a;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #a12025;
    --bs-light: #faf4b9;
    --bs-dark: #212529;
    --bs-primary-rgb: 2,15,93;
    --bs-secondary-rgb: 108,117,125;
    --bs-success-rgb: 33,122,26;
    --bs-info-rgb: 13,202,240;
    --bs-warning-rgb: 255,193,7;
    --bs-danger-rgb: 161,32,37;
    --bs-light-rgb: 250,244,185;
    --bs-dark-rgb: 33,37,41;
    --bs-primary-text-emphasis: #052c65;
    --bs-secondary-text-emphasis: #2b2f32;
    --bs-success-text-emphasis: #0a3622;
    --bs-info-text-emphasis: #055160;
    --bs-warning-text-emphasis: #664d03;
    --bs-danger-text-emphasis: #58151c;
    --bs-light-text-emphasis: #495057;
    --bs-dark-text-emphasis: #495057;
    --bs-primary-bg-subtle: #cfe2ff;
    --bs-secondary-bg-subtle: #e2e3e5;
    --bs-success-bg-subtle: #d1e7dd;
    --bs-info-bg-subtle: #cff4fc;
    --bs-warning-bg-subtle: #fff3cd;
    --bs-danger-bg-subtle: #a12025;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;
    --bs-primary-border-subtle: #9ec5fe;
    --bs-secondary-border-subtle: #c4c8cb;
    --bs-success-border-subtle: #a3cfbb;
    --bs-info-border-subtle: #9eeaf9;
    --bs-warning-border-subtle: #ffe69c;
    --bs-danger-border-subtle: #a12025;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark-border-subtle: #adb5bd;    
    --bs-secondary-color: rgba(33, 37, 41, 0.75);
    --bs-secondary-color-rgb: 33,37,41;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233,236,239;
    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
    --bs-tertiary-color-rgb: 33,37,41;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248,249,250;    
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);    
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);    
    --bs-focus-ring-color: rgba(255,193,7, 0.25);
    --bs-form-valid-color: #198754;
    --bs-form-valid-border-color: #198754;
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545;
}
.dimbo {
    font-family: 'Dimbo';
    font-weight: normal;
    font-style: normal;
}
.heroes {
    font-family: 'Big Heroes Free Trial';
    font-weight: normal;
    font-style: normal;
}
.text-stroke-black {
	text-shadow: rgb(0, 0, 0) 4px 0px 0px, rgb(0, 0, 0) 3.87565px 0.989616px 0px, rgb(0, 0, 0) 3.51033px 1.9177px 0px, rgb(0, 0, 0) 2.92676px 2.72655px 0px, rgb(0, 0, 0) 2.16121px 3.36588px 0px, rgb(0, 0, 0) 1.26129px 3.79594px 0px, rgb(0, 0, 0) 0.282949px 3.98998px 0px, rgb(0, 0, 0) -0.712984px 3.93594px 0px, rgb(0, 0, 0) -1.66459px 3.63719px 0px, rgb(0, 0, 0) -2.51269px 3.11229px 0px, rgb(0, 0, 0) -3.20457px 2.39389px 0px, rgb(0, 0, 0) -3.69721px 1.52664px 0px, rgb(0, 0, 0) -3.95997px 0.56448px 0px, rgb(0, 0, 0) -3.97652px -0.432781px 0px, rgb(0, 0, 0) -3.74583px -1.40313px 0px, rgb(0, 0, 0) -3.28224px -2.28625px 0px, rgb(0, 0, 0) -2.61457px -3.02721px 0px, rgb(0, 0, 0) -1.78435px -3.57996px 0px, rgb(0, 0, 0) -0.843183px -3.91012px 0px, rgb(0, 0, 0) 0.150409px -3.99717px 0px, rgb(0, 0, 0) 1.13465px -3.8357px 0px, rgb(0, 0, 0) 2.04834px -3.43574px 0px, rgb(0, 0, 0) 2.83468px -2.82216px 0px, rgb(0, 0, 0) 3.44477px -2.03312px 0px, rgb(0, 0, 0) 3.84068px -1.11766px 0px, rgb(0, 0, 0) 3.9978px -0.132717px 0px;
}
.text-stroke-white {
	text-shadow: rgb(255, 255, 255) 3px 0px 0px, rgb(255, 255, 255) 2.83487px 0.981584px 0px, rgb(255, 255, 255) 2.35766px 1.85511px 0px, rgb(255, 255, 255) 1.62091px 2.52441px 0px, rgb(255, 255, 255) 0.705713px 2.91581px 0px, rgb(255, 255, 255) -0.287171px 2.98622px 0px, rgb(255, 255, 255) -1.24844px 2.72789px 0px, rgb(255, 255, 255) -2.07227px 2.16926px 0px, rgb(255, 255, 255) -2.66798px 1.37182px 0px, rgb(255, 255, 255) -2.96998px 0.42336px 0px, rgb(255, 255, 255) -2.94502px -0.571704px 0px, rgb(255, 255, 255) -2.59586px -1.50383px 0px, rgb(255, 255, 255) -1.96093px -2.27041px 0px, rgb(255, 255, 255) -1.11013px -2.78704px 0px, rgb(255, 255, 255) -0.137119px -2.99686px 0px, rgb(255, 255, 255) 0.850987px -2.87677px 0px, rgb(255, 255, 255) 1.74541px -2.43999px 0px, rgb(255, 255, 255) 2.44769px -1.73459px 0px, rgb(255, 255, 255) 2.88051px -0.838247px 0px;
}
.text-naranja {
	color: #ffa250;
}
.text-lila {
	color: #dab5ff;
}
.text-amarillo {
	color: #ffcc5f;
}
.text-morado {
	color: #7951b6;
}
.frost {	
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
.modal-open .modal {
    background-color: rgba(0,0,0,0.9);
}
.modal-backdrop.show {
    opacity: 0;
}
.offcanvas.offcanvas-top {
	height: fit-content;
}
.offcanvas-backdrop.show {
    opacity: .9;
}
#loader {
	overflow: hidden;
	display: flex;
	top: 0px;
	left: 0px;	
	z-index: 99999;
}
.animadof {
	visibility: hidden !important;
}
.animate__bounceInUp {
	-webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
    animation-duration: calc(var(--animate-duration) * 0.75);
}
.animate__animated.animate__delay-025s {
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s;
    webkit-animation-delay: calc(var(--animate-delay)*0.25);
    animation-delay: calc(var(--animate-delay)*0.25);
}
.animate__animated.animate__delay-05s {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    webkit-animation-delay: calc(var(--animate-delay)*0.5);
    animation-delay: calc(var(--animate-delay)*0.5);
}
.animate__animated.animate__delay-075s {
    -webkit-animation-delay: 0.75s;
    animation-delay: 0.75s;
    webkit-animation-delay: calc(var(--animate-delay)*0.75);
    animation-delay: calc(var(--animate-delay)*0.75);
}
.animate__animated.animate__delay-1s {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    webkit-animation-delay: calc(var(--animate-delay)*1);
    animation-delay: calc(var(--animate-delay)*1);
}
.text-shadow {
	text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.7);
}
.text-shadow-white {
	text-shadow: 2px 2px 8px rgba(255, 255, 255, 0.5);
}
.display-1m {
	font-size: calc(1.625rem + 23vw);
}

.shadow-extra {
    box-shadow: 0 0 .5rem rgba(0,0,0,.15)!important;
}

@property --wipe-position {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

.wipe {
    --wipe-position: 100%;
    --gradient-length: 20%;
    -webkit-mask-image: linear-gradient(
      to right,
      black var(--wipe-position),
      transparent calc(var(--wipe-position) + var(--gradient-length)),
      transparent
    );

    transition: --wipe-position 1000ms cubic-bezier(0, 0.55, 0.45, 1);
}

.wipe.out {
    --wipe-position: calc(-1 * var(--gradient-length));
}

#mainContennedor4 .reloj {
	max-width: 45px;
}
#mainContennedor4 .tiempo_count {
	font-size: 24px;
}
#mainContennedor4 .tiempo_seg {
	font-size: 20px;
}
#mainContennedor4 .puntos {
	max-width: 180px;
}
#mainContennedor4 .puntos_count {
	font-size: 18px;
	top: 40%;
}

@media only screen and (min-width: 576px){	
}

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

@media only screen and (min-width: 992px){
    #mainContennedor4 .reloj {
		max-width: 80px;
	}
	#mainContennedor4 .tiempo_count {
		font-size: 36px;
	}
	#mainContennedor4 .tiempo_seg {
		font-size: 28px;
	}
	#mainContennedor4 .puntos {
		max-width: 250px;
	}
	#mainContennedor4 .puntos_count {
		font-size: 28px;
		top: 37%;
	}	
}

@media only screen and (min-width: 1200px){	
}

@media only screen and (min-width: 1400px){
	
}	

@supports(padding: max(0px)) {
    .fitCont {
        padding-left: max(0px, env(safe-area-inset-left)) !important;
        padding-right: max(0px, env(safe-area-inset-right)) !important;
    }
    .fitCont-left {
        padding-left: max(0px, env(safe-area-inset-left)) !important;        
    }
    .fitCont-right {        
        padding-right: max(0px, env(safe-area-inset-right)) !important;
    }
}