.admin-bar .bsite-alert-banner-wrapper:not([class*="middle"]){
    margin-top: 35px !important;
}
.bsite-alert-banner-wrapper{
    position: fixed;
    z-index: 9991;
    width:40%;
    transition: 500ms all;
}
.bsite-alert-banner{
    position: relative;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    width: 100%;
    align-items: center;
    padding: 1rem 3rem;
    border-radius: 5px;
    min-height: 50px;
    margin-bottom: 0.5rem;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;
    transition: 500ms all;
}

.alert-img-wrapper{
    grid-column: span 3;
}
.alert-img-wrapper img{
    max-width: 100%;
}
.alert-text-wrapper{
    padding-left: 1rem;
    grid-column: span 9;
}
.alert-text-wrapper div{
    line-height: 25px;
}
.no-image .alert-text-wrapper{
    grid-column: span 12;
}
.alert-text-wrapper *{
    color: inherit;
}
.bsite-alert-banner-close{
    background: none;
    background-color: none;
    padding: 0;
    font-size: 30px;
    position: absolute;
    right: 20px;
    top: 10px;
    border: 0;
    cursor: pointer;
}

.bsite-alert-banner-close:hover,
.bsite-alert-banner-close:active,
.bsite-alert-banner-close:focus{
    background:none;
    filter: brightness(0.75);
}

/* positions settings */

.bsite-alert-banner-wrapper.top_left{
    top: 5%;
    left: 1%;
}
.bsite-alert-banner-wrapper.top_right{
    top: 5%;
    right: 1%;
}
.bsite-alert-banner-wrapper.top_center{
    top: 5%;
    right: 0;
    left: 0;
    margin: auto;
}
.bsite-alert-banner-wrapper.middle_left{
    top: 0;
    bottom: 0;
    left: 1%;
    margin: auto;
    height: fit-content;
}
.bsite-alert-banner-wrapper.middle_right{
    top: 0;
    bottom: 0;
    right: 1%;
    margin: auto;
    height: fit-content;
}
.bsite-alert-banner-wrapper.middle_center{
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    height: fit-content;
}
.bsite-alert-banner-wrapper.bottom_left{
    bottom: 10%;
    left: 1%;
}
.bsite-alert-banner-wrapper.bottom_right{
    bottom: 1%;
    right: 1%;
}
.bsite-alert-banner-wrapper.bottom_center{
    bottom: 1%;
    right: 0;
    left: 0;
    margin: auto;
}
.bsite-alert-banner-wrapper.top_full{
    top: 0;
    width: 100%;
    margin: auto;
}
.bsite-alert-banner-wrapper.middle_full{
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    margin: auto;
    height: fit-content;
}
.bsite-alert-banner-wrapper.bottom_full{
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
}
/* end positions settings */

@media screen and (min-width: 769px) {
    .bsite-alert-banner-wrapper.top_full .alert-img-wrapper,
    .bsite-alert-banner-wrapper.middle_full .alert-img-wrapper,
    .bsite-alert-banner-wrapper.bottom_full .alert-img-wrapper{
        grid-column: span 1;
    }
    .bsite-alert-banner-wrapper.top_full .alert-text-wrapper,
    .bsite-alert-banner-wrapper.middle_full .alert-text-wrapper
    .bsite-alert-banner-wrapper.bottom_full .alert-text-wrapper{
        grid-column: span 11;
    }
    .no-image .bsite-alert-banner-wrapper.top_full .alert-text-wrapper,
    .no-image .bsite-alert-banner-wrapper.middle_full .alert-text-wrapper
    .no-image .bsite-alert-banner-wrapper.bottom_full .alert-text-wrapper{
        grid-column: span 12;
    }
}

@media screen and (max-width: 768px) {
    .bsite-alert-banner-wrapper{
        width:80%;
    }
    .alert-img-wrapper{
        grid-column: span 3;
    }
    .alert-text-wrapper {
        grid-column: span 9;
    }
    .no-image .alert-text-wrapper {
        grid-column: span 12;
    }
}

@media screen and (max-width: 480px) {
    .bsite-alert-banner-wrapper{
        width:100%;
    }
    .alert-img-wrapper{
        grid-column: span 12;
        text-align: center;
        margin-bottom: 20px;
    }
    .alert-text-wrapper {
        grid-column: span 12;
        text-align: center;
    }
    /* positions settings */
    .bsite-alert-banner-wrapper.top_left,
    .bsite-alert-banner-wrapper.middle_left,
    .bsite-alert-banner-wrapper.middle_right,
    .bsite-alert-banner-wrapper.top_right,
    .bsite-alert-banner-wrapper.bottom_left,
    .bsite-alert-banner-wrapper.bottom_right{
        left: 0;
        right: 0;
    }
}