.top-line{
    border-bottom: 1px solid #ccc;
}
.top_line-menu{
    display:flex;
    list-style: none;
}
.top_line-menu li{
    margin-right:15px;
}
.top_line-menu li a{
    color: #404040;
    font-size: 14px;
}

.top_line-menu li a:hover{
    color: #0169f4;
}
.svg-wrapper {
    display: inline-block;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    margin-right: 10px;
}
.svg-phone {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='%232d67f3'%3E%3Cpath d='M17.167,16.155a2.5,2.5,0,0,0-3.535,0l-.385.384A46.692,46.692,0,0,1,7.458,10.75l.385-.385a2.5,2.5,0,0,0,0-3.536L5.721,4.708a2.5,2.5,0,0,0-3.535,0L1.022,5.872a3.51,3.51,0,0,0-.442,4.4A46.932,46.932,0,0,0,13.722,23.417a3.542,3.542,0,0,0,4.4-.442l1.165-1.164a2.5,2.5,0,0,0,0-3.535Z' /%3E%3Cpath d='M11.5,0a1,1,0,0,0,0,2A10.512,10.512,0,0,1,22,12.5a1,1,0,1,0,2,0A12.515,12.515,0,0,0,11.5,0Z' /%3E%3Cpath d='M11.5,6A6.508,6.508,0,0,1,18,12.5a1,1,0,0,0,2,0A8.51,8.51,0,0,0,11.5,4a1,1,0,1,0,0,2Z' /%3E%3Cpath d='M11.5,10A2.5,2.5,0,0,1,14,12.5a1,1,0,0,0,2,0A4.505,4.505,0,0,0,11.5,8a1,1,0,1,0,0,2Z' /%3E%3C/svg%3E")
}
.svg-email {
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' version='1.1' width='512' height='512' x='0' y='0' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512' xml:space='preserve' class=''%3E%3Cg%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M507.49 101.721L352.211 256L507.49 410.279c2.807-5.867 4.51-12.353 4.51-19.279V121 C512 114.073 510.297 107.588 507.49 101.721z' fill='%23404040' data-original='%23000000' style='' class=''/%3E%3C/g%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M467 76H45c-6.927 0-13.412 1.703-19.279 4.51l198.463 197.463c17.548 17.548 46.084 17.548 63.632 0L486.279 80.51 C480.412 77.703 473.927 76 467 76z' fill='%23404040' data-original='%23000000' style='' class=''/%3E%3C/g%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M4.51 101.721C1.703 107.588 0 114.073 0 121v270c0 6.927 1.703 13.413 4.51 19.279L159.789 256L4.51 101.721z' fill='%23404040' data-original='%23000000' style='' class=''/%3E%3C/g%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M331 277.211l-21.973 21.973c-29.239 29.239-76.816 29.239-106.055 0L181 277.211L25.721 431.49 C31.588 434.297 38.073 436 45 436h422c6.927 0 13.412-1.703 19.279-4.51L331 277.211z' fill='%23404040' data-original='%23000000' style='' class=''/%3E%3C/g%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3Cg xmlns='http://www.w3.org/2000/svg'%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
 }

.header-top-contacts a{
    display: flex;
    color: #404040;
    font-size: 14px;
}
.header-top-contacts a:hover{
    display: flex;
    color: #0169f4;
}

.header-top-contacts a:hover .svg-email {
    background-image: url('data:image/svg+xml,<svg data-name="Email" id="email1" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><title/><path d="M116.73,31.83a3,3,0,0,0-4.2-.61L64.14,67.34a1,1,0,0,1-1.2,0L15.5,31.06a3,3,0,1,0-3.64,4.77L49.16,64.36,12.27,92.16A3,3,0,1,0,15.88,97L54.11,68.14l5.18,4a7,7,0,0,0,8.43.06l5.44-4.06L111.84,97a3,3,0,1,0,3.59-4.81L78.17,64.35,116.12,36A3,3,0,0,0,116.73,31.83Z"/><path d="M113,19H15A15,15,0,0,0,0,34V94a15,15,0,0,0,15,15h98a15,15,0,0,0,15-15V34A15,15,0,0,0,113,19Zm9,75a9,9,0,0,1-9,9H15a9,9,0,0,1-9-9V34a9,9,0,0,1,9-9h98a9,9,0,0,1,9,9Z"/></svg>');   
}
.header-contacts:hover span {
    color: #cd2122
}

.header-contacts a{
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    color: #404040 !important;
    float: left;    
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

/**MENU***/
.main_nav{
    width: 100%;
    background: rgb(204 204 204 / 20%);
}
.menu_desktop{
    position: relative;
    display: flex;
    padding: 6px 0;
    
    align-items: center;
    justify-content: space-between;
}
.catalogs-main, .menu-cart{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    
    font-weight: 500;
	text-transform: uppercase;
}
.main_menu{
    list-style: none;
    display: flex;;
}

.main-menu ul{
    list-style: none;
    display: flex;
    justify-content: space-around;
}
.main-menu li a {
    font-weight: 500;
	text-transform: uppercase;
    display: block;
    color: #363636;
    padding: 10px 15px;
    text-align: center;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.main-menu li a:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #4bc5cb;
    border-radius: 10px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.main-menu li a:hover:before, .main-menu li a:focus:before, .main-menu li a:active:before {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.main-menu li a:hover,
.main-menu li a:focus{
   color: #ffffff;
}

.shop_menu>li{
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    font-size: 0;
    margin-right: 10px;
    border: 2px solid #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
}
.shop_menu>li:hover{    
    border: 2px solid #945cb4;
}