/* SMALL Menu from http://kmturley.blogspot.com/2014/06/responsive-mobile-dropdown-navigation.html --*/

/* header */
#SmallMenu {height:40px;}

.SMheader {

  background-color:transparent;
  background-color:#212937;
  position: absolute;
  width: 100%;
  z-index:10;
	padding-left:10px; 
}

.SMheader ul {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
  background-color: #FFFFFF;
}

.SMheader li a {
  display: block;
  text-align:left;
	padding: 8px 20px;
  border-top: 1px dotted #3f3f3f;
	  border-bottom: 1px dotted #000000;
  font-weight:300;
  text-decoration: none;
	color:#FFFFFF;
	background-color:#123148;
}

.SMheader li a:hover,
.SMheader .menu-btn:hover {
 background-color:#0E3E6E;
 background-color:#447DC0;
 color:#ffffff;
}

/* menu */
.SMheader .menu {
  clear: both;
  max-height: 0;
	width:100%;
  transition: width .5s ease-out;
  transition: max-height .2s ease-out;
}




/* The rest controls the menu icon */
.SMheader .menu-icon {
  cursor: pointer; 
  display: inline-block;
  float: left;
  padding: 20px 10px 21px 5px;
  position: relative;
  user-select: none;
}

.SMheader .menu-icon .navicon {
  background: #ffffff;
  display: block;
  height: 3px;
  position: relative;
  transition: background .5s ease-out;
  width: 20px;
}

.SMheader .menu-icon .navicon:before,
.SMheader .menu-icon .navicon:after {
  background: #ffffff;
  content: '';
	display: block;
  position: absolute;
  height: 100%;
  transition: all .2s ease-out;
  width: 100%;
}

.SMheader .menu-icon .navicon:before {top: 7px;}
.SMheader .menu-icon .navicon:after {top: -7px;}

/* menu btn */
.SMheader .menu-btn {display: none;}
.SMheader .menu-btn:checked ~ .menu {max-height: 2000px;}
.SMheader .menu-btn:checked ~ .menu-icon .navicon {background: transparent;}
.SMheader .menu-btn:checked ~ .menu-icon .navicon:before {transform: rotate(-45deg);}
.SMheader .menu-btn:checked ~ .menu-icon .navicon:after  {transform: rotate(45deg);}
.SMheader .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.SMheader .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {top: 0;}
