@import url('https://fonts.googleapis.com/css?family=Muli:300,300i,400,600,700,800,900');

/*   images shadow all page

 =================================*/
.navbar-inverse .navbar-nav > li > a {
  color: #fff;
}

.dropdown-menu > li > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 300;
  line-height: 24px;
  color: #333;
  white-space: nowrap;
  color: #333;
}

.carousel-control {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 0%;
  font-size: 20px;
  color: #847c7c;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  opacity: .5;
  filter: alpha(opacity=50);
}

@media (max-width:800px) {

  /*colaps and toggel*/
  .wet-asphalt {
    background-color: #bebebe;
  }

  .navbar-header {
    float: none;
  }

  .navbar-toggle {
    display: block;
  }

  .navbar-collapse {
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  }

  .navbar-collapse.collapse {
    display: none !important;
  }

  .navbar-nav {
    float: none !important;
    margin: 0px -15px;
  }

  .navbar-nav>li {
    float: none;
	background-color: #999;
  }

  .navbar-nav>li>a {
    padding-top: 30px;
    padding-bottom: 20px;
  }

  .navbar-inverse .navbar-toggle {
    border-color: #333;
    background-color: #555;
    margin-top: 27px;
  }

}

.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.open>a:focus {
  color: #fff;
  background-color: rgba(8, 8, 8, 0);
}

.sticky-container {

  /*background-color: #333;*/

  padding: 0px;
  margin: 0px;
  position: fixed;
  right: -173px;
  top: 180px;
  width: 200px;
  z-index: 999;
  display: none;
}

.sticky li {
  list-style-type: none;
  background-color: #333;
  font-size: 12px;
  color: #efefef;
  height: 30px;
  padding: 0px;
  margin: 0px 0px 1px 0px;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  cursor: pointer;
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  filter: gray;
  -webkit-filter: grayscale(100%);
}

.sticky li:hover {
  margin-left: -150px;                          /*-webkit-transform: translateX(-115px);

      -moz-transform: translateX(-115px);

      -o-transform: translateX(-115px);

      -ms-transform: translateX(-115px);

      transform:translateX(-115px);*/

  /*background-color: #8e44ad;*/

  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
  -webkit-filter: grayscale(0%);
}

.sticky li img {
  float: left;
  margin: 5px 5px;
  margin-right: 10px;
}

.sticky li p {
  padding: 3px;
  margin: 0px;                          /*text-transform: uppercase;*/
  line-height: 35px;
  font-size: 12px;
  color: #fff;
}

.socialicon {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-width: 0px;
  -webkit-box-shadow: 0px 0px;
  box-shadow: 0px 0px;
  background-color: rgba(0, 0, 0, 0.0);
  background-image: -webkit-gradient(linear, 50.00% 0.00%, 50.00% 100.00%, color-stop(0%, rgba(0, 0, 0, 0.00)), color-stop(100%, rgba(0, 0, 0, 0.00)));
  background-image: -webkit-linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 100%);
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 100%);
}

.socialicon li {
  float: left;
}

.socialicon li a {
  display: block;
  color: #fff;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.socialicon li a:hover {
  background-color: #111;
}

.navbar-inverse {
  background-color: #fff;
  border-color: rgba(34, 34, 34, 0.75);
}

.height {
  height: 800px;
}

/*mouse over change color menu bar text*/
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
  color: #fff;
  font-weight: 600;
  font-size: 13px;
  background-color: rgba(8, 8, 8, 0);
  border-bottom: 2px solid #036d97;
  border-radius: 1px;
}

.navbar-brand {
  float: left;
  padding: 5px 5px;
}

/*code stricky menu==============================?*/
@media screen and (min-width:800px) {
  .navbar {
    padding: 0px 0;
    border-bottom: 0;
    letter-spacing: 1px;
    background: 0 0;
    color: #000;
    -webkit-transition: background .5s ease-in-out, padding .5s ease-in-out;
    -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;
    transition: background .5s ease-in-out, padding .5s ease-in-out;
  }

  .top-nav-collapse {
    padding: 0;
    background-color: #f9f9f9 !important;
  }

  #navbar.navbar-inverse.top-nav-collapse .navbar-nav {
    margin-top: 10px;
    margin-bottom: 10px;                                                      /*transition: 1s;*/
  }

  .navbar-inverse.top-nav-collapse .navbar-nav > li > a {
    color: #000;
    text-transform: uppercase;
  }

  #navbar.navbar-inverse.top-nav-collapse .navbar-brand {
    float: left;
    padding: 2px 0px;
    font-size: 18px;
    line-height: 20px;
    
    height: 50px;                                            /*transition: 1s;*/
  }

  .navbar-inverse.top-nav-collapse .navbar-nav > li > a {
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius: 4px;
    text-transform: uppercase;
    font-size: 12px;
    font-family: 'Muli', sans-serif;
    font-weight: 600;
  }

  .navbar.top-nav-collapse {
    min-height: 0px !important;
    border: none;
    position: fixed !important;
    margin-bottom: 0px;
    border: 1px solid transparent;
    min-width: 100% !important;
    z-index: 1000 !important;
  }

  #navbar.navbar-inverse.top-nav-collapse .navbar-brand img {
    max-width: 100%;
    max-height: 100%;                                            /*margin-top: 2px;*/
  }

  .navbar-custom.top-nav-collapse {
    border-bottom: 1px solid;
  }

  .navbar-inverse.top-nav-collapse .navbar-nav>.open>a, .navbar-inverse.top-nav-collapse .navbar-nav>.open>a:hover, .navbar-inverse.top-nav-collapse .navbar-nav>.open>a:focus {
    color: #000;
    background-color: rgba(8, 8, 8, 0);
  }

  .navbar-inverse.top-nav-collapse .navbar-nav>li>a:hover, .navbar-inverse.top-nav-collapse .navbar-nav>li>a:focus {
    color: #000;
    font-weight: 600;
    font-size: 12px;
    background-color: #08080800;
    border-bottom: 2px solid #036d97;
    border-radius: 0px;
  }

  #navbar.navbar-inverse.top-nav-collapse .navbar-nav>.active>a, .navbar-inverse.top-nav-collapse .navbar-nav>.active>a:hover, .navbar-inverse.top-nav-collapse .navbar-nav>.active>a:focus {
    color: #000;
    font-weight: 600;
    font-size: 13px;
    background-color: #08080800;
    border-bottom: 2px solid #f29321;
    border-radius: 0px;
  }

}

.dropdown-menu .divider {
  height: 1px;
  margin: 0px 0px;
  overflow: hidden;
  background-color: #dedede;
}

/*close code*/
@media (min-width:320px) and (max-width:799px) {
  .navbar {
    padding: 0px 0;
    border-bottom: 0;
    letter-spacing: 1px;
    background: #3b3b3b;
    color: #000;
    -webkit-transition: background .5s ease-in-out, padding .5s ease-in-out;
    -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;
    transition: background .5s ease-in-out, padding .5s ease-in-out;
  }

  .top-nav-collapse {
    padding: 0;
    background-color: #3b3b3b;
  }

  .navbar-inverse.top-nav-collapse .navbar-nav > li > a {
    color: #fff;
    text-transform: uppercase;
  }

  .navbar-inverse.top-nav-collapse .navbar-brand {
    float: left;
    padding: 2px 0px;
    font-size: 18px;
    line-height: 20px;
    width: 60px;
    margin-bottom: 5px;
  }

  .navbar-inverse.top-nav-collapse .navbar-brand img {
    max-width: 100%;
    max-height: 100%;
    padding: px;
  }

  .navbar-custom.top-nav-collapse {
    border-bottom: 1px solid;
  }

  .navbar-inverse.top-nav-collapse .navbar-nav>.open>a, .navbar-inverse.top-nav-collapse .navbar-nav>.open>a:hover, .navbar-inverse.top-nav-collapse .navbar-nav>.open>a:focus {
    color: #000;
    background-color: rgba(8, 8, 8, 0);
  }

  .dropdown:hover .dropdown-menu {
    display: block !important;
  }

}

legend {
  display: block;
  width: 45%;
  padding: 0;
  margin-bottom: 0px;
  line-height: inherit;
  color: #555;
  border: 0;
}

fieldset {
  padding: .35em .625em .75em;
  margin: 15px 2px;                                              /*border: 1px solid #ededed;*/
}

.nav>li>a {
  position: relative;
  display: block;
  padding: 10px 10px;
  margin: 0px 5px;
}

/*summer note aditing*/
.note-popover .popover-content .dropdown-menu, .panel-heading.note-toolbar .dropdown-menu {
  min-width: 90px !important;
}