hlight {background-color:yellow; color:green;}
hlightw {background-color:red; color:yellow;}

markgreen {background-color:green;}
markorange {background-color:orange;}
markred {background-color:red;}

divpadtop {
  padding-top: 5px;
}

div.sticky {
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  padding: 5px;
}

.draggable {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 1000;
    width: 350px; /* Prevent it from expanding */
    max-width: 90%; /* Adjust to screen size */
}

.form-content {
    width: 100%; /* Ensure the form content stays within the draggable div */
    max-height: 500px; /* Optional: Constrain height */
    overflow-y: auto; /* Add scrolling if content overflows */
}

.sticky_show_form {
    cursor: pointer;
}

.drag-handle {
    cursor: move;
    background-color: #444;
    color: white;
    padding: 10px;
    border-radius: 8px 8px 0 0;
}

.topnav {
  overflow: hidden;
  background-color: #e9e9e9;
}

.topnav a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.topnav a.active {
  background-color: green;
  color: white;
}

.topnav a.disabled {
   pointer-events: none;
   cursor: not-allowed;
   opacity: 0.5;
}

.topnav .search-container {
  float: right;
}

.topnav input[type=text] {
  padding: 6px;
  margin-top: 8px;
  font-size: 17px;
  border: none;
}

.topnav .search-container button {
  float: right;
  padding: 6px 10px;
  margin-top: 8px;
  margin-right: 16px;
  background: #ddd;
  font-size: 17px;
  border: none;
  cursor: pointer;
}

.topnav .search-container button:hover {
  background: #ccc;
}

.sidepanel  {
  width: 0;
  position: fixed;
  z-index: 1;
  height: 250px;
  top: 0;
  right: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidepanel a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidepanel a:hover {
  color: #f1f1f1;
}

.sidepanel .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
}

.openbtn {
  position: fixed;
  top: 16px;
  right: 16px;

  font-size: 20px;
  cursor: pointer;
  background-color:transparent;
  color: white;
  padding: 10px 15px;
  border: none;
}

.openbtn:hover {
  background-color:grey;
}

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=email], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=password], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=phone], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}
.cancelbtn {
  background-color: #f44336;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

span.password {
  float: right;
  padding-top: 16px;
}

.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #4d4d4d;
   color: white;
   text-align: center;
}

.dropbtn {
  border-radius: 5px;
  background-color: #2196f3;
  color: white;
  /*padding: 16px;*/
  font-size: 15px;
  border: none;
  cursor: pointer;
  width: 50px;
  height: 38px;
  margin-top: 10px;
  /*margin-bottom: 100px;*/
  /*margin-right: 150px;*/
  /*margin-left: 80px;*/
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #cccccc;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 120px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown a:hover {background-color: #229cff;}

.show {display: block;}

.topmainmenu {
  overflow: hidden;
  background-color: #ffffff;
  position: relative;
}

.topmainmenu a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topmainmenu a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.topmainmenu a:hover {
  background-color: #ddd;
  color: black;
}

.topmainmenu a.active {
  background-color: green;
  color: white;
}

.topmainmenu a.disabled {
   pointer-events: none;
   cursor: not-allowed;
   opacity: 0.5;
}

.mySlides {display:none;}

.w3-left, .w3-right, .w3-badge {cursor:pointer}
.w3-badge {height:25px;width:28px;padding:0}

div.sticky_bottom {
  width: 410px;
  position: -webkit-sticky;
  position: sticky;
  bottom: 80px;
  right: 5px;
}

div.sticky_show_form {
  width: 250px;
  position: -webkit-sticky;
  position: sticky;
  bottom: 60px;
  right: 5px;
}


/* CSS Media Query for mobile screens (max-width: 768px) */
@media screen and (max-width: 768px) {
    #2c4052 {
        display: none;
    }
}

/* For desktop or larger screens */
@media screen and (min-width: 769px) {
    #2c4052 {
        display: block;
    }
}


/*@media screen and (max-width: 300px) {
  span.password {
     display: block;
     float: none;
  }
}*/

/*p {color:white; font-size:calc(1vw + 1vh);}*/

/*img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}*/


/** {box-sizing: border-box;}*/

/*body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
}*/

/*@media screen and (max-width: 600px) {
  .topnav .search-container {
    float: none;
  }
  .topnav a, .topnav input[type=text], .topnav .search-container button {
    float: none;
    display: block;
    text-align: left;
    width: 100%;
    margin: 0;
    padding: 14px;
  }
  .topnav input[type=text] {
    border: 1px solid #ccc;
  }
}*/