@font-face {
	font-family: 'Raleway';
	font-weight: 400;
	src: url('../fonts/Raleway-Regular.ttf');
}
@font-face {
	font-family: 'Raleway'; 
	font-weight: 600; 
	src: url('../fonts/Raleway-SemiBold.ttf');
}
@font-face {
	font-family: 'Arimo';
	font-weight: 400; 
	src: url('../fonts/Arimo-Regular.ttf');
}
@font-face {
	font-family: 'Arimo'; 
	font-weight: 600; 
	src: url('../fonts/Arimo-SemiBold.ttf');
}
@font-face {
	font-family: 'WixMadeforDisplay';
	font-weight: 400; 
	src: url('../fonts/WixMadeforDisplay-Regular.ttf');
}
@font-face {
	font-family: 'WixMadeforDisplay'; 
	font-weight: 600; 
	src: url('../fonts/WixMadeforDisplay-SemiBold.ttf');
}
@font-face {
	font-family: 'Inter';
	font-weight: 400; 
	src: url('../fonts/Inter_28pt-Regular.ttf');
}
@font-face {
	font-family: 'Inter'; 
	font-weight: 600; 
	src: url('../fonts/Inter_28pt-SemiBold.ttf');
}
@font-face {
	font-family: 'NotoSans';
	font-weight: 400; 
	src: url('../fonts/NotoSans-Regular.ttf');
}
@font-face {
	font-family: 'NotoSans'; 
	font-weight: 600; 
	src: url('../fonts/NotoSans-SemiBold.ttf');
}@font-face {
	font-family: 'Onest';
	font-weight: 400; 
	src: url('../fonts/Onest-Regular.ttf');
}
@font-face {
	font-family: 'Onest'; 
	font-weight: 600; 
	src: url('../fonts/Onest-SemiBold.ttf');
}

:root {
	--dark:   #343a40;
	--gray:   #4E5054;
	--muted:  #777777;
	--silver: #bbbbbb;
	--black:  #212529;
	--white:  #FFFFFF;
	--white2: #f9f9f9;
	--blue:   #0d6efd;
	--brown:  #4A3526;
	--pink:   #C6178E;
	--light:  #f2f2f2;
	--navy:   #0a58ca;
	/*--beige:  #DDC49A;*/
	--beige:  wheat;
	
	--pink-dark: #A91478;
}

body {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 25px;
	font-weight: 400;
	color: var(--dark);
}
a {
	color: var(--blue);
	text-decoration: none;
}
	a:hover {
		/*text-decoration: underline;*/
		color: var(--pink);
	}
h1 {
	/*color: var(--blue);*/
}

.body {
	margin-top: 85px;
}

.brown {
	color: var(--brown);
}
.gray {
	color: var(--gray);
}
.silver {
	color: var(--silver);
}
.black {
	color: var(--black);
}
.white {
	color: var(--white);
}
.beige {
	color: var(--beige);
}
.dark {
	color: var(--dark);
}
.bi-square-fill {
	text-shadow: 1px 1px 1px black;
}
.badge {
	text-decoration: none;
}
.muted {
	color: var(--muted);
}
p:last-child {
	margin-bottom: 0;
}

.bi-map:before {
	rotate: 90deg;
}

#menu, #pills, #items, #content, #footer .block {
	margin-top: 1rem;
}
#header {
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 999;
	height: 85px;
}
#header .row {
	background-color: var(--white);
	border-bottom-left-radius: 2rem;
	border-bottom-right-radius: 2rem;
	padding: 1rem 0;
}
#header .descr {
	color: var(--muted);
}
#header .brand {
	max-width: 250px;
}
	#header .brand .sub {
		color: var(--silver);
		font-size: 0.76rem;
		white-space: nowrap;
	}
	#header .brand .logo {
		font-size: 1.75rem;
		white-space: nowrap;
	}
		#header .brand .logo a {
			color: var(--pink);
		}
.glyph {
	position: relative;
	min-width: 52px;
	text-align: center;
}
	.glyph .bi {
		color: var(--silver);
		font-size: 2rem;
		display: inline-block;
	}
	.glyph .badge {
		color: var(--white);
		background-color: var(--pink);
		display: inline-block;
		position: absolute;
		top: 0;
		right: 0;
	}
	.glyph .sig {
		display: block;
		font-size: 0.75rem;
		margin: 0;
		padding: 0;
		color: var(--dark);
		line-height: 0.75rem;
	}
#header .phone a {
	font-size: 1.5rem;
	color: var(--dark);
	text-decoration: none;
	font-weight: 600;
	white-space: nowrap;
}
.geo {
	padding-right: 1rem;
}
	.geo .bi {
		color: var(--silver);
	}
#header .burger {
	width: 36px;
	height: 36px;
	display: none;
}
#header .burger-icon {
	width: 100%;
	height: 100%;
	/*display: block;*/
	border: none;
}
#header .burger-icon.closed {
		background: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' style='fill:rgb(18,26,63)'><rect x='3.8' y='9.1' width='42.3' height='3.2'/><rect x='3.8' y='38.7' width='42.3' height='3.2'/><rect x='3.8' y='23.9' width='42.3' height='3.2'/></svg>") no-repeat center center;
	}
	#header .burger-icon.opened {
		background: url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' style='fill:rgb(18,26,63)'><rect x='3.8' y='23.3' transform='matrix(-0.7071 -0.7071 0.7071 -0.7071 24.9854 60.1493)' width='42.3' height='3.2'/><rect x='3.8' y='23.3' transform='matrix(-0.7071 0.7071 -0.7071 -0.7071 60.1993 24.8646)' width='42.3' height='3.2'/></svg>") no-repeat center center;
	}

#menu ul {
	display: flex;
    flex-flow: row;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    font-weight: 600;
	margin: 0;
	align-items: center;
}
	#menu ul li a {
		text-decoration: none;
		text-transform: uppercase;
		color: var(--dark);
		line-height: 26px;
		margin-bottom: 0;
		white-space: nowrap;
		margin-right: 1rem;
	}
	#menu ul li a:hover,
	#menu ul li a.active {
		color: var(--pink);
		border-bottom: 2px Solid var(--dark);
		margin-bottom: -2px;
	}
.menu_social {
	display: flex;
    flex-flow: row;
    justify-content: end;
}
	.menu_social img {
		width: 36px;
		margin-left: 0.5rem;
		/*filter: grayscale(100%);*/
	}
	
#pills a {
	font-size: 0.9rem;
	padding: 0.4rem 0.8rem;
	font-weight: 400;
	margin-bottom: 0.5rem;
}
	#pills a.badge {
		color: var(--white);
		background-color: var(--blue);
	}
	#pills a.badge.active,
	#pills a.badge:hover {
		background-color: var(--navy);
	}
#items .list {
	border-radius: 1rem;
	background: var(--light);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-column-gap: 1rem;
	grid-row-gap: 1rem;
	padding: 1rem;
}
	#items .item {
		box-sizing: border-box;
		margin: 0;
		cursor: pointer;
	}
		#items .item a:hover {
			text-decoration: none;
		}
		#items .item .info {
			background-color: var(--white);
			padding: 1rem;
			border-bottom-left-radius: 1rem;
			border-bottom-right-radius: 1rem;
		}
		#items .item .image img {
			border: none;
			width: 100%;
		}
		#items .item .buttons {
			text-align: center;
			margin-top: 0.5rem;
			width: 100%;
		}
			#items .item .buttons .btn {
				width: 50%;
			}
		#items .item .descr,
		#items .item .title {
			background-color: var(--dark);
			color: var(--white);
			display: flow-root;
			font-size: 1.2rem;
			padding: 0.5rem;
		}
			#items .item .descr .thickness {
				/*color: var(--white)*/
			}
			#items .item .descr .resistance {
				/*color: var(--white)*/
			}
		#items .item .title {
			text-align: center;
			text-transform: uppercase;
			border-top-left-radius: 1rem;
			border-top-right-radius: 1rem;
		}
			.badge.brown,
			#items .item .title.brown a,
			#items .item .title.brown,
			#items .item .descr.brown {
				background-color: var(--brown);
				color: var(--white);
			}
			.badge.black,
			#items .item .title.black a,
			#items .item .title.black,
			#items .item .descr.black {
				background-color: var(--black);
				color: var(--white);
			}
			.badge.gray,
			#items .item .title.gray a,
			#items .item .title.gray,
			#items .item .descr.gray {
				background-color: var(--dark);
				color: var(--white);
			}
			.badge.beige,
			#items .item .title.beige a,
			#items .item .title.beige,
			#items .item .descr.beige {
				color: var(--dark);
				background-color: var(--beige);
			}
			.badge.silver,
			#items .item .title.silver a,
			#items .item .title.silver,
			#items .item .descr.silver {
				color: var(--dark);
				background-color: var(--silver);
			}
			.badge.white,
			#items .item .title.white a,
			#items .item .title.white,
			#items .item .descr.white {
				color: var(--dark);
				background-color: var(--white);
			}
			#items .item .descr.white {
				background-color: var(--white2);
			}
		#items .item .summary {
			color: var(--dark);
		}

			#items .item .summary:hover {
				color: var(--blue);
			}
		#items .item.more .title a,
		#items .item.more .title,
		#items .item.more .descr {
			background-color: var(--pink);
			color: var(--white);
			text-align: center;
			text-transform: uppercase;
		}
#items .price {
	/*text-align: center;*/
	margin-bottom: 0.5rem;
}
	#items .price .first,
	#item .price .first {
		color: var(--pink);
		font-weight: 600;
		font-size: 1.5rem;
		text-transform: uppercase;
	}
	#items .price .strike,
	#item .price .strike {
		color: var(--gray);
		font-size: 1rem;
		text-decoration: line-through;
	}
#items .summary {
	font-weight: 400;
	line-height: 20px;
}
#content .content {
	border-radius: 1rem;
	background: var(--light);
	padding: 1rem;
}
#footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
	#footer .content {
		/*background-color: var(--silver);*/
		padding: 1rem;
		border-top-left-radius: 1rem;
		border-top-right-radius: 1rem;
		font-size: 0.9rem;
	}
	#footer .heading {
		font-weight: 600;
		display: block;
		margin-bottom: 0.5rem;
		padding-bottom: 0.5rem;
		border-bottom: 1px Solid var(--silver);
	}
	#footer a {
		color: var(--gray);
	}
		#footer a:hover {
			color: var(--pink);
		}
		
#footer-menu {
	display: none;
	z-index: 100;
}

#mobile-menu {
	background-color: var(--white);
	position: fixed;
	top: calc(85px - 0.5rem);
	z-index: 99;
	width: 100%;
	height: calc(100% - 42px - 75px - 1rem + 0.5rem);
	display: none;
}
	#mobile-menu ul {
		padding: 0;
		margin: 0;
		list-style: none;
	}
		#mobile-menu ul li a {
			font-weight: 600;
			text-transform: uppercase;
			color: var(--gray);
			line-height: 2rem;
		}
			#mobile-menu ul li a:hover {
				color: var(--pink);
			}
	#mobile-menu .menu_social {
		justify-content: start;
		margin-top: 1rem;
	}
		#mobile-menu .menu_social img {
			width: 48px;
			margin-left: 0;
			margin-right: 0.5rem;
		}
	#mobile-menu .col.phone {
		margin-top: 1rem;
	}
		#mobile-menu .col.phone a {
			font-weight: 600;
			font-size: 1.5rem;
			color: var(--gray);
		}
	#mobile-menu .col.address {
		margin-top: 1rem;
	}
	
#item .gallery img {
	width: 100%;
	border-radius: 1rem;
	margin-bottom: 1rem;
}
	#item .gallery .thumbs {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-column-gap: 0.5rem;
		grid-row-gap: 0;
	}
		#item .gallery .thumbs img {
			opacity: 0.5;
			cursor: pointer;
		}
			#item .gallery .thumbs img.active {
				opacity: 1;
			}
#item .filters .badge {
	font-size: 0.9rem;
    line-height: 1.1rem;
    font-weight: 400;
    margin: 0 0.25rem 0.5rem 0;
	border: 1px Solid transparent;
}
	#item .filters .badge:hover,
	#item .filters .badge.active {
		border-color: var(--pink);
	}
	#item .filters .sizes .badge {
		width: 48px;
	}
#item .filters ul {
	padding: 0;
	list-style: none;
	display: flex;
}
	#item .filters ul li {
		padding: 0.25rem;
		margin: 0 0.5rem 0.5rem 0;
		border-bottom: 1px Solid var(--silver);
		border-radius: 0.5rem;
	}
#item .table {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 0.5rem;
	grid-row-gap: 0;
	font-size: 0.9rem;
	background-color: var(--white);
	border-radius: 0.5rem;
	padding: 0.5rem 1rem;
	white-space: nowrap;
}
	#item .title {
		font-weight: 600;
	}
	#item .table > * {
		/*border-bottom: 1px Solid var(--silver);*/
	}
#item .incart {
	width: 100%;
	white-space: nowrap;
	text-align: center;
	margin-bottom: 1rem;
	height: 48px;
	align-items: center;
	display: flex;
    justify-content: center;
}
	#offer .incart .cart,
	#offer .incart .attr,
	#item .incart .cart,
	#item .incart .attr {
		white-space: nowrap;
		cursor: default;
		pointer-events: none;
	}
#item .price,
#item .tocart {
	text-align: center;
	margin-bottom: 1rem;
	height: 48px;
	align-items: center;
	display: flex;
    justify-content: center;
}
#item .create {
	margin-top: 0.5rem;
}
#item .tocart .btn,
#item .create .btn {
	width: 100%;
	text-align: center;
	display: block;
}
#item .description {
	margin-bottom: 0.5rem;
	font-size: 0.9rem;
	line-height: 1.2rem;
	padding: 1rem;
	border-radius: 1rem;
	background-color: var(--white);
}

.hint {
	padding: 1rem;
	background-color: var(--white);
	border-radius: 1rem;
	height: 100%;
}
small {
	font-size: 0.8rem;
}
.box {
	background: var(--light);
	border-radius: 1rem;
	padding: 1rem;
}
.btn.pink {
	background-color: var(--pink);
	border-color: var(--pink-dark);
}
	.btn.pink:hover {
		background-color: var(--pink-dark);
	}
.toggle {
	cursor: pointer;
	border-bottom: 1px dashed;
}
.spacer {
	height: 1rem;
}

#ModalCart .title {
	/*text-align: center;*/
}
	#ModalCart .price,
	#ModalCart .name {
		font-weight: 400;
	}

@media (max-width: 1200px) {
	.md-hidden {
		display: none;
	}
	#items .list {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 992px) {
	.md-hidden,
	.sm-hidden {
		display: none !important;
	}
	#items .list {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	#menu,
	.md-hidden,
	.sm-hidden,
	.xs-hidden {
		display: none !important;
	}
	#items .list {
		grid-template-columns: repeat(2, 1fr);
	}
	#header .burger {
		display: block !important;
	}
	#header .brand .sub {
		color: var(--gray);
	}
	html, body {
		overflow-x: hidden;
	}
	#footer-menu {
		position: fixed;
		bottom: 0;
		background-color: var(--white);
		width: 100%;
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
		display: block;
	}
	#footer {
		margin-bottom: 50px;
	}
}

@media (max-width: 498px) {
	#items .list {
		border-radius: 1rem;
		background: var(--light);
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-column-gap: 0.25rem;
		grid-row-gap: 0.5rem;
		padding: 0.25rem;
	}
	#items .buttons .btn-primary {
		display: none;
	}
	#items .buttons.offer .btn {
		display: block;
	}
	#items .buttons .btn {
		border-top-right-radius: var(--bs-border-radius-sm);
		border-bottom-right-radius: var(--bs-border-radius-sm);
	}
	#header .row {
		padding-bottom: 0.5rem;
		border-radius: 0;
	}
	#items, #content, #footer, #item, #about, #pages {
		margin-left: -1rem;
		margin-right: -1rem;
	}
	#items .item.more .descr {
		font-size: 1rem;
	}
	#items .item .title {
		border-top-left-radius: 0.5rem;
		border-top-right-radius: 0.5rem;
	}
	#items .item .info {
		border-bottom-left-radius: 0.5rem;
		border-bottom-right-radius: 0.5rem;
	}
	#items .list,
	#content .content {
		border-radius: 0.5rem;
	}
}

