/* 22-Nov */
      .globe-container .header {
        position: relative;
        top: 0;
      }

      h3 {
        font-size: 20px;
        line-height: 26px;
        font-weight: 700;
        letter-spacing: .2px;
      }

      .globe-container .header {
        align-items: center;
        box-shadow: 0 1px 0 rgba(0, 17, 51, .04), 0 0 13px rgba(0, 17, 51, .06);
        display: flex;
        height: 70px;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 1002;
      }

      .bg-white {
        background-color: #fff !important;
      }

      .logo-main {
        height: 33px;
        margin-top: 2px;
        width: 255px;
      }

      .globe-container .global-header-text {
        margin-left: 12px;
        position: relative;
        top: 3px;
        left: 5px;
      }

      .text-gray-8 {
        color: #515660 !important;
      }

      .text-xxl {
        font-size: 16px !important;
        letter-spacing: .2px;
        line-height: 22px;
      }

      .font-bold {
        font-weight: 700 !important;
      }

      .globe-container header .right-wrapper {
        margin-left: 200px;
      }

      .choices__inner {
        background-color: #fff !important;
        border: 1px solid #d5dbe5 !important;
        border-radius: 4px;
        height: 42px !important;
        padding-right: 9px !important;
        color: #515660 !important;
        padding-top: 4px !important;
        text-align: left;
        width: 100% !important;
      }

      .choices__list,
      .light .choices__inner {
        background-color: #fff !important;
        color: #515660 !important;
      }

      .choices__list--dropdown .choices__input {
        margin-bottom: 6px !important;
        width: 96% !important;
      }

      .choices__list--dropdown.is-active {
        border-radius: 4px !important;
        box-shadow: 0 0 0 1px rgba(26, 45, 51, .03), 2px 2px 6px rgba(0, 0, 0, .04), 5px 5px 40px rgba(26, 45, 51, .08);
        padding-top: 6px;
        padding-bottom: 6px;
        background-color: #fff;
        margin: 0px;
      }

      .choices__list--dropdown .choices__list {
        scrollbar-width: none;
        border-radius: 0px !important;
      }

      .choices__list--dropdown .choices__list::-webkit-scrollbar {
        display: none;
      }

      .choices__list--dropdown .choices__list::-moz-scrollbar {
        display: none;
      }

      .color-legend-wrapper {
        padding: 20px;
        border-radius: 5px;
        background-color: #fff;
        box-shadow: 0 1px 0 rgba(0, 17, 51, .04), 0 0 13px rgba(0, 17, 51, .06);
      }

      .color-legend-wrapper {
        left: 20px;
        bottom: 20px;
        position: absolute;
        border-radius: 5px;
        padding: 20px;
        padding-top: 10px;
      }

      .color-legend-container * {
        color: #202020;
        font-size: 12px;

      }

      .choices__input {
        margin: 0 6px !important;
        width: 100% !important;
        border: 1px solid #d5dbe5 !important;
        background-color: #fff !important;
        border-radius: 4px !important;
        height: 36px !important;
        box-shadow: none !important;
        font-size: 16px !important;
        letter-spacing: .2px;
        line-height: 22px;
        color: #202020;
      }

      .choices__list--dropdown .choices__item--selectable.is-highlighted {
        background-color: #e6effe !important;
      }

      .choices__item.choices__item--choice is-selected.choices__item--selectable.is-highlighted {

        background-color: #f2f7ff !important;
      }

      .popup-header-2 {
        height: 56px;
        padding: 0 10px;
        width: 400px;
      }

      .popup-header-1 .popup-border-1 {
        border-bottom: 2px solid #e8ebf2;
        width: 100%;
      }

      .popup-header-1 h4 {
        margin-top: 1px;
        padding: 9px 16px;
        width: max-content;
      }

      .h4,
      h4 {
        font-size: 18px;
        line-height: 24px;
      }

      .primary-tag {
        border: 1px solid #e8ebf2;
        border-radius: 20px;
        margin: 0 3px;
        max-width: -moz-fit-content;
        max-width: fit-content;
        min-height: 30px;
        padding: 0 9px;
      }

      .primary-tag p {
        margin-top: 1px;
      }

      .text-lg,
      .text-xl {
        font-size: 14px;
        letter-spacing: .2px;
      }

      a:hover {
        color: #0157ff !important;
      }

      .add-filter-chip:hover .primary-tag {
        background-color: #f2f7ff !important;
        border-color: #8db3ff !important;
      }

      .add-filter-chip:hover .primary-tag svg path {
        fill: #0157ff;
      }

      .add-filter-chip:hover .primary-tag p {
        color: #0157ff !important;
      }

      .form-switch .form-check-input {
        margin-left: 0px;
        float: none !important;
        background-color: #edf4ff;
        border-color: rgba(0, 17, 51, .122);
        height: 20px;
        position: relative;
        width: 36px;
      }

      .color-legend-container {
        margin-bottom: 20px !important;
      }

      .filter-offcanvas-body .dropdown-label {
        color: #949ba8;
        font-size: 12px;
      }

      .filter-offcanvas-body .grid-li {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        padding: 0px 4px;
        margin-top:5px;
      }

      .filter-offcanvas-body .grid-li .grid-menu-items.active {
        background-color: #fff !important;
      }

      .filter-offcanvas-body .grid-li .grid-menu-items {
        align-items: center;
        display: flex;
        height: 88px;
        justify-content: left;
        width: 80px;
      }

      .filter-offcanvas-body .grid-li .grid-menu-items.active a {
        color: #0157ff !important;
      }

      .filter-offcanvas-body .grid-li .grid-menu-items.active .gray-box {
        box-shadow: 0 0 0 2px #0157ff !important;
      }

      .filter-offcanvas-body .gray-box {
        background-color: #e8ebf2;
        border-radius: 4px;
        height: 48px;
        margin: auto auto 6px;
        width: 48px;
      }

      .filter-offcanvas-body .grid-li .grid-menu-items.active a {
        color: #0157ff !important;
      }

      .text-base,
      .text-sm {
        font-size: 12px;
        letter-spacing: .2px;
      }

      .filter-offcanvas-body .grid-li .grid-menu-items a {
        color: #515660;
        font-weight: 300;
        min-height: 82px;
        text-decoration: none;
      }

      .range-slider {
        height: 8px;
        border-radius: 5px;
      }

      .range-slider svg {
        width: 100%;
        height: 8px;
        overflow: hidden !important;
        border-radius: 5px;

      }

      .slider-back {
        width: 458px;
        transform: translateX(-79px);
      }

      .range-input input::-webkit-slider-thumb {
        margin-top: -4px;
        transform: translateX(2px);
      }

      .data-dropdown {
        margin: 5px 0px;
      }

      .ocean-color-input {
        width: 16px;
        height: 16px;
        border: 1px solid #d5dbe5;
        border-radius: 2.5px;
      }

      .ocean-color-label {
        transform: translateY(-2px);
      }

      .light .choices__list--dropdown {
        background-color: #fff !important;
      }

      .light .choices__list--dropdown .choices__item--selectable.is-highlighted {
        background-color: #e6effe !important;
      }

      .light .choices__input {
        border-bottom: 1px solid #ddd !important;
        background-color: #fff !important;
      }

      .multi-level-project-dropdown-container .drop-button-border {
        width: 400px !important;
        height: 42px !important;
        border-radius: 4px;
        background: transparent;
        padding: 0 9px 1px 15px !important;
        color: #202020;
        border: 1px solid #d5dbe5;
      }

      .form-floating2 {
        margin-top: 25px;
      }

      .dropdown.autoheight-contextmenu .dropdown-menu {
        border-radius: 4px;
        background-color: #fbfcfe !important;
        width: 255px;
        border: none !important;
        border-top-right-radius: 0px;
        padding: 6px 0;
        max-height: 449px;
        overflow-y: auto;
        height: auto;
      }

      .autoheight-contextmenu .sub-outer {
        display: none;
        min-height: 290px;
        position: absolute;
        left: 255px;
        opacity: 0;
        visibility: hidden;
        box-shadow: 0px 0px 0px 1px rgba(0, 17, 51, 0.04), 2px 2px 6px rgba(0, 17, 51, 0.04), 5px 5px 40px rgba(0, 17, 51, 0.08);
        border-radius: 4px;
        bottom: auto !important;
        top: 100% !important;
      }

      .autoheight-contextmenu .sub-outer.isOpen {
        display: block !important;
        z-index: 11;
      }

      .context-div .sub-outer.isOpen {
        opacity: 1;
        visibility: visible;
      }

      .float-block {
        font-size: 16px;
        transform: translateY(0);
        -moz-transform: translateY(-1px);
        left: 12px !important;
        background: #fff;
        color: #737987;
        opacity: 1;
        padding: 0 5px;
        z-index: 8;
        font-weight: 300 !important;
        position: absolute !important;
        display: inline-block;
        top: 9px;
      }

      .parent-ul-button li a p {
        text-wrap: wrap;
        display: flex;
        gap: 10px;
      }

      .font-normal {
        font-weight: 300 !important;
      }

      .context-div .sub-outer .dropdown-menu {
        width: 236px;
        min-height: 350px;
        border: none !important;
        border-left: 1px solid #e8ebf2 !important;
        border-radius: 0 4px 4px 0;
        max-height: 350px;
        overflow-y: auto !important;
        padding: 6px 0;
        position: relative;
        background-color: #fff !important;
        box-shadow: none !important;
      }

      .context-div .sub-outer .dropdown-menu .submenu-list {
        cursor: pointer;
        min-width: 100%;
      }

      .dropdown-submenu .submenu-list a {
        width: 100% !important;
        border-bottom-right-radius: 0;
        border-right-color: transparent;
        border-top-right-radius: 0;
        color: #202020;
        background-color: transparent;
        padding-right: 9px !important;
        height: 42px !important;
        padding: 7px 7px 7px 12px !important;
        position: relative;
        white-space: nowrap;
      }

      .dropdown-submenu .submenu-list p {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
        transform: translateY(0);
        color: #515660 !important;
      }

      .dropdown button label.block-priority {
        top: -12px !important;
        font-size: 12px;
        transition: all .1s ease-in-out 0s;
        background: #fff;
        line-height: 1.6 !important;
      }

      .dropdown-submenu::-webkit-scrollbar {
        display: none;
      }

      .dropdown-submenu {
        -ms-overflow-style: none;
        scrollbar-width: none;
      }

      .context-div .sub-outer:before {
        width: calc(100% - 38px);
        background: #fbfcfe;
        border: none !important;
        border-radius: 4px 0 0 4px;
        content: "";
        display: block;
        height: 100%;
        left: -184px;
        z-index: 0;
        box-shadow: 0 0 0 1px rgba(0, 17, 51, .04), 2px 2px 6px rgba(0, 17, 51, .04), 5px 5px 40px rgba(0, 17, 51, .08);
        position: absolute;
        top: 0;
      }

      .dropdown.drop-select .drop-button-border:hover {
        background: #fff;
        box-shadow: inset 0 0 0 1px #d5dbe5;
      }

      .context-div .sub-outer .dropdown-menu .submenu-list:hover {
        background: #e6effe;
      }

      .file-type-list .dropdown-item.active {
        background: #f2f7ff !important;
      }

      .dropdown-item {
        max-height: 42px;
      }

      .drop-button-border.show {
        border: 1px solid #0157ff !important;
        box-shadow: inset 0 0 0 1px #0157ff !important;
      }

      .label-active-dropdown .drop-button-border.show label {
        color: #0157ff;
      }

      .parent-ul-button li:hover .right-icon svg path {
        fill: #0157ff;
      }

      .dropdown-menu li.rightOpen .right-icon svg path {
        fill: #0157ff;
      }

      .dropdown-menu li.rightOpen {
        background-color: #f2f7ff;
      }

      .drop-select .dropdown-menu li:hover .dropdown-item {
        background: #e6effe;
      }

      .drop-select .dropdown-menu li p {
        align-items: center;
        display: flex;
      }

      .dropdown-submenu .submenu-list p {
        display: block !important;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      .submenu-list .dropdown-item.active .drop-list-text {
        margin-right: 10px;
        width: 86%;
      }

      .choices__list--single .choices__item,
      .choices__list--dropdown .choices__item, .autoheight-contextmenu .submenu-list .dropdown-item  p {
        text-transform: lowercase;
      }

      .choices__list--single .choices__item:first-letter,
      .choices__list--dropdown .choices__item:first-letter, .autoheight-contextmenu .submenu-list .dropdown-item  p:first-letter {
        text-transform: uppercase;
      }


      /* Modal */
      .climate-risk-modal-wrapper .modal-dialog {
        max-height: calc(100vh - 93px);
        width: 1100px;
        max-width: 1100px;
        border-radius: 4px !important;
        box-shadow: 0 0 0 1px rgba(0, 17, 51, .04), 2px 2px 6px rgba(0, 17, 51, .04), 5px 5px 40px rgba(0, 17, 51, .08);
        max-height: calc(100vh - 92px);
        overflow: hidden;
      }

      .climate-risk-modal-wrapper .card .modal-header {
        border-bottom: 0;
        border-radius: 0;
        margin: 0 20px;
        width: 100%;
      }

      .climate-risk-modal-wrapper .modal-body {
        -ms-overflow-style: none;
        overflow-y: scroll;
        padding-right: 15px;
        scrollbar-width: none;
      }

      .climate-risk-modal-wrapper .popup-border-1 {
        height: 56px;
      }

      .modal-footer {
        background-color: #f5f7fa !important;
        padding: 14px 40px 14px 16px !important;
      }

      .modal-footer .consumption-prev-btn {
        height: 42px;
      }

      .button-secondary {
        background-color: #fff !important;
        border: 2px solid #d5dbe5 !important;
        color: #202020 !important;
        line-height: 20px;
        width: 150px;
        box-shadow: none !important;
      }

      .button-secondary:hover {
        background-color: #f2f7ff !important;
        color: #0157ff !important;
        border: 2px solid #0157ff !important;
      }

      .button-secondary:active {
        background: #e6effe !important;
        color: #0157ff !important;
        border: 2px solid #0157ff !important;
      }

      .btn-custom {
        font-size: 14px;
        border-radius: 4px !important;
        height: 42px;
        font-size: 14px;
        align-items: center;
        justify-content: center;
      }

      .gray-1 {
        background-color: #f5f7fa !important;
      }

      .climate-risk-modal-wrapper .modal-body .left-tabs-scopebody .nav {
        height: 100%;
        padding-top: 20px;
      }

      .scopebody-content .left-tabs-scopebody {
        box-shadow: inset 0 -1px 0 rgba(0, 35, 105, .06);
        max-height: calc(100vh - 222px) !important;
        overflow-y: auto;
        scrollbar-width: none;
        width: 260px;
        min-width: 260px;
      }

      .climate-risk-modal-wrapper .modal-body .left-tabs-scopebody .nav li .nav-link {
        background-color: transparent;
        border: none;
        border-left: 3px solid transparent;
        color: #202020;
        margin-bottom: 0;
        min-height: 52px;
        padding: 15px 28px 15px 26px;
      }

      .climate-risk-modal-wrapper .right-tabscontent-scopebody {
        max-height: calc(100vh - 222px);
        overflow-y: auto;
        padding: 0 71px;
        scrollbar-width: none;
        width: 840px;
      }

      .climate-risk-modal-wrapper .modal-body .left-tabs-scopebody .nav li .nav-link.active {
        background-color: #e6effe;
        border-left: 3px solid #0157ff;
      }

      .climate-risk-modal-wrapper .modal-body .left-tabs-scopebody .nav li .nav-link:hover {
        background-color: #e6effe;
      }

      .button-primary {
        background-color: #0157ff;
        border: 2px solid #0157ff;
        color: #fff !important;
        width: 150px;
      }

      .climate-risk-modal-wrapper .right-tabscontent-scopebody .vector-div {
        margin: 0 auto;
        width:500px;
      }

      .climate-risk-modal-wrapper .right-tabscontent-scopebody .summary-text {
        margin-bottom: 29px !important;
        width: 90%;
        margin: auto;
        text-align: justify;
      }

      .mb-10 {
        margin-bottom: 10px !important;
      }

      .climate-risk-modal-wrapper .block-switch .carousel-control-prev,
      .climate-risk-modal-wrapper .block-switch .carousel-control-next {
        width: 32px;
        opacity: 1;
        height: 32px;
        padding: 0px !important;
        margin-top: auto;
        margin-bottom: auto !important;
      }

      .block-switch .carousel-control-prev .carousel-control-prev-icon,
      .block-switch .carousel-control-prev .carousel-control-next-icon,
      .block-switch .carousel-control-next .carousel-control-prev-icon,
      .block-switch .carousel-control-next .carousel-control-next-icon {
        border: 1px solid #e8ebf2;
        background: #fff;
        width: 32px;
        height: 32px;
        border-radius: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .block-switch .carousel-control-prev:hover .carousel-control-prev-icon,
      .block-switch .carousel-control-prev:hover .carousel-control-next-icon,
      .block-switch .carousel-control-prev.hover .carousel-control-prev-icon,
      .block-switch .carousel-control-prev.hover .carousel-control-next-icon,
      .block-switch .carousel-control-next:hover .carousel-control-prev-icon,
      .block-switch .carousel-control-next:hover .carousel-control-next-icon,
      .block-switch .carousel-control-next.hover .carousel-control-prev-icon,
      .block-switch .carousel-control-next.hover .carousel-control-next-icon {
        border: 1px solid #0157ff;
        background: #f2f7ff;
      }

      .block-switch .carousel-control-prev:hover .carousel-control-prev-icon svg path,
      .block-switch .carousel-control-prev:hover .carousel-control-next-icon svg path,
      .block-switch .carousel-control-prev.hover .carousel-control-prev-icon svg path,
      .block-switch .carousel-control-prev.hover .carousel-control-next-icon svg path,
      .block-switch .carousel-control-next:hover .carousel-control-prev-icon svg path,
      .block-switch .carousel-control-next:hover .carousel-control-next-icon svg path,
      .block-switch .carousel-control-next.hover .carousel-control-prev-icon svg path,
      .block-switch .carousel-control-next.hover .carousel-control-next-icon svg path {
        fill: #0157ff;
      }

      .block-switch .carousel-control-prev:active .carousel-control-prev-icon,
      .block-switch .carousel-control-prev:active .carousel-control-next-icon,
      .block-switch .carousel-control-prev.active .carousel-control-prev-icon,
      .block-switch .carousel-control-prev.active .carousel-control-next-icon,
      .block-switch .carousel-control-next:active .carousel-control-prev-icon,
      .block-switch .carousel-control-next:active .carousel-control-next-icon,
      .block-switch .carousel-control-next.active .carousel-control-prev-icon,
      .block-switch .carousel-control-next.active .carousel-control-next-icon {
        border: 1px solid #0157ff;
        background: #e6effe;
      }

      .climate-risk-modal-wrapper .carousel {
        margin-bottom: 20px;
      }

      .close-icon-right a:hover svg path {
        fill: #0157ff;
      }

      .info-tooltipbtn {
        cursor: pointer;
        box-shadow: none !important;
      }
      .info-tooltipbtn:hover svg path {
        fill: #0157ff;
      }