#bg {
display: none;
}
:root {
--c-white: #FFFFFF;
--c-white-opacity-90:rgba(255, 255, 255, 0.9);
--c-black: #313C4E;
--c-black-deep: #212A38;
--c-main: #2B5DA2;
--c-main-deep: #275391;
--c-main-bright: #336FC2;
--c-accent: #F0A93B;
--c-accent-hover: #FEB645;
--c-additional: #62738D;
--c-additional-2:#495974;
--c-gray-1:#D0D7E1;
--c-gray-2:#F3F4F7;
--c-gray-3:#8A97AD;
--c-gray-4:#EDEFF3;
--c-overlay: rgba(49, 60, 78, 0.5);
--siteMaxWidth: 1440px;
--siteMinWidth: 320px;
--gridWidth: 1160px;
--gridPadding: 15px;
--baseFontFamily: "Tahoma", sans-serif;
--baseFontSize: 16px;
--baseLineHeight: 1.4;
--baseFontWeight: normal;
--borderRadius: 8px;
--borderRadiusLarge: 12px;
--boxShadow: 0px 0px 20px rgba(43, 93, 162, 0.08), 0px 0px 10px rgba(43, 93, 162, 0.06), 0px 0px 8px rgba(43, 93, 162, 0.08), inset -4px -4px 4px rgba(43, 93, 162, 0.12), 3px 3px 3px rgba(255, 255, 255, 0.2);
--boxShadow-2:4px 4px 6px rgba(43, 93, 162, 0.06), 2px 2px 4px rgba(43, 93, 162, 0.08), inset -2px -2px 4px rgba(43, 93, 162, 0.1);
--boxShadow-3:4px 4px 6px rgba(43, 93, 162, 0.06);
--transition-all: all 0.3s ease-in-out;
--transition-glow: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
--btnHeight: 48px;
--btnPadding: 16px 28px;
--btnBorder: 2px solid transparent;
--btnBorderRadius: var(--borderRadius);
--inputHeight: 48px;
--inputPaddingX: 20px;
--inputPaddingY: 13px;
--inputPadding: var(--inputPaddingY) var(--inputPaddingX);
--inputBgColor: var(--c-white);
--inputBorderRadius: var(--borderRadius);
--hero-gray: #F3F4F7;
--hero-secondary-gray: #EDEEF1;
--primary-blue: #2B5DA2;
--primary-gray: #313C4E;
--secondary-gray: #62738D;
}
.btn {
position: relative;
overflow: hidden;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
height: var(--btnHeight);
padding: var(--btnPadding);
font-weight: 700;
font-size: 14px;
text-decoration: none;
text-transform: uppercase;
color: var(--c-white);
background-color: var(--c-main);
border-radius: var(--btnBorderRadius);
}
.btn:hover {
background-color: var(--c-main-bright);
}
.btn:active {
-webkit-transform: scale(1.02) translateZ(0);
transform: scale(1.02) translateZ(0);
}
.btn[disabled] {
background-color: var(--c-gray-1);
pointer-events: none;
}
.btn--orange {
background-color: var(--c-accent);
}
.btn--orange:hover {
background-color: var(--c-accent-hover);
}
.btn--wide {
width: 100%;
}
.header img {
max-width: 100%;
height: auto;
width: auto;
}
.header img:not[class] {
width: 100%;
}
.header svg {
width: var(--iconSize);
height: var(--iconSize);
}
.animate {
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.header, .footer {
-webkit-box-flex: 0;
-webkit-flex: 0 0 auto;
flex: 0 0 auto;
}
.header__cities-list-wrapper {
max-height: 500px;
overflow-y: auto;
overflow-x: hidden;
}
.header__cities-list-wrapper {
width: fit-content !important; }
.header__cities-list-wrapper::-webkit-scrollbar:vertical {
width: 11px;
}
.header__cities-list-wrapper::-webkit-scrollbar {
-webkit-appearance: none;
}
.header__cities-list-wrapper::-webkit-scrollbar-thumb {
border-radius: 8px;
border: 2px solid white;
background-color: var(--c-main);
}
.header__cities-list-wrapper::-webkit-scrollbar-track {
background-color: #fff;
border-radius: 8px;
}
.header {
position: fixed;
z-index: 100;
top: 0;
left: 0;
width: 100%;
-webkit-transition: var(--transition-all);
transition: var(--transition-all); background: var(--c-white);
}
@media (max-width: 1024px) {
.header {
--paddingY: 12px ;
}
}
.header.fixed { border-bottom: 1px solid var(--c-gray-2);
}
.header.fixed .header__inner {
--paddingY: 12px;
}
.header__inner {
--paddingY: 24px;
padding-top: var(--paddingY);
padding-bottom: var(--paddingY);
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
.header__menu {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
flex-grow: 1;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
font-size: 16px;
}
@media (max-width: 1024px) {
.header__menu {
--paddingY: 30px;
position: fixed;
overflow-y: auto;
z-index: 10;
top: 0;
left: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
width: 100vw;
height: 100vh;
padding-top: var(--paddingY);
padding-bottom: var(--paddingY);
background-color: var(--c-gray-2);
opacity: 0;
}
.header__menu.opened {
left: 0;
opacity: 1;
}
}
.header__logo:not(:last-child) {
margin-right: 30px;
}
.header__navigation {
width: 100%;
}
.header__navigation:not(:last-child) {
margin-right: 30px;
}
@media (max-width: 1024px) {
.header__navigation:not(:last-child) {
margin-right: 0;
margin-bottom: 22px;
}
.header .navigation {
justify-content: flex-start;
}
.submenu__list {
border-radius: 14px;
box-shadow: 4px 4px 6px 0 rgba(43, 93, 162, 0.06), -2px 2px 6px 0 rgba(43, 93, 162, 0.08);
font-size: 14px;
padding: 18px;
}
.submenu__list > li:not(:last-child) {
margin-bottom: 6px;
}
.submenu__list a:hover {
color: #F0A93B;
}
.navigation__item.dropdown .navigation__link {
display: flex;
gap: 6px;
align-items: center;
}
.navigation__item.dropdown .navigation__link svg {
width: 16px;
height: 16px;
}
.header__logo:not(:last-child) {
margin-right: 34px;
}
.header__navigation {
max-height: 55vh;
overflow-y: auto;
}
}
@media (max-width: 767.98px) {
.header {
background-color: #fff;
}
.navigation .dropdown {
max-height: initial;
}
.navigation .dropdown-menu {
max-height: initial;
}
.navigation .submenu__list {
display: block;
}
.header__inner {
z-index: 50;
position: relative;
}
}
.overlay {
z-index: 10;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
transition: 0.3s;
}
.overlay:not(.active) {
opacity: 0;
pointer-events: none;
visibility: hidden;
}
.off-canvas {
position: fixed;
top: 0px;
left: 0;
z-index: 20;
width: 100%;
border-radius: 0 0 20px 20px;
background-color: #313c4e;
color: #fff;
padding: 84px 16px 24px;
box-sizing: border-box;
max-height: 100dvh;
overflow-y: auto;
transition: 0.4s;
}
.off-canvas:not(.active) {
transform: translateY(-103%);
}
.off-canvas-nav {
font-size: 16px;
text-align: center;
}
.off-canvas-nav a {
color: rgb(49, 60, 78);
text-decoration: none;
color: #fff;
}
.off-canvas-nav-list > li {
margin-bottom: 24px;
}
.off-canvas-nav-list > li:last-child {
margin-bottom: 0;
}
.off-canvas-nav-list > li.has-children {
margin-bottom: 24px;
border-bottom: 1px solid rgb(207, 210, 217);
padding-bottom: 24px;
}
.off-canvas-nav .has-children > a {
color: rgb(98, 115, 141);
font-size: 14px;
color: #fff;
}
.off-canvas-nav .sub-menu {
margin-top: 16px;
}
.off-canvas-nav .sub-menu > li:not(:last-child) {
margin-bottom: 8px;
}
@media (min-width: 1025px) {
.off-canvas {
display: none;
}
.overlay {
display: none;
}
}
.header__actions {
-webkit-flex-shrink: 0;
flex-shrink: 0;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
@media (max-width: 1024px) {
.header__actions {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
flex-direction: column;
}
}
.header__sign-in {
display: inline-flex;
width: 32px;
height: 32px;
border-radius: var(--borderRadius);
}
.header__sign-in:not(:last-child) {
margin-right: 20px;
}
@media (max-width: 1024px) {
.header__sign-in:not(:last-child) {
margin-right: 0;
margin-bottom: 22px;
}
}
.header__sign-in:hover svg path, .header__sign-in:active svg path, .header__sign-in[disabled] svg path {
stroke: var(--c-white);
}
.header__sign-in:hover {
background-color: var(--c-main);
}
.header__sign-in:active {
background-color: var(--c-main-deep);
-webkit-transform: scale(1.05) translateZ(0);
transform: scale(1.05) translateZ(0);
}
.header__sign-in[disabled] {
background-color: var(--c-gray-1);
pointer-events: none;
}
.header__sign-in svg {
--size: 100%;
}
.header__burger-button.burger-button {
display: none;
}
@media (max-width: 1024px) {
.header__burger-button.burger-button {
display: -webkit-box;
display: -webkit-flex;
display: flex;
}
}
.logo__link {
display: -webkit-box;
display: -webkit-flex;
display: flex;
}
.logo__link:hover {
opacity: 0.9;
}
@media (max-width: 767px) {
.logo__image.logo__image {
max-width: 115px;
}
.header__logo.active .logo__link img:last-child {
display: block;
}
.header__logo.active .logo__link img:first-child {
display: none;
}
}
.burger-button {
position: relative;
z-index: 10;
display: -webkit-box;
display: -webkit-flex;
display: flex;
width: 32px;
height: 32px;
background-color: transparent;
border: none;
cursor: pointer;
}
.burger-button:focus {
outline: none;
}
.burger-button svg {
width: 100%;
height: 100%;
}
.burger-button__line {
fill: none;
stroke: var(--c-black);
stroke-width: 6;
-webkit-transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1), stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1), stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.burger-button__line--1 {
stroke-dasharray: 60 207;
stroke-width: 6;
}
.burger-button__line--2 {
stroke-dasharray: 60 60;
stroke-width: 6;
}
.burger-button__line--3 {
stroke-dasharray: 60 207;
stroke-width: 6;
}
.burger-button.opened .burger-button__line--1 {
stroke-dasharray: 90 207;
stroke-dashoffset: -134;
stroke-width: 6;
}
.burger-button.opened .burger-button__line--2 {
stroke-dasharray: 1 60;
stroke-dashoffset: -30;
stroke-width: 6;
}
.burger-button.opened .burger-button__line--3 {
stroke-dasharray: 90 207;
stroke-dashoffset: -134;
stroke-width: 6;
}
.burger-button.opened .burger-button__line {
stroke: #fff;
}
.logo__link img:last-child {
display: none;
}
.header.fixed .menu-categories {
padding: 12px 0;
}
body.logged-in .header {
top: 32px !important;
}
@media (max-width: 782px) {
body.logged-in .header {
top: 46px !important;
}
}
.sign-up {
cursor: pointer;
}
.header__signup-block {
display: none;
}
@media (max-width: 1024px) {
.header__inner {
display: grid;
grid-template-columns: max-content max-content 1fr;
}
.header__logo {
width: 100%;
order: 2;
justify-self: flex-start;
}
.header__burger-button {
justify-self: flex-start;
order: 1;
}
.header__signup-button {
background-color: var(--primary-blue);
padding: 9px 15px;
font-size: 12px;
font-weight: 700;
color: #fff;
border-radius: 8px;
text-decoration: none;
}
.header__signup-block {
display: flex;
align-items: center;
order: 3;
justify-self: flex-end;
}
.header__signup-block .header__sign-in {
margin-bottom: 0;
margin-right: 12px;
}
.header__logo {
margin-left: 16px;
}
}
.navigation__item.dropdown.showmobile .submenu__list li:not(:last-child) {
margin-bottom: 14px;
}
.navigation__item.dropdown.showmobile .submenu__list {
background-color: transparent !important;
box-shadow: none !important;
}
.navigation__item.dropdown.showmobile .submenu__list .submenu__link {
color: #fff !important;
}
.header-language-switcher {
margin-right: 20px;
}
.header-language-switcher .blog-nav-button {
background-color: #f8f8f8;
height: 42px;
border-radius: 8px;
}
.header-language-switcher .blog-nav-button svg {
color: #2B5DA2;
}
.header-language-switcher .blog-nav-dropdown-list {
max-height: 285px;
}
@media (min-width: 768px) {
.header__signup-block > .header-language-switcher {
display: none;
}
}
@media (max-width: 767.98px) {
.header__signup-button {
font-size: 10px;
padding-left: 10px;
padding-right: 10px;
}
.header__sign-in {
width: 24px;
height: 24px;
}
.header__signup-block .header__sign-in {
margin-right: 8px;
}
.header__signup-block .header-language-switcher {
margin-right: 10px;
}
.header__signup-block .header-language-switcher .blog-nav-button {
padding: 0 8px;
height: 38px;
font-size: 14px;
}
.header__signup-block .header-language-switcher .blog-nav-button svg {
width: 16px;
height: 16px;
}
.header__logo:not(:last-child) {
margin-right: 10px;
}
}
@media (max-width: 1023.98px) {
.off-canvas-nav {
text-align: left;
}
}