/*************************************************************
[TABLE OF CONTENTS]

- LOGO
- MENU BUTTON
- MENU BUTTON STYLE #1
- MENU BUTTON STYLE #2
- MENU BUTTON STYLE #3
- MENU BUTTON STYLE #4
- MENU BUTTON STYLE #5
- MENU BUTTON STYLE #6
- MAIN WRAPPER
- MAIN MENU
- SUB-MENU
- MAIN BACKGROUND
- BACKGROUND IMAGE
- BACKGROUND LINES
- MISC
- WORDPRESS TOOLBAR (IF WORDPRESS TOOLBAR ACTIVE, PUSH HEADER ELEMENTS DOWN A BIT)
- MEDIA QUERIES
*************************************************************/

/* LOGO
**************************************************/
/* wrapper */
.navi-logo-wrapper {
	position:fixed;
	z-index:998;
	top:18px;
	right:15px;
}
.navi-logo-above-menu {
    z-index:9999999998;
}
/* if left positioning active */
.navi-left {
    right:auto;
    left:60px;
	text-align:left;
}
/* if logo center positioning active */
.navi-center {
    right:0;
    left:0;
	text-align:center;
}
/* if logo is an image */
.navi-logo-image img {
	width:auto;
	max-height:50px;
}
/* if logo is text */
.navi-logo a {
/*	font-family:'Roboto';*/
	font-size:16px;
	text-decoration:none;
	color:#676970;
	margin:0;
	padding:5px;
	
	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}
.navi-logo a:hover {
	color:#8D8E92;
	text-decoration:none;
}
/* primary/secondary logo switch */
.navi-logo-primary {
	position:relative;
	z-index:10;

	-webkit-transition:all .4s ease;
	-moz-transition:all .4s ease;
	transition:all .4s ease;
}
.navi-logo-secondary {
	opacity:0;
	position:absolute;
	top:0;
	z-index:9;

	-webkit-transition:all .4s ease;
	-moz-transition:all .4s ease;
	transition:all .4s ease;
}
.navi-logo-image-active .navi-logo-primary {
	opacity:0;
}
.navi-logo-image-active .navi-logo-secondary {
	opacity:1;
}


/* MENU BUTTON
**************************************************/
/* wrapper */
.navi-main-menu-button-wrapper {
	position:fixed;
	z-index:99999999999;
	top:10px;
	left:10px;
	width:50px;
	height:46px;
	cursor:pointer;
	
	-webkit-transition:opacity .2s ease .3s, top 0s ease .3s;
	-moz-transition:opacity .2s ease .3s, top 0s ease .3s;
	transition:opacity .2s ease .3s, top 0s ease .3s;
    
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
/* if positioned right */
.navi-right {
	left:auto;
	right:20px;
}


/* MENU BUTTON STYLE #1
**************************************************/
.navi-main-menu-button {
	padding:6px 10px;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	transition:all .3s ease;
}
.navi-main-menu-button:before,
.navi-main-menu-button div.navi-main-menu-button-middle:before,
.navi-main-menu-button:after {
	content:'';
	display:block;
	width:30px;
	height:2px;
	margin:7px 0;
	background-color:#92959E;

	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
	
	/* lessen animation 'pop' in Firefox */
	outline:1px solid transparent;
}
/* menu bars (active) */
.navi-menu-active .navi-main-menu-button:before,
.navi-menu-active .navi-main-menu-button div.navi-main-menu-button-middle:before,
.navi-menu-active .navi-main-menu-button:after {
	background-color:#fff;
}


/* MENU BUTTON STYLE #2
**************************************************/
.navi-main-menu-button-two {
	padding:6px 10px;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	transition:all .3s ease;
}
.navi-main-menu-button-two:before,
.navi-main-menu-button-two div.navi-main-menu-button-two-middle:before,
.navi-main-menu-button-two:after {
	content:'';
	display:block;
	width:30px;
	height:2px;
	margin:7px 0;
	background-color:#92959E;

	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
	
	/* lessen animation 'pop' in Firefox */
	outline:1px solid transparent;
}
.navi-main-menu-button-two div.navi-main-menu-button-two-middle:before {
	width:25px;
    margin-left:5px;
}
.navi-main-menu-button-two:after {
	width:20px;
    margin-left:10px;
}
/* menu bars (active) */
.navi-menu-active .navi-main-menu-button-two:before,
.navi-menu-active .navi-main-menu-button-two div.navi-main-menu-button-two-middle:before,
.navi-menu-active .navi-main-menu-button-two:after {
	background-color:#fff;
}


/* MENU BUTTON STYLE #3
**************************************************/
.navi-main-menu-button-three {
	padding:6px 10px;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	transition:all .3s ease;
}
.navi-main-menu-button-three:before,
.navi-main-menu-button-three div.navi-main-menu-button-three-middle:before,
.navi-main-menu-button-three:after {
	content:'';
	display:block;
	width:25px;
	height:2px;
	margin:7px 0;
	background-color:#92959E;

	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
	
	/* lessen animation 'pop' in Firefox */
	outline:1px solid transparent;
}
.navi-main-menu-button-three div.navi-main-menu-button-three-middle:before {
	width:20px;
}
/* menu bars (active) */
.navi-menu-active .navi-main-menu-button-three:before,
.navi-menu-active .navi-main-menu-button-three div.navi-main-menu-button-three-middle:before,
.navi-menu-active .navi-main-menu-button-three:after {
	background-color:#fff;
}


/* MENU BUTTON STYLE #4
**************************************************/
.navi-main-menu-button-four {
	padding:6px 10px;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	transition:all .3s ease;
}
.navi-main-menu-button-four:before,
.navi-main-menu-button-four div.navi-main-menu-button-four-middle:before,
.navi-main-menu-button-four:after {
	content:'';
	display:block;
	width:25px;
	height:2px;
	margin:7px 0;
	background-color:#92959E;

	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
	
	/* lessen animation 'pop' in Firefox */
	outline:1px solid transparent;
}
.navi-main-menu-button-four div.navi-main-menu-button-four-middle:before {
	width:20px;
}
.navi-main-menu-button-four:after {
	width:15px;
}
/* menu bars (active) */
.navi-menu-active .navi-main-menu-button-four:before,
.navi-menu-active .navi-main-menu-button-four div.navi-main-menu-button-four-middle:before,
.navi-menu-active .navi-main-menu-button-four:after {
	background-color:#fff;
}


/* MENU BUTTON STYLE #5
**************************************************/
.navi-main-menu-button-five {
	padding:6px 10px;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	transition:all .3s ease;
}
.navi-main-menu-button-five:before,
.navi-main-menu-button-five div.navi-main-menu-button-five-middle:before,
.navi-main-menu-button-five:after {
	content:'';
	display:block;
	width:22px;
	height:2px;
	margin:9px 0;
	background-color:#92959E;

	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
	
	/* lessen animation 'pop' in Firefox */
	outline:1px solid transparent;
}
/* menu bars (active) */
.navi-menu-active .navi-main-menu-button-five:before,
.navi-menu-active .navi-main-menu-button-five div.navi-main-menu-button-five-middle:before,
.navi-menu-active .navi-main-menu-button-five:after {
	background-color:#fff;
}


/* MENU BUTTON STYLE #6
**************************************************/
.navi-main-menu-button-six {
	padding:6px 10px;
	
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	transition:all .3s ease;
}
.navi-main-menu-button-six:before,
.navi-main-menu-button-six:after {
	content:'';
	display:block;
	width:30px;
	height:2px;
	margin:6px 0;
	background-color:#92959E;

	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
	
	/* lessen animation 'pop' in Firefox */
	outline:1px solid transparent;
}
/* menu bars (active) */
.navi-menu-active .navi-main-menu-button-six:before,
.navi-menu-active .navi-main-menu-button-six:after {
	background-color:#fff;
    
    -webkit-transition:all .25s ease !important;
	-moz-transition:all .25s ease !important;
	transition:all .25s ease !important;
}


/* MENU BUTTON LABEL
**************************************************/
.navi-menu-button-label {
    position:absolute;
    top:7px;
    left:40px;
/*    font-family:'Roboto';*/
	font-weight:400;
    font-size:11px;
    letter-spacing:0;
    color:#92959E;
    padding:10px;
    white-space:nowrap;
    
    -webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}


/* MAIN WRAPPER
**************************************************/
/* main wrapper */
.navi-main-wrapper {
    position:fixed;
	z-index:999999999;
	top:0;
    bottom:0;
	left:-100%;
	width:100%;
	overflow-x:hidden;
	
	margin:0;
	padding:0;
	color:#767676;
	
	-webkit-transition:left 0s ease .4s;
	-moz-transition:left 0s ease .4s;
	transition:left 0s ease .4s;
}
.navi-main-wrapper-active {
	left:0;
	
	-webkit-transition:left 0s ease;
	-moz-transition:left 0s ease;
	transition:left 0s ease;
}


/* MAIN MENU
**************************************************/
.navi-menu-wrapper {
	position:relative;
	top:150px;
	width:300px;
	margin:0 0 0 105px;
	padding:9px 0 50px 0;
	
	/* prevent iOS scroll flicker */
    transform:translate3d(0,0,0);
	-webkit-transform:translate3d(0,0,0);
	/* smooth scroll on touch devices */
	-webkit-overflow-scrolling:touch;
}
/* top-level menu */
.navi-by-bonfire .menu {
	width:90%;
	list-style-type:none;
	margin:0;
	padding:0;
	position:relative;
	left:0;
}
.navi-by-bonfire .menu li {
	margin:0;
	padding:0;
	border:none;
	z-index:auto;
	position:relative;
}
/* individual main menu items */
.navi-by-bonfire ul li {
	width:100%;
	list-style-type:none;
	margin:0;
	padding:0;
	text-align:left;
}
/* top-level menu item */
.navi-by-bonfire ul li a {
	width:100%;
	left:0;
	font-size:30px;
	line-height:30px;
/*	font-family:'Roboto';*/
	font-weight:300;
	color:#fff;
	margin:0;
	padding:10px 0 5px 0;
	display:inline-block;
	text-decoration:none;
	outline:none;
	
	-webkit-transition:all .2s ease;
	-moz-transition:all .2s ease;
	transition:all .2s ease;
}	
/* hide top-level menu items */
.navi-top-inactive {
	-webkit-transition:opacity .75s ease, -webkit-transform .75s ease, left 0s ease .75s !important;
	-moz-transition:opacity .75s ease, -moz-transform .75s ease, left 0s ease .75s !important;
	transition:opacity .75s ease, transform .75s ease, left 0s ease .75s !important;
}
.navi-by-bonfire ul li.current-menu-item > a {
	color:#6A7074;
	text-decoration:line-through;
}
/* hide top-level menu items */
.navi-top-inactive {
	-webkit-transition:opacity .75s ease, -webkit-transform .75s ease, left 0s ease .75s !important;
	-moz-transition:opacity .75s ease, -moz-transform .75s ease, left 0s ease .75s !important;
	transition:opacity .75s ease, transform .75s ease, left 0s ease .75s !important;
}
.navi-by-bonfire ul.navi-top-inactive > li > a {
	opacity:0 !important;
	pointer-events:none;
}
/* custom border */
.navi-by-bonfire ul li.border a {
	padding-bottom:19px;
	margin-bottom:8px;
	border-bottom:1px solid #D9D9D9;
}
/* top-level menu item hover */
.navi-by-bonfire ul li a:hover,
.navi-by-bonfire ul li a:active {
	color:#1e73be !important;
}
.navi-by-bonfire ul li {
	opacity:0;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li {
	opacity:1;
}
/* individual li animation speeds (up to 25) */
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(1) {
	-webkit-transition:opacity .3s ease .2s;
	-moz-transition:opacity .3s ease .2s;
	transition:opacity .3s ease .2s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(2) {
	-webkit-transition:opacity .3s ease .25s;
	-moz-transition:opacity .3s ease .25s;
	transition:opacity .3s ease .25s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(3) {
	-webkit-transition:opacity .3s ease .3s;
	-moz-transition:opacity .3s ease .3s;
	transition:opacity .3s ease .3s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(4) {
	-webkit-transition:opacity .3s ease .35s;
	-moz-transition:opacity .3s ease .35s;
	transition:opacity .3s ease .35s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(5) {
	-webkit-transition:opacity .3s ease .4s;
	-moz-transition:opacity .3s ease .4s;
	transition:opacity .3s ease .4s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(6) {
	-webkit-transition:opacity .3s ease .45s;
	-moz-transition:opacity .3s ease .45s;
	transition:opacity .3s ease .45s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(7) {
	-webkit-transition:opacity .3s ease .5s;
	-moz-transition:opacity .3s ease .5s;
	transition:opacity .3s ease .5s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(8) {
	-webkit-transition:opacity .3s ease .55s;
	-moz-transition:opacity .3s ease .55s;
	transition:opacity .3s ease .55s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(9) {
	-webkit-transition:opacity .3s ease .6s;
	-moz-transition:opacity .3s ease .6s;
	transition:opacity .3s ease .6s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(10) {
	-webkit-transition:opacity .3s ease .65s;
	-moz-transition:opacity .3s ease .65s;
	transition:opacity .3s ease .65s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(11) {
	-webkit-transition:opacity .3s ease .7s;
	-moz-transition:opacity .3s ease .7s;
	transition:opacity .3s ease .7s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(12) {
	-webkit-transition:opacity .3s ease .75s;
	-moz-transition:opacity .3s ease .75s;
	transition:opacity .3s ease .75s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(13) {
	-webkit-transition:opacity .3s ease .8s;
	-moz-transition:opacity .3s ease .8s;
	transition:opacity .3s ease .8s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(14) {
	-webkit-transition:opacity .3s ease .85s;
	-moz-transition:opacity .3s ease .85s;
	transition:opacity .3s ease .85s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(15) {
	-webkit-transition:opacity .3s ease .9s;
	-moz-transition:opacity .3s ease .9s;
	transition:opacity .3s ease .9s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(16) {
	-webkit-transition:opacity .3s ease .95s;
	-moz-transition:opacity .3s ease .95s;
	transition:opacity .3s ease .95s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(17) {
	-webkit-transition:opacity .3s ease 1s;
	-moz-transition:opacity .3s ease 1s;
	transition:opacity .3s ease 1s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(18) {
	-webkit-transition:opacity .3s ease 1.05s;
	-moz-transition:opacity .3s ease 1.05s;
	transition:opacity .3s ease 1.05s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(19) {
	-webkit-transition:opacity .3s ease 1.1s;
	-moz-transition:opacity .3s ease 1.1s;
	transition:opacity .3s ease 1.1s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(20) {
	-webkit-transition:opacity .3s ease 1.15s;
	-moz-transition:opacity .3s ease 1.15s;
	transition:opacity .3s ease 1.15s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(21) {
	-webkit-transition:opacity .3s ease 1.2s;
	-moz-transition:opacity .3s ease 1.2s;
	transition:opacity .3s ease 1.2s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(22) {
	-webkit-transition:opacity .3s ease 1.25s;
	-moz-transition:opacity .3s ease 1.25s;
	transition:opacity .3s ease 1.25s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(23) {
	-webkit-transition:opacity .3s ease 1.3s;
	-moz-transition:opacity .3s ease 1.3s;
	transition:opacity .3s ease 1.3s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(24) {
	-webkit-transition:opacity .3s ease 1.35s;
	-moz-transition:opacity .3s ease 1.35s;
	transition:opacity .3s ease 1.35s;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li:nth-child(25) {
	-webkit-transition:opacity .3s ease 1.4ss;
	-moz-transition:opacity .3s ease 1.4s;
	transition:opacity .3s ease 1.4s;
}


/* SUB-MENU
**************************************************/
/* the arrow button */
.navi-by-bonfire ul li span {
	width:80px;
	height:45px;
	z-index:999;
	position:absolute;
	top:6px;
	right:0;
	margin:0;
	padding:0;
	cursor:pointer;
	text-align:right;
	opacity:0;
	
	-webkit-transition:width .5s ease, right .5s ease, padding .5s ease, -webkit-transform .5s ease;
	-moz-transition:width .5s ease, right .5s ease, padding .5s ease, -moz-transform .5s ease;
	transition:width .5s ease, right .5s ease, padding .5s ease, transform .5s ease;
}
.navi-menu-wrapper-active .navi-by-bonfire ul li span {
	opacity:1;
}
.navi-by-bonfire .menu-item-has-children:hover span {
	right:-10px;
}
/* don't let users accidentally click on inactive sub-menu arrow */
.navi-by-bonfire ul.navi-top-inactive > li > span {
	pointer-events:none;
}
/* active sub-menu arrow */
.navi-by-bonfire .menu li span.navi-submenu-active {
	width:40px;
	right:0;
	opacity:1 !important;
	pointer-events:auto;
	-webkit-transform:translateX(-300px);
	-moz-transform:translateX(-300px);
	transform:translateX(-300px);
}
/* hide non-active sub-menu arrow (tip) */
.navi-by-bonfire ul.navi-top-inactive > li > span .sub-menu-arrow-tip-right {
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	transform:scale(0);
}
/* hide non-active sub-menu arrow (line) */
.navi-by-bonfire ul.navi-top-inactive > li > span .sub-menu-arrow-line {
	width:0;
}
/* arrow hover (when sub-menu active) */
.navi-by-bonfire .menu li span.navi-submenu-active:hover {
	padding-right:10px;
}
/* sub-menu indicator arrow line */
.sub-menu-arrow-line {
	width:78px;
	height:2px;
	background-color:#fff;
	margin-top:20px;
	
	-webkit-transition:all .6s ease;
	-moz-transition:all .6s ease;
	transition:all .6s ease;
}
/* sub-menu indicator arrow line (when sub-menu active) */
.navi-by-bonfire .menu li span.navi-submenu-active .sub-menu-arrow-line {
	width:34px;
}
/* sub-menu indicator arrow right tip */
.sub-menu-arrow-tip-right {
	position:relative;
	top:-4px;
	right:-2px;
	margin:0 0 0 auto;
	width:0;
	height:0; 
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	border-left:5px solid #fff;
	
	-webkit-transition:all .5s ease;
	-moz-transition:all .5s ease;
	transition:all .5s ease;
}
/* sub-menu indicator arrow right tip (when sub-menu active) */
.navi-by-bonfire .menu li span.navi-submenu-active .sub-menu-arrow-tip-right {
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	transform:scale(0);
}
/* sub-menu indicator arrow left tip */
.sub-menu-arrow-tip-left {
	position:absolute;
	top:16px;
	left:-2px;
	margin:0 auto 0 0;
	width:0; 
	height:0; 
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	border-right:5px solid #fff;
	
	-webkit-transform:scale(0);
	-moz-transform:scale(0);
	transform:scale(0);
	
	-webkit-transition:all .5s ease;
	-moz-transition:all .5s ease;
	transition:all .5s ease;
}
/* sub-menu indicator arrow left tip (when sub-menu active) */
.navi-by-bonfire .menu li span.navi-submenu-active .sub-menu-arrow-tip-left {
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	transform:scale(1);
}
/* sub-menu */
.navi-by-bonfire ul.sub-menu {
	position:absolute;
	z-index:9999;
	top:0;
	left:-1000%;
	list-style:none;
	margin:10px 0 0 0 !important;
	padding:0;
	opacity:0;
	height:100%;
	
	-webkit-transition:opacity .45s ease .2s, left 0s ease 0s;
	-moz-transition:opacity .45s ease .2s, left 0s ease 0s;
	transition:opacity .45s ease .2s, left 0s ease 0s;
}
.navi-sub-active {
	top:0;
	left:0 !important;
	opacity:1 !important;
	
	-webkit-transition:opacity .35s ease 0s, left 0s ease .35s;
	-moz-transition:opacity .35s ease 0s, left 0s ease .35s;
	transition:opacity .35s ease 0s, left 0s ease .35s;
}
/* add bottom padding to last sub-menu item */
.navi-by-bonfire ul.sub-menu li:last-child {
	padding-bottom:50px;
}
/* sub-menu items */
.navi-by-bonfire ul.sub-menu li a {
	min-width:300px;
	font-size:30px;
/*	font-family:'Roboto';*/
	font-weight:300;
	color:#fff;
	margin:0;
	padding:0 0 15px 0;
}
/* sub-menu items hover */
.navi-by-bonfire ul.sub-menu li a:hover {
	color:#C9A536;
}
.navi-by-bonfire ul.sub-menu li.current-menu-item > a {
	color:#6A7074;
	text-decoration:line-through;
}


/* MAIN BACKGROUND
**************************************************/
/* main background */
.navi-main-background {
	position:fixed;
	z-index:9999999;
	left:0;
	width:100%;
	height:100%;
    height:100vh;
	margin:0;
	padding:0;
	background-color:#0C1013;
	display:block;

	top:-100%;
	opacity:0;

	-webkit-transition:opacity .5s ease, top 0s ease .5s;
	-moz-transition:opacity .5s ease, top 0s ease .5s;
	transition:opacity .5s ease, top 0s ease .5s;
}
.navi-main-background-active {
	top:0;
	opacity:.9;
	
	-webkit-transition:opacity .5s ease, top 0s ease;
	-moz-transition:opacity .5s ease, top 0s ease;
	transition:opacity .5s ease, top 0s ease;
}


/* BACKGROUND IMAGE
**************************************************/
/* background image */
.navi-background-image {
	position:fixed;
	z-index:99999999;
	left:0;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	display:block;
    background-position:center center;

	top:-100%;
	opacity:0;

	-webkit-transition:opacity .5s ease, top 0s ease .5s;
	-moz-transition:opacity .5s ease, top 0s ease .5s;
	transition:opacity .5s ease, top 0s ease .5s;
}
.navi-background-image-active {
	top:0;
	opacity:1;
	
	-webkit-transition:opacity .5s ease, top 0s ease;
	-moz-transition:opacity .5s ease, top 0s ease;
	transition:opacity .5s ease, top 0s ease;
}


/* BACKGROUND LINES
**************************************************/
.navi-bg-lines-wrapper {
	position:fixed;
	z-index:99999999;
	top:0;
	left:-1000%;
	width:100%;
	height:100%;
	opacity:0;
	
	-webkit-transition:opacity .5s ease;
	-moz-transition:opacity .5s ease;
	transition:opacity .5s ease;
}
.navi-bg-lines-wrapper-active {
    left:0;
	opacity:.1;
}
.navi-bg-line-one,
.navi-bg-line-two,
.navi-bg-line-three,
.navi-bg-line-four,
.navi-bg-line-five,
.navi-bg-line-six {
	position:fixed;
	z-index:999999999;
	left:0;
	width:200%;
	height:1px;
	background-color:#fff;
	
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	transform:rotate(-45deg);
	
	-webkit-transform-origin:0 0;
	-moz-transform-origin:0 0;
	transform-origin:0 0;
}
.navi-bg-line-one { top:50%; }
.navi-bg-line-two { top:90%; }
.navi-bg-line-three { top:130%; }
.navi-bg-line-four { top:170%; }
.navi-bg-line-five { top:210%; }
.navi-bg-line-six { top:250%; }


/*
MISC
**************************************************/
/* if absolute positioning active */
.navi-absolute { position:absolute; }


/*
WORDPRESS TOOLBAR (IF WORDPRESS TOOLBAR ACTIVE, PUSH HEADER ELEMENTS DOWN A BIT)
**************************************************/
.wp-toolbar-active { margin-top:20px; }
/* if WordPress amin bar active, keep it above everything else */
#wpadminbar { z-index:9999999999999999999999999999; }


/*
MEDIA QUERIES
**************************************************/
@media screen and (max-width: 500px) {
	/* menu wrapper */
	.navi-menu-wrapper {
		top:100px !important;
		width:240px;
		margin:0 0 0 55px !important;
	}
	/* text size */
	.navi-by-bonfire ul li a,
	.navi-by-bonfire ul li ul.sub-menu a {
		font-weight:400;
		font-size:20px;
		line-height:20px;
	}
	/* sub-menu arrow line */
	.sub-menu-arrow-line {
		width:58px;
	}
	/* the arrow button */
	.navi-by-bonfire ul li span {
		top:0;
		width:50px;
	}
	/* arrow hover */
	.navi-by-bonfire .menu-item-has-children:hover span {
		right:-5px;
	}
	/* arrow hover (when sub-menu active) */
	.navi-by-bonfire .menu li span.navi-submenu-active:hover {
		padding-right:5px;
	}
	/* active sub-menu arrow */
	.navi-by-bonfire .menu li span.navi-submenu-active {
		width:30px;
		-webkit-transform:translateX(-220px);
		-moz-transform:translateX(-220px);
		transform:translateX(-220px);
	}
	/* sub-menu indicator arrow line (when sub-menu active) */
	.navi-by-bonfire .menu li span.navi-submenu-active .sub-menu-arrow-line {
		width:20px;
	}
}
/* for the thicker, mobile admin bar */
@media screen and (max-width: 782px) {
	.wp-toolbar-active { margin-top:34px; }
	#wpadminbar { position: fixed !important; }
}