/* Global Style
----------------------------*/

/* 	Multilingual Navigation
|
|	The GJC navigation uses custom DNN multilingual
|	functionality. Previously, the CSS written here
|	catered for a standard unordered list. Since the
|	integration of this custom functionality, the markup
|	on the front-end has changed significantly. To
|	make the transition simple, below is a quick
|	reference sheet to see how the previous markup 
|	transfers through to the new IDs and Classes
|	
|	#dnn_ctlHeader_dnnNAV_ctldnnNAV = ul.Level0
|	.root = li
|	.txt = a
|	.m0 = ul.Level1
|	.m0 td = ul.Level1 li
|	.m0 td .txt = ul.Level1 li a
|	.sel = .current
|
----------------------------*/

	#navWrapper .root {
		padding: 0 0 5px 0;
		float: left;
		background-image: none !important; /* Strip inline background image. */
	}
		#navWrapper .txt {
			font-family:'TradeGothicW02-BoldCn20 675505', sans-serif;
			font-weight: normal;
			text-transform: uppercase;
			text-decoration: none;
			color: #a29f9a;
			-moz-transition: color 0.2s linear;
			-webkit-transition: color 0.2s linear;
			transition: color 0.2s linear;
			display: block;
		}
			#navWrapper .root .sel .txt {
				color: #efeae3;
			}
				#navWrapper span:focus {
					outline: none;
				}
	#navWrapper .m0 {
		margin: 0 auto 0 auto;
		float: none;
		position: absolute;
		top: 127px !important; /* Strip inline position */
		background: #231f20;
		border: 1px solid #3a3534;
		border-collapse: separate;
		z-index: 999;
	}
		.dnnAuthenticated #navWrapper .m0 {
			top: 161px !important; /* Add 34 Pixels to cater for admin bar. */
		}

			#navWrapper .m0 .txt {
				width: 100%;
				height: auto;
				padding: 5px;
				margin-right: 5px;
				color: #72675e;
				font-size: 0.875em; /* 14  / 16 = 0.875 */
				font-weight: normal;
				text-align: center;
				float: none;
				border-bottom: 1px solid #312c2b;
				display: block;
			}
				#navWrapper .m0 .txt:hover {
					background: none !important;
					color: #efeae3;
				}

/* Desktop Breakpoint
----------------------------*/
@media all and
(min-width: 960px)
{

/* 	Multilingual Navigation
|
|	#dnn_ctlHeader_dnnNAV_ctldnnNAV = ul.Level0
|	.root = li
|	.txt = a
|	.m0 = ul.Level1
|	.m0 td = ul.Level1 li
|	.m0 td .txt = ul.Level1 li a
|	.sel = .current
|
----------------------------*/

	#navWrapper h3 {
		display: none;
	}
	#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV {
		margin-right: -15px;
		float: right;
		z-index: 999;
	}
		#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root {
			margin: 0 15px 0 15px;
		}
			#navWrapper .root .txt {
				height: 27px;
				font-size: 1.1875em; /* 19  / 16 = 1.1875 */
				float: left;
			}
				#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root .txt:hover {
					color: #efeae3;
					background: url('../img/gjc-navHover.png') no-repeat bottom center;
				}
			#navWrapper .m0 {
				padding-right: 7px;
			}
}

/* Tablet Portrait Breakpoint
----------------------------*/
@media all and
(min-width: 768px) and
(max-width: 959px)
{

/* 	Multilingual Navigation
|
|	#dnn_ctlHeader_dnnNAV_ctldnnNAV = ul.Level0
|	.root = li
|	.txt = a
|	.m0 = ul.Level1
|	.m0 td = ul.Level1 li
|	.m0 td .txt = ul.Level1 li a
|	.sel = .current
|
----------------------------*/

	#navWrapper h3 {
	display: none;
	}
	#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV {
		width: 100%; /* 768 / 768 = 100% */
		height: 30px;
		margin: 20px 0 0 -15px;
		float: left;
	}
	#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root {
		margin: 0 10px 0 10px;
	}
		#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root:hover {
			background: url('../img/gjc-navHover.gif') no-repeat bottom center;
		}
		#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root .txt {
			padding: 0 0 3px 0;
			font-size: 1.1875em; /* 19  / 16 = 1.1875 */
			float: left;
		}
			#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root .txt:hover {
				color: #efeae3;
				border-bottom: 2px solid #aea089;
			}
		#navWrapper .m0 {
			margin-top: 40px;
			padding-right: 7px;
			z-index: 999;
		}
}

/* Mobile Landscape & Portrait Breakpoint
----------------------------*/
@media all and
(min-width: 0px) and
(max-width: 767px)
{

/* 	Multilingual Navigation
|
|	#dnn_ctlHeader_dnnNAV_ctldnnNAV = ul.Level0
|	.root = li
|	.txt = a
|	.m0 = ul.Level1
|	.m0 td = ul.Level1 li
|	.m0 td .txt = ul.Level1 li a
|	.sel = .current
|
----------------------------*/

	#navWrapper h3 {
		width: 95%;
		margin: 10px 0 0 0;
		padding: 10px 0 10px 5%;
		background: #231F20;
		display: block;
	}
		#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV {
			width: 100%; /* 768 / 768 = 100% */
			height: auto;
			padding: 20px 0 0 0;
			background: #231F20;
			float: left;
			display: none;
		}
			#navToggle:hover #dnn_ctlHeader_dnnNAV_ctldnnNAV {
				display: block;
			}
			#navWrapper #dnn_ctlHeader_dnnNAV_ctldnnNAV .root {
				width: 95%;
				padding: 5px 0 5px 5%;
				border-bottom: 1px solid #312c2b;
				clear: both;
			}
				#navWrapper .m0 {
					width: 95%;
					padding: 5px 0 5px 5%;
					float: left;
					position: static !important;
					text-align: left;
					border: none;
				}
					#navWrapper .m0 .txt {
						text-align: left;
					}
}