@media (max-width: 578px) {
    #myLogo {
        height: 28px !important;
    }
    .headerSocial{
        display: none;
    }
    .topHeaderSocial{
        padding: 0 15px 0 15px !important;
    }
    .main-menu {
        padding: 0 30px 0 30px;
    }
    .brand-logo {
        position: relative !important;
        left: 0% !important;
    }
}

.topHeaderSocial{
    padding: 0 10px 0 10px !important;
}

.rtl .main-menu .menu-left .navbar{
    padding: 0 45px 0 0 !important;
}

@media (max-width: 577px){
    .brand-logo img  {
        height: 45px !important;
    }
}

@media (min-width: 578px){
    .brand-logo img {
        height: 50px !important;
        width: auto !important;
    }
}

@media (max-width: 991px){
    .myCaptionL {
        display: none !important;
    }
    .myCaptionS{
        display: block !important;
    }
}

.top-header .header-dropdown .onhover-dropdown .onhover-show-div li{
    padding: 5px !important;
}

.frontA {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    border-radius: 10px;
}

.ratio_asos .bg-size:before{
    padding-top: 99.777778% !important;
}


.cover_div {
    display: none;
    margin: 2px;
}
.cover_img {
    width: 100%;
    border: 1px solid #e5e4f0;
    box-shadow: 5px 4px 12px 4px rgb(79 37 225 / 3%);
}
.cursor {
    cursor: pointer;
}
.column {
    width: 20%;
    float: right;
    margin: 3px;
    position: relative;
}
.demo {
    width: 100%;
    opacity: 0.5;
    box-shadow: 5px 4px 12px 4px rgb(79 37 225 / 3%);
    border: 1px solid #e5e4f0;
}
.slide_active,
.demo:hover {
    opacity: 1;
    border: 1px solid #b2b2b2;
}