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

- MAIN MENU BUTTON
- CLOSE BUTTON
- SEARCH
- MAIN MENU IMAGE
- MAIN MENU
- MAIN MENU ACTIVE
- MAIN MENU HOVER EFFECT ANIMATIONS
- FOOTER MENU
- SCROLLBAR STYLING
- MISC
- ICONS
- Z-INDEXES
- MEDIA QUERIES
*************************************************************/


/* MAIN MENU BUTTON
**************************************************/
.wauki-menu-button-wrapper {
	position:fixed;
	top:20px;
    left:20px;
    min-width:51px;
    min-height:51px;
    padding:11px 10px 6px 11px;
    border-radius:50px;
    cursor:pointer;
    box-sizing:border-box;

    -webkit-tap-highlight-color:rgba(0,0,0,0);

    border:2px solid #23262B;

    -webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}
.wauki-menu-button {
	top:13px;
	left:13px;
    text-decoration:none;
    display:inline-block;
}
.wauki-menu-button::before,
.wauki-menu-button::after,
.wauki-menu-button div.wauki-menu-button-middle {
	content:'';
	display:block;
	width:24px;
	height:3px;
    margin:4px 0;
    border-radius:50px;
    background-color:#B9B9B9;

	-moz-transition:all .25s ease;
	-webkit-transition:all .25s ease;
	transition: all .25s ease;
}
/* menu button text label */
.wauki-menu-button-label {
	color:#CFD4D4;
	font-size:13px;
	position:relative;
	top:-8px;
	margin:0 8px 0 10px;
	display:inline-block;
	
	font-family:'Jost',arial,tahoma,verdana;
	font-weight:500;
	font-size:12px;
    
    -webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}
/* main menu button top bar animation */
.wauki-menu-button-wrapper .wauki-menu-button::before {
    position:relative;
    transform-origin:top left;
    
    animation-duration:.35s;
	animation-timing-function:ease-in-out;
    animation-iteration-count:1;
    animation-fill-mode:forwards;
}
@keyframes wauki-menu-button-top-in {
	0% { width:24px; transform:rotate(0); }
    50% { width:0; transform:rotate(0); }
    51% { width:0; transform:rotate(45deg) translateY(-3px) translateX(3px); }
	100% { width:24px; transform:rotate(45deg) translateY(-3px) translateX(3px); }
}
@keyframes wauki-menu-button-top-out {
    0% { width:24px; transform:rotate(45deg) translateY(-3px) translateX(3px); }
    50% { width:0; transform:rotate(45deg) translateY(-3px) translateX(3px); }
    51% { width:0; transform:rotate(0); }
	100% { width:24px; transform:rotate(0); }
}
.wauki-menu-button-active .wauki-menu-button::before {
	animation-name:wauki-menu-button-top-in;
}
.wauki-menu-button-inactive .wauki-menu-button::before {
	animation-name:wauki-menu-button-top-out;
}
/* main menu button bottom bar animation */
.wauki-menu-button-wrapper .wauki-menu-button::after {
    position:relative;
    transform-origin:top left;
    
    animation-duration:.5s;
	animation-timing-function:ease-in-out;
    animation-iteration-count:1;
    animation-fill-mode:forwards;
}
@keyframes wauki-menu-button-bottom-in {
	0% { width:24px; transform:rotate(0); }
    50% { width:0; transform:rotate(0); }
    51% { width:0; transform:rotate(-45deg) translateY(4px); }
	100% { width:24px; transform:rotate(-45deg) translateY(4px); }
}
@keyframes wauki-menu-button-bottom-out {
    0% { width:24px; transform:rotate(-45deg) translateY(4px); }
    50% { width:0; transform:rotate(-45deg) translateY(4px); }
    51% { width:0; transform:rotate(0); }
	1000% { width:24px; transform:rotate(0); }
}
.wauki-menu-button-active .wauki-menu-button::after {
    animation-name:wauki-menu-button-bottom-in;
}
.wauki-menu-button-inactive .wauki-menu-button::after {
    animation-name:wauki-menu-button-bottom-out;
}
/* main menu button middle bar animation */
.wauki-menu-button-wrapper div.wauki-menu-button-middle {
    transform-origin:top right;
    
    -webkit-transition:transform .25s ease .25s, background-color .25s ease;
    -moz-transition:transform .25s ease .25s, background-color .25s ease;
    transition:transform .25s ease .25s, background-color .25s ease;
}
.wauki-menu-button-active div.wauki-menu-button-middle {
    transform:scaleX(0);
    
    -webkit-transition:transform .25s ease, background-color .25s ease;
    -moz-transition:transform .25s ease, background-color .25s ease;
    transition:transform .25s ease, background-color .25s ease;
}


/* CLOSE BUTTON
**************************************************/
.wauki-close-button {
    position:absolute;
	top:30px;
	right:30px;
	width:44px;
	height:44px;
    cursor:pointer;
    border:2px solid #23262B;
    border-radius:50%;
    box-sizing:border-box;

    -webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	transition: all .25s ease;
}
.wauki-close-button::before,
.wauki-close-button::after {
	content:'';
	position:absolute;
	top:1.2em;
	left:0.8em;
	width:14px;
	height:0.1em;
	background-color:#586262;
	
	border-radius:50px;

	-webkit-transition: all .15s ease;
	-moz-transition: all .15s ease;
	transition: all .15s ease;
}
.wauki-close-button::before {
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	transform:rotate(45deg);
}
.wauki-close-button::after {
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	transform:rotate(-45deg);
}


/* SEARCH
**************************************************/
.wauki-search-wrapper {
    position:absolute;
	top:30px;
	left:30px;
	width:44px;
	height:44px;
    border:2px solid transparent;
    background:#191C21;
    border-radius:50px;
    box-sizing:border-box;

    -webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	transition: all .25s ease;
}
.wauki-search-active {
	width:250px;
	border:2px solid #23262B;
	background:transparent;
}
/* searchform wrapper */
.wauki-searchform {
    display:none;
    opacity:0;
}
.wauki-search-active .wauki-searchform {
    display:inline;
    opacity:1;
}
/* searchform input */
.wauki-searchform #searchform input {
	width:100%;
	height:100%;
    position:absolute;
    top:0;
	left:0;
	padding:0 10px 0 50px;
	margin:0;
	border:0;
	background:transparent;
    outline:none;
    color:#99A2A2;
    border-radius:50px;
    box-sizing:border-box;
}
/* search button */
.wauki-search-button {
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:40px;
    height:100%;
    cursor:pointer;
    border-radius:50px;
}
.wauki-icon-search {
	position:absolute;
	top:.63em;
	left:.6em;
    font-size:18px;
    color:#808182;

    -webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	transition: all .25s ease;
}


/* MAIN MENU IMAGE
**************************************************/
.wauki-main-menu-image-wrapper {
	position:absolute;
    width:100%;
    top:100px;
	text-align:center;
}
.wauki-main-menu-image-wrapper img {
	height:auto;
    width:75%;
    margin:0;
}


/* MAIN MENU
**************************************************/
.wauki-by-bonfire-main-wrapper {
    position:fixed;
    top:0;
    left:0;
	width:100%;
	height:100%;
	
	opacity:0;
            
    -webkit-transform:translateY(-100%);
    -moz-transform:translateY(-100%);
    transform:translateY(-100%);

    -webkit-transition:opacity .5s ease 0s, -webkit-transform 0s ease .5s;
    -moz-transition:opacity .5s ease 0s, -moz-transform 0s ease .5s;
    transition:opacity .5s ease 0s, transform 0s ease .5s;
    
    /* smooth scroll on touch devices */
	-webkit-overflow-scrolling:touch;
}
/* the main menu */
.wauki-main-menu-wrapper {
    position:absolute;
    top:0;
    left:0;
	width:100%;
    height:100%;
    text-align:center;
    
    display:flex;
    align-items:center;
    justify-content:center;

    box-sizing:border-box;
	padding:40px;
}
.wauki-main-menu-wrapper-inner {
    position:relative;
	width:100%;
    height:100%;
    overflow:hidden;

	max-width:950px;
    max-height:550px;
    border-radius:2px;

    -webkit-transform:translateY(15px);
    -moz-transform:translateY(15px);
    transform:translateY(15px);
	
    -webkit-transition:-webkit-transform 0s ease-out .5s;
    -moz-transition:-moz-transform 0s ease-out .5s;
    transition:transform 0s ease-out .5s;
}
.wauki-menu-active .wauki-main-menu-wrapper-inner {
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
	
    -webkit-transition:-webkit-transform .5s ease-out;
    -moz-transition:-moz-transform .5s ease-out;
    transition:transform .5s ease-out;
}
.wauki-main-menu-wrapper-inner-inner {
    position:relative;
	width:100%;
	height:100%;
    overflow-y:auto;
}
.wauki-inner-bg-image {
    position:absolute;
	width:100%;
	height:100%;
	
    pointer-events:none;
    
    opacity:.25;
    background-size:cover;
    background-position:center center;
}
.wauki-inner-bg-color {
    position:absolute;
	width:100%;
	height:100%;
	
    pointer-events:none;
    
    opacity:1;
    background-color:#0A0A0C;
}
.wauki-by-bonfire-wrapper {
    position:relative;
	width:100%;
}
.wauki-by-bonfire {
    position:relative;
    top:100px;
    overflow:hidden;
    display:inline;
    margin:0 auto;
}
.wauki-by-bonfire > ul {
    margin:0 50px;
}
/* sub-menu indicator */
.wauki-by-bonfire .wauki-icon-keyboard_arrow_right {
	position:absolute;
	right:-30px;
	width:20px;
	height:22px;
    font-size:20px;
    color:#6C6C6D;
	top:calc(50% - 10px);
    pointer-events:none;

    -webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}
.wauki-by-bonfire .menu-item-has-children > a:hover .wauki-icon-keyboard_arrow_right {
	-webkit-transform:translateX(3px);
	-moz-transform:translateX(3px);
	transform:translateX(3px);
}
/* sub-menu back button */
.wauki-by-bonfire > ul .wauki-submenu-back-button {
    position:relative;
    display:inline-block;
	width:40px;
    margin:-46px auto 0 auto;
    text-align:right;
}
.wauki-by-bonfire > ul .wauki-submenu-back-button div {
    font-family:'Jost',arial,tahoma,verdana;
	font-weight:500;
    font-size:11px;
    color:#D3D0D0;
    display:inline-block;
    margin:0 -10px 10px 0;
    padding:10px 10px 10px 20px;
    cursor:pointer;
}
.wauki-by-bonfire > ul .wauki-submenu-back-button .wauki-icon-arrow-left {
	position:absolute;
    font-size:11px;
	height:12px;
	top:13px;
	left:0;
	display:inline-block;
    color:#6C6C6D;
    
    -webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}
.wauki-by-bonfire > ul .wauki-submenu-back-button div:hover .wauki-icon-arrow-left {
	-webkit-transform:translateX(-3px);
	-moz-transform:translateX(-3px);
	transform:translateX(-3px);
}
.wauki-hide-submenu-back-button {
    display:none !important;
}
/* previous level animation */ 
.wauki-slide-prev {
    opacity:0;
    display:none;
}
.wauki-by-bonfire ul {
    position:relative;

    -webkit-transition:-webkit-transform .5s ease, opacity .25s ease;
    -moz-transition:-moz-transform .5s ease, opacity .25s ease;
    transition:transform .5s ease, opacity .25s ease;
}
.wauki-by-bonfire li {
    list-style:none;
    margin-bottom:20px;
}
/* no FA icons for default main menu */
.wauki-by-bonfire i {
	display:none;
}
.wauki-by-bonfire a {
    position:relative;
    font-family:'Shrikhand',arial,tahoma,verdana;
    font-size:40px;
    line-height:40px;
    color:#CFD4D4;
    text-decoration:none;

    -webkit-transition:color .2s ease;
    -moz-transition:color .2s ease;
    transition:color .2s ease;
}
.wauki-by-bonfire a:hover,
.wauki-by-bonfire .current-menu-item a:hover {
    color:#E16923;
    text-decoration:none;
}
.wauki-by-bonfire .menu-item-has-children ul {
    opacity:0;
    pointer-events:none;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}
.wauki-by-bonfire .menu-item-has-children ul > li {
    display:none;
}
/* next level animation */
.wauki-slide-next {
    opacity:1 !important;
    pointer-events:auto !important;
}
/* the background image */
.wauki-background-image {
    position:absolute;
    top:0;
    left:0;
    opacity:.25;
	width:100%;
	height:100%;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:top center;
}
/* the background color */
.wauki-background-color {
	position:absolute;
    top:0;
    left:0;
	width:100%;
	height:100%;
	
	/* main menu background color */
	background-color:#19191B;
}


/* MAIN MENU ACTIVE
**************************************************/
.wauki-menu-active {
    opacity:1;

    -webkit-transform:translateY(0) translateX(0);
    -moz-transform:translateY(0) translateX(0);
    transform:translateY(0) translateX(0);
    
    -webkit-transition:opacity .5s ease 0s, -webkit-transform 0s ease 0s;
    -moz-transition:opacity .5s ease 0s, -moz-transform 0s ease 0s;
    transition:opacity .5s ease 0s, transform 0s ease 0s;
}


/* MAIN MENU HOVER EFFECT ANIMATIONS
**************************************************/
/* joint styles for underline animation */
.wauki-by-bonfire a:after {
    content:'';
}
/* glitch animation */
@keyframes wauki-glitch {
	1%{text-shadow:-1px 0 0 red,1px 0 0 blue;}
	20%{text-shadow:-1px 0 0 blue,1px 0 0 lime;}
	
	21%{text-shadow:-1px 0 0 red,1px 0 0 blue;}
	23%{text-shadow:20px 0 0 red,-40px 0 0 blue;}
	25%{text-shadow:0 0 0 red,0 0 0 blue;}
	
	30%{text-shadow:-1px 0 0 red,1px 0 0 blue;}
	31%{text-shadow:40px 0 0 red,-40px 0 0 lime;}
	32%{text-shadow:0 0 0 red,0 0 0 blue;}
	
    50%{text-shadow:-1px 0 0 red,1px 0 0 blue;}

	70%{text-shadow:-1px 0 0 red,1px 0 0 blue;}
	71%{text-shadow:40px 0 0 red,-40px 0 0 blue;}
	72%{text-shadow:0 0 0 red,0 0 0 blue;}
	
	80%{text-shadow:-1px 0 0 red,1px 0 0 blue;}
	
	90%{text-shadow:-1px 0 0 red,1px 0 0 lime;}
	91%{text-shadow:20px 0 0 lime,-20px 0 0 blue;}
	92%{text-shadow:-1px 0 0 blue,1px 0 0 lime;}
	
	100%{text-shadow:-1px 0 0 blue,1px 0 0 lime;}
}


/* FOOTER MENU
**************************************************/
.wauki-by-bonfire-footer-wrapper {
	position:absolute;
	left:0;
    bottom:25px;
    width:100%;
    text-align:left;
    padding:0 30px;
    box-sizing:border-box;
}
.wauki-by-bonfire-footer-wrapper ul {
	margin:0;
	padding:0;
}
.wauki-by-bonfire-footer-wrapper li {
    position:relative;
	list-style:none;
	display:inline-block;
	margin:0 5px;
}
.wauki-by-bonfire-footer-wrapper a {
	font-family:'Jost',arial,tahoma,verdana;
	font-weight:500;
	font-size:10px;
	letter-spacing:2px;
	text-decoration:none;
    color:#B9BEBE;
    padding:5px;
}
.wauki-by-bonfire-footer-wrapper a:hover {
	color:#E16923;
	text-decoration:none;
}
/* hover effect */
.wauki-by-bonfire-footer-wrapper ul li::before {
	content:'';
	position:absolute;
	top:-25px;
	left:50%;
	width:1px;
	height:0;
	background:#414449;
	
	-webkit-transition:all .25s ease;
	-moz-transition:all .25s ease;
	transition:all .25s ease;
}
.wauki-by-bonfire-footer-wrapper ul li:hover::before {
	height:15px;
}


/* SCROLLBAR STYLING
**************************************************/
.scroll-wrapper {
	overflow:hidden !important;
	padding:0 !important;
	position:relative;
}
.scroll-wrapper > .scroll-content {
	border:none !important;
	box-sizing:content-box !important;
	height:auto;
	left:0;
	margin:0;
	max-height:none !important;
	max-width:none !important;
	overflow:scroll !important;
	position:relative !important;
	top:0;
	width:auto !important;
}
.scroll-wrapper > .scroll-content::-webkit-scrollbar {
	height:0;
	width:0;
}
.scroll-element {
	display:none;
}
.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
	display:block;
}
/* primary menu scrollbar */
.wauki-main-menu-wrapper-inner-inner > .scroll-element,
.wauki-main-menu-wrapper-inner-inner > .scroll-element div {
	border:none;
	margin:0;
	padding:0;
	position:absolute;
}
.wauki-main-menu-wrapper-inner-inner > .scroll-element div {
	display:block;
	height:100%;
	left:0;
	top:0;
	width:100%;
}
.wauki-main-menu-wrapper-inner-inner > .scroll-element.scroll-x {
	bottom:0;
	height:8px;
	left:0;
	width:100%;
}
.wauki-main-menu-wrapper-inner-inner > .scroll-element.scroll-y {
	max-height:100%;
	right:5px;
	top:5px;
    bottom:5px;
	width:3px;
}
.wauki-main-menu-wrapper-inner-inner > .scroll-element .scroll-element_outer {
    overflow:hidden;
    border-radius:5px;
}
.wauki-main-menu-wrapper-inner-inner > .scroll-element .scroll-bar {
    background-color:#BE8431;
    border-radius:5px;
}

/* update scrollbar offset if both scrolls are visible */
.wauki-main-menu-wrapper-inner-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left:-12px; }
.wauki-main-menu-wrapper-inner-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top:-12px; }

.wauki-main-menu-wrapper-inner-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -12px; }
.wauki-main-menu-wrapper-inner-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -12px; }


/* MISC
**************************************************/
/* push down Wauki if WordPress toolbar is active */
.wauki-wp-toolbar { margin-top:32px; }


/* ICONS
**************************************************/
@font-face {
    font-family: 'icomoon';
    src:  url('fonts/icomoon/icomoon.eot?jz3b5z');
    src:  url('fonts/icomoon/icomoon.eot?jz3b5z#iefix') format('embedded-opentype'),
        url('fonts/icomoon/icomoon.ttf?jz3b5z') format('truetype'),
        url('fonts/icomoon/icomoon.woff?jz3b5z') format('woff'),
        url('fonts/icomoon/icomoon.svg?jz3b5z#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
[class^="wauki-icon-"], [class*=" wauki-icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.wauki-icon-arrow-left:before {
    content: "\e9011";
}
.wauki-icon-keyboard_arrow_right:before {
    content: "\e9022";
}
.wauki-icon-search:before {
    content: "\e9033";
}


/* Z-INDEXES
**************************************************/
.wauki-menu-button-wrapper,
.wauki-by-bonfire-footer-wrapper {
    z-index:999999;
}
.wauki-by-bonfire-main-wrapper {
    z-index:999996;
}
.wauki-close-button,
.wauki-search-wrapper,
.wauki-search-button,
.wauki-main-menu-wrapper {
    z-index:13;
}
.wauki-searchform #searchform input,
.wauki-main-menu-wrapper-inner-inner,
.wauki-by-bonfire-wrapper,
.wauki-by-bonfire {
    z-index:12;
}
.wauki-main-menu-image-wrapper,
.wauki-background-image {
    z-index:11;
}
.wauki-inner-bg-image { z-index:10; }
.wauki-inner-bg-color { z-index:9; }
.wauki-background-color {
    z-index:8;
}
.wauki-main-menu-wrapper-inner-inner > .scroll-element,
.wauki-main-menu-wrapper-inner-inner > .scroll-element div {
    z-index:9999999999;
}


/* MEDIA QUERIES
**************************************************/
/* push down Wauki if WordPress toolbar is active */
@media screen and (max-width: 782px) {
	.wauki-wp-toolbar { margin-top:46px; }
}