/*Variable css*/
:root {
	/*--default-container-max-width        : 92%;*/
	--margin-for-default-container       : 4%;
	--margins-for-default-container      : calc(var(--margin-for-default-container) * 2);
	--default-container-max-width        : calc(100% - var(--margins-for-default-container));

	--primary-color                      : #1a1a1a;
	--secondary-color                    : #998047;
	--third-color                        : #C2A666;

	--price-color                        : var(--primary-color);

	--btn-primary-color                  : white;
	--btn-primary-color--is-hover        : var(--primary-color);
	--btn-primary-bg-color               : var(--primary-color);
	--btn-primary-bg-color--is-hover     : white;
	--btn-primary-border-color           : var(--primary-color);
	--btn-primary-border-color--is-hover : var(--primary-color);

	--input-focus-color                  : var(--primary-color);

	--link-color-on-hover                : var(--secondary-color);

	--product-flag-bg-color              : var(--primary-color);

	--nav-bg--color                      : white;

	/*FONTS*/

	
	/*--second-font: 'Futura LT Condensed';*/
	--main-font: 'Poppins', sans-serif;
	--regular-font                       : 'poppins-regular', sans-serif;
	--medium-font                        : 'Poppins-Medium', sans-serif;
	--extralight-font                    : 'Poppins-ExtraLight', sans-serif;
	--thin-font                          : 'Poppins-Thin', sans-serif;
}

@font-face {
	font-family: "myFont";
	src: url("../../fonts/material/material.ttf") format('truetype');
	font-style: normal;
}


@media screen and (min-width: 768px) {
	:root {
		--nav-bg--color: #f7f7f7;
	}
}

@media screen and (min-width: 1024px) {
	:root {
		/*--default-container-max-width  : 85%;*/
		--margin-for-default-container: 7.5%;
	}
}

@media screen and (min-width: 1200px) {
	:root {
		/*--default-container-max-width : 80%;*/
		--margin-for-default-container: 10%;
	}
}
