/************************************************************
//
//	SLIDE NAV
//
************************************************************/

/* MAIN CONTAINER */

#wideNav {
	
	position: absolute;
	
	right: 10px;
	top: 0;
	
	height: 50px;
	
	color: white;
	
}

/* TOP ITEM MENU */

#wideNav > ul {
	
	display: block;
	
	height: 50px;
	
	font-size: 20px;
	font-size: 2.0rem;
	
	list-style: none;
	
	text-align: right;
	
}

/* TOP ITEM */

.wideNavTopItem {
	
	display: inline-block;
	
	width: 140px;
	height: 50px;
	
	line-height: 46px;
	line-height: 4.6rem;
	
	text-align: left;
	white-space: nowrap;
	
	cursor: pointer;
	
	-webkit-transition: all 300ms;
	-moz-transition: all 300ms;
	-o-transition: all 300ms;
	transition: all 300ms;
	
}

/* TOP ITEM ICONS */

.wideNavTopItem:before {
	
	display: inline-block;
	
	font-family: "qis_icons";
	
	speak: none;
	
	width: 40px;
	width: 4.0rem;
	text-align: center;
	
	-webkit-transition: all 300ms;
	-moz-transition: all 300ms;
	-o-transition: all 300ms;
	transition: all 300ms;
	
}

.wideNavTopItem.ourshop:before {	content: '\e800';	}
.wideNavTopItem.services:before {	content: '\e804';	}
.wideNavTopItem.listings:before {	content: '\e808';	}

/* TOP ITEM TEXT */

.wideNavTopItem:after {
	
	-webkit-transition: all 300ms;
	-moz-transition: all 300ms;
	-o-transition: all 300ms;
	transition: all 300ms;
	
	-webkit-transition-delay: 100ms;
	-moz-transition-delay: 100ms;
	-o-transition-delay: 100ms;
	transition-delay: 100ms;
	
	pointer-events: none;
	
}

	/* TOP ITEM TEXT HIDDEN */

	.wideNavTopItem.hidden:after {
		
		-webkit-transition: all 150ms;
		-moz-transition: all 150ms;
		-o-transition: all 150ms;
		transition: all 150ms;
		
		-webkit-transition-delay: 0;
		-moz-transition-delay: 0;
		-o-transition-delay: 0;
		transition-delay: 0;
		
	}

.wideNavTopItem.ourshop:after {		content: 'Our Shop';	}
.wideNavTopItem.services:after {	content: 'Services';	}
.wideNavTopItem.listings:after {	content: 'Listings';	}

/* SUB ITEM MENU */

.wideNavTopItem > ul {
	
	position: absolute;
	
	padding-top: 0; /* 50px; */
	
	top: 50px; /* 0 */
	
	width: 140px;
	
	font-size: 16px;
	font-size: 1.6rem;
	
	overflow: hidden;
	
	max-height: 120px;
	max-height: 12.0rem;
	
	/* z-index: -1; */
	
	-webkit-transition: all 300ms;
	-moz-transition: all 300ms;
	-o-transition: all 300ms;
	transition: all 300ms;
	
}

	/* SUB ITEM MENU HIDDEN */

	.wideNavTopItem.hidden ul {
		
		/* visibility: hidden; */
		
		max-height: 0;
		
		opacity: 0;
		
	}

/* SUB ITEM */
	
.wideNavSubItem {
	
	display: block;
	
	margin: 5px 0;
	padding: 5px 8px;
	
	height: 20px;
	
	line-height: 20px;
	line-height: 2.0rem;
	
	border: 1px solid white;
	
	background: black;
	
}

/* SUB ITEM ICONS */

.wideNavSubItem:before {
	
	display: inline-block;
	
	font-family: "qis_icons";
	
	speak: none;
	
	width: 32px;
	width: 3.2rem;
	text-align: center;
	
}

.wideNavSubItem.information:before {	content: '\e801';	}
.wideNavSubItem.updates:before {	content: '\e802';	}
.wideNavSubItem.location:before {	content: '\e803';	}

.wideNavSubItem.maintenance:before {	content: '\e805';	}
.wideNavSubItem.repairs:before {	content: '\e806';	}
.wideNavSubItem.towinginfo:before {	content: '\e807';	}

.wideNavSubItem.cars:before {		content: '\e809';	}
.wideNavSubItem.parts:before {		content: '\e80A';	}

/************************************************************
//
//	SLIDE NAV - MEDIA QUERIES
//
************************************************************/

/* SCREEN WIDTH LESS THAN 960px */

@media only screen and (max-width :959px) {
	
	/* TOP ITEM HIDDEN */
	
	.wideNavTopItem.hidden {
		width: 40px;
	}
	
	/* TOP ITEM TEXT HIDDEN */
	
	.wideNavTopItem.hidden:after {
		opacity: 0;
	}
	
}

/* SCREEN WIDTH LESS THAN 720px */

@media only screen and (max-width :719px) {
	
	/* TOP ITEM HIDDEN */
	
	.wideNavTopItem, .wideNavTopItem.hidden {
		width: 0;
		visibility: hidden;
	}
	
	/* TOP ITEM ICONS HIDDEN */
	
	.wideNavTopItem:before, .wideNavTopItem.hidden:before {
		opacity: 0;
	}
	
}