/* ---------------------------------------

	TABLE OF CONTENTS
	
	- GLOBAL MENU
	- SECONDARY MENU
	- CONTEXTUAL MENU
	- MENU POSITION & ATTRIBUTES
	
--------------------------------------- */


/* ----------------------
	GLOBAL MENU
----------------------*/

	#global-menu {
  		background-color: #345968;
		color: #fff;
		text-shadow: none;
		font-weight: normal;
	    box-shadow: 0 5px 0 rgba(0,0,0,0.15);
		padding: 0;
		position: relative;
		width: auto;
	}

		/* Clearfix */
		#global-menu:before,
		#global-menu:after {
			content: "";
			display: table;
			clear: both;
		}
		
	/*#global-menu .pos-left {
		float: left;
		clear: both;
		padding: 10px;
	}
	
	#global-menu .pos-right {
		float: right;
		clear: both;
		width: 100%;
		border-top: 1px solid rgba(0,0,0,0.2);
		box-shadow: inset 0px 1px 0 rgba(255,255,255,0.1);
		text-align: right;
    }*/

	#global-menu h2 {
		text-shadow: 0 2px 0 #000;
		font: 50px 'Open Sans';
		padding:0;
		margin:0 0 0 10px;
		line-height:50px;
	}

	#global-menu ul {
		position: static;
		padding: 10px 0;
		float: right;
		width: 100%;
		border-top: 1px solid rgba(0,0,0, 0.2);
    	box-shadow: 0 -1px 0 rgba(255,255,255, 0.1);
    	text-align: right;
	}

		#global-menu li {
			padding-left: 1rem;
			padding-right: 1rem;
			position: relative;
		}

		#global-menu li:before {
			content: "";
			width: 0;
			top: -10px;
			bottom: -15px;
			/*top: -10px;
			bottom: -24px;*/
			border-left: 1px solid rgba(0,0,0, 0.2);
			box-shadow: 1px 0 0 rgba(255,255,255, 0.1);
			position: absolute;
			margin-left: -18px;
		}
	
		#global-menu li:first-child:before {
			border-left: 0 solid rgba(0,0,0, 0.2);
			box-shadow: 0 0 0 rgba(255,255,255, 0.1);
		}
		
		#global-menu li:last-child {
			margin-right: 0px;
		}
		
		#global-menu li a,
		#global-menu li a:hover {
		    padding: 16px 29px 14px;
			margin-right: -19px;
			margin-left: -17px;
			background: rgba(0,0,0,0) 50% 40% no-repeat;
			color: #fff;
			font:lighter 18px 'Open sans';
		}

	#global-menu li a span {display:none;}
	#global-menu ul li a:hover { background-color: #CAE4DB;}
	#global-menu a:hover { background-color: #CAE4DB;}
	#global-menu a.active{ background-color: #7C9D94; }
	#global-menu a.active:hover { background-color: #CAE4DB; }

	#global-menu #nav-btn-home{background-image:url('/img/glyph/w/750-home.png');}
	#global-menu #nav-btn-storage{background-image:url('/img/glyph/w/1052-database.png');}
	#global-menu #nav-btn-faq{background-image:url('/img/glyph/w/739-question.png');}
	#global-menu #nav-btn-about-ucore{background-image:url('/img/glyph/w/962-puzzle-piece.png');}
	#global-menu #nav-btn-contact-d4m{background-image:url('/img/glyph/w/906-chat-3.png');}
	#global-menu #nav-btn-logout{background-image:url('/img/glyph/w/744-locked.png');}
	#global-menu #nav-btn-my-profile{background-image:url('/img/glyph/w/769-male.png');}

	#global-menu #nav-btn-home:hover{background-image:url('/img/glyph/blue/750-home.png');}
	#global-menu #nav-btn-storage:hover{background-image:url('/img/glyph/blue/1052-database.png');}
	#global-menu #nav-btn-faq:hover{background-image:url('/img/glyph/blue/739-question.png');}
	#global-menu #nav-btn-about-ucore:hover{background-image:url('/img/glyph/blue/962-puzzle-piece.png');}
	#global-menu #nav-btn-contact-d4m:hover{background-image:url('/img/glyph/blue/906-chat-3.png');}
	#global-menu #nav-btn-logout:hover{background-image:url('/img/glyph/blue/744-locked.png');}
	#global-menu #nav-btn-my-profile:hover{background-image:url('/img/glyph/blue/769-male.png');}

/* Override default */
#global-menu label.uc-flipswitch {
    top: 50%;
    width: 50px;
}


/* ----------------------
	SECONDARY MENU
----------------------*/
#secondary-menu {
	margin: 0 auto;
	border-radius: 0 0 10px 10px;
	position: relative;
	text-transform: uppercase;
	height: 65px;

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,345968+100&0+0,1+100 */
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(52,89,104,0.7) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(52,89,104,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(52,89,104,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#345968',GradientType=0 ); /* IE6-9 */

	text-shadow: none;
	text-align: center;
} 

	#secondary-menu ul {
		width: 100%;
	} 
		
	#secondary-menu li {
		font-weight: bold;
		letter-spacing: 2px;
	}

	#secondary-menu ul li:first-child {
		margin-left: 0;
	}

	#secondary-menu ul li:first-child:before {
		border-left: 0px solid #34342d;
		box-shadow: 0 0 0 #54554c;
	}

	#secondary-menu li:before {
		content: "";
		width: 0;
		top: 5px;
		bottom: 0;
		border-left: 1px solid rgba(0,0,0, 0.3);
		box-shadow: 1px 0 0 rgba(255,255,255, 0.1);
		position: absolute;
		margin-left: -35px;
	}

	#secondary-menu li a,
	#secondary-menu li a:hover {
	    display: inline-block;
	    float: left;
	    padding: 30px 32px 29px;
	    background: rgba(0,0,0,0) 50% 50% no-repeat;
	    margin: 5px 0 0;
	    position: relative;
	}
	#secondary-menu li a {
		color: #fff;
	}

	#secondary-menu li a.active:hover,
	#secondary-menu li a:hover {
		background-color: #7C9D94;
	}

	#secondary-menu li a.active { background-color: #DBAE1D;}
	#secondary-menu li a span { display:none;}

	#secondary-menu #nav-btn-playlists {background-image:url('/img/glyph/w/707-albums.png');}
	#secondary-menu #nav-btn-media-archive {background-image:url('/img/glyph/w/822-photo-2.png');}
	#secondary-menu #nav-btn-templates-content {background-image:url('/img/glyph/w/721-bookmarks-toolbar.png');}
	#secondary-menu #nav-btn-resolutions {background-image:url('/img/glyph/w/926-photos.png');}
	#secondary-menu #nav-btn-screens {background-image:url('/img/glyph/w/969-television.png');}

	/* Active & hover btns */
	/*#secondary-menu #nav-btn-playlists.active,*/
	/*#secondary-menu #nav-btn-playlists:hover {background-image:url('/img/glyph/honey/707-albums.png');}

	#secondary-menu #nav-btn-media-archive.active,
	#secondary-menu #nav-btn-media-archive:hover {background-image:url('/img/glyph/honey/822-photo-2.png');}

	#secondary-menu #nav-btn-templates-content.active,
	#secondary-menu #nav-btn-templates-content:hover {background-image:url('/img/glyph/honey/721-bookmarks-toolbar.png');}

	#secondary-menu #nav-btn-screens.active,
	#secondary-menu #nav-btn-screens:hover {background-image:url('/img/glyph/honey/969-television.png');}*/


/* ------------------
	CONTEXTUAL MENU
-------------------*/
	
.contextual-menu {
	background: #484840;
	position: relative;
	text-shadow: none;
	color: #f9f9f9;
	font-weight: normal;
	width: 100%;
	margin: -40px auto 0;
	padding: 10px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

	.contextual-menu .icon {
		font-size: 1rem;
		text-align: center;
	}

	.contextual-menu p {
		padding: 0;
		margin: 0;	
	}

		.contextual-menu li {
			padding-left: 1rem;
			padding-right: 1rem;
		}

		/* creating a vertical line */
		.contextual-menu li:before {
			content: "";
			width: 0;
			top: 0;
			bottom: -5px;
			border-left: 1px solid rgba(0,0,0, 0.2);
			box-shadow: 1px 0 0 rgba(255,255,255, 0.1);
			position: absolute;
			margin-left: -18px;
		}
		
		.contextual-menu li:first-child:before {
			border-left: 0 solid rgba(0,0,0, 0.2);
			box-shadow: 0 0 0 rgba(255,255,255, 0.1);
		}

			.contextual-menu li a,
			.contextual-menu a:hover {
				padding: 0 19px;
				padding: 15px 19px 27px;
				margin-right: -17px;
				margin-left: -17px;
				color: #fff;
			}
			
			.contextual-menu a:hover { color: #80bca3; }
			
		
		/* Creating an arrow at the top */
		.contextual-menu .active:before {
			border-left: 20px solid transparent;
			border-right: 20px solid transparent;				
			border-bottom: 20px solid #484840;
			width: 0;
			height: 0;
			transform: rotate(135deg);
			top: -5px;
		}
		
		.contextual-menu li.active { text-align: center; }

/* ---------------------
	MEDIA QUERIES
--------------------- */
	
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 



}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	
	/* Override default */
	#global-menu label.uc-flipswitch {
	    top: 7px;
	}

	/*--- GLOBAL MENU -----------------*/
	#uc-header-wrapper #global-menu {
		border-radius: 10px;
		padding: 10px;
    	height: 65px;
	}
	#uc-header-wrapper #global-menu .ucore-logo {
	    margin: 0;
	    padding: 0;
	    position: absolute;
	    top: 40%;
	    left: 20px;
	    /*transform: translateY(-50%);*/
	}	
	#uc-header-wrapper #global-menu ul {
		position: static; 	/* Force vertical line to full height */
		padding: 0;
		float: right;
		border-top: 0;
    	box-shadow: none;

	}
		#uc-header-wrapper #global-menu li:before {
			bottom: -26px;
		}
	    
		#global-menu ul li a,
		#global-menu ul li a:hover {
			padding: 14px 37px 27px;
		}
		
		#global-menu ul li:last-child {
			margin-right: -10px;
		}
		#global-menu ul li:last-child a{
			border-radius: 0 10px 10px 0;
		}


	/*--- SECONDARY MENU -----------------*/
	#uc-header-wrapper #secondary-menu {text-align: left;}
	#uc-header-wrapper #secondary-menu ul li:before {margin-left: 0;}

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {


	/*--- SECONDARY MENU -----------------*/
	#secondary-menu ul li {
		font-weight: bold;
		margin-left: 10px;
		letter-spacing: 2px;
		padding: 0 1rem;
	}

	#secondary-menu ul li a,
	#secondary-menu ul li a:hover {
		display:block;
		float:left;
		font:600 14px 'Open sans';
		background:rgba(0,0,0,0) 0px 50% no-repeat;
		margin: -10px;
		padding: 25px 35px;
	}
	
	#secondary-menu ul li a:hover {
		color: #DBAE1D;
	}
	#secondary-menu ul li a.active {
		background-color: transparent;
		color: #DBAE1D; 
		font:600 14px 'Open sans';
	}
	#secondary-menu ul li a.active:hover {
		background-color: transparent;
		/*color: #fff;*/
	}
	 
	#secondary-menu ul li a span { display:inline;}
	#uc-header-wrapper  #secondary-menu ul li:before { margin-left: -35px;}
	#uc-header-wrapper #secondary-menu { 
		padding: 10px 10px 5px;
		height: 65px;
	}
	
	/* Active & hover buttons */
	#secondary-menu li a#nav-btn-media-archive.active,
	#secondary-menu li a#nav-btn-media-archive:hover {background-image:url('/img/glyph/honey/822-photo-2.png');}
	#secondary-menu li a#nav-btn-templates-content.active,
	#secondary-menu li a#nav-btn-templates-content:hover {background-image:url('/img/glyph/honey/721-bookmarks-toolbar.png');}
	#secondary-menu li a#nav-btn-screens.active,
	#secondary-menu li a#nav-btn-screens:hover {background-image:url('/img/glyph/honey/969-television.png');}
	#secondary-menu li a#nav-btn-playlists.active,
	#secondary-menu li a#nav-btn-playlists:hover {background-image:url('/img/glyph/honey/707-albums.png');}
}
	/*#secondary-menu li a#nav-btn-media-archive:hover {background-image:url('/img/glyph/o/822-photo-2.png');}*/
	/*#secondary-menu li a#nav-btn-templates-content:hover {background-image:url('/img/glyph/o/721-bookmarks-toolbar.png');}*/
	/*#secondary-menu li a#nav-btn-screens:hover {background-image:url('/img/glyph/o/969-television.png');}*/
	/*#secondary-menu li a#nav-btn-playlists:hover {background-image:url('/img/glyph/o/707-albums.png');}*/



/* ---------------------
	COLOURS
--------------------- */

/*#global-menu {
	background-color: #61644f;
    box-shadow: 0 5px 0 #505241;
	color: #fff;
}
#global-menu li a,
#global-menu li a:hover {
	color: #fff;
}
#global-menu ul li a:hover { background-color: #b09554;}
#global-menu a:hover { background-color: #80bca3;}
#global-menu a.active{ background-color: #989778; }
#global-menu a.active:hover { background-color: #ffbf61; }

#secondary-menu {
	background: -moz-linear-gradient(top,  rgba(97,100,79,0) 0%, rgba(97,100,79,0.6) 100%); 
	background: -webkit-linear-gradient(top,  rgba(97,100,79,0) 0%,rgba(97,100,79,0.6) 100%);
	background: linear-gradient(to bottom,  rgba(97,100,79,0) 0%,rgba(97,100,79,0.6) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#61644f', endColorstr='#9961644f',GradientType=0 );
}
#secondary-menu ul li:first-child:before {
	border-left: 0px solid #34342d;
	box-shadow: 0 0 0 #54554c;
}
#secondary-menu li a.active:hover,
#secondary-menu li a:hover {
	background-color: #ffbf61;
}
#secondary-menu li a.active { background-color: #bc8c1e;}

.contextual-menu {
	background: #484840;
	color: #f9f9f9;
}
.contextual-menu li a,
.contextual-menu a:hover {
	color: #fff;
}*/
/*.contextual-menu a:hover { color: #80bca3; }*/
/* Creating an arrow at the top */
/*.contextual-menu .active:before {
	border-bottom: 20px solid #484840;
}*//* ---------------------------------------

	TABLE OF CONTENTS
	
--------------------------------------- */

#footer {
	width: 50%;
	height: 50px;	
	position: absolute;
	bottom: 20px;
	margin: 0 auto;
	text-align: center;
	padding: 0;
	left: 0;
	right: 0;
	background-color: transparent;
	display: none;
	
}
	#footer-container {
		overflow: hidden;
		position: relative;
		height: 50px;
		background-color: transparent;
	}
		#inner-footer-container {
			background-color: #535448;
			width: 500px;
			height: 500px;
			border-radius: 50%;
			border: 2px #68685d solid;
			text-align: center;
			padding: 20px 0 0 0;
			margin: auto;
		}
	
	#footer p {
		text-transform: uppercase;
		text-shadow: none;
		color: #fff;
		font-weight: bold;
		background-color: transparent;
		margin-top: 5px;
	}

	#footer img {
		background: transparent;

	}

/* ---------------------
	MEDIA QUERIES
--------------------- */
	
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}