﻿.divMaintenanceBanner {
    z-index: 10000000;
    max-width: 460px;
}

.header .divMaintenanceBanner {
    max-width: 100%;
}

.divMaintenanceBanner .warningBlock {
    background-color: #fde119;
    border-radius: 10px;
    font-size: 13px;
    /*position: fixed;*/
    width: 460px;
    /*right: 0px;*/
    z-index: 1000000;
    /*top: 150px;*/
    text-align: left;
    display: table;
}

.header .warningBlock {
    width: 100%;
}

.divMaintenanceBanner .warningBg {
    display: table-cell;
    vertical-align: middle;
}

.divMaintenanceBanner .warningIcon {
    width: 80px;
    text-align: center;
}

.divMaintenanceBanner .warningMessage {
    background: rgb(94,182,228);
    background: linear-gradient(90deg, rgba(94,182,228,1) 0%, rgba(20,58,101,1) 100%);
    color: #fff;
    padding: 0px 5px 10px 5px;
    width: 380px;
}

.divMaintenanceBanner .warning-1 {
    padding-bottom: 1rem;
}

.divMaintenanceBanner .btnClose {
    color: #fff;
    /*position: absolute;*/
    text-align: right;
    padding: 5px;
}

    .divMaintenanceBanner .btnClose:hover {
        cursor: pointer;
    }

.divMaintenanceBanner.top-left {
    position: fixed;
    left: 0px;
    top: 110px;
}

.divMaintenanceBanner.top-middle {
    position: fixed;
    left: 35%;
    top: 110px;
}

.divMaintenanceBanner.top-right {
    position: fixed;
    right: 0px;
    top: 110px;
}

.divMaintenanceBanner.middle-left {
    position: fixed;
    left: 0px;
    top: 40%;
}

.divMaintenanceBanner.middle-middle {
    position: fixed;
    left: 35%;
    top: 45%;
}

.divMaintenanceBanner.middle-right {
    position: fixed;
    right: 0px;
    top: 45%;
}

.divMaintenanceBanner.bottom-left {
    position: fixed;
    left: 0px;
    bottom: 110px;
}

.divMaintenanceBanner.bottom-middle {
    position: fixed;
    left: 35%;
    bottom: 110px;
}

.divMaintenanceBanner.bottom-right {
    position: fixed;
    right: 0px;
    bottom: 110px;
}

.divMaintenanceBanner.btnClose span {
    border: 1px solid #ddd;
    border-radius: 50%;
    padding: 0px 5px 2px 5px;
}



.infobanner .divMaintenanceBanner .bannerBlock {
    font-size: 14px;
}

.infobanner .divMaintenanceBanner .btnClose {
    padding: 0px;
}

    .infobanner .divMaintenanceBanner .btnClose span {
        border: 1px solid #000 !important;
        border-radius: 50%;
        color: #000 !important;
        padding: 0px 5px 2px 5px;
    }

/*Default div position for utilities*/
.infobanner .header,
.infobanner .divMaintenanceBanner.top-left, .infobanner .divMaintenanceBanner.top-middle, .infobanner .divMaintenanceBanner.top-right,
.infobanner .divMaintenanceBanner.middle-left, .infobanner .divMaintenanceBanner.middle-middle, .infobanner .divMaintenanceBanner.middle-right,
.infobanner .divMaintenanceBanner.bottom-left, .infobanner .divMaintenanceBanner.bottom-middle, .infobanner .divMaintenanceBanner.bottom-right {
    position: unset !important;
    color: #000000;
    background-color: #f4a370; /*f49c65*/
    border-color: #f4a370;
    border-radius: 5px;
    padding: 10px 15px !important;
    margin: 15px 15px 0px 15px;
}

@media screen and (min-width:320px) and (max-width:766px) {
    .divMaintenanceBanner {
        z-index: 10000000;
        max-width: 320px;
    }

        .divMaintenanceBanner .warningBlock {
            width: 320px !important;
        }

        .divMaintenanceBanner .warningIcon {
            width: 60px !important;
            /*padding: 65px 15px !important;*/
            /*padding: 40px 5px!important;*/
        }

        .divMaintenanceBanner .warningMessage {
            width: 260px !important;
        }
}

.divIncidentBanner {
    z-index: 10000000;
    max-width: 460px;
}

.header .divIncidentBanner {
    max-width: 100%;
}

.divIncidentBanner .warningBlock {
    background-color: #fde119;
    border-radius: 10px;
    font-size: 13px;
    /*position: fixed;*/
    width: 460px;
    /*right: 0px;*/
    z-index: 1000000;
    /*top: 150px;*/
    text-align: left;
    display: table;
}

.header .warningBlock {
    width: 100%;
}

.divIncidentBanner .warningBg {
    display: table-cell;
    vertical-align: middle;
}

.divIncidentBanner .warningIcon {
    width: 80px;
    text-align: center;
}

.divIncidentBanner .warningMessage {
    background: rgb(94,182,228);
    background: linear-gradient(90deg, rgba(94,182,228,1) 0%, rgba(20,58,101,1) 100%);
    color: #fff;
    padding: 0px 5px 10px 5px;
    width: 380px;
}

.divIncidentBanner .warning-1 {
    padding-bottom: 1rem;
}

.divIncidentBanner .btnClose {
    color: #fff;
    /*position: absolute;*/
    text-align: right;
    padding: 5px;
}

    .divIncidentBanner .btnClose:hover {
        cursor: pointer;
    }

.divIncidentBanner.top-left {
    position: fixed;
    left: 0px;
    top: 110px;
}

.divIncidentBanner.top-middle {
    position: fixed;
    left: 35%;
    top: 110px;
}

.divIncidentBanner.top-right {
    position: fixed;
    right: 0px;
    top: 110px;
}

.divIncidentBanner.middle-left {
    position: fixed;
    left: 0px;
    top: 40%;
}

.divIncidentBanner.middle-middle {
    position: fixed;
    left: 35%;
    top: 45%;
}

.divIncidentBanner.middle-right {
    position: fixed;
    right: 0px;
    top: 45%;
}

.divIncidentBanner.bottom-left {
    position: fixed;
    left: 0px;
    bottom: 110px;
}

.divIncidentBanner.bottom-middle {
    position: fixed;
    left: 35%;
    bottom: 110px;
}

.divIncidentBanner.bottom-right {
    position: fixed;
    right: 0px;
    bottom: 110px;
}

.divIncidentBanner.btnClose span {
    border: 1px solid #ddd;
    border-radius: 50%;
    padding: 0px 5px 2px 5px;
}



.infobanner .divIncidentBanner .bannerBlock {
    font-size: 14px;
}

.infobanner .divIncidentBanner .btnClose {
    padding: 0px;
}

    .infobanner .divIncidentBanner .btnClose span {
        border: 1px solid #000 !important;
        border-radius: 50%;
        color: #000 !important;
        padding: 0px 5px 2px 5px;
    }

/*Default div position for utilities*/
.infobanner .header,
.infobanner .divIncidentBanner.top-left, .infobanner .divIncidentBanner.top-middle, .infobanner .divIncidentBanner.top-right,
.infobanner .divIncidentBanner.middle-left, .infobanner .divIncidentBanner.middle-middle, .infobanner .divIncidentBanner.middle-right,
.infobanner .divIncidentBanner.bottom-left, .infobanner .divIncidentBanner.bottom-middle, .infobanner .divIncidentBanner.bottom-right {
    position: unset !important;
    color: #000000;
    background-color: #f4a370; /*f49c65*/
    border-color: #f4a370;
    border-radius: 5px;
    padding: 10px 15px !important;
    margin: 15px 15px 0px 15px;
}

@media screen and (min-width:320px) and (max-width:766px) {
    .divIncidentBanner {
        z-index: 10000000;
        max-width: 320px;
    }

        .divIncidentBanner .warningBlock {
            width: 320px !important;
        }

        .divIncidentBanner .warningIcon {
            width: 60px !important;
            /*padding: 65px 15px !important;*/
            /*padding: 40px 5px!important;*/
        }

        .divIncidentBanner .warningMessage {
            width: 260px !important;
        }
}
