

  .container {
    max-width: 1460px;
  }
  @media only screen and (width: 1920px) {
    .container { width: 80%; }
  }

  @media only screen and (width: 1366px) {
    .container { max-width: 90%; }
  }

  @media only screen and (width: 992px) {
    .container { max-width: 90%; }
  }
  @media only screen and (width: 2560px) {
    .container { max-width: 70%; }
  }


  .container-fluid {
    max-width: 80%!important;/*Set your own width %; */
  }
  @media only screen and (max-width: 600px) { 
    .container-fluid {
    width: 100%!important;/*Set your own width %; */
    }
  }



/* ===== Dropdown Submenu ====== */

.subitemnav li:hover > ul.dropdown-menu {
    border-radius: 0;
    display: block;
    background-color: white;
    box-shadow: 2px 2px 8px #999;
}
.dropdown-submenu {
    position:relative;
}
.dropdown-submenu>.dropdown-menu {
    left: 5px;
    right: auto;
    top: 0%;
    left: 100%;
    margin-top:-6px;
}

  .dropdown-item {
    border-left: 1px solid #ccc;
    padding: 5px 10px; 
    transition: all .2s linear;
  }
  .dropdown-item:before {
    content: "\2B9A";
    color: #666;
    padding-right: 5px;
  }
  .dropdown-item:hover:before  {
    color: green;
  }
  /* rotate caret on hover */
  .dropdown-menu > li > a:after {
    transition: all .3s linear;
      transform: rotate(-90deg);
  } 
  .dropdown-menu > li > a:hover:after {
    transform: translateX(20px);
  } 

/*dropdown_hover */ 

  .dropdown:hover > .dropdown-menu, .dropdown-submenu {

      display: block;
      border: 0px;
      transition: all .4s;
  }

  .dropdown-item:hover {
    color: green;
    background-color: #ddd;
    border-left: 5px solid green;
    transform: translateY(0px) ;
  }

  .topdownbtn:hover {
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
  }

    
  /* ======Checklist Button Modify ======*/
  .checkbox-btn {
    border:1px solid #ddd;
    position: relative;  
  }
  .checkbox-btn input {
      position: absolute;
      z-index: -1;
      opacity: 0; }
  .checkbox-btn input:checked ~ .btn {
      background-color: #3167eb;
      color: #fff;
  }

/* ================= mobilenavbar style ================= */

.screen-overlay {
  height: 100%;
  z-index: 30;
  position: fixed;
  top: 0;
  left: 0;
  opacity:0;
  visibility:hidden;
  background-color: rgba(34, 34, 34, 0.3);
  transition:opacity .2s linear, visibility .1s, width 1s ease-in;
}
.screen-overlay.show {
  transition:opacity .5s ease, width 0s;
  opacity:1;
  width:100%;
  visibility:visible;
}
	
@media all and (max-width:992px) { 

 .offcanvas-header{ display:block; }
 
 .mobile-offcanvas{
    visibility: hidden;
    transform:translateX(-100%);
    border-radius:0; 
    display:block;
    position: fixed;
    top: 0; left:0;
    height: 100%;
    z-index: 1200;
    width:75%;
    overflow-y: scroll;
    overflow-x: none;
    transition: visibility .2s ease-in-out, transform .2s ease-in-out;
  }


  .mobile-offcanvas.show{
    visibility: visible;
    transform: translateX(0);
  }
}
/* ================= mobilenavbar style ================= */