
* {
	/* touch-action: none; Disables general Pinch and zoom on the window */
	font-family: Medium;
    line-height:1.5;
    letter-spacing: 0.02rem;
}

a {
    text-decoration: none; 
}

.selectable{
	-moz-user-select:text;
	-webkit-user-select: text;
	-ms-user-select: text;
	user-select: text;

}

.scroll_bars::-webkit-scrollbar {
    -webkit-appearance: none;
}

.scroll_bars::-webkit-scrollbar:vertical {
    width: 8px;
}

.scroll_bars::-webkit-scrollbar:horizontal {
    height: 8px;
}

.scroll_bars::-webkit-scrollbar-thumb {
	border-radius: 6px;
	border: 1px solid var(--tone_2);
	/* should match background, can't be transparent */
	background-color: var(--body_light);
}

.scroll_bars_light::-webkit-scrollbar {
    -webkit-appearance: none;
}

.scroll_bars_light::-webkit-scrollbar:vertical {
    width: 8px;
}

.scroll_bars_light::-webkit-scrollbar:horizontal {
    height: 8px;
}

.scroll_bars_light::-webkit-scrollbar-thumb {
	border-radius: 6px;
	border: 1px solid var(--tone_2);
	/* should match background, can't be transparent */
	background-color: var(--tone_3);
}

/* CSS Document */

/* @font-face{
    font-family: Flux;
	src: url('AfacadFlux-Light.ttf');

} */

/* @font-face{
    font-family: Bruno;
	src: url('BrunoAce-Regular.ttf');
} */

/* @font-face{
    font-family: Dotto;
	src: url('Doto_Rounded-Black.ttf');
} */

/* @font-face{
    font-family: Medium;
	src: url('Comfortaa-Medium.ttf');
} */

/* @font-face{
    font-family: NunitoSans-Black;
	src: url('NunitoSans-Black.ttf');
} */

/* @font-face{
    font-family: Bold;
	src: url('Audiowide-Regular.ttf');
} */


@font-face{
    font-family: Medium;
	src: url('Comfortaa-Medium.ttf');
}

@font-face{
    font-family: Bold;
	src: url('NunitoSans-Black.ttf');
}


.homeTitle{
    font-family: Bold !important;
    letter-spacing: 0.06rem;
    line-height:1.4;
}

.underline{
    text-decoration: underline;
}


.bodyBack {

    background:radial-gradient(circle at 90% 90%,#b21e18 0%,var(--body_dark) 40%) 50% 50%/cover no-repeat;

}
.headerBack {

    background: linear-gradient(180deg, var(--body_dark) 40%, transparent 100%);

}

.editorBack{
    
    
    background: linear-gradient(135deg, var(--body_light) 0%, var(--body_dark) 100%);
}

.editorBack_reverse{
    
    
    background: linear-gradient(135deg, var(--body_dark) 0%, var(--body_light) 100%);
}

.innerGlowRing_blue{
    box-shadow: 0px 0px 6px var(--blue);
    background: conic-gradient(  #3c7cfb 60deg, #0b152c 145deg, #3c7cfb 255deg,  #ffffff 315deg, #3c7cfb 340deg);
}

.innerGlowRing_red{
    box-shadow: 0px 0px 6px var(--red);
    background: conic-gradient(  #fb3c3c 60deg, #2c0b0b 145deg, #fb3c3c 255deg,  #ffffff 315deg, #fb3c3c 340deg);
}


.displayBox{
    box-sizing:border-box;
}

.displayTable_plain {
    display: table; 
	border-collapse: collapse;
	
}


.displayTable_plain > div { 
    display: table-row;
    padding: 5px 0;

}

.displayTable_plain > div > div { 
    display: table-cell;
    padding: 8px 0px;
	box-sizing: border-box;
	
}

.displayTable_plain > div > div:first-of-type { 
   /* padding-right:20px; */
    width:45%;
	
}

.displayTable {
    display: table; 
	border-collapse: collapse;
	
}

.displayTable > theader { 
    display: table-header-group; 
	position: sticky;
	top: -1px;
	z-index:1002;
	height:26px;
}

.displayTable > theader > div:first-of-type { 
	position: sticky;
    left: 0;
    z-index: 3;
	background:#3F3F3F;
	color:#3F3F3F;
	text-transform:uppercase;
	border-right:thin solid var(--tone_5);
}

.displayTable > theader > div { 
    display: table-cell;
	box-sizing: border-box;
	background:var(--tone_3);
	z-index: 2;
}

.displayTable > div { 
    display: table-row; 
}

.displayTable > div > div { 
    display: table-cell;
	box-sizing: border-box;
	padding:8px 15px;
    background:var(--light);
    border:8px solid var(--tone_0);

	
}

.displayTable > div > div:first-of-type { 
    min-width:160px;
	background:var(--hilite_light_blue);
	color:var(--hilite_blue);
	font-family: Bold;
	padding:8px 15px;
    border-radius:26px;
    border:8px solid var(--tone_0);
	
}

.displayTable_darkBack {
    display: table; 
	border-collapse: collapse;
	
}

.displayTable_darkBack > div { 
    display: table-row; 
   

    
}

.displayTable_darkBack > div > div { 
    display: table-cell;
	box-sizing: border-box;
	padding:8px 15px;

    
    border:8px solid var(--glassExtraDark);

	
}

.displayTable_darkBack > div > div:first-of-type { 
    min-width:160px;
	background:var(--hilite_light_blue);
	color:var(--hilite_blue);
	font-family: Bold;
	padding:8px 15px;
    border-radius:26px;

    border:8px solid var(--glassExtraDark);
	
}

.label{
    float:left;
    width:60px;
    height:30px;
    line-height:30px;
    color:var(--tone_c);
    font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight:normal;
}



.cursor{

	cursor:pointer;

}

.cursorDown{
	cursor: s-resize;
}

.cursorUp{
	cursor: n-resize;
}

.clear{
	clear:both;
}

body{
user-select: none;
-webkit-touch-callout: none;
font-family: Medium;
}

.gradientDarkUp{

background: -moz-linear-gradient(top,  rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.7) 49%);
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.01) 0%,rgba(0,0,0,0.7) 49%);
background: linear-gradient(to bottom,  rgba(0,0,0,0.01) 0%,rgba(0,0,0,0.7) 49%);

}


.homeText{
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
}

.homeText1e {
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
    font-size:clamp(43px, calc(3.2em + 1vmin), 70px);
	/* font-size: 53px; */
	/* line-height:63px; */
	font-weight:normal;
    line-height:1.2;
}

.homeText1d {
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
    font-size:clamp(43px, calc(2.6em + 1vmin), 63px);
	/* font-size: 53px; */
	/* line-height:63px; */
	font-weight:normal;
    line-height:1.2;
}

.homeText1c {
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 43px; */
    font-size:clamp(20px, calc(2em + 1vmin), 43px);
	font-weight:normal;
}


.homeText1b {
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 33px; */
    
    /* font-size:clamp(23px, 3.6vw, 33px); */
    font-size:calc(1.4em + 1vmin);
	font-weight:normal;
}

.homeText1a {
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 28px; */
    /* font-size:clamp(19px, 3.2vw, 28px); */
    font-size:clamp(24px, calc(1.2em + 1vmin), 28px);
	font-weight:normal;
}

.homeText1 {
font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 24px; */
    /* font-size:clamp(18px, 3vw, 24px); */
    font-size:clamp(21px, calc(1em + 1vmin), 24px);
	font-weight:normal;
}

.homeText2c {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 22px; */
    font-size:clamp(19px, calc(0.8em + 1vmin), 22px);
	font-weight:normal;
}

.homeText2b {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 20px; */
    font-size:clamp(17px, calc(0.7em + 1vmin), 20px);
	font-weight:normal;
}

.homeText2 {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 19px; */
    font-size:clamp(16px, calc(0.6em + 1vmin), 19px);

	font-weight:normal;
}


.homeText3c {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 15px; */

   font-size:clamp(15px, calc(0.5em + 1vmin), 17px);
	font-weight:normal;
}

.homeText3b {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 16px; */
    font-size:clamp(14px, calc(0.6em + 1vmin), 16px);
    
	font-weight:normal;
}

.homeText3a {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 14px; */
    font-size:clamp(13px, calc(0.5em + 1vmin), 15px);

	font-weight:normal;
}

.homeText3 {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 13px; */
    /* font-size:clamp(13px, calc(0.5em + 1vmin), 15px); */
    font-size:clamp(12px, calc(0.4em + 1vmin), 14px);

	font-weight:normal;
}

.homeText4b {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	font-size:clamp(10px, calc(0.3em + 1vmin), 12px);
	font-weight:normal;
}

.homeText4 {
	font-family: Medium, Verdana, Arial, Helvetica, sans-serif;
	/* font-size: 11px; */
    /* font-size: clamp(0.2em,calc(0.3em + 1vmin), 0.8em); */
    font-size:clamp(9px, calc(0.3em + 1vmin), 11px);
	font-weight:normal;
}

.homeText5 {
	font-family:  Medium, Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;

	font-weight:normal;
}

.homeText6 {
	font-family:  Medium, Verdana, Arial, Helvetica, sans-serif;
	font-size: 8px;

	font-weight:normal;
}

.homeText7b {
	font-family:  Medium, Verdana, Arial, Helvetica, sans-serif;
	font-size: 7px;

	font-weight:normal;
}

.homeText7 {
	font-family:  Medium, Verdana, Arial, Helvetica, sans-serif;
	font-size: 6px;

	font-weight:normal;
}


/* end of custom icons */
.disp1 { display:block}
.disp2 { display:none}


.textBold {

	font-weight: bold;
}

.text_center{
    text-align:center;
}

.text_left{
    text-align:left;
}



.textItalic{
font-style:italic;

}



.deepShadow{
	-moz-box-shadow: 12px 32px 18px rgba(0,0,0,.2) ;
	-webkit-box-shadow: 12px 32px 18px rgba(0,0,0,.2) ;
	box-shadow: 12px 32px 18px rgba(0,0,0,.2) ;

}

.deepShadowLeft{
	-moz-box-shadow: -12px 32px 18px rgba(0,0,0,.2) ;
	-webkit-box-shadow: -12px 32px 18px rgba(0,0,0,.2) ;
	box-shadow: -12px 32px 18px rgba(0,0,0,.2) ;

}

.shadowLeft {
	-moz-box-shadow: -8px 8px 8px /*{global-box-shadow-size}*/ 			rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
	-webkit-box-shadow: -8px 8px 8px /*{global-box-shadow-size}*/ 		rgba(0,0,0,.2) /*{global-box-shadow-color}*/;
	box-shadow: -8px 8px 8px /*{global-box-shadow-size}*/ 				rgba(0,0,0,.2) /*{global-box-shadow-color}*/;


}

.shadowDown {
	-moz-box-shadow: 0px 8px 10px rgba(0,0,0,.2);
	-webkit-box-shadow: 0px 8px 10px rgba(0,0,0,.2);
	box-shadow: 0px 8px 10px rgba(0,0,0,.2) ;

}

.shadowRight {
	-moz-box-shadow: 8px 0px 10px rgba(0,0,0,.2);
	-webkit-box-shadow: 8px 0px 10px rgba(0,0,0,.2);
	box-shadow: 8px 0px 10px rgba(0,0,0,.2);

}

.shadowUp {
	-moz-box-shadow: 0px -4px 10px rgba(0,0,0,.2);
	-webkit-box-shadow: 0px -4px 10px rgba(0,0,0,.2);
	box-shadow: 0px -4px 10px rgba(0,0,0,.2) ;

}

.flatShadow{
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.3) ;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.3) ;
	box-shadow: 0px 0px 10px rgba(0,0,0,.3) ;

}

.flatShadowLarge{
	-moz-box-shadow: 0px 0px 16px rgba(0,0,0,.3) ;
	-webkit-box-shadow: 0px 0px 16px rgba(0,0,0,.3) ;
	box-shadow: 0px 0px 16px rgba(0,0,0,.3) ;

}

.normalShadow{
	-moz-box-shadow: 8px 8px 8px rgba(0,0,0,.2);
	-webkit-box-shadow: 8px 8px 8px rgba(0,0,0,.2);
	box-shadow: 8px 8px 8px rgba(0,0,0,.2);
}



.innerflatShadow{
	-moz-box-shadow: inset 0px 0px 12px 			rgba(0,0,0,.3);
	-webkit-box-shadow: inset 0px 0px 12px 			rgba(0,0,0,.3);
	box-shadow: inset 0px 0px 12px 			rgba(0,0,0,.3);

}

.cornersAll{
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;

}


.boxRoll{
	cursor:pointer;
}

.boxRoll:hover {
	
	box-shadow: 0px 0px 20px var(--main);

	cursor: pointer;
}

.glassHilite{
	background-color: var(--glassHilite);

}

.glassHilite2{
	background-color: var(--glassHilite2);

}

.glassBlueDark{
	background-color: var(--glass_blue_dark);

}

.glassMain{
	background-color: var(--glass_main);

}

.glassWhite{
	background-color:rgba(214,236,251,0.2);

}

.glassBlack{

	background-color:rgba(0,0,0,0.8);
}

.glassDark{

	background-color:var(--glassDark);
}

.glassExtraDark{

	background-color:var(--glassExtraDark);
}

.blur {
-webkit-filter: blur(10px); -moz-filter: blur(10px);
-o-filter: blur(10px); -ms-filter: blur(10px);
filter: url(#blur); filter: blur(10px);  
}



@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
	.backBlur {
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	}

	.glassExtraDark{

		background-color:var(--glassExtraDark);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	}

	.glassDark{

		background-color:var(--glassDark);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	}

	.glassBlack{

		background-color:rgba(0, 0, 0, 0.8);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	}

	.glassWhite{
		background-color:rgba(215,217,251,0.15);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	
	}
    .glassMain{
		background-color:var(--glass_main);
		-webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
	
	}

    .glassBlueDark{
        background-color: var(--glass_blue_dark);
        -webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
    
    }

    .glassHilite{
        background-color: var(--glassHilite);
        -webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
    }

    .glassHilite2{
        background-color: var(--glassHilite2);
        -webkit-backdrop-filter: blur(4px);
		backdrop-filter: blur(4px);
    }

  }


.loaderThick {
	border: 6px solid var(--tone_8);
	border-radius: 50%;
	border-top: 6px solid var(--main);

	-webkit-animation: loaderSpin 1s linear infinite; /* Safari */
	animation: loaderSpin 1s linear infinite;
  }

 /* Tooltip container */
 .tooltip-left::after {
	content: " ";
	position: absolute;
	top: 50%; /* At the bottom of the tooltip */
	left: -40px;
	margin-top: -5px;
	border-width: 20px;
	border-style: solid;
	border-color: transparent var(--hilite_2) transparent transparent;
  
}

.tooltip-right::after {
	content: " ";
	position: absolute;
	top: 50%; /* At the bottom of the tooltip */
	left: 100%;
	margin-top: -5px;
	border-width: 20px;
	border-style: solid;
	border-color: transparent transparent transparent var(--hilite_2) ;
  
}

.tooltip-up::after {
	content: " ";
	position: absolute;
	top: 100%; /* At the bottom of the tooltip */
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: var(--hilite_2) transparent transparent transparent;
  
}

.tooltip-down::after {
	content: " ";
	position: absolute;
	bottom: 100%; /* At the bottom of the tooltip */
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent var(--hilite_2) transparent;
  
}
 
.boxContainer{
    display: flex;
    /* justify-content:center; */
    max-width:1400px;
    margin:0 auto;
    border-radius: 30px;
    
}

.boxContainerMedium{
    /* display: flex; */
    /* justify-content:center; */
    max-width:1160px;

    /* margin:0 auto; */
    border-radius: 30px;
    
}

.box80{
    width:80%;
    box-sizing:border-box;
    padding:20px 40px;
  
}

.box70{
    width:70%;
    box-sizing:border-box;
    padding:20px 40px;
  
}

.box60{
    width:60%;
    box-sizing:border-box;
    padding:20px 40px;
  
}

.box40{
    width:40%;
    box-sizing:border-box;
    padding:20px 40px;
  
}

.box50{
    width:50%;
    box-sizing:border-box;
    padding:20px 40px;
   
}

.box33{
    width:33%;
    box-sizing:border-box;
    padding:20px 40px;
   
}

.box30{
    width:30%;
    box-sizing:border-box;
    padding:20px 40px;
}

.box25{
    width:25%;
    box-sizing:border-box;
    padding:20px 40px;
}

.box20{
    width:20%;
    box-sizing:border-box;
    padding:20px 40px;
}

.box10{
    width:10%;
    box-sizing:border-box;
    padding:20px 40px;
}

.box5{
    width:5%;
    box-sizing:border-box;
    padding:20px 40px;
}

.box_side_image{
    min-height:350px;
    height:100%;
}

.box_guides_thumb_container{
    position:relative;
    float:left;
    width:374px;
    height:144px;
    box-sizing:border-box;
    padding:10px;
}

.box_guides_thumbs{
    cursor:pointer;
    background-color:var(--glassDark);
    -webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);

    z-index:1000;
}

.box_guides_thumbs:hover{
    border:thin solid var(--tone_0);
    box-shadow: -1px -1px 8px var(--main), 1px -1px 8px var(--main), -1px 1px 8px var(--main), 1px 1px 8px var(--main);

    background-color:var(--glassHilite);
    animation: scaleProjectThumb 0.5s forwards;
    z-index:2000;
}

.box_project_thumb_container{
    position:relative;
    float:left;
    width:374px;
    height:184px;
    box-sizing:border-box;
    padding:10px;
}

.box_project_thumbs{
    cursor:pointer;
    background-color:var(--glassDark);
    -webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);

    z-index:1000;
}

.box_project_thumbs:hover{
    border:thin solid var(--tone_0);
    box-shadow: -1px -1px 8px var(--main), 1px -1px 8px var(--main), -1px 1px 8px var(--main), 1px 1px 8px var(--main);

    background-color:var(--glassHilite);
    animation: scaleProjectThumb 0.5s forwards;
    z-index:2000;
}



@keyframes scaleProjectThumb {
	0% { transform: scale(1); }
	100% { transform: scale(1.15); }
}

  

.project_thumb{
    background-image: var(--background-image);
    background-size: cover;
    background-position:top right;

}
/* .project_thumb:hover{
    animation: scaleProjectThumb 0.5s forwards;

} */

@media screen and (max-width: 1400px) {
    .boxContainer{
        border-radius:0px;
    }
}

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

    .boxContainerMedium{
       
        border-radius:0px;
    }


}

@media screen and (max-width: 700px) {
    .homeText1 {
        font-size: 15px;
    }

    .homeText2 {
        font-size: 14px;
    }

    .boxContainer{
        display: block;
    }

    .boxContainerMedium{
        display: block;
    }

    .box80{
        width:100%;
      
    }
    
    .box70{
        width:100%;
      
    }

    .box60{
        width:100%;
      
    }
    
    .box40{
        width:100%;
      
    }

    .box50{
        
        width:100%;
    }

    .box33{
        width:100%;
       
    }


    .box30{
        width:100%;
    }

    .box25{
        width:100%;
       
    }

    .box20{
        width:100%;
       
    }

    .box10{
        width:100%;
    }
    
    .box5{
        width:100%;
    }

    .box_side_image{
        min-height:350px;
        height:100%;
    }

    .box_project_thumbs{
        width:100%;
    }
  }
