/* General Style */

.header-nav:after {
  clear: both;
}


/* Search Box Button*/
.search-button{ float:right;}
.search-toggle {
  position: relative;
  display: block;
  height: 59px;
  width: 64px;
    
  background:url(../img/search-bar.jpg) no-repeat;
}
.search-toggle::before, .search-toggle::after {
  content: '';
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s;
  transition: all 0.1s;
}
.search-toggle::before {
 
  width: 286%;
  height: 276%;
  margin-top:-5px;

}








/* Example #2 */

#header-2 .menu li {
  opacity: 1;
  -webkit-transition: opacity 0.2s 0.1s, -webkit-transform 0.3s;
  transition: opacity 0.2s 0.1s, -webkit-transform 0.3s;
  transition: transform 0.3s, opacity 0.2s 0.1s;
  transition: transform 0.3s, opacity 0.2s 0.1s, -webkit-transform 0.3s;
}
#header-2 .menu li:nth-child(1) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
#header-2 .menu li:nth-child(2) {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}
#header-2 .menu li:nth-child(3) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
#header-2 .menu li:nth-child(4) {
  -webkit-transition-delay: 0.7s;
          transition-delay: 0.7s;
}
#header-2 .menu li:nth-child(5) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
#header-2 .search-box {
  position: absolute;
  left: 0;
  
  
  height: 100%;
  padding-left: 2em;
  -webkit-transform: translateX(20%);
          transform: translateX(20%);
  opacity: 0;
  -webkit-transition: all 0.4s 0.3s;
  transition: all 0.4s 0.3s;
}
#header-2 .search-box .search-input {
  border: 0;
  background:transparent;
  color:#fff;



}
#header-2 .search-box .search-toggle {
  width: 14px;
  height: 14px;
  padding: 0;
  position: absolute;
  left: 5px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
#header-2.show .menu li {
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  opacity: 0;
}
#header-2.show .search-box {
  width: calc(100% - 5em);
  -webkit-transform: translateX(0);
          transform: translateX(0);
  opacity: 1;
  margin-top:-44px;
}