/****************************************/    
/******************** FRAMEWORK ********************/                                                                               
/****************************************/ 
  







/******************** GENERAL ADJUSTMENTS ********************/                                                                                
body, html {                                                                                                                                                                                                                                 
	overflow: hidden;
	background-color: #1F1F23; 
}
  
* {                 
	margin: 0px auto;
	padding: 0px;
	box-sizing: border-box;
}

    





          
/******************** PRELOADER ********************/    
#PreloadOverlay {
    width: 100%;
    height: 100vh;	
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 9999999999;
	background-color: #1F1F23; 
	transition: 600ms;
} 

#PreloadOverlay.hide {
	opacity: 0;  
}

/* dvh */
@supports (height: 100dvh) {
    #PreloadOverlay { height: 100dvh; }    
}

/* loader */
#PreloadOverlay #LoaderContainer { 
	width: 80px;
	height: 80px; 
	position: absolute;
	top: calc(50% - 40px);
	left: calc(50% - 40px);  
}

/* loader - inner */
#PreloadOverlay #LoaderContainer #LoaderInner {  
    width: 80px;
	height: 80px; 
	position: relative;
	animation: preloadpulsate 2s linear infinite;
}

/* loader - inner - spinner */
#PreloadOverlay #LoaderContainer #LoaderInner .spin {
	position: absolute;
	border: 2px solid transparent; 
	border-radius: 100%;
}

#PreloadOverlay #LoaderContainer #LoaderInner #SpinnerOne {  
	width: 80px; 
	height: 80px; 
	top: calc(50% - 40px); 
	left: calc(50% - 40px);
	border-top-color: rgb(250,250,250);
	border-bottom-color: rgb(250,250,250); 
    animation: spinclockwise 1s linear infinite; 
}

#PreloadOverlay #LoaderContainer #LoaderInner #SpinnerTwo { 
	width: 50px;
	height: 50px;
	top: calc(50% - 25px);
	left: calc(50% - 25px);
	border-right-color: rgb(250,250,250);
    animation: spincounterclockwise 1s linear infinite; 
}

#PreloadOverlay #LoaderContainer #LoaderInner #SpinnerThree {
	width: 20px;
	height: 20px;
	top: calc(50% - 10px);
	left: calc(50% - 10px);
	border-right-color: rgb(250,250,250);
	border-left-color: rgb(250,250,250);
    animation: spinclockwise 5s linear infinite; 
}

#PreloadOverlay #LoaderContainer #LoaderInner #SpinnerFour {
	width: 4px;
	height: 4px;
	top: calc(50% - 2px);
	left: calc(50% - 2px); 
	background-color: white;
}

/* circle */
#PreloadCircle {   
    position: fixed;
	top: 50%;
	left: 50%;
    z-index: 999999999; 
	background-color: #1F1F23;
	border-radius: 100%; 
}

#PreloadCircle.hide {
	transition: 600ms;
	transform: scale(0);  
	opacity: 0.8; 
}








/******************** INQUIRE MODAL *********************/   
#InquireModal {            
    width: 100%;
    height: 100vh;	
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 99;
	background-color: #1F1F23; 
}

/* dvh */
@supports (height: 100dvh) {
    #InquireModal { height: 100dvh; }    
} 








/********************* PRELOAD ANIMATION *********************/   
/* outer */                     
@-webkit-keyframes preloadpulsate {      
    0% {  
	    -webkit-transform: scale(0.8);
		opacity: 1;
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 0.1;
	}
	100% {
	    -webkit-transform: scale(0.8);
		opacity: 1;	
	}
}
 
@keyframes preloadpulsate {
    0% { 
	    transform: scale(0.8);
		opacity: 1;
	}
	50% {
		transform: scale(1);
		opacity: 0.1; 
	}
	100% {
	    transform: scale(0.8);
		opacity: 1;
	}
}

/* clockwise */
@-webkit-keyframes spinclockwise {      
    to { 
	    -webkit-transform: rotate(360deg);
	}
}

@keyframes spinclockwise {
    to {
		transform: rotate(360deg);
	}
}

/* counter clockwise */
@-webkit-keyframes spincounterclockwise {      
    to { 
	    -webkit-transform: rotate(-360deg);
	}
}

@keyframes spincounterclockwise {
    to {
		transform: rotate(-360deg);
	}
}   
 






