/* General styles for all menus */
/*.cbp-spmenu*/
.gen-menu {
	background: #060606;
	position: fixed;
}
#navBar {
    height: 100%;
    top: 0;
    width: 100px;
    z-index: 1000;
    background: none repeat scroll 0 0 #212121;
    position: absolute;  
    cursor: pointer;  
}

#navBar #menu_button {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4yLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMzIuMTY2cHgiIGhlaWdodD0iMjQuMzM0cHgiIHZpZXdCb3g9IjAgMCAzMi4xNjYgMjQuMzM0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAzMi4xNjYgMjQuMzM0IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM1RTVGNUYiIGQ9Ik0zMi4xNjYsMy41ODRjMCwwLjU1My0wLjQ0NiwxLTEsMUgxYy0wLjU1MywwLTEtMC40NDctMS0xVjFjMC0wLjU1MywwLjQ0Ny0xLDEtMWgzMC4xNjYNCgljMC41NTQsMCwxLDAuNDQ3LDEsMVYzLjU4NHoiLz4NCjxwYXRoIGZpbGw9IiM1RTVGNUYiIGQ9Ik0zMi4xNjYsMTMuMzM0YzAsMC41NTMtMC40NDYsMS0xLDFIMWMtMC41NTMsMC0xLTAuNDQ3LTEtMVYxMC43NWMwLTAuNTUzLDAuNDQ3LTEsMS0xaDMwLjE2Ng0KCWMwLjU1NCwwLDEsMC40NDcsMSwxVjEzLjMzNHoiLz4NCjxwYXRoIGZpbGw9IiM1RTVGNUYiIGQ9Ik0zMi4xNjYsMjMuMzM0YzAsMC41NTMtMC40NDYsMS0xLDFIMWMtMC41NTMsMC0xLTAuNDQ3LTEtMVYyMC43NWMwLTAuNTUzLDAuNDQ3LTEsMS0xaDMwLjE2Ng0KCWMwLjU1NCwwLDEsMC40NDcsMSwxVjIzLjMzNHoiLz4NCjwvc3ZnPg0K");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 26px;
    width: 33px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 35%;    
}

.cbp-spmenu-push-toright #navBar #menu_button {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4yLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMjUuMTZweCIgaGVpZ2h0PSIyNS4xNTlweCIgdmlld0JveD0iMCAwIDI1LjE2IDI1LjE1OSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjUuMTYgMjUuMTU5IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM1RTVGNUYiIGQ9Ik0xNS44MjIsMTIuNThsOS4wNDQtOS4wNDRjMC4zOTItMC4zOTIsMC4zOTItMS4wMjMsMC0xLjQxNWwtMS44MjctMS44MjdjLTAuMzkxLTAuMzkxLTEuMDIzLTAuMzkyLTEuNDE0LDANCglMMTIuNTgsOS4zMzhMMy41MzUsMC4yOTNjLTAuMzkyLTAuMzkxLTEuMDIzLTAuMzkxLTEuNDE1LDBMMC4yOTMsMi4xMmMtMC4zOTIsMC4zOTItMC4zOTEsMS4wMjMsMCwxLjQxNWw5LjA0NSw5LjA0NGwtOS4wNDUsOS4wNDUNCgljLTAuMzkxLDAuMzkyLTAuMzkxLDEuMDIzLDAsMS40MTRsMS44MjcsMS44MjhjMC4zOTEsMC4zOTEsMS4wMjMsMC4zOTEsMS40MTUsMGw5LjA0NS05LjA0NWw5LjA0NCw5LjA0NA0KCWMwLjM5MSwwLjM5MiwxLjAyMiwwLjM5MiwxLjQxNCwwbDEuODI3LTEuODI3YzAuMzkxLTAuMzkxLDAuMzkyLTEuMDIzLDAtMS40MTRMMTUuODIyLDEyLjU4eiIvPg0KPC9zdmc+DQo=");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 28px;
    width: 29px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 35%;    
}

#navBar #gen_logo {
    background-image: url("../images/gen-logo.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 40px;
    width: 49px;
}
#navBar #gen_logo {
    left: 50%;
    margin-left: -25px;
    margin-top: -23px;
    position: absolute;
    top: 50%;
}


/*Nav Link Text*/
#nav_wrap ul li {
	line-height: 1.4;
}
#nav_wrap ul li a {
    /*font-family: "futura-pt",sans-serif;*/
    font-weight: 300;
    font-size: 1.25em;
    text-transform: uppercase;
}
#nav_wrap ul li a:hover {
    color: #9C9C9C;
}
.cbp-spmenu-push-toright #nav_wrap {
    opacity: 1;
}
#nav_wrap {
    background-color: #060606;
    height: 100%;
    opacity: 0;
    /*position: absolute;*/
    /*right: 100px;*/
    top: 0;
    transform: translate3d(0px, 0px, 0px);
    transition: opacity 600ms ease-out 200ms;
    /*width: 300px;*/
}
#nav_wrap ul {
    height: 100px;
    left: 0;
    list-style: outside none none;
    margin: -50px 0 0 0;
    position: absolute;
    top: 50%;
    transform: translate3d(0px, 0px, 0px);
}

#nav_wrap #footer {
    bottom: 0;
    left: 0;
    padding: 0 0 2.0625em 2.0625em;
    position: absolute;
    font-size: 0.8125em;
    line-height: 1.3;
    text-transform: uppercase;
    color: #7C7C7C;
}

#nav_wrap #footer small {
    font-size: 0.6875em;
}

/*.cbp-spmenu h3 {
	color: #afdefa;
	font-size: 1.9em;
	padding: 20px;
	margin: 0;
	font-weight: 300;
	background: #0d77b6;
}

.cbp-spmenu a {
	display: block;
	color: #fff;
	font-size: 1.1em;
	font-weight: 300;
}

.cbp-spmenu a:hover {
	background: #258ecd;
}

.cbp-spmenu a:active {
	background: #afdefa;
	color: #47a3da;
}*/



/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {
	width: 240px;
	height: 100%;
	top: 0;
	z-index: 1000;
}

.cbp-spmenu-vertical a {
	color: white;
	padding: 1em;
}

.cbp-spmenu-horizontal {
	width: 100%;
	height: 150px;
	left: 0;
	z-index: 1000;
	overflow: hidden;
}

.cbp-spmenu-horizontal h3 {
	height: 100%;
	width: 20%;
	float: left;
}

.cbp-spmenu-horizontal a {
	float: left;
	width: 20%;
	padding: 0.8em;
	border-left: 1px solid #258ecd;
}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {
	left: -240px;
}

.cbp-spmenu-right {
	right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
	left: 0px;
}

.cbp-spmenu-right.cbp-spmenu-open {
	right: 0px;
}

/* Horizontal menu that slides from the top or bottom */

/*.cbp-spmenu-top {
	top: -150px;
}

.cbp-spmenu-bottom {
	bottom: -150px;
}*/

/*.cbp-spmenu-top.cbp-spmenu-open {
	top: 0px;
}

.cbp-spmenu-bottom.cbp-spmenu-open {
	bottom: 0px;
}*/

/* Push classes applied to the body */

.cbp-spmenu-push {
	overflow-x: hidden;
	position: relative;
	left: 0;
}


.cbp-spmenu-push-toright {
	left: 240px;
}

.cbp-spmenu-push-toleft {
	left: -240px;
}

/* Transitions */

.gen-menu,
.cbp-spmenu-push {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

/*  media queries */



/* Portrait and Landscape */
@media only screen 
  and (max-device-width: 767px)
  and (-webkit-min-device-pixel-ratio: 2) {

	 #navBar {
	  width: 100%;
	  height: 60px;
	  /*padding-top: 1.0625em;*/
	  -webkit-touch-callout: none !important;
	/*  -webkit-transform: translate3d(100%, 0, 0);
	  -moz-transform: translate3d(100%, 0, 0);
	  -ms-transform: translate3d(100%, 0, 0);
	  -o-transform: translate3d(100%, 0, 0);
	  transform: translate3d(100%, 0, 0);*/
	}

	#navBar #menu_button {
	  margin-left: 5%;
	  margin-right: 0;
	  margin-top: 15px;
	}

	.cbp-spmenu-push-toright #navBar #menu_button {
	  margin-left: 5%;
	  margin-right: 0;
	  margin-top: 15px;
	}
	#nav_wrap ul {
	 /* height: 114px;
	  position: relative;*/
	  top: 0;
	  margin: 120px 0 0 0;
	}
	#nav_wrap ul li {
	  line-height: 2.2;
	}
	#nav_wrap #footer {
	  position: relative;
	  padding-top: 7px;
	  /*margin-top: 100px;*/

	}	
	#navBar #gen_logo {
		height: 30px;
		width: 39px;
		margin-top: -18px;
	}

}


/* ----------- iPad mini ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

	#navBar {
	  width: 100%;
	  height: 60px;
	  -webkit-touch-callout: none !important;
	}

	#navBar #menu_button {
	  margin-left: 5%;
	  margin-right: 0;
	  margin-top: 15px;
	}

	.cbp-spmenu-push-toright #navBar #menu_button {
	  margin-left: 5%;
	  margin-right: 0;
	  margin-top: 15px;
	}
	#nav_wrap ul {
	 /* height: 114px;
	  position: relative;*/
	  top: 0;
	  margin: 120px 0 0 0;
	}
	#nav_wrap ul li {
	  line-height: 2.2;
	}
	#nav_wrap #footer {
	  position: relative;
	  padding-top: 7px;
	  /*margin-top: 100px;*/

	}	
	#navBar #gen_logo {
		height: 30px;
		width: 39px;
		margin-top: -18px;
	}

}