/* * {
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
} */
/*
@media print {
    * { display: block !important; }
  } 
    */
    /* @media print {
    * { display: block !important; }
  } */

body{
    overflow: hidden;
  }
  /* #mapdiv {
      width:100%;
      height: 94vh;
      border:1px solid red;
  } */
  
  .layout-fixed .wrapper {
    display: flex;
    flex-direction: column;
    height: 100vh;
  } 

  .content-wrapper {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  } 

   #mapdiv {
    /* width:100%; */
    /* flex: 1 .7 auto; */
    /* position: relative; */
    /* height: 100vh; */
    position: absolute;
    top: 56px; /* height of navbar */
    bottom: 19px; /* height of bottom bar */
    left: 0;
    right: 0;
    z-index: 0;
    width: 100%;
    height: auto;
  }


  #mydiv55 {
      position: absolute;
      z-index: 9;
      background-color: #f1f1f1;
      text-align: center;
      border: 1px solid #d3d3d3;
  }

  #mydivheader55 {
      padding: 10px;
      cursor: move;
      z-index: 10;
      background-color: #2196F3;
      color: #fff;
  }

      
#refreshButton {
    position: absolute;
    /* top: 13px; */
    /* left: 48px; */
    padding: 4px;
    z-index: 402;
    margin-left: 64px;
    margin-top: 64px;
    height:30x;
    width:30px;
    background-color:#ffffff;
    border:2px solid gray;
}
#qryForm1 {
    position: absolute;
    /* top: 13px; */
    /* left: 48px; */
    padding: 2px;
    z-index: 402;
    margin-left: 64px;
    margin-top: 14px;
    height:30x;
    /* width:30px; */
    background-color:#ffffff;
}

#qryForm2 {
    position: absolute;
    /* top: 13px; */
    /* left: 48px; */
    padding: 4px;
    z-index: 402;
    margin-left: 64px;
    margin-top: 64px;
    height:30x;
    /* width:30px; */
    background-color:#ffffff;
    border:2px solid gray;
}


#myUL {
margin: 0;
padding: 0;
}

.caret {
cursor: pointer;
-webkit-user-select: none; /* Safari 3.1+ */
-moz-user-select: none; /* Firefox 2+ */
-ms-user-select: none; /* IE 10+ */
user-select: none;
}

.caret::before {
content: "\2B9E";
/* content: "\25B6"; */
/* content: "+"; */
color: black;
display: inline-block;
margin-right: 4px;
}

.caret-down::before {
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Safari */
transform: rotate(90deg);  
}

.nested {
display: none;
}

.active {
display: block;
}



/* another */
.layer-tree{
list-style-type: none; 
}

ul.layer-tree {
margin: 0;
/* padding-left: 25px; */
padding-left: 15px;
line-height: 1.8em;
list-style: none;
background-color: #fff;
font-size:13px;
}
ul.layer-tree li {
position: relative;
/* line-height: 2em; */
}
ul.layer-tree li:before {
position: absolute;
top: 0;
/* left: -15px; */
left: -10px;
display: block;
/* width: 15px; */
width: 10px;
height: 1em;
content: "";
border-bottom: 1px dotted #666;
border-left: 1px dotted #666;
}
/* hide the vertical line on the first item */
ul.tree > li:first-child:before {
border-left: none;
}
ul.layer-tree li:after {
position: absolute;
top: 1.1em;
bottom: 1px;
left: -10px;
display: block;
content: "";
border-left: 1px dotted #666;
}

/* hide the lines on the last item */
ul.layer-tree li:last-child:after {
display: none;
}
.layer-tree > li input[type="checkbox"]{
/* padding:5px;
display: inline-block; */
/* float: left; */
margin-left: 2px;
margin-right: 4px;
margin-top: 7px;

}

/* inserted via JS  */
.js-toggle-icon {
position: relative;
z-index: 1;
display: inline-block;
width: 14px;
margin-right: 6px;
/* margin-left: -23px; */
margin-left: -18px;
line-height: 14px;
text-align: center;
font-style: normal;
cursor: pointer;
background-color: #fff;
border: 1px solid #666;
border-radius: 2px;

}
div.sticky {
position: -webkit-sticky;
position: sticky;
}

.illigal-occupation-pin {
      margin-left: -12.5px; /* -x */
      margin-top: -41px; /* -y */
      width: 25px;
      height: 41px;
      transform: translate3d(1968px, -463px, 0px);
      z-index: -463;
  }
  .my-label {
position: absolute;
width:1000px;
font-size:20px;
}

/* .leaflet-tooltip {
background-color: transparent !important;
border: 0px;
box-shadow: none !important;
color:#ffffff;
font-weight: bold;
font-size:9px;
text-shadow: 1px 1px 2px red, 0 0 1em blue, 0 0 0.2em blue;
} */

.map-sheetindex-tooltips {
background-color: transparent !important;
box-shadow: none !important;
border: none !important;
color:#ffffff !important;
font-weight: bold;
font-size:10px;
text-shadow: 1px 1px 2px red, 0 0 1em rgb(255, 234, 0), 0 0 0.2em rgb(251, 231, 1);
}


.accent {
    accent-color: #32CD32;
}

.leaflet-control-measure{
  box-shadow: none;
  border: 4px solid rgba(0, 0, 0, 0.3);
}

.hero-image {
  background-image:  url("../img/hero18.png") !important;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

/* old */
.busy-overlay{
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 999;
        background: rgba(255,255,255,0.8) url("/examples/images/loader.gif") center no-repeat;
    }
   
    /* Turn off scrollbar when body element has the loading class */
    body.loading{
        overflow: hidden;   
    }
    /* Make spinner image visible when body element has the loading class */
    body.loading .busy-overlay{
        display: block;
    }


     .nav-sidebar>.nav-item>.nav-link.active, .sidebar-light-primary .nav-sidebar>.nav-item>.nav-link.active {
        background-color: #494E53 !important;
        color: #fff;
     }

    .f10{
        font-size: 10px;    
    }
    .f11{
        font-size: 11px;    
    }
    .f12{
        font-size: 12px;    
    }
    .f13{
        font-size: 13px;    
    }
    
    .comomn-height-z{
        height: 60vh;
    }
    .comomn-height-z65{
        min-height: 65vh;
    }
    .sinin-backg-img {
        background-image: url("../img/backimg/1.jpg");
        background-size: cover;
        background-repeat: no-repeat;
     }
     .sinup-backg-img {
        background-image: url("../img/backimg/2.jpg");
        background-size: cover;
        background-repeat: no-repeat;
     }

     .forgot-backg-img {
        background-image: url("../img/backimg/G03.jpg");
        background-size: cover;
        background-repeat: no-repeat;
     }

     .feedback-backg-img {
        background-image: url("../img/backimg/feedback.png");
        background-size: cover;
        background-repeat: no-repeat;
     }
     

     .basic-functions {
        position: absolute;
        bottom: 50px;
        left: 10px;
      }
      
      .basic-functions .btns {
        position: relative;
        width: 35px;
        height: 35px;
        background-color: #ffffff;
        margin: 1px;
        padding: 5px;
        border-radius: 3px;
        box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.73);
      }
      
      .basic-functions .fas {
        font-size: 1.2rem;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
      }


.leaflet-measure-lable .close{
    float: none !important;
}

.leaflet-measure-contents >h3{
    font-size: 1.2rem;
    float: left;
}

.leaflet-measure-actions,.leaflet-measure-action{
    float: left;
    display: flex;
    padding: 0 !important;
}

/* .leaflet-measure-toggle{

} */
.leaflet-measure-contents {
    padding:0 !important;
    background-color: #919187;
}

.leaflet-measure-contents-icon{
    display: block;
    width: auto;
    padding: 0 9px 0 23px;
    border: 0;
    text-align: left;
    /* background-image: url('data:image/svg+xml;utf8,<svg t="1599643864260" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26869" width="32" height="32"><path d="M910.623 777.748h-79.725V325.977l-53.15 53.149v398.622H282.715l580.416-605.875-37.58-37.578-579.299 604.707v-492.75h372.591l48.92-53.149H246.252v-79.725c0-14.688-11.886-26.575-26.575-26.575-14.688 0-26.575 11.886-26.575 26.575v79.725h-79.724c-14.689 0-26.575 11.886-26.575 26.575s11.886 26.575 26.575 26.575h79.724v584.646h584.646v79.725c0 14.688 11.887 26.574 26.574 26.574 14.689 0 26.576-11.887 26.576-26.574v-79.725h79.725c14.688 0 26.574-11.887 26.574-26.576 0-14.688-11.886-26.575-26.574-26.575z"></path></svg>'); */
    /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16.5V21h-4.5L3 7.5 7.5 3 21 16.5zM4.5 8.5l2 2M7.5 11.5l2 2M10.5 14.5l2 2M13.5 17.5l2 2'/%3E%3C/svg%3E"); */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='currentColor' d='M497.9 74.2L437.8 14.1c-18.8-18.8-49.2-18.8-68 0L14.1 369.9c-18.8 18.8-18.8 49.2 0 68l60.1 60.1c18.8 18.8 49.2 18.8 68 0L497.9 142.2c18.8-18.8 18.8-49.2 0-68zM142.2 439.8l-69.9-69.9 25.2-25.2 17.6 17.6c6.2 6.2 16.4 6.2 22.6 0s6.2-16.4 0-22.6l-17.6-17.6 25.2-25.2 17.6 17.6c6.2 6.2 16.4 6.2 22.6 0s6.2-16.4 0-22.6l-17.6-17.6 25.2-25.2 17.6 17.6c6.2 6.2 16.4 6.2 22.6 0s6.2-16.4 0-22.6l-17.6-17.6 25.2-25.2 17.6 17.6c6.2 6.2 16.4 6.2 22.6 0s6.2-16.4 0-22.6l-17.6-17.6 25.2-25.2 69.9 69.9L142.2 439.8z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 5px 50%;
    background-size: 18px 18px;
    background-color: transparent;
    text-decoration: none;
}

.measure-holder {
    background-color: #919187;
    color:#ffffff;
    margin: 0px;
    padding: 0px;
    list-style: none;
    white-space: nowrap;
    align-items: center;
    display: flex;
    
}
.measure-holder:hover{
    background-color:#757570;
    color:#ffffff;
    text-decoration: none;
}
.measure-holder > a{
    color:#ffffff ;
    text-decoration: none;
}

.measure-holder > a::after{
    color:#ffffff ;
    text-decoration: none;
}


.leaflet-control-measure a.start {
        color:#ffffff;
        text-decoration: none;
}
.leaflet-control-measure a.start:hover {
    color:#ffffff;
    text-decoration: none;

}

.credits-backg-img {
        background-image: url("../img/csc-logo.png");
        background-size: cover;
        background-repeat: no-repeat;
        border-radius: 0.25rem;
        -ms-flex-align: center;
        align-items: center;
        display: -ms-flexbox;
        display: flex;
        font-size: 1.875rem;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
        width: 100px;
     }

#one-panel > label{
    margin-bottom: 0rem !important;
}

/* ******** Dynamic Legend ******** */


#style-3::-webkit-scrollbar-track
    {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        background-color: #F5F5F5;
    }

    #style-3::-webkit-scrollbar
    {
        width: 6px;
        background-color: #F5F5F5;
    }

    #style-3::-webkit-scrollbar-thumb
    {
        background-color: #000000;
    }

#dynamic-legend {
  position: fixed;
  bottom: 27px;
  right: 9px;
  padding: 0.3rem;
  transition: margin-right 0.55s;
  max-height: 100vh;
  transition-duration: 3200ms;
  z-index: 3000;
}


.dynamic-legend-body {
  bottom: 0;
  overflow-y: hidden;
  font-size: 13px;
}


.dynamic-legend-body-scrollbar {
    margin-left: 0px;
    float: left;
    max-height: 48vh;
    width: 220px;
    background: #F5F5F5;
    overflow-y: scroll;
    margin-bottom: 25px;
}


.legend {
position: absolute;
bottom: 0.6px;
right: 5px;
padding: 0.3rem;
transition: margin-right 0.55s;
max-height: 68vh;
overflow-y: auto;
transition-duration: 3200ms;
overflow: auto;
}


/* ********* End Dynamic Legend ********** */


/* *********** Left Tab ***************** */
 .tab{
  cursor: pointer;
  padding:10px 14px;
  margin:1px 1px;
  background:#6AA9DC;
  display:inline-block;
  color:#fff;
  border-radius:3px 3px 0px 0px;
  box-shadow: 0 0.5rem 0.8rem #00000080;
  font-size: 16px;
  
}
.panels{
  background:#fffffff6;
  box-shadow: 0 2rem 2rem #00000080;
  min-height:200px;
  width:100%;
  max-width:500px;
  border-radius:3px;
  overflow:hidden;
  padding:10px;  
}
.panel{
  display:none;
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
.panel-title{
  font-size:1.5em;
  font-weight:bold
}
.radio{
  display:none;
}
#onex:checked ~ .panels #one-panel-i,
#one:checked ~ .panels #one-panel,
#two:checked ~ .panels #two-panel,
#three:checked ~ .panels #three-panel,
#four:checked ~ .panels #four-panel,
#five:checked ~ .panels #five-panel{
  display:block;
 
}
#onex:checked ~ .tabs #one-tab-i,
#one:checked ~ .tabs #one-tab,
#two:checked ~ .tabs #two-tab,
#three:checked ~ .tabs #three-tab,
#four:checked ~ .tabs #four-tab,
#five:checked ~ .tabs #five-tab{
  background:#fffffff6;
  color:#000;
  border-top: 3px solid #0D82FF;
  
}

/* Map grid instuction print msg. */
#map-bottom-message {
  position: absolute;
  bottom: 18px; 
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.75);
  color: white;
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 12px;
  z-index: 1000;
  display: none; 
  pointer-events: none;
  white-space: nowrap;
}

.leaflet-control-scale {
      position: absolute !important;
      left: 0px;
      bottom: 6px;
      z-index: 1000;
    }


.leaflet-bookmarks-control {
    width: 35px !important;  /* Custom width */
    height: 32px !important; /* Or set a fixed height if needed */
    max-height: 300px;        /* Optional scroll limit */
    font-size: 14px;          /* Optional: adjust text size */
}

.bookmarks-container{
    min-width:182px !important;
}

.leaflet-control-basemapsSwitcher{
    margin-left: 4px;
    margin-bottom: 22px;
}

.basic-functions {
  position: absolute;
  bottom: 50px;
  left: 10px;
}

.basic-functions .btns {
  position: relative;
  width: 35px;
  height: 35px;
  background-color: #ffffff;
  margin: 1px;
  padding: 5px;
  border-radius: 3px;
  box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.73);
}

.basic-functions .fas {
  font-size: 1.2rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.nav-extended1{
    background-color: #6AA9DC !important;
    border-bottom: 1px solid #000 !important;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
}

.nav-extended2 {
    background-color: #ffffff !important;
    border-bottom: 1px solid #000 !important;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
}

.nav-link a.txt-white{
    color: #FFFFFF !important;
}

.nav-link-pushmenu{
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
}

.font-white{
    color: #ffffff !important;
}

.bottom-nav-extended1{
    background-color: #6AA9DC !important;
    border-top: 1px solid #000 !important;
    box-shadow: 6px 0px 10px rgba(0, 0, 0, 0.2);
}
.bottom-nav-extended1 > div, .bottom-nav-extended1 a, .bottom-nav-extended1 span{
    color: #ffffff;
} 

/* .leaflet-tooltip {
    background-color: transparent;
    border: 0px;
    box-shadow: none;
    color:#ffffff;
    font-weight: bold;
    font-size:9px;
    text-shadow: 1px 1px 2px red, 0 0 1em blue, 0 0 0.2em blue;
} */


#accordion .card .card-body{
  padding: 4px;
}

.accro-f-color{
  color: #134eb7 !important;
}


/* ********* Leaflet override css class *********** */

.leaflet-control-zoom, .leaflet-bookmarks-control, .leaflet-control-locate, .leaflet-control-measure, .leaflet-control-browser-print {
    border: 3px solid rgba(0, 0, 0, 0.2) !important;
}

.leaflet-control-attribution{
  margin-right: 15px !important;
  margin-bottom:5px !important;
}

.title-head{
  background-image: url("../img/lt-5.png");
  background-repeat: no-repeat;
  /* background-position: left center; */
  background-attachment: fixed;
  min-height: 56px;
}
.title-head1{
  /* background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)), url('your-image.jpg'); */
  /* background-image: linear-gradient(to right, #FFFFFF, #6AA9DC),url("../img/hero23.png"); */
  background-image: url("../img/hero25.png");
  background-repeat: no-repeat;
  background-position: left 292px center;
  /* background-attachment: fixed; */
  /* min-height: 56px; */
  background-color: #6AA9DC;
  
}


.index-z10011{
  z-index: 10011 !important;
}

.navbar {
  /* padding:0px !important; */
  height:56px;
}

/* @media print {
  body {
    visibility: hidden;
  }
  #mapdiv {
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
    display: block; 

  }
} */


/*Draw toolabr overright */


/* Advanced options */
    .advanced-options { 
      max-height: 0; 
      overflow: hidden;
      transition: max-height 0.3s ease-out;
      background-color: #f9f9f9;
      border-radius: 4px;
      margin-top: 10px;
    }
    .advanced-options.expanded { 
      max-height: 300px; 
      /* padding: 10px; */
      padding: 1px 8px;
      border: 1px solid #ddd;
      overflow-y: auto; /* Add scrollbar when needed */
    }
    .toggle-advanced {
      width: 100%;
      text-align: center;
      /* margin: 10px 0;
      padding: 5px; */
      margin: 4px 0;
      padding: 2px;
      background: #f0f0f0;
      border: 1px solid #ddd;
      cursor: pointer;
      border-radius: 4px;
    }
    .toggle-advanced:hover {
      background: #e0e0e0;
    }

    /* Rings styling */
    .ring-row { 
      margin: 2px 0; 
      padding: 5px; 
      border: 1px solid #ddd; 
      border-radius: 4px;
      background: white;
    }
    .ring-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 1px;
    }
    .ring-title {
      font-weight: bold;
    }
    .remove-ring {
      color: #f44336;
      cursor: pointer;
      font-weight: bold;
      padding: 2px 6px;
      border-radius: 3px;
    }
    .remove-ring:hover {
      background: #ffebee;
    }

    /* Labels */
    .buffer-label-container { background:transparent; border:none; }
    .buffer-label {
      background:#fff; padding:2px 6px; border-radius:3px; border:1px solid #ccc;
      font-weight:700; text-shadow:0 0 3px #fff;
    }
    .width-indicator {
      position: absolute;
      background: rgba(255, 255, 255, 0.8);
      padding: 2px 5px;
      border-radius: 3px;
      border: 1px solid #ccc;
      font-size: 11px;
      pointer-events: none;
      z-index: 1000;
    }

    /* Highlight selection */
    .feature-highlight path, .feature-highlight circle {
      stroke:#3388ff !important; stroke-width:4 !important; opacity:0.8 !important; fill-opacity:.2 !important;
    }

    /* Small red edit vertices */
    .leaflet-editing-icon,
    .leaflet-div-icon.leaflet-editing-icon {
      background: red !important;
      border: 1px solid darkred !important;
      width: 6px !important;
      height: 6px !important;
      margin-left: -3px !important;
      margin-top: -3px !important;
      border-radius: 50% !important;
    }
  .leaflet-show-draw-buffer{
    margin-top: 0px !important;
    border: 3px solid rgba(0, 0, 0, 0.2) !important;
    color: #FFFFFF;
  }

  /* .leaflet-show-draw-buffer a {
    background-color: #fbf304 !important;
  } */

/* End Draw toolbar */
.leaflet-draw.leaflet-control {
  margin-bottom: 5px !important; /* optional spacing from bottom */
}


.leaflet-control-scale{
   margin-left: 52px !important;
}

/* Print styles */
  /* @media print {
    @page { size: A4 landscape; margin: 20mm; }
    body { -webkit-print-color-adjust: exact; } 
    .print-header {
      text-align: center;
      font-size: 18px;
      font-weight: bold;
      margin-bottom: 10px;
    }
    .print-footer {
      position: fixed;
      bottom: 10mm;
      width: 100%;
      text-align: center;
      font-size: 12px;
      border-top: 1px solid #ccc;
      padding-top: 4px;
    } 
  } */


  /*16.09 2025*/

  /* Hidden header/footer (only for print) */
    .print-header,
    .print-footer {
      display: none;
    }

    /* ---- PRINT STYLES ---- */
   /* @media print {*/
      /* @page {  */
        /* size: A4 landscape !important; */
        /* margin: 20mm;  */
        
        /* width: 100% !important; */
      /* } */
      /* body { -webkit-print-color-adjust: exact; }  */

      /* body, html {
        height: 100vh;
        width: 100%;

      } */

      /* #mapdiv{ */
        /* height: calc(100vh - 100px) !important;  */
        /* width: 100% !important; */
      /* } */
      /* .leaflet-control-browser-print,.comp-legend-tab, .leaflet-control-basemapsSwitcher{
        display: none !important; 
      }
      #sudo,#mySidepanelLeft, .leaflet-control, .leaflet-bar, .leaflet-control-browser-print{
        display: none; 
      }

      .print-header,
      .print-footer {
        display: block;    
        text-align: center;
        font-weight: bold;
        padding: 8px;
        
      } */
    /*}*/

    /* @media print {
      .print-header,
      .print-footer {
        display: block;    
        text-align: center;
        font-weight: bold;
        padding: 8px;
        
      }
    } */



.sign-in-cintent{
  position: relative; width: 100%; min-height: 78vh;
}
  

    /* Media Query*/

@media (min-width:320px)  { 
  .sign-in-cintent{
    position: relative; width: 100%;
  }
  .sign-in-container{
    position: absolute; 
     
  }
}
@media (min-width:480px)  { /* smartphones, Android phones, landscape iPhone */ }
@media (min-width:600px)  { /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */ }
@media (min-width:801px)  { 
/* tablet, landscape iPad, lo-res laptops ands desktops */ 
.sign-in-container{
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
  }
}
@media (min-width:1025px) { 
/* big landscape tablets, laptops, and desktops */ 
.sign-in-container{
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
  }

}
@media (min-width:1281px) { 
/* hi-res laptops and desktops */ 

.sign-in-container{
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
  }
}


/********* new ************/

@media (max-width:767.98px){
  .navbar_top{
  width: 100%;
      padding: 0px 20px 0px 0px;
      display: flex;
      justify-content: space-between;
  }
  .navbar-collapse{
    background-color: rgb(128, 128, 128);
  }
   .navbar-toggler{
    height: 40px;
    padding: 4px 5px 4px 5px !important;
  }
}