:root {
	/* BORDER */
	--border-radius: 20px;
	--border-radius-input: 10px;
	--border-width: 1px;
		
	/* WRAPPER */
	--wrapper-size: 1500px;
	--wrapper-size-small: 800px;
    --logo-ratio: 139 / 66;
			
	/* COLORS */
	--background-color: #FFFFFF;
	--background-grey: #F0F0FF;
	--background-dark: linear-gradient(270deg, #0010A3 0%, #192D64 100%);
	--background-socket: #192D64;
	
	--dark-title-color: #192D64;
	--light-title-color: #FFFFFF;
	--dark-text-color: 25, 45, 100;
	--light-text-color: 252, 255, 255;
	
	--primary-color: #3C50FF;
	--primary-hover-color: #2030e2;
	--primary-focus-color: #1d2cb6;
	--primary-rgb: 60, 80, 255;
	
	--secondary-color: #FFD750;
	--secondary-hover-color: #f9a007;
	--secondary-focus-color: #dd7802;
	--secondary-rgb: 255, 215, 80;
		
	
	/* FONTS */
	--font-title: 'Barlow Semi Condensed';
	--font-text: 'Zen Kaku Gothic Antique';
		
	
	/* FONT SIZES */
	--h1-font-size: 3.125rem;
	--h2-font-size: 3.75rem;
	--h3-font-size: 2.5rem;
	--h4-font-size: 1.875rem;
	--h5-font-size: 1.25rem;
	--subtitle-font-size: 1.25rem;
	
	
	/* MARGES */
	--margin-h2: 4.375rem;
	--margin-h3: 3.75rem;
	--margin-h4: 2.5rem;	
	--margin-h2-blog: 1.25rem;
	--margin-h3-blog: .9375rem;
		
	
	/* Archives */
	--items-by-row: 4;
	--items-margin: 30px;
}




/* ----------------------------------- */
/*
/* ----------- RESPONSIVE ------------ */
/*
/* ----------------------------------- */
@media screen and (min-width: 1251px) {
	
}



@media screen and (max-width: 1250px) {
	
	:root{
		--items-by-row: 3;
		--items-margin: 20px;
	}	
}



@media screen and (max-width: 1140px) {
	
    :root{        
        --margin-h2: 3.125rem;
        --margin-h3: 2.5rem;
    }
}



@media screen and (max-width: 989px) {
	
	:root{
		--h2-font-size: 3.75rem;
		--h3-font-size: 2.5rem;
		--items-by-row: 2;
	}	
}



@media screen and (max-width: 767px) {
	
	:root{
		--h2-font-size: 3.125rem;
		--h3-font-size: 1.5625rem;
        --h4-font-size: 1.25rem;
	    --subtitle-font-size: 1.125rem;
	}	
}



@media screen and (max-width: 575px) {
	
	:root{	
		--h2-font-size: 2.5rem;
		--margin-h2: 2.5rem;
    	--margin-h3: 1.875rem;
	    --margin-h4: 1.5625rem;
		--items-margin: 15px;
	}	
}



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



@media screen and (max-width: 375px) {
	
	:root{
		--h2-font-size: 1.875rem;
		--h3-font-size: 1.25rem;
        --h4-font-size: 1.125rem;
	    --subtitle-font-size: .9375rem;		
    	--margin-h2: 1.5625rem;
    	--margin-h2: 1.5625rem;
		--items-by-row: 1;
	}
}



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