.overlay {
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    background:rgba(255,255,255,1);
    z-index:200;
    border-bottom:solid 3px #d02229;
    border-top:solid 3px #d02229;
}
.overlay.up {top:50px;}

.overlay .container {
    position:relative;
    top:100%;
    height:100%;
    min-height:300px;
    font-size:14px;
    position:relative;
    z-index:100;
}
.overlay ul {
    list-style:none;
    padding:0;
}
.overlay ul li a {
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    border-bottom:none;
}
.overlay .close {
    width:90px;
    height:24px;
    font-size:14px;
    position: absolute;
    right: 20px;
    top: 10px;
    border: none;
    background: none;
    cursor:pointer;
    color: black;
    outline: none;
    text-align:right;
    z-index: 400;
    padding:0;
}
.overlay.overlay-small .close {
    top:0;
    right:0;
    text-align:center;
    color:white;
    font-size:25px;
    width:60px;
    height:60px;
}
.overlay {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.5s, visibility 0s 0.5s;
    transition: opacity 0.5s, visibility 0s 0.5s;
}
.overlay-small {
    border-bottom:none;
    border-top:none;
    background:black;
    overflow-y:scroll;
    height:100%;
}
.overlay-small .inner {
    width:100%;
    position:absolute;
    left:-300px;
    transition: 0.5s;
}
.overlay-small .inner {
    padding-top:20px;
}
.overlay-small .inner .nav-link {
    color:white;
    padding:15px 20px;
    border-bottom:solid 1px #222;
}

.overlay-small .inner .green {
    color:#00B64C;
    padding:15px 20px;
    border-bottom:none;
    display: block;
}

.overlay-small.open .inner {
    left:0;
}
.overlay.open {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}
.overlay-big {
    top:132px;
    left:0;
    height:470px;
}
body.with-offer-stripe .overlay-big {top:183px;}
body.with-offer-stripe .overlay-big.up {top:50px;}

.overlay-big .container {
    height:100%;
    opacity:0.4;
    -webkit-transform: translateY(-80%);
    transform: translateY(-80%);
    -webkit-transition: -webkit-transform 0.2s ease-out, opacity 0.2s;
    transition: transform 0.2s ease-out, opacity 0.2s;
}
.overlay-big .container .row {
    height:100%;
}
.overlay-big.open .container {
    opacity: 1;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
}
.overlay-big ul.left-menu {
    margin-bottom:30px;
    padding-right:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}
.overlay-big ul.left-menu li {
    display:block; 
    width:100%;
    line-height:20px;
    padding:0;
    background:transparent;
}

.overlay-big ul.left-menu li.root-item > a {
    font-weight:500;
    font-size:14px;
    color:black;
    text-decoration:none;
    height:35px;
    display:flex;
    align-items:center;
    border-bottom:none;
    padding:0px 15px 0px 45px;
    background-repeat:no-repeat;
    background-size:28px;
    background-position:10px center;
    position:relative;
}
.overlay-big ul.left-menu li.root-item:hover > a {
    background-color:#d02229;
    color:white;
}
.overlay-big ul.left-menu li.root-item:hover > a::after {
    display:block;
}
.overlay-big ul.left-menu li.root-item {
    cursor:pointer;
    padding-right:10px;
}
.overlay-big ul.left-menu li.root-item > a::after {
    content:'';
    display:none;
    position:absolute;
    top:10px;
    right:-8px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 8px solid #d02229;
    z-index:100;
}
.overlay-big ul.left-menu .products-count {
    color:gray;
    font-size:12px;
}
.overlay-big .children-container {
    margin-left:10px;
    position:relative;
    padding-top:5px;
}
.overlay-big .children-container ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content:space-around;
    max-height:400px;
    width:100%;
    max-width:100%;
}
.overlay-big .children-container ul li {
    width:280px;
    line-height:22px !important;
    padding:0 10px;
}
.overlay-big .children-container ul li a {
    font-size:14px;
    font-weight:400;
    text-decoration:none;
    color:black;
    line-height:1.4;
    padding:5px 15px;
}
.overlay-big .children-container ul li:hover a {
    color:gray;
}
.overlay-big .root-item .children {
    display:none;
    position:absolute;
    top:0;
    left:20%;
    width:67.77%;
}
.overlay-big .root-item .children.open {display:block;}