/*------------------------------------*\
    Flaunt JS Navigation
\*------------------------------------*/

.nav {
		position: relative;
		width: auto;
		padding:12px 0;
		float: right;
}
.nav-list li{
		zoom: 1;
		position: relative;
		margin: 0;
		vertical-align: bottom;
		float:left;
}

.nav-list>li::before {

    height: 0;
    width: 1px;
    background: #fff;
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: -40px;
    transition: all ease-in-out 0.3s 0s;

}
.nav-list>li:hover:before, .nav-list>li.active:before { height:40px; }
.nav-list li.register-btn:before, .nav-list li.login-btn:before { display: none;}
.nav-list li a {
		padding:3px 15px; float:left;
		font-family: 'Montserrat', sans-serif; font-weight:300;
		color: #fff;
		font-size:15px;
	
}
/*.nav-list li > a:hover, .nav-list li:hover > a, .nav-list li.active > a, .nav-list li.current-menu-item a,
.nav-list li.login a{
		color: #fff;
}*/
.nav-list li:hover .nav-submenu, .nav-list li .nav-submenu li:hover .nav-submenu {
	display:block;
}
/*.sub-menu >a::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}*/
/* Navigation submenu */
.nav-submenu {
	display:none;
	position:absolute;
	left:50%;
	transform: translateX(-50%);
	width:400px;
	background:#fff;
 top:40px;
	transition: all ease-in-out 0.3s 0s;
	border-radius: 4px;
	-webkit-box-shadow: 0 50px 100px rgba(50,50,93,.1),0 15px 35px rgba(50,50,93,.15),0 5px 15px rgba(0,0,0,.1);
	box-shadow: 0 50px 100px rgba(50,50,93,.1),0 15px 35px rgba(50,50,93,.15),0 5px 15px rgba(0,0,0,.1);
	border-bottom:60px solid #eaeffa; z-index:9999999;	
	
}

.nav-submenu:before { background:url(../images/arrow-menu.png) no-repeat center top; width:100%; height:13px; content:"";display: block;
position: relative; margin-top: -12px; margin-bottom: 20px; -webkit-box-shadow: -3px -3px 5px rgba(82,95,127,.04); box-shadow: -3px -3px 5px rgba(82,95,127,.04);}

.nav-submenu li{ float:left; width:100%; position:relative; margin:0; padding:0 40px;}
.nav-submenu li a {
	display:block; 
	padding:16px 0; color:#2e303a; width:100%; text-transform:uppercase;min-height: 60px;
}

.nav-submenu li a span {
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 300;
    font-family: 'Montserrat', sans-serif;
}
.nav-submenu li a.item-payments { background:url(../images/menu1.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.item-payments:hover, 
.nav-submenu li.active a.item-payments { background:url(../images/menu1-hover.png) no-repeat 0 center; background-size:60px;}

.nav-submenu li a.item-subscriptions { background:url(../images/menu2.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.item-subscriptions:hover,
.nav-submenu li.active a.item-subscriptions { background:url(../images/menu2-hover.png) no-repeat 0 center; background-size:60px;}

.nav-submenu li a.item-connect { background:url(../images/menu3.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.item-connect:hover,
.nav-submenu li.active a.item-connect { background:url(../images/menu3-hover.png) no-repeat 0 center; background-size:60px;}

/*Product-submenu*/
.nav-submenu li a.product-submenu-1 { background:url(../images/3-hover.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.product-submenu-1:hover, 
.nav-submenu li a.product-submenu-1.active { background:url(../images/3.png) no-repeat 0 center; background-size:60px;}
.nav-submenu li a.product-submenu-1 span { color:#d8262d;}

.nav-submenu li a.product-submenu-2 { background:url(../images/5-hover.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.product-submenu-2:hover,
.nav-submenu li a.product-submenu-2.active { background:url(../images/5.png) no-repeat 0 center; background-size:60px;}
.nav-submenu li a.product-submenu-2 span { color:#59a7ee;}

.nav-submenu li a.product-submenu-3 { background:url(../images/1.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.product-submenu-3:hover,
.nav-submenu li a.product-submenu-3.active { background:url(../images/1-hover.png) no-repeat 0 center; background-size:60px;}
.nav-submenu li a.product-submenu-3 span { color:#68d36f;}

.nav-submenu li a.product-submenu-4 { background:url(../images/4-hover.png) no-repeat 0 center; background-size:60px; padding-left:75px;transition: all ease-in-out 0.3s 0s;}
.nav-submenu li a.product-submenu-4:hover,
.nav-submenu li a.product-submenu-4.active { background:url(../images/4.png) no-repeat 0 center; background-size:60px;}
.nav-submenu li a.product-submenu-4 span { color:#f8c74a;}
/*Product-submenu*/
 

.nav-submenu li a.item-payments span { color:#4bb3ad;}
.nav-submenu li a.item-subscriptions span { color:#32325d;}
.nav-submenu li a.item-connect span { color:#83518f;}
.nav-submenu li a p {
    text-transform: none;
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    padding: 0;
}

/*sub-menu*/
.nav-list li .nav-submenu .nav-submenu {
	display:none;
	position:absolute;
	left:180px;
	width:180px;
	top:0;
}
.nav-list li .nav-submenu .nav-submenu li { float:left; width:100%;}
.nav-list li .nav-submenu .nav-submenu li a {
	background:#932C77;
	display:block;
	padding:5px 15px;
	width:100%; color:#fff;
}
.nav-list li .nav-submenu .nav-submenu li a:hover {
	background:#0fb4b7;
}


/* Mobile navigation */
.nav-mobile {
	display:none; /* Hide from browsers that don't support media queries */
	cursor:pointer;
	position:absolute;
	top:5px;
	right:10px;
	background: url(../images/ham.png) no-repeat center center; background-size:44px;
	height:40px;
	width:50px;
	border-radius: .25rem; z-index: 99999;
}
.nav-mobile.open {
	top:9px;z-index: 99999;
	background: url(../images/ham-close.png) no-repeat center center; background-size:44px;
}
/* Mobile navigation, clickable area for revealing <ul> */
.nav-click {
	position:absolute;
	top:0;
	right:0;
	display:none;
	height:39px;
	width:50px;
	cursor:pointer;
}
.nav-click i {
	display:block;
	height:39px;
	width:48px;
	background: url(../images/drop.png) no-repeat center center;
	background-size:20px;
}
.nav-click:hover {
	
}
.nav-rotate {
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	-o-transform:rotate(90deg);
	transform:rotate(90deg);
}

/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media only screen and (max-width: 990px) {
	.nav-mobile {
		display:block;
	}
	.nav {
		width:100%;
		padding:50px 0 0 0; margin:0;
	}
.nav-list {
    text-align: left;
		overflow:auto;    
    position: fixed;
    z-index: 99;
    left: 0;
    width: 100%;
    top: 0;
    height: 100vh;
    padding-top: 70px;
		background: #0506d2; 
background: -moz-linear-gradient(left,  #0506d2 0%, #0564f9 25%, #0fadea 75%, #1ed2bf 100%);
background: -webkit-linear-gradient(left,  #0506d2 0%,#0564f9 25%,#0fadea 75%,#1ed2bf 100%);
background: linear-gradient(to right,  #0506d2 0%,#0564f9 25%,#0fadea 75%,#1ed2bf 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0506d2', endColorstr='#1ed2bf',GradientType=1 );
}


.yellow-theme .nav-list{
background: #ef9802;
background: -moz-linear-gradient(left, #ef9802 0%, #fbc803 25%, #e3f230 75%, #c7d822 100%);
background: -webkit-linear-gradient(left, #ef9802 0%,#fbc803 25%,#e3f230 75%,#c7d822 100%);
background: linear-gradient(to right, #ef9802 0%,#fbc803 25%,#e3f230 75%,#c7d822 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef9802', endColorstr='#c7d822',GradientType=1 );}
.red-theme .nav-list{
background: #c10000;
background: -moz-linear-gradient(left, #c10000 0%, #e2473f 25%, #c20392 75%, #660099 100%);
background: -webkit-linear-gradient(left, #c10000 0%,#e2473f 25%,#c20392 75%,#660099 100%);
background: linear-gradient(to right, #c10000 0%,#e2473f 25%,#c20392 75%,#660099 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c10000', endColorstr='#6194bc',GradientType=1 );}
.blue-theme .nav-list{
background: #00a1d8;
background: -moz-linear-gradient(left, #00a1d8 0%, #1ab9f5 25%, #2a96fc 75%, #168dff 100%);
background: -webkit-linear-gradient(left, #00a1d8 0%,#1ab9f5 25%,#2a96fc 75%,#168dff 100%);
background: linear-gradient(to right, #00a1d8 0%,#1ab9f5 25%,#2a96fc 75%,#168dff 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00a1d8', endColorstr='#168dff',GradientType=1 );}
.green-theme .nav-list{
background: #5dc004;
background: -moz-linear-gradient(left, #5dc004 0%, #80da2f 25%, #6ce3b5 75%, #62e4b2 100%);
background: -webkit-linear-gradient(left, #5dc004 0%,#80da2f 25%,#6ce3b5 75%,#62e4b2 100%);
background: linear-gradient(to right, #5dc004 0%,#80da2f 25%,#6ce3b5 75%,#62e4b2 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dc004', endColorstr='#62e4b2',GradientType=1 );}


	.nav-list, .sub-menu >a::after {
		display:none;
	}
	.nav-list li {
		width:100%;
		float:left;
		margin:0;
	}
	.nav-list li > a {
		padding:15px; display:block;width:100%;
		border-bottom:1px solid rgba(255,255,255,0.1); color:#fff;
	}
	
	.nav-list li > a:hover, .nav-list li:hover > a, .nav-list li.active > a{ color:#fff;}
	.nav-submenu li a {color: #2e303a !important;}
	.nav-list li { border:none;}
	.nav-click {
		display:block;
	}
	.nav-mobile-open {
		-webkit-border-radius:5px 5px 0 0;
		-moz-border-radius:5px 5px 0 0;
		border-radius:5px 5px 0 0;
	}
	.nav-list li:hover .nav-submenu, .nav-list li .nav-submenu li:hover .nav-submenu {
		display:none;
	}
	.nav-submenu{ position:static; transform:none; float:right; width:90%; margin-right:5%; border-radius:0;}
	
}