/**
 * Place for Header & Burger block styles here.

MAIN

*/
 
/* MAIN */
@font-face {
	font-family: 'Gilroy';
	src: url(../includes/fonts/gilroy/Gilroy-Bold.ttf);
}

.layout-header-wrapper {
    position: relative;
    width: 100%;
    top: auto;
    z-index: 10;
}

#block-header {
    display: flex;
    flex-direction: column;
    width: 100%;
    position: fixed;
    background-color: #fff;
}

.page-login-wrapper #block-header {
	display: none;
}

.page-header__upline {
    background: rgba(0,0,0,.7);
    padding-left: 13%;
    padding-right: 13%;
}

.page-header__upline ul {
    padding-left: 0;
    display: flex;
}

.page-header__upline ul > li {
    margin-right: 3em;
    font-size: 14px;
}

.page-header__upline-menu a {
    color: #fff;
}

.page-header {
    padding-left: 13%;
    padding-right: 13%;
    padding-top: 20px;
    padding-bottom: 20px;
}

.page-header > div {
    display: flex;
    justify-content: space-between;
}

.block-header__logo {
    display: flex;
    align-items: center;
}

.block-header__info {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
	height: 70px;
}

.block-header__info  > div {
    /* margin-bottom: 5px; */
}

.block-header__links {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
	height: 70px;
}

.block-header__links > div {
    /* margin-bottom: 5px; */
}

.block-header__links a {
    color: #1d1d1d;
    transition: all .3s ease;
}

.block-header__links a:hover {
    color: #2e6b85;
}

.block-header__links-info-block.phone-block {
    display: grid;
    grid-template-columns: 25px auto 30px 28px;
    align-items: center;
}

.phone-block__telegram svg {
    float: right;
    color: #40B3E0;
    font-size: 18px;
}

.phone-block__whatsapp svg {
    float: right;
    color: #2FB848;
    font-size: 20px;
}

.block-header__links-info-block.email-block {
    display: grid;
    grid-template-columns: 25px auto;
}

.email-block__email {
    text-decoration: none;
    display: block;
    border-bottom: 1px dashed rgba(0,0,0,.5);
    width: fit-content;
}

.block-header__links-info-block.city-block {
    display: grid;
    grid-template-columns: 25px 100px auto;
}

.block-header__links-info-block.city-block svg {
    grid-row: 1;
    grid-column: 1;
}

.block-header__links-info-block.city-block city-block__title {
    grid-row: 1;
    grid-column: 2;
}

.block-header__links-info-block #block-selectcityblock {
    grid-row: 1;
    grid-column: 3;
    position: relative;
}

.block-header__links .placement-delivery {
    display: block !important;
}

.block-header__links #select_city_multilevel .city_groups {
    color: #1d1d1d;
    border-bottom: 1px dashed rgba(0,0,0,.5);
}

.block-header__links #select_city_multilevel .city_groups span {
    text-decoration: none;
}

.block-header__links #select_city_multilevel .city_groups span:hover {
    color: #2e6b85;
}

.page-header__underline {
    background: rgba(0,0,0,.7);
    padding-left: 13%;
    padding-right: 13%;
}

.page-header__underline ul {
    padding-left: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}



.page-header__underline a {
    color: #fff;
}

.block-header__burger {
    cursor: pointer;
}

.burger-button__icon-open {
	width: 55px;
	height: 2px;
	display: grid;
	grid-template-rows: 19px 7px auto;
	background-color: #111;
}

.burger-button__icon-open > span:nth-child(1) {
    grid-row: 1;
	width: 55px;
	height: 2px;
	background-color: #111;
}

.burger-button__icon-open > span:nth-child(2) {
	grid-row: 2;
	width: 55px;
	height: 2px;
	background-color: #111;
}

.burger-button__icon-open > span:nth-child(3) {
	grid-row: 3;
	font-family: Gilroy;
	font-weight: bold;
	font-size: 14px;
}

.block-header__links-info-block__mobile {
    display: none;
}











/* ADAPTIVE */
@media (min-width: 1920px) {
    .page-header__upline,
    .page-header,
    .page-header__underline {
        padding-left: 13%;
        padding-right: 13%;
    }
}

@media (max-width: 1919px) {
    .page-header__upline,
    .page-header,
    .page-header__underline {
        padding-left: 5%;
        padding-right: 5%;
    }
}

@media (max-width: 1919px) {
}

@media (max-width: 1700px) {
}

@media (max-width: 1600px) {
    .page-header__underline ul > li:nth-child(n+9) {
		display: none;
	}
}

@media (max-width: 1440px) {
	.page-header__underline ul > li:nth-child(n+8) {
		display: none;
	}
}

@media (max-width: 1366px) {
}

@media (max-width: 1280px) {
	.page-header__underline ul > li:nth-child(n+7) {
		display: none;
	}
}

@media (max-width: 1150px) {

}

@media (max-width: 1024px) {

}

@media (max-width: 991px) {
	.block-header__info,
	.page-header__underline {
		display: none;
	}
	.page-header {
	    border-bottom: 1px solid rgba(0,0,0,.5);
	}
}

@media (max-width: 834px) {
  
}

@media (max-width: 768px) {
	.block-header__links {
		height: 35px;
	}
	.block-header__links-info-block {
		display: none!important;
	}
	.block-header__links-info-block__mobile {
		display: flex;
	}
	.block-header__links-info-block__mobile > div {
		margin-right: 1em;
	}
}

@media (max-width: 675px) {
	.page-header > div {
	    display: grid;
	    grid-template-columns: 9em 5fr 1fr;
		column-gap: 1em;
	}
	.block-header__links-info-block.phone-block {
	    grid-template-columns: 25px 150px 30px 28px;
	}
	.block-header__links a,
	.block-header__links-info-block {
		font-size: 14px;
	}
	.block-header__links-info-block.city-block {
	    grid-template-columns: 25px 85px auto;
	}
	.block-header__links-info-block__mobile {
		margin-left: 20px;
		justify-content: center;
	}
}

@media (max-width: 480px) {
	.page-header > div {
	    display: grid;
	    grid-template-columns: 7em 5fr 40px;
	    column-gap: 0;
	}
	.burger-button {
		padding-left: 5px;
	}
	.burger-button__icon-open {
		width: 40px;
	}
	.burger-button__icon-open > span:nth-child(1) {
		width: 40px;
	}
	.burger-button__icon-open > span:nth-child(2) {
		width: 40px;
	}
	.page-header__upline {
	    background: rgba(0,0,0,.7);
	}
	.page-header__upline ul {
	    padding-left: 0;
	    display: flex;
	}
	.page-header__upline ul > li {
	    margin-right: 2em;
	    font-size: 12px;
	}
	.block-header__links-info-block__mobile {
		margin-left: 25px;
	}
	.block-header__links-info-block__mobile img {
		width: 36px;
		height: 35px;
	}
}

@media (max-width: 400px) {
	
}

@media (max-width: 350px) {
	.block-header__links-info-block__mobile {
		display: none;
	}
	.page-header__upline ul > li {
	    margin-right: 1.3em;
	    font-size: 12px;
	}
}