@font-face{
    font-family: 'Futura Book';
    src: url('../fonts/Futura Book font.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*Global style*/
html{
    font-size:10px;
}
header{
    background-color: #fff;
    color: #ffffff;
    font-size: 1.4rem;
}
body {
    background: #FFFFFF;
    color: #000000;
    font-size: 1.4rem;
}

.row {
    margin: 0px;
    padding: 0px;
}
caption{
    display:none;
}

fieldset{
    padding:0;
    border:0;
    min-width:min-content;
}
.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;
}

.close{
    opacity:unset;
}
.close span {
    color: rgb(255, 255, 255);
}

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

.container {
    width: 90%;
}
@media(max-width:767.5px){
    .container {
        width: 90%;
    }
}

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

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

#back-to-dashBoard {
    margin-left: 30px;
    margin-top: 5px;
}

    #back-to-dashBoard a {
        margin-top: 2%;
        background-color: #005A6F;
        border-color: #005A6F;
    }

#back-to-dashBoard a:hover {
    text-decoration: none !important;
}

        #back-to-dashBoard a:visited {
            color: #fff;
            background-color: #005A6F;
            border-color: #005A6F;
        }
h4{
    font-size: 1.8rem;
}
.btn{
    font-size: 1.4rem;
}
/*Global style end*/

/*header*/
#main-header {
    display: flex;
    flex-direction: column;
}
#upper-header {
    padding: 0;
    position: absolute;
    right: 1%;
    z-index: 2;
}
#upper-header-container {
    display: flex;
    justify-content: flex-end;
    padding-right: 0;
}

.upper-header-container-inner {
    padding: 0.3rem 1rem;
}
#header-1 {
    padding: 0 10px;
}

    #header-1 > .container {
        padding: 0 5px;
    }

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

#logo-img {
    height: 7em;
    margin: 7% 0;
}

#dashboard-title-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: end;
    align-items: center;
    color: #212638;
}

#dashboard-title-container h1 {
    margin: 0px;
    padding: 5px;
    float: right;
    text-align: center;
    font-size: 3.6rem;
    font-weight: bold;
}
#call-triple-zero {
    font-size: 2rem;
    text-align: end;
    color: red;
    font-weight: bold;
}
#training-purpose {
    font-size: 3rem;
    text-align: end;
    color: red;
    font-weight: bold;
}
#header-nav, #header-nav-content, #menu-items {
    background: #005A6F;
}

#header-nav {
    width: 100%;
}

#header-nav-content {
    margin: 0 auto;
    position: relative;
    text-align: center;
    width: fit-content;
    margin-left: 5.5%;
}
.navbar-toggle{
    margin-right:7.5%;
}
@media(max-width:767px) {
    #header-nav-content {
        width: -webkit-fill-available;
    }
}
#header-nav-content .navbar {
    line-height: 45px;
    height: 40px;
    border: 0px !important;
    border-radius: 0;
    margin-bottom: 0px !important;
    min-height: 40px;
}

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

#header-nav-content .navbar-toggle .icon-bar {
    background: #fff;
}

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

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

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

.highlighted {
    background-color: #C7DFE7;
    color: #005A6F;
}

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


@media(max-width:991.5px){
    #dashboard-title-container{
        justify-content: center;
    }
    #dashboard-title-container h1{
        font-size: 3.2rem;
    }
}
@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;
    max-height: 250px;
}

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

    .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;
        align-items: center;
    }
    .top-tab .top-tab-link-style {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .top-tab .top-tab-external-link, .top-tab .optin-text {
        grid-template-columns: none;
    }

    .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 {
            height: 8rem;
        }

        .top-tab .top-tab-icon .fa {
            font-size: 5.5rem;
        }

    .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.5rem;
            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;
    }

    .top-tab .top-tab-external-link .top-tab-icon{
        margin-top: 10%;
    }

.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;
}

.weather-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;
    display: block;
    padding: 0.5rem;
}



.small-tab .small-tab-style a {
    display: block;
}

.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;
        Add commentMore actions
    }

    .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: 600px;
    }

        .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: #005A6F;
        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 > div {
        height: fit-content;
    }
    /*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*/
    #google_translate_container {
        right: 40px;
        width: 100%;
    }

    #google_translate_element {
        width: 100%;
        border: none;
        font-size: 1.8rem;
        border-radius: 5px;
        border-style: none;
    }

    #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.8rem;
        border-radius: 5px;
        border-style: none;
        text-align: center;
        text-align-last: center;
        cursor: pointer;
        -webkit-appearance: none;
        -moz-appearance: none;
        font-family: 'Futura Book', Arial;
    }

    .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*/
    /*widget weather observations*/
    .tab-content-weather .flex-column {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .tab-content-weather {
        overflow: hidden;
    }
    /*widget weather observations 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: 999999;
        top: 35%;
        right: 0;
    }

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

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

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

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

    #accessibility-main {
        background-color: #005A6F;
        width: 70px;
        height: 60px;
        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;
    }

#upper-footer {
    background: #FFE36C;
    color: #000;
}

#lower-footer {
    background: #C7DFE7;
    color: #000;
    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;
}

    .upper-footer-container {
        color: #000;
    }

    #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;
    color: #005A6F;
}

.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: #005A6F;
    padding: 1rem;
    border-radius: 100%;
}

#acknowledgement-info {
    font-size: 1.6rem;
    padding-right: 10px;
    line-height: 30px;
}

#service-centres-body{
    font-size: 1.6rem;
}

.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) {
        #logo-img {
            margin-left: auto;
        }

        .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) {
        h3 {
            font-size: 2rem;
        }

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

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

        #dashboard-logo-container {
            display: flex;
            justify-content: center;
        }
    }

    @media (max-width: 767.5px) {
        h3 {
            font-size: 2rem;
        }

        .top-tab {
            display: block;
            max-height: unset;
            flex-grow: 1;
        }

            .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;
        }

        #dashboard-logo-container {
            display: flex;
            justify-content: center;
        }

        .accessibility-button {
            width: 45px;
        }

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

    @media(max-width: 661px) {


        #dashboard-title-container h1 {
            font-size: 2.4rem;
        }

        #logo-img {
            height: 5em;
        }

        #call-triple-zero {
            font-size: 1.5rem;
        }

        #training-purpose {
            font-size: 2rem;
        }
    }

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

        #dashboard-title-container h1 {
            font-size: 1.8rem;
        }

        #call-triple-zero {
            font-size: 1rem;
        }

        #training-purpose {
            font-size: 1.5rem;
        }
    }

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

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

        .notice-container > div {
            overflow-x: scroll;
        }
    }

    @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;
        }

        #dashboard-title-container h1 {
            font-size: 1.3rem;
        }

        #call-triple-zero {
            font-size: 0.8rem;
        }

        #logo-img {
            height: 4em;
        }
    }

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

        #SearchBox-map {
            width: 60%;
        }

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