:root
{
	
	--font-family-default: 'Fira Sans', sans-serif;
	--font-family-heading: 'Oswald', sans-serif;
	--bg-primary: #00a5f1;					/*	used only in buttons.css */
	--bg-primary-hover: #008bcd;			/*	used only in buttons.css */
	--bg-default: #4e4e4e;					/*	used in generic.css (dev.mai.ru) */
	--bg-secondary: #434343;				/*	not used */
	--bg-info: rgba(0,165,240, .1);			/*	used only in buttons.css */
	--bg-info-hover: rgba(0,165,240, .4);	/*	*/
	--bg-card-default: white;				/*	used only in contacts.css */
	
	--color-text-default: #eee;				/*	used in generic.css (dev.mai.ru) */
	--color-text-primary: #2d11ff;			/*	main.css, hero.css */
	--color-text-blueindark: #7787ff;		/*	not used */
	--color-link-menu: #eee;				/*	mainmenu.css, layout.css */
	--color-link-menu-hover: #95ddff;		/*	mainmenu.css, layout.css */
	--color-link-default: #95ddff;			/*	main.css, cards.css, buttons.css */
	--color-hover-default: #56c3f7;			/*	main.css, buttons.css */
	--color-link-secondary: white;			/*	not used */
	--color-hover-secondary: rgba(255,255,255, .6);	/*	*/
	--color-text-muted: rgba(0,0,0, .6);			/*	main.css, generic.css */
	--color-text-dark: black;				/*	main.css */
	--color-text-accent: #ff9000;			/*	main.css */
	
	--color-state: #4d34ff;					/*	contacts.css */
	--color-action: #ff9000;				/*	cards.css */
	
	--vp-padding-x: 3vw;					/*	layout.css, sections.css, section.home.css */
	--topbar-height: 11vh;					/*	layout.css, section.home.css, hero.css */	
	--section-default-left-width: 20vw;
	--section-default-right-width: 20vw;
}

@media all and (min-width:1200px)
{
	:root
	{
		--vp-padding-x: 1.8vw;
	}
}
@media all and (min-width: 1540px) and (max-width: 1799.98px)
{
	:root
	{
		--section-default-left-width: 16vw;
		--section-default-right-width: 16vw;
	}
}
@media all and (min-width: 1200px) and (max-width: 1539.98px)
{
	:root
	{
		--topbar-height: 14vh;
		--section-default-left-width: 14vw;
		--section-default-right-width: 14vw;
	}
}
@media all and (min-width: 1200px) and (max-width: 1299.98px)
{
	:root
	{
		--topbar-height: 10vmax;
		--section-default-left-width: 7vmax;
		--section-default-right-width: 7vmax;
	}
}
@media all and (min-width: 992px) and (max-width: 1199.98px)
{
	:root
	{
		--topbar-height: 10vmax;
		--section-default-left-width: 10vmax;
		--section-default-right-width: 10vmax;
	}
}
@media all and (min-width: 768px) and (max-width: 991.98px)
{
	:root
	{
		--section-default-left-width: 8vmax;
		--section-default-right-width: 8vmax;		
	}
}
@media all and (max-width: 991.98px)
{
	:root
	{
		--topbar-height: 16vmax;		
	}
}



@media all and (max-width: 379.98px) and (orientation: portrait)
{
	:root
	{
		--vp-padding-x: 20px;
		--topbar-height: 15vmax;
	}
}

/*	cards.css, tiles.css, tilenews.css */


:root
{
	--card-holder-margin: -10px;
	--card-margin: 10px;
	--card-border-radius: 5px;
}
@media all and (max-width: 575.98px)
{
	:root
	{	
		--card-holder-margin: -6px;
		--card-margin: 6px;
		--card-border-radius: 5px;
	}
}