/* Layout definitions */

@font-face{
	font-family: "Roboto";
	src: url("../fonts/Roboto-VariableFont_wdth_wght.ttf");
}

@font-face{
	font-family: "Montserrat";
	src: url("../fonts/Montserrat-VariableFont_wght.ttf");
}


* {
	margin: 			0px;
    padding: 			0px;
	font-family: 		"Roboto";
	scroll-behavior: 	smooth;
}


@media (orientation: landscape) {
	html {
		/*font-size: 			calc(8px + 0.75vmin);*/
		font-size: 				calc(5px + 1vmin);
	}
}
@media (orientation: portrait) {
	html {
		/*font-size: 			calc(8px + 0.75vmin);*/
		font-size: 				calc(5px + 1vmin);
	}
}

* {
	/* COLORS */
	--colorWhiteFull: 		rgba(255, 255, 255,  1);
	--colorWhite075: 		rgba(255, 255, 255,  0.75);
	--colorWhite050: 		rgba(255, 255, 255,  0.5);
	--colorWhite025: 		rgba(255, 255, 255,  0.25);
	--colorWhite000: 		rgba(255, 255, 255,  0);
	
	--colorRedFull: 		rgba(200,   0,   0,  1);
	--colorRedDarkFull: 	rgba(150,   0,   0,  1);
	--colorRed025: 			rgba(200,   0,   0,  0.25);
		
	--colorOrangeFull: 		rgba(255, 128,   0,  1);
	--colorOrange075: 		rgba(255, 128,   0,  0.75);
	--colorOrange050: 		rgba(255, 128,   0,  0.5);
	--colorOrange025: 		rgba(255, 128,   0,  0.25);
	--colorOrange075Opa:	rgba(255, 160,   64, 1);
	--colorOrange075HTFull:  #ffdfbf;
	
	
	--colorBlueFull: 		rgba( 14,  26, 104,  1);
	--colorBlue075: 		rgba( 14,  26, 104,  0.75);
	--colorBlue050: 		rgba( 14,  26, 104,  0.50);
	--colorBlue033: 		rgba( 22,  36, 128,  0.25);
	--colorBlue025: 		rgba( 14,  26, 104,  0.25);
	--colorBlue005: 		rgba( 14,  26, 104,  0.05);
	--colorBlueBrightFull: 	rgba(122, 136, 223,  1);
	--colorBrightBlue022: 	rgba( 10, 233, 255,  0.22);
	--colorBlue025Opa: 		rgba(195, 198, 217,  1);
	--colorBlue005Opa: 		rgba(243, 243, 247,  1);
	
	--colorHeaderBlueBright:rgba( 37,  166, 206,  1);
	--colorHeaderBluedark: 	rgba(  6,  101, 227,  1);
	--colorHomeText: 		rgba( 115, 115, 115,  1);
	--colorHomeTextDark: 	rgba( 200, 200, 200,  1);
		
	--colorBlackFull: 		rgba(  0,   0,   0,  1);
	--colorBlack075: 		rgba(  0,   0,   0,  0.75);
	--colorBlack065: 		rgba(  0,   0,   0,  0.65);
	--colorBlack050: 		rgba(  0,   0,   0,  0.5);
	--colorBlack025: 		rgba(  0,   0,   0,  0.25);
	--colorBlack010: 		rgba(  0,   0,   0,  0.1);
	--colorBlack005: 		rgba(  0,   0,   0,  0.05);
	--colorBlack001: 		rgba(  0,   0,   0,  0.01);
	--colorBlack000: 		rgba(  0,   0,   0,  0);
	
	--colorGrayishBlue025: 	rgba(166, 168, 179,  0.25);
	
	--colorDarkGrayFull:	rgba( 77,  77,  77,  1);
	--colorDarkGray025:		rgba( 77,  77,  77,  0.25);
	--colorHalfGrayFull:	rgba(127, 127, 127,  1);
	--colorHalfGray030:		rgba(127, 127, 127,  0.3);
	
	--colorDarkerGrayFull:	rgba( 40,  40,  40,  1);
	--colorDarkestGrayFull:	rgba( 22,  22,  22,  1);
	
	--colorBrightLightGrayFull: rgba(240, 240, 240,  1);
	--colorLightGrayFull: 	rgba(220, 220, 220,  1);
	--colorLightGray075: 	rgba(220, 220, 220,  0.75);	
	--colorLightGray050: 	rgba(220, 220, 220,  0.5);	
	--colorLightGray025: 	rgba(220, 220, 220,  0.25);
	--colorLightGray010: 	rgba(220, 220, 220,  0.1);
	--colorBrightGrayFull:  rgba(250, 250, 250,  1);
	
	--colorBrightGrayHTFull:  rgba(230, 230, 230,  1);
	
	
	--colorLightBlue1:  	rgba(235, 238, 255,  1);
	--colorLightBlue2:  	rgba(224, 230, 255,  1);
	--colorLightBlue3:  	rgba(191, 202, 255,  1);
	--colorLightBlue4:  	rgba(165, 181, 255,  1);
	--colorLightBlue5:  	rgba(141, 161, 255,  1);
	
	--colorLightGreen1:  	rgba(100, 200, 100,  1);
	
	--colorGray153Full:		rgba(153, 153, 153,  1); /*99*/
	--colorGray204Full:		rgba(204, 204, 204,  1); /*cc*/
	--colorBackGrayFull:	#f1f5f9;

	
	/*FONT SIZES*/
	--fontDefault:			1rem;
	--fontHeader1:			1.2rem;
	--fontHeader2:			1.1rem;
	--fontSmall1:			0.9rem;
	--fontSmall2:			0.8rem;
	--fontSmall3:			0.75rem;
	
	--fontHomeDefault:		1.2rem;
	--fontHomeHeader1:		2rem;
	--fontHomeLineHeight:	1.8rem;
	--fontHomeHLineHeight:	2.5rem;
	
	/* animations */
	--transitionQuick:		0.25s;
	--transitionSemi:		0.5s;
	--transitionNormal:		1s;
	--transitionSlow:		2s;
}