/* header color = #192B41 = 5, 43, 65 */
.header {position: fixed; display: flex; top: 0; left: 0; width: 100%; height: 10rem; z-index: 100; 
    background-color: #192B41; background-color: rgba(25, 43, 65, 0.6); }
.header.not-transparent {background-color: rgba(25, 43, 65, 1);}
.header-container {display: flex; justify-content: space-between; align-items: center; position: relative;}

/**/
.header-left {display: flex; justify-content: flex-start; align-items: center; gap: 0;}

/* logo */
.header-left-logo {width: 17rem; height: 17rem; position: absolute; top: 1.5rem; left: 5rem;}
.header-left-logo > a {display: block;}
.header-left-logo > a > img {width:100%; height:auto;}

/* nav */
.header-left-nav {padding-left: 19rem;}
.header-left-nav > nav {}
.header-left-nav > nav > ul {display: flex; list-style: none; margin: 0; padding: 0; gap: 6rem;}
.header-left-nav > nav > ul > li {margin: 0;}
.header-left-nav > nav > ul > li > a {color: #f3f3f3; font-size: 2rem; font-weight: 300; text-transform: uppercase; text-decoration: none;
    text-shadow: 0 0 0 transparent; transition: all 0.3s ease;} 
.header-left-nav > nav > ul > li > a:hover {color: #fff; text-shadow: 0 0 1px rgba(255, 255, 255, 0.9);}

/**/
.header-right {display: flex; justify-content: flex-end; align-items: center; gap: 6rem;}

/* callback */
.header-right-callback {}
.header-right-callback > button {padding: 1.0rem 2.3rem 1.2rem 2.3rem; color: #fff; background-color: transparent; border: 1px solid #fff; 
    border-radius: 1rem; transition: all 0.3s ease; font-weight: 300;}
.header-right-callback > button:hover {color:#000; background-color: #fff;}

/* icons */
.header-right-icons {}
.header-right-icons > ul {display: flex; list-style: none; margin: 0; padding: 0; gap: 1.6rem;}
.header-right-icons > ul > li {margin: 0;}
/* icons - one */
.header-right-icons-one {width: 2.7rem; height: 2.7rem;}
.header-right-icons-one > button {display:block; width:100%; height:100%; border: none; background-color: transparent; padding:0;}
.header-right-icons-one > a {display:block; width:100%; height:100%; text-decoration: none; }
.header-right-icons-one-icon {width:100%; height:100%;}
/* icons - one - search */
.header-right-icons-one-icon.icon-search {fill: transparent; stroke: #a8a8a8; transition: stroke 0.3s ease; stroke-width:0.7px; }
.header-right-icons-one-icon.icon-search:hover {stroke: #fff;}
/* icons - one - vk */
.header-right-icons-one-icon.icon-vk {fill: #a8a8a8; stroke: transparent; transition: fill 0.3s ease;}
.header-right-icons-one-icon.icon-vk:hover {fill: #fff;}
/* icons - one - cart */
.header-right-icons-one-icon.icon-cart {fill: transparent; stroke: #a8a8a8; transition: stroke 0.3s ease;}
.header-right-icons-one-icon.icon-cart:hover {stroke: #fff;}
.header-right-icons-one-cart-pos-count {position:absolute; top:-1rem; right:-1rem; background-color:#f00; color:#fff; margin:0; padding:0;
    display:flex; justify-content: center; align-items: center;  width:2.4rem; height:2.4rem; border-radius:2rem; font-size:1.2rem; } 
/* icons - one - personal */
.header-right-icons-one-icon.icon-personal {fill: #a8a8a8; stroke: #a8a8a8; transition: fill 0.3s ease, stroke 0.3s ease; stroke-width: 1.2px;}
.header-right-icons-one-icon.icon-personal:hover {fill: #fff; stroke: #fff; }