/*--- this must put for every template, for error message ---*/
.error {color:red;}

img#nostockIcon {position: relative; top: -20px;}

@media (min-width: 768px) {
  #topLogin { position:relative; left:20px; top:-3px;}
}

@media (max-width: 768px) {
  #topLogin { text-align:center;}
  #content .main_box .box_1 {background:#FFF}
}

/* change menu position */
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  #nav .navbar-nav {padding-left:

  <?php
    //get menu padding_left position from condiguration table
    $this->db->select('top_menu_position')->from('configuration')->where('id_configuration', 1);
    $position_menu = $this->db->get()->row()->top_menu_position;
    echo $position_menu;
  ?>px;}
}

body, html { overflow-x:hidden; }

.staticBanners img {
    max-width: 100%;
    width: 100%;
    margin-bottom: 30px;
}

.wa_icon {
  position:fixed;
  right:20px;
  bottom:20px;
  z-index: 5;
}
.wa_icon .img_wa {
  width: 50px;
  height: 50px;
}
.crop {
  width: 260px;
  height: 150px;
  overflow: hidden;
}

.crop img {
  width: 260px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.navbar-default{
color: #fff;
background-color: #ccc6c6;
border-color: #aca1a2;
}
.navbar-default .navbar-nav > li > a{
  color:#fff;
}
.navbar-default .navbar-nav > .dropdown > a .caret{
  border-top-color: #fff;
    border-bottom-color: #fff;
}
.navbar-default .navbar-brand{
  color:#fff;
}
.navbar-brand {
  position: absolute;
  right: 0px;
  font-size: 15px;
}



.navbar-brand> ul > li {
  padding: 0px 15px;
}
.menu-large {
  position: static !important;
}
.megamenu{
  padding: 20px 0px;
  width:100%;
}
.megamenu> li > ul {
  padding: 0;
  margin: 0;
}
.megamenu> li > ul > li {
  list-style: none;
}
.megamenu> li > ul > li > a {
  display: block;
  padding: 3px 20px;
  padding-left: 13px;
  clear: both;
  font-weight: normal;
  line-height: 1.428571429;
  color: #333333;
  white-space: normal;
}
.megamenu> li ul > li > a:hover,
.megamenu> li ul > li > a:focus {
  text-decoration: none;
  color: #262626;
  background-color: #f5f5f5;
}
.megamenu.disabled > a,
.megamenu.disabled > a:hover,
.megamenu.disabled > a:focus {
  color: #999999;
}
.megamenu.disabled > a:hover,
.megamenu.disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  cursor: not-allowed;
}
.megamenu.dropdown-header {
  color: #428bca;
  font-size: 18px;
}

@media (min-width: 770px) {

.dropdown .dropdown-menu {
    display: none;
    margin-top: 0; // remove the gap so it doesn't close
 }

.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; // remove the gap so it doesn't close
 }

}

@media (max-width: 768px) {

  html.touch *:hover {
      pointer-events: none !important;
  }

  .wa_icon {
    position:fixed;
    right:5px;
    bottom:5px;
    z-index: 5;
  }
  .wa_icon .img_wa {
    width: 40px;
    height: 40px;
  }

  .carousel {
    display: none;
  }
  .navbar-brand {
    position: relative;
    right: auto;
  }
  .megamenu{
    margin-left: 0 ;
    margin-right: 0 ;
  }
  /* .megamenu> li {
    margin-bottom: 30px;
  } */
  .megamenu> li:last-child {
    margin-bottom: 0;
  }
  .megamenu.dropdown-header {
    padding: 3px 15px !important;

  }
  .navbar-nav .open .dropdown-menu .dropdown-header{
  color:black;
  }
}