/*Global style*/
html {
    font-size: 10px;
}

header,
body {
    background: #ffffff;
    color: #000000;
    cursor: default;
}

body {
    min-height: 100%;
    overflow-y: scroll;
}

.row {
    margin: 0px;
    padding: 0px;
}

body {
    font-size: 1.4rem;
    height: 100%;
    line-height: 1.375;
}

.col-12, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding: 5px;
}

.clear {
    clear: both;
}

.container {
    width: 90%;
}

.pac-container {
    z-index: 99999 !important;
}

.black-icon {
    filter: grayscale(1) invert(1);
}

h2 {
    font-size: 2.4rem;
}

h4 {
    font-size: 1.8rem;
}


a {
    cursor: pointer;
    text-decoration: underline;
    background-color: transparent;
}

    a:focus,
    a:hover {
        text-decoration: none;
    }

    a:focus {
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

.btn,
.btn:hover,
.btn:focus,
.btn:active {
    font-size: 1.4rem;
}

.form-control {
    font-size: 1.4rem;
}

caption {
    display: none;
}

fieldset {
    padding: 0;
    border: 0;
    min-width: min-content;
}
/*Global style end*/

/*header*/
.main-wrapper {
    padding-top: 1%;
    width: 100%;
    float: left;
    box-sizing: border-box;
    -webkit-background-size: cover;
}

#upper-header {
    padding: 0;
    position: absolute;
    right: 1%;
    z-index: 2;
    display: contents;
}

#upper-header-container {
    display: flex;
    justify-content: flex-end;
    padding-right: 0;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    width: 90%;
}

#header-google-translate {
    padding: 0.3rem 1rem;
}

#header-1 #header-1-content {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

#dashboard-logo-container,
#dashboard-title-container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
}

    #dashboard-logo-container #logo-img {
        width: clamp(100px, 30%, 150px);
    }

    #dashboard-title-container h1 {
        margin: 0px;
        padding: 5px;
        float: right;
        text-align: center;
        font-size: 2.5rem;
        font-weight: 700;
    }

@media (min-width: 992px) {
    #dashboard-logo-container {
        align-items: initial;
    }

    #dashboard-title-container {
        align-items: end;
        justify-content: center;
    }

    #dashboard-logo-container #logo-img {
        float: left;
    }
}

@media (max-width: 991px) {
    #dashboard-logo-container,
    #dashboard-title-container {
        justify-content: center;
    }

    #dashboard-logo-container logo-img {
        margin-left: auto;
    }
}




#header-nav {
    width: 100%;
}

#header-nav-content {
    margin: 0 auto;
    position: relative;
    text-align: center;
}

    #header-nav-content .navbar {
        line-height: 45px;
        height: 40px;
        border: 0px;
        border-radius: 0;
        margin-bottom: 0px;
        min-height: 40px;
    }

        #header-nav-content .navbar .navbar-toggle {
            margin-right: 7.5%;
        }

    #header-nav-content .container-fluid {
        padding: 0px;
    }

    #header-nav-content #menu-items {
        width: 100%;
        float: left;
        color: #f9f9f9;
        padding: 0px;
    }

    #header-nav-content #template-menu {
        width: auto;
    }

    #header-nav-content #template-menu > li {
        position: static;
        display: block;
        font-size: 1.6rem;
        padding-left: 10px;
        padding-right: 10px;
        cursor: pointer;
        min-width: 85px;
        margin: 2px 1px;
    }

#banner-image {
    max-height: 280px;
}

@media(max-width:767px) {
    #upper-header {
        position: relative;
        right: 4%;
    }
}
/*header end*/

/*body*/
.flex-row {
    align-items: stretch;
    flex-wrap: wrap;
}

table {
    font-size: 1.5rem;
    text-align: left;
}

table, th, td {
    border: 1px solid #e1e1e1;
}

    table th {
        padding: 5px;
        text-align: center;
    }

    table td {
        padding: 5px;
        text-align: left;
    }

    table tbody tr:nth-child(even) {
        background: #fff;
    }

.content-title {
    cursor: pointer;
}

/*widget top-tab*/
.top-tab {
    display: flex;
    flex-grow: 1;
    padding: 0px;
    flex-wrap: wrap;
}

    .top-tab > div {
        cursor: pointer;
    }

@media (min-width: 769px) {
    .top-tab .top-tab-div {
        padding: 5px;
        min-width: 25%;
        width: auto;
        flex: 1 0 25%;
    }
}

/*@media (max-width: 1024px) and (max-width: 768px) {
    .topTabsItems {
    }
}*/

@media (max-width: 768px) {
    .top-tab .top-tab-div {
        padding: 5px;
        min-width: 50%;
        width: auto;
        flex: 1 0 50%;
    }
}

@media (max-width: 480px) {
    .top-tab .top-tab-div {
        padding: 5px;
        min-width: 100%;
        width: auto;
        flex: 1 0 100%;
    }
}

.top-tab .top-tab-style {
    width: 100%;
    height: 100%;
    display: grid;
    border-radius: 0.3571em;
    float: left;
    padding-top: 1rem;
    padding-bottom: 1rem;
    grid-template-columns: 1fr 2fr;
    grid-template-rows: auto 1fr;
    align-items: center;
}

    .top-tab .top-tab-link-style {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .top-tab .top-tab-icon {
        grid-row: 1;
        grid-column-start: 1;
        grid-column-end: 3;
        text-align: center;
    }

        .top-tab .top-tab-icon img,
        .top-tab .top-tab-icon .fa {
            height: 8rem;
        }

    .top-tab #current-temperature-div {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .top-tab #temperature-container {
        display: grid;
        grid-column-gap: 0.5rem;
    }

        .top-tab #temperature-container #temperature-image {
            text-align: center;
            grid-row: 1;
            grid-column-start: 1;
            grid-column-end: 3;
        }

            .top-tab #temperature-container #temperature-image img {
                width: 50px;
            }

        .top-tab #temperature-container #temperature-now {
            grid-row: 2;
            float: left;
            margin-right: 2rem;
        }

        .top-tab #temperature-container #temperature-Feel {
            grid-row: 2;
            float: right;
        }

        .top-tab #temperature-container .temperature {
            font-size: 2rem;
        }

    .top-tab .top-tab-event-count {
        width: 100%;
        float: left;
        grid-row: 2;
        grid-column: 1;
        box-sizing: border-box;
        font-weight: bolder;
        font-size: 5rem;
        text-align: center;
        padding: 0 5px;
        line-height: 1;
    }

    .top-tab .tab-info-div {
        grid-row: 2;
        grid-column: 2;
        text-align: center;
    }

        .top-tab .tab-info-div .tab-info-inner-div {
            text-align: left;
            padding: 5px;
            display: flex;
            flex-direction: column;
            box-sizing: border-box;
        }

        .top-tab .tab-info-div .tab-update-time {
            clear: left;
            font-size: 1.2rem;
            font-style: italic;
            float: left;
        }

        .top-tab .tab-info-div .link-tab-info-inner-div {
            text-align: center;
        }

        .top-tab .tab-info-div .link-tab-phone-div {
            color: #fff;
            font-size: 2rem;
        }

.top-tab .top-tab-external-link a {
    display: block;
    text-decoration: none;
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.modal-title {
    text-align: center;
}

.modal-body {
    padding: 15px;
    float: left;
    width: 100%;
    max-height: 600px;
    overflow-y: auto;
}

    .modal-body table {
        width: 100%;
    }

.modal-footer .acknowledgement {
    font-size: 1.3rem;
    font-style: italic;
    float: left;
    text-align: left;
}

.content-item, .emergency-content-item {
    border-bottom: 1px solid #666;
    margin: 5px;
    padding: 5px 10px;
    float: left;
    width: 80%;
    clear: left;
    text-align: left;
}

.top-tab #Opt-in-top, .top-tab #Opt-in {
    display: flex;
    justify-content: center;
}

.top-tab-external-link, .top-tab .optin-text {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.opt-in-top-tab-image {
    padding-top: 0.5em;
}

.top-tab #emergency-contact-tab {
    display: flex;
    justify-content: center;
}

#emergency-contact-tab .emergency-contact-text {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.emergency-contact-text .top-tab-icon {
    padding-top: 0.5em;
}

#live-traffic-rc-count, #council-rc-count {
    background-color: #545454;
}

/*widget top-tab end*/
/*widget small-tab*/
.small-tab {
    display: flex;
    padding: 0px;
}

    .small-tab > div {
        width: 100%;
        cursor: pointer;
    }

    .small-tab i {
        margin-right: 1rem;
    }

    .small-tab .small-tab-style {
        height: 100%;
        text-align: center;
        font-size: 1.8rem;
        border-radius: 5px;
        padding: 0.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .small-tab .small-tab-style a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
            text-decoration: none;
            cursor: pointer;
        }

            .small-tab .small-tab-style a img {
                background-color: #fff;
                border-radius: 5px;
                width: 48px;
                margin-right: 1rem;
            }

.small-tab-style .tab-info-div {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .small-tab-style .tab-info-div .small-tab-item-count {
        margin-right: 10px;
    }

@media (max-width: 767px) {
    .emergency-contacts-table, .emergency-contacts-table tbody, .emergency-contacts-table td, .emergency-contacts-table tr {
        display: block;
        width: 100%;
    }

        .emergency-contacts-table tr {
            margin-bottom: 1rem;
        }

        .emergency-contacts-table td {
            text-align: left;
            padding: 10px;
            box-sizing: border-box;
            border: none;
        }
}

/*widget small-tab end*/
/*widget map*/
.map-heading {
    display: none;
    justify-content: center;
    color: #ffffff;
    font-size: 1.8rem;
    margin-bottom: 0px;
    border-bottom: none;
    background: #303030;
    border-radius: 4px;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    align-items: center;
    min-height: 40px;
}

.map, .map-container {
    min-height: 680px;
}

    .map #legend-icon img {
        width: 20px;
        height: 20px;
    }

    .map .search-box {
        padding: 8px;
        padding-left: 48px;
        width: 273px;
        border: 1px solid #f5f5f5;
        color: gray;
        outline: 0;
        background-color: white;
        font-size: 1.5rem;
        border-radius: 3px;
    }

.map-heading #map-disclaimer-btn {
    background-color: #005A6F;
    color: #ffffff;
    text-transform: uppercase;
    border-radius: 2px;
    position: absolute;
    right: 10px;
    border: none;
    vertical-align: middle;
    padding: 4px 5px;
}

.leaflet-bar button {
    padding: 0;
}

.leaflet-right {
    z-index: 998;
}

#map-legend table, #map-legend th, #map-legend td {
    background-color: #ffffff;
    border: 0;
}

#map-legend th {
    padding: 0;
}

    #map-legend th img {
        width: 30px;
        height: 30px;
    }

#map-legend td {
    font-size: 1.3rem;
}

#map-modal #map-modal-label img {
    margin: 0px 10px;
    padding-bottom: 4px;
}

#map-modal .modal-header {
    color: #ffffff;
}

#map-modal .modal-body th {
    text-align: left;
}

.carousel-inner > .item > a > img, .carousel-inner > .item > img {
    margin: auto;
}

.leaflet-sidebar a.close {
    display: none;
}
/*widget map end*/
/*map layer control style start*/
#map-disclaimer-btn {
    position: absolute;
    right: 10px;
    border: none;
    vertical-align: middle;
}

#legend-icon img {
    width: 20px;
    height: 20px;
}

.accordion-container {
    max-width: 300px;
    min-height: 100px;
    margin: 1rem auto;
    text-align: left;
    overflow-y: auto;
    overflow-x: hidden;
}

    .accordion-container button.menu {
        margin: 0;
        padding: 2px 7px;
        font-weight: bold;
        font-size: 1.32rem;
        border: none;
        background-color: transparent;
        border-radius: 5px;
    }

        .accordion-container button.menu:hover {
            padding: 1px 5px;
            background-color: rgba(60, 64, 67, 0.04);
            border: 1px solid #3c4043;
            cursor: pointer;
            width: 100%;
            text-align: left;
        }

        .accordion-container button.menu[aria-expanded="false"]::before {
            content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' style='forced-color-adjust: auto;'%3E%3Cpolygon points='1 1, 1 11, 8 6' fill='currentcolor' stroke= 'currentcolor' /%3E%3C/svg%3E%0A");
            position: relative;
            left: -2px;
        }

        .accordion-container button.menu[aria-expanded="true"]::before {
            content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' style='forced-color-adjust: auto;'%3E%3Cpolygon points='1 1, 11 1, 6 8' fill='currentcolor' stroke= 'currentcolor' /%3E%3C/svg%3E ");
            position: relative;
            left: -4px;
            top: 2px;
        }

    .accordion-container fieldset {
        background: rgba(255, 255, 255, 0.5);
        margin-top: -1px;
        margin-left: 1.25rem;
        z-index: 10;
    }

    .accordion-container label input[type=checkbox], .accordion-container label input[type=radio] {
        margin-right: 0.5rem;
    }

    .accordion-container label .pin-count {
        width: 20px;
        height: 20px;
        padding: 2px;
        color: white;
        background-color: #517900;
        border-radius: 50%;
        display: inline-block;
        text-align: center;
        margin-left: auto;
        float: inline-end;
    }

    .accordion-container input[type=checkbox]:disabled + span {
        color: #ccc;
        cursor: not-allowed;
    }

#map-legend table, #map-legend th, #map-legend td {
    background-color: #ffffff;
    border: 0;
}

#map-legend th {
    padding: 1px;
}

    #map-legend th img {
        width: 30px;
        height: 30px;
    }

#map-legend td {
    font-size: 1.3rem;
}

.leaflet-control-layers label {
    font-size: 1.2rem;
}
/*map layer control style end*/
/*widget social media*/
.social-media-inner-div .content-info li a, .social-media-inner-div .content-info li a:focus, .social-media-inner-div .content-info li a:hover {
    color: #000000;
}

.social-media-inner-div .content-info li.active a, .social-media-inner-div .content-info li.active a:focus, .social-media-inner-div .content-info li.active a:hover {
    background-color: #00685e;
    color: #fff;
}

.social-media-tab {
    justify-content: center;
    display: flex;
    overflow-x: hidden;
}

.social-media-content {
    height: 600px;
    overflow-y: hidden;
}


@media (min-width: 1200px) {
    #laptop {
        display: block;
    }

    #Ipad, #mobile {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    #Ipad {
        display: block;
    }

    #laptop, #mobile {
        display: none;
    }
}

@media (max-width: 767px) {
    #mobile {
        display: block;
    }

    #laptop, #Ipad {
        display: none;
    }
}

/*widget social media end*/

/*widget radio station*/
#radiostation-table {
    width: 100%;
}

    #radiostation-table th {
        width: 50%;
        background: #212638;
        color: #fff;
        text-align: center;
        padding: 0.75em 1em;
    }


/*widget radio station end*/

/*widget notice*/
.notice-container {
    height: fit-content;
    overflow-x: scroll;
}
/*widget notice end*/

/*opt in start*/
.opt-in-img {
    height: 1.2em;
}

.logout-button {
    cursor: pointer;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    background: #333;
    color: #ffffff;
    display: flex;
    width: max-content;
    align-items: center;
}

#logoutUser {
    margin-top: 0.5em;
    margin-right: 1%;
    background: #005A6F;
    padding: 0.6em;
    position: absolute;
    z-index: 999;
    right: 0;
}

#address-to-map-modal .modal-body {
    border: 1px solid #000;
}

#toggle-password-sign-up, #toggle-password-confirm, #toggle-password-login, #toggleForgetPassword, #toggleForgetPasswordConfirm {
    position: absolute;
    right: 20px;
    top: 20px;
    transform: translateY(-50%);
    cursor: pointer;
}

.reduced-brightness {
    filter: brightness(0.5);
}

.select2-container--open .select2-dropdown--below {
    z-index: 10000;
}

#suburb-modal .close span {
    color: #000;
}

#forgot-password {
    cursor: pointer;
}

@media(max-width: 676px) {
    #logoutUser {
        right: unset;
    }

    #opt-in-modal {
        overflow-y: scroll;
    }
}
/*opt in end*/
/*business start*/
#tbl-active-business_next a, #tbl-active-business_previous a {
    color: #000;
}

#cke_1_resizer {
    font-size: 1.2rem;
}

.dt-paging-button {
    color: rgba(0, 0, 0, 1);
}
/*business end*/
/*widget select language*/
#translate-icon {
    font-size: 18px;
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    margin-right: 95px;
}

#translate-img {
    width: 2.5rem;
}

#google-translate-container {
    width: 100%;
}

.google-translate-element {
    width: 100%;
    border: none;
    font-size: 1.6rem;
    border-radius: 5px;
    border-style: none;
    display: flex;
}

#google-translate-container > div > div > div {
    margin-top: -0.4em;
}

.goog-te-gadget .goog-te-combo {
    margin: -5px 0 !important;
    width: 100%;
    padding: 5px 7px;
    font-size: 1.6rem;
    border-radius: 5px;
    border-style: none;
    text-align: center;
    text-align-last: center;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    font-family: "Poppins", sans-serif;
}

.goog-te-gadget > div > select {
    color: black;
}

.goog-te-gadget > span > a {
    display: none;
}
/*widget select language end*/

/*widget fire danger */
.fireDangerOuter {
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
}

.fireDangerInner {
    width: inherit;
}

.fireDangerContainer {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 10px;
}

#fireDangerCont {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: -webkit-fill-available;
}

#fireDangerImage {
    width: 100%;
    max-width: 418px;
    width: -webkit-fill-available;
}

.fireDangerTable {
    width: 100%;
}

    .fireDangerTable tr:nth-child(odd) {
        background: #FFF;
    }

    .fireDangerTable tr:nth-child(even) {
        background: #CCC;
    }
/*widget fire danger end*/

/*bushfire start*/
.bushfire-content-item {
    border: 1px solid #e3e3e3;
    border-radius: 0.28em;
    margin: 5px;
    display: flex;
}

    .bushfire-content-item .bushfire-warning-image {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 5px;
    }

        .bushfire-content-item .bushfire-warning-image img {
            max-width: 30px;
        }


    .bushfire-content-item .busfire-warning-text-container {
        padding: 5px;
        width: 100%;
    }

    .bushfire-content-item .view-more-bushfire, .view-more-bushfire-outer {
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: 60px;
        cursor: pointer;
        padding: 0px;
        font-size: 0.85em;
        font-weight: 700;
        background-color: #005A6F;
        color: #fff;
        border: 1px solid #005A6F;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .bushfire-content-item .bushfire-warning-level {
        font-weight: 700;
        color: #A80000;
    }

.modal-backdrop {
    z-index: 0;
}

.bushfire-content-detail {
    font-size: 1.8rem;
}

/*bushfire end*/
/*weather warning start*/
.weatherColumn .headingInfo {
    display: flex;
    justify-content: space-between;
}

#weatherWarningContent .contentItem, #warningsModal .contentItem {
    border-bottom: 1px solid #666;
    margin: 5px;
    padding: 5px 0px;
    clear: left;
}

    #weatherWarningContent .contentItem .contentTitle, #warningsModal .contentItem .contentTitle {
        font-weight: bold;
    }

.warning-view-more {
    background-color: #005A6F;
    float: right;
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    cursor: pointer;
    margin-top: 25px;
    margin-right: 2px;
}

@media(max-width:414px) {
    .weatherColumn .headingInfo {
        flex-direction: column;
    }
}

/*wearher warning end*/
/*neighour council start*/
.neighbour-council-tab {
    padding: 0;
}

.neighbour-council-header-text {
    text-align: center;
    padding: 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    cursor: pointer;
    font-size: 1.8rem;
}

.neighbour-council-dropdown-list li {
    text-align: center;
    list-style-type: none;
    padding: 0.5em;
    border-bottom-style: inset;
    border-bottom-width: thin;
}

    .neighbour-council-dropdown-list li:last-child {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .neighbour-council-dropdown-list li a {
        font-size: 1.8rem;
        font-weight: bold;
    }
/*neighour council end*/
/*recovery link start*/
.recovery-buttons {
    padding: 0.6em;
    border-radius: 5px;
    text-align: center;
}

    .recovery-buttons:not(:last-child) {
        margin-bottom: 10px;
    }

    .recovery-buttons a {
        display: block;
        width: 100%;
    }

.recovery-text {
    font-size: 1.8rem;
}
/*recovery link end*/
/*Video start*/

.videoRow .tabRow {
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 250px;
    border-radius: 0.3571em;
    cursor: pointer;
}

    .videoRow .tabRow i {
        padding: 10px;
        font-size: 2.4rem;
    }

    .videoRow .tabRow h4 {
        padding: 10px;
    }

.topTab, .videotab {
    padding: 0;
}

.videoDisplay, .videoDisplay_youTube {
    text-align: center;
}

.videoPopUpTextBody {
    text-align: justify;
    font-size: 1.6rem;
    padding-top: 10px;
}

#smallTabVideoModal .modal-body, #videoModal .modal-body {
    min-height: 650px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.videotab {
    padding: initial;
    border-radius: 5px;
}

.videoOuter {
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
}


.videoInnerContainer .videoDisplay {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}

    .videoInnerContainer .videoDisplay iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.smallVideoModal .videoDisplay_youTube {
    position: relative;
    padding-bottom: 38.25%;
    height: 0;
}

    .smallVideoModal .videoDisplay_youTube iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 150%;
    }

.videoPopUpTextBody a {
    background-color: #fff;
    color: #0063af;
}

.smallVideoModal .modal-body {
    max-height: 600px;
}
/*Video end*/
/*carousel start*/
.mySlides {
    display: none;
    height: 100%;
    width: 100%;
}

.carousel-tab {
    height: 200px;
}


    .top-tab ~ .carousel-tab, .carousel-tab:has(~ .top-tab), .warning-tab ~ .carousel-tab, .carousel-tab:has(~ .warning-tab), .map ~ .carousel-tab, .carousel-tab:has(~ .map), .social-media-tab ~ .carousel-tab, .carousel-tab:has(~ .social-media-tab) {
        height: auto;
        display: flex;
    }

    .social-media-tab ~ .carousel-tab, .carousel-tab:has(~ .social-media-tab) {
        height: 200px;
    }

.mySlides img {
    aspect-ratio: unset;
    width: 100%;
    height: 100%;
    contain: size;
    min-height: 190px;
    border-radius: 5px;
    object-fit: cover;
}

.carousel-container {
    position: relative;
    margin: auto;
    float: initial;
    width: 100%;
    height: 100%;
}

.warning-tab ~ .carousel-tab .carousel-container, .carousel-tab:has(~ .warning-tab) .carousel-container {
    aspect-ratio: 1.2/1;
}

.silde-container {
    height: 100%;
    width: 100%;
    background-color: #005A6F;
    border-radius: 0.3571em;
}

.carousel-text {
    position: absolute;
}

.preview .dot {
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    transition: background-color 0.6s ease;
}

.preview .dot-active {
    background-color: #000;
}

.preview {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 10px;
    width: 100%;
}

.carousel-fade {
    animation-name: fade;
    animation-duration: 1.5s;
}

@keyframes fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}

.silde-container > .carousel-text > a {
    text-decoration: none !important;
    border-radius: 5px;
    padding: 5px;
}
/******map sibling******/
.map ~ .carousel-tab .mySlides, .carousel-tab:has(~ .map) .mySlides, .map ~ .carousel-tab .silde-container, .carousel-tab:has(~ .map) .silde-container {
    height: auto;
    width: auto;
}

.map ~ .carousel-tab .carousel-container, .carousel-tab:has(~ .map) .carousel-container {
    aspect-ratio: 0.6/1;
    width: auto;
}

.map ~ .carousel-tab .mySlides img, .carousel-tab:has(~ .map) .mySlides img {
    aspect-ratio: unset;
    width: 100%;
    height: auto;
    contain: none;
}
/******map sibling end **********/
/*************social media sibling************/
.social-media-tab ~ .carousel-tab, .carousel-tab:has(~ .social-media-tab) {
    height: 200px;
}

    .social-media-tab ~ .carousel-tab .mySlides, .carousel-tab:has(~ .social-media-tab) .mySlides, .social-media-tab ~ .carousel-tab .silde-container, .carousel-tab:has(~ .social-media-tab) .silde-container {
        height: auto;
        width: auto;
    }

    .social-media-tab ~ .carousel-tab .carousel-container, .carousel-tab:has(~ .social-media-tab) .carousel-container {
        aspect-ratio: 0.6/1;
        width: auto;
    }

    .social-media-tab ~ .carousel-tab .mySlides img, .carousel-tab:has(~ .social-media-tab) .mySlides img {
        aspect-ratio: unset;
        width: 100%;
        height: auto;
        contain: none;
    }
/*************social media sibling end************/
/*************warning sibling *******************/
#warnings_weather ~ .carousel-tab, .carousel-tab:has(~ #warnings_weather) {
    height: 200px;
}

    #warnings_weather ~ .carousel-tab .mySlides, .carousel-tab:has(~ #warnings_weather) .mySlides, #warnings_weather ~ .carousel-tab .silde-container, .carousel-tab:has(~ #warnings_weather) .silde-container {
        height: auto;
        width: auto;
    }

    #warnings_weather ~ .carousel-tab .carousel-container, .carousel-tab:has(~ #warnings_weather) .carousel-container {
        height: auto;
        width: auto;
    }

    #warnings_weather ~ .carousel-tab .mySlides img, .carousel-tab:has(~ #warnings_weather) .mySlides img {
        aspect-ratio: unset;
        max-height: 582px;
        width: 100%;
        height: auto;
        contain: none;
    }
/*************warning sibling end*******************/
@media (max-width: 767px) {
    .carousel-tab {
        height: 100px;
    }

        .topTab ~ .carousel-tab, .carousel-tab:has(~ .topTab) {
            display: flex;
            width: 100%;
            min-height: 100px;
        }

        .warning-tab ~ .carousel-tab, .carousel-tab:has(~ .warning-tab), .social-media-tab ~ .carousel-tab, .carousel-tab:has(~ .social-media-tab) {
            display: flex;
            width: 100%;
            min-height: 500px;
            max-height: 710px;
            height: auto;
        }

        .map ~ .carousel-tab, .carousel-tab:has(~ .map) {
            display: flex;
            width: 100%;
            min-height: 500px;
        }

    .mySlides img {
        min-height: 160px;
    }
}
/*carousel end*/
/*operation start*/
.operation-camera-img {
    height: 51px;
    width: 98px;
    margin-top: -9%;
}

.operation-camera-container {
    cursor: pointer;
    border: 1px solid #000000;
    margin-top: -2%;
    border-radius: 5px;
    font-size: 1.1rem;
    padding-top: 1%;
    text-align: center;
}

    .operation-camera-container p {
        text-align: center;
    }

.operation-tab {
    box-shadow: 0 0 5px #17150c;
    margin-bottom: 1%;
    border-radius: 9px;
    padding: 13px;
}

    .operation-tab h4 {
        color: #000;
    }

/*operation end*/
/*camera start*/
#header-outer-camera {
    margin: 0;
    display: inline-flex;
    background: #333;
    width: 100%;
}

.essential-field {
    color: #9e0000;
}

input:checked + .slider {
    background-color: #005A6F;
}

    input:checked + .slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }

.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.slider:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: grey;
    -webkit-transition: .4s;
    transition: .4s;
}

.switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 25px;
}

.camera-container {
    margin-left: 1%;
    margin-right: 1%;
}

#header-camera {
    text-align: center;
}

#camera-label {
    font-size: 2.7rem;
    padding: 4.5px;
    color: #fff;
    text-align: center;
    margin-right: 15%;
}

#camera h5 {
    display: none;
}

#camera h2 {
    color: #000;
    text-align: center;
    font-size: 1.6rem;
}

#camera-modal img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

#flood-camera-img h2 {
    display: none;
}

#flood-camera-img {
    max-height: 700px;
}


#camera .thumbnail img {
    aspect-ratio: 16 / 9;
    width: 100%;
}

#camera-information {
    max-height: unset;
}

@media(max-width:500px) {
    #header-outer-camera {
        flex-direction: column;
        text-align: center;
    }
}

@media(max-width:570px) {
    #camera h4 {
        min-height: 150px;
    }
}

@media(max-width: 669.1px) {
    #flood-camera-img {
        max-height: 500px;
    }
}

/*camera end*/
/*book start*/
#header-outer-book {
    margin: 0;
    display: inline-flex;
    background: #212638;
    width: 100%;
}

#header-book {
    text-align: center;
}

#book-label {
    font-size: 2.7rem;
    padding: 4.5px;
    color: #fff;
    text-align: center;
    margin-right: 15%;
}

.book-container {
    margin-left: 1%;
    margin-right: 1%;
}

#book-error-message {
    margin: 40px 10px;
    padding: 10px;
    background: #e0e0e0;
    border-radius: 5px;
    text-align: center;
    font-size: large;
    font-weight: bolder;
}

@media(max-width:500px) {
    #header-outer-book {
        flex-direction: column;
        text-align: center;
    }
}
/*book end*/
/*risk start*/
#header-outer-risk {
    margin: 0;
    display: inline-flex;
    background: #333;
    width: 100%;
}

#header-risk {
    text-align: center;
}

#risk-label {
    font-size: 2.7rem;
    padding: 4.5px;
    color: #fff;
    text-align: center;
    margin-right: 15%;
}

.large-container#main-container {
    width: 99%;
    margin-top: 0px;
}

.risk-widget-image {
    height: 120px;
    width: 120px;
}

#risk-carousel {
    padding: 0 5px;
}

.risk-widget-lower {
    padding-left: 0;
    padding-right: 0;
}

.risk-widget-item {
    cursor: pointer;
    height: fit-content;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 7px;
}

.risk-iframe-container {
    padding-left: 0;
    padding-right: 0;
}

.carousel-caption {
    position: unset;
    padding: 0;
    margin-bottom: 0;
    color: #000;
}

#carousel-icon-left {
    margin-left: -40%;
}

#carousel-icon-right {
    margin-right: -40%;
}

.full-screen-button {
    position: absolute;
    left: 25px;
    top: 65px;
    opacity: 80%;
    z-index: 9999;
}

    .full-screen-button span {
        font-size: 2.5rem;
        color: #000;
        font-weight: 600;
        padding: 3px 6px;
        background-color: #fff;
        border-color: rgba(0, 0, 0, 0.2);
        border-radius: 2px;
    }

        .full-screen-button span:hover {
            text-decoration: none !important;
            background-color: #f4f4f4;
            cursor: pointer;
        }

.tooltip-inner {
    font-size: 1.2rem;
}

.tooltip.right .tooltip-arrow, .tooltip-inner {
    background-color: #005A6F;
    border-right-color: #005A6F;
}

@media(max-width:500px) {
    #header-outer-risk {
        flex-direction: column;
        text-align: center;
    }

    #back-to-dashboard {
        margin: 0;
    }
}
/*risk end*/
/*recovery start*/
#header-outer-recovery {
    margin: 0;
    display: inline-flex;
    background: #333;
    width: 100%;
}

#header-recovery {
    text-align: center;
}

#recovery-label {
    font-size: 2.7rem;
    padding: 4.5px;
    color: #fff;
    text-align: center;
    margin-right: 15%;
}

#active-operation-recovery-items, #inactive-operation-recovery-items {
    width: auto;
}

#closed-events {
    background-color: #005A6F;
    border: none;
    min-height: 45px;
    color: #fff;
}

#active-operation-recovery-items .select2-container, #inactive-operation-recovery-items .select2-container {
    min-width: 300px;
}

#active-operation-recovery-items .select2-container--default .select2-selection--single, #inactive-operation-recovery-items .select2-container--default .select2-selection--single {
    border: none !important;
    border-radius: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #fff;
}

#active-operation-recovery-items .select2-search select2-search--dropdown, #inactive-operation-recovery-items .select2-search select2-search--dropdown, #active-operation-recovery-items .select2-selection__rendered, #inactive-operation-recovery-items .select2-selection__rendered {
    background-color: #005A6F;
    font-size: 1.8rem;
    padding: 3px;
    padding-left: 15px;
}

.base-recovery-view {
    margin-bottom: 10px;
    margin-top: 30px;
}

#recovery-detail-pdf {
    background-color: #fff;
    min-height: 860px;
}

.no-active-operations {
    display: flex;
    justify-content: center;
    align-items: center;
}

.hidden-top-right {
    position: fixed;
    top: 67px;
    right: -35%;
    transition: ease-in;
    transition-duration: 0.2s;
    visibility: hidden;
}

.inner-error-message {
    background-color: #ffffff;
    color: #353434;
    max-width: 95vw;
    padding: 1.5em;
    border-radius: .5em;
    font-size: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.card {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    transition: 0.3s;
    border-radius: 5px;
}

.objective {
    height: 425px;
    overflow-y: auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 5px #17150c;
}

.notice {
    border-radius: 5px;
    height: 425px;
    overflow-y: auto;
    background-color: #fff;
    padding: 10px;
}

.flipMenulist {
    padding: 10px;
    /* border-right: 1px solid; */
    border-radius: 5px;
    font-weight: 600;
    min-width: 100px;
}

.active-operation {
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 5px 3px #b0c8dc;
    -moz-box-shadow: 0px 0px 5px 3px #b0c8dc;
    box-shadow: 0px 0px 5px 3px #b0c8dc;
}

.topmenulist {
    padding: 4px 10px;
    background-color: #005A6F;
    margin: 0 5px;
    color: #fff;
    border-radius: 5px;
    font-size: 1.8rem;
}

    .topmenulist:hover, .topmenulist:active {
        background-color: #005A6F;
        color: black;
    }
/*recovery end*/
/*push notification start*/
#activeDevicesTable_previous a, #activeDevicesTable_next a {
    color: #000;
}
/*push notification end*/
/*accessibility start*/
.left-floaters {
    position: fixed;
    z-index: 1000;
    top: 35%;
    right: 0;
}

    .left-floaters li {
        list-style: none;
    }

.left-tool-list {
    border: solid 1px #fff;
    background-color: #00685E;
    padding-left: 0;
}

.btn-accesibility-toggle {
    background-color: #f0f0f0;
}

#accessibility-icon {
    font-size: 2rem;
}

#accessibility-main {
    background-color: #00685E;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: solid 1px #fff;
}

.left-tool-list-items span {
    font-size: 2.5rem;
}
/****high contrast start****/

.high-contrast *:not(.map *):not(#recovery-detail-pdf *):not(.carousel-container *) {
    background-color: black !important;
    color: white !important;
    border-color: white !important;
}

.high-contrast .map *,
.high-contrast .flipMenulist {
    color: black;
}

.high-contrast .map,
.high-contrast img,
.high-contrast iframe,
.high-contrast #recovery-detail-pdf {
    filter: grayscale(1);
}

.high-contrast button,
.high-contrast input,
.high-contrast textarea,
.high-contrast select {
    background-color: black !important;
    color: white !important;
    border-color: white !important;
}

.high-contrast .top-tab-style,
.high-contrast .carousel-container img,
.high-contrast .small-tab-style,
.high-contrast #google_translate_element,
.high-contrast .recovery-buttons,
.high-contrast .neighbour-council-header-text,
.high-contrast .neighbour-council-dropdown-list li,
.high-contrast footer,
.high-contrast header,
.high-contrast .header-nav,
.high-contrast .top-menu-list,
.high-contrast .topmenulist {
    border: solid 1px white !important;
}

.high-contrast .preview {
    background-color: unset !important;
}

.high-contrast .easy-button-button,
.high-contrast #searchbox-map {
    background-color: white !important;
}

.high-contrast button.menu,
.high-contrast .left-floaters,
.high-contrast .crt-play,
.high-contrast .arrow,
.high-contrast .arrow:after {
    background-color: transparent !important;
    color: black !important;
}

.high-contrast .btn-accesibility-toggle {
    border: unset !important;
}

.high-contrast .highlighted {
    background-color: #fff !important;
    color: black !important;
}

.high-contrast .slider {
    background-color: gray !important;
}
/****high contrast end****/
/****Light Background start****/

.light-contrast *:not(.map):not(.map *):not(.top-tab-icon img):not(.carousel-container *):not(.crt-play):not(.slider):not(#recovery-detail-pdf *) {
    background-color: white !important;
    color: black !important;
    border-color: black !important;
}

.light-contrast .top-tab-icon img:not(.black-icon) {
    filter: grayscale(1) invert(1);
}

.light-contrast .map *,
.light-contrast .flipMenulist {
    color: black;
}

.light-contrast .map,
.light-contrast img:not(.top-tab-icon img),
.light-contrast iframe,
.light-contrast #recovery-detail-pdf {
    filter: grayscale(1);
}

.light-contrast button,
.light-contrast input,
.light-contrast textarea,
.light-contrast select {
    background-color: white !important;
    color: black !important;
    border-color: black !important;
}

.light-contrast .top-tab-style,
.light-contrast .carousel-container img,
.light-contrast .small-tab-style,
.light-contrast #google_translate_element,
.light-contrast .recovery-buttons,
.light-contrast .neighbour-council-header-text,
.light-contrast .neighbour-council-dropdown-list li,
.light-contrast footer, .light-contrast header,
.light-contrast .header-nav,
.light-contrast .top-menu-list,
.light-contrast .map-heading,
.light-contrast .topmenulist {
    border: solid 1px black !important;
}

.light-contrast .easy-button-button,
.light-contrast #searchbox-map,
.light-contrast .map-heading {
    background-color: white !important;
}

.light-contrast button.menu,
.light-contrast .left-floaters,
.light-contrast .arrow,
.light-contrast .arrow:after {
    background-color: transparent !important;
    color: black !important;
}

.light-contrast .btn-accesibility-toggle {
    border: unset !important;
}

.light-contrast .highlighted {
    background-color: black !important;
    color: white !important;
}

.light-contrast .slider {
    background-color: gray !important;
}
/****Light Background end****/
/****Link Underline start****/
.link-underline {
    text-decoration: underline;
}
/****Link Underline end****/
/*accessibility end*/
/*divToAppend start*/
.divToAppend1 > div, .divToAppend2 > div {
    padding-bottom: 10px;
}

.divToAppend1 {
    display: flex;
    flex-direction: column;
}

.divToAppend2 {
    display: flex;
    flex-direction: column;
}

    .divToAppend1 > div:last-child, .divToAppend2 > div:last-child {
        padding-bottom: 0;
    }
/*divToAppend end*/
/*body end*/
/*footer*/
footer {
    padding: 0;
}

    footer a {
        color: #FFFFFF;
    }


#upper-footer {
    background: #00685E;
    color: #FFFFFF;
}

#lower-footer {
    background: rgba(0, 104, 94, 0.5);
    color: #FFFFFF;
    padding-top: 5px;
}

#upper-footer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: start;
    justify-items: center;
    padding: 20px 0;
    border-bottom: solid rgba(255, 255, 255, 0.1) 1px;
    grid-column-gap: 5em;
}

#footer-social-media-container {
    margin-top: 6%;
}

#lower-footer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: center;
    justify-items: center;
    grid-column-gap: 10px;
    outline: none;
}

.connect-with-us-header, .service-centres-header, .acknowledgement-header {
    font-size: 1.8rem;
}

.connect-with-us-link-inner {
    text-align: center;
}

.connect-with-us-link a {
    color: #000;
    text-decoration: none;
    padding-right: 15px;
}

.connect-with-us-img {
    height: 5rem;
    background-color: #529F44;
    padding: 1rem;
    border-radius: 100%;
}

#acknowledgement-info {
    padding-right: 10px;
    line-height: 30px;
}

.lower-footer-container a {
    font-size: 1.5rem;
    color: #000;
    text-decoration: none;
}

    .lower-footer-container a:hover {
        text-decoration: underline;
    }

#footer-privacy-statement {
    text-align: center;
}

#qitplus-logo {
    width: 50px;
}

@media(max-width: 991.5px) {
    #upper-footer-grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 0.5fr 0.5fr 0.5fr;
        padding: 0;
        justify-items: center;
        align-items: center;
        align-content: center;
        text-align: center;
    }

    #lower-footer-grid {
        grid-template-columns: 1fr;
    }
}
/*footer end*/
@media(min-width: 1200px) and (max-width: 1400px) {
    #temperature, .temp-value {
        font-size: 1.2em;
    }
}

@media(max-width: 1199.5px) and (min-width:991.5px) {

    #temperature, .temp-value {
        font-size: 0.9em;
    }

    .temp-label {
        font-size: 0.8em;
    }

    #main-container {
        margin-top: 0px;
    }
}

@media (max-width: 991px) {
    .footer-top {
        flex-direction: column;
    }

    .footer-block1 {
        margin-left: auto;
        margin-right: auto;
        padding: 0;
    }

    .accessibilty-button {
        width: 50px;
        height: 43px;
    }

    #accessibility-icon {
        font-size: 1.5rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .top-tab-style h2, h3 {
        font-size: 2rem;
    }

    #temperature, .temp-value {
        font-size: 0.9em;
    }

    .temp-label {
        font-size: 0.8em;
    }
}

@media (max-width: 767.5px) {
    .top-tab-style h2, h3 {
        font-size: 2rem;
        margin: 10px 0;
    }

        .top-tab .top-tab-icon {
            display: none;
        }

        .top-tab .top-tab-event-count {
            display: flex;
            align-items: center;
            justify-content: left;
            margin-left: 20px;
        }


    .small-tab {
        flex-direction: column;
    }

    .divToAppend1 {
        margin-left: 0;
    }

    .footerTop {
        flex-direction: column;
    }

    .footerTopContent {
        align-items: center;
    }

    .footerTopLast > div:not(:last-child) {
        margin-right: 30px;
    }

    .accessibility-button {
        width: 45px;
    }

    #accessibility-icon {
        font-size: 1.2rem;
    }
}

@media(max-width: 500px) {
    #back-to-dashboard {
        margin: 0;
    }
}

@media(max-width:450px) {
    .map .search-box {
        width: 90%;
    }
}

@media (max-width: 416px) {
    #SearchBox-map {
        width: 70%;
    }

@media (max-width: 350px) {
    #temperature, .temp-value {
        font-size: 0.9em;
    }

    .temp-label {
        font-size: 0.8em;
    }

    .tab-content-weather {
        overflow-x: scroll;
    }

    .leaflet-right {
        width: 60%;
    }

    .footerTopLast {
        flex-direction: column;
    }

    .footerTopContent {
        align-items: flex-start;
    }

    .footerBottomContent {
        display: flex;
        flex-direction: column;
    }

        .footerBottomContent div {
            width: inherit;
        }

    .footerBottomContentSectionMid, .footerBottomContentSectionLast {
        justify-content: flex-start;
    }
}

@media (max-width: 290px) {
    #temperature {
        font-size: 1em;
    }

    #SearchBox-map {
        width: 60%;
    }

    #latest-weather-time {
        padding-left: 50px;
    }
}