/*
    File Name: menu.css
*/



/* Main Nav */

#nav {
	margin: 0;
	padding: 30px 6px 0;
	line-height: 100%;
	float:right;
	z-index:1;
 

}
#nav li {
	font-family:Arial;
	font-size:12px;
	margin: 0 5px;
	padding: 0 0 8px;
	float: left;
	position: relative;
	list-style: none;
	z-index:6;
}
 
 
/* main level link */
#nav a {
	font-weight: normal;
	color: #777;
	text-decoration: none;
	display: block;
	padding:  8px 20px;
	margin: 0;
	z-index:3;
 
	-webkit-border-radius: 1.6em;
	-moz-border-radius: 1.6em;
	
}
#nav a:hover {
	background: #000;
	color: #fff;
}
 
/* main level link hover */

/* Home Button */

#nav li.home a {
	color:#777;
}

#nav li.home a:hover {
	color:#FFF;
	background-color:#107fad;
}

#nav li.home_active a {
	color:#FFF;
	background-color:#107fad;
}

/* About Us Button */

#nav li.about a {
	color:#777;
}

#nav li.about a:hover {
	color:#FFF;
	background-color:#f11979;
}

#nav li.about_active a {
	color:#FFF;
	background-color:#f11979;
}

/* Vehicle Services Button */

#nav li.vehicle a {
	color:#777;
}

#nav li.vehicle a:hover {
	color:#FFF;
	background-color:#96cd2c;
}

#nav li.vehicle_active a {
	color:#FFF;
	background-color:#96cd2c;
}

/* Personal Services Button */

#nav li.personal a {
	color:#777;
}

#nav li.personal a:hover {
	color:#FFF;
	background-color:#feb914;
}

#nav li.personal_active a {
	color:#FFF;
	background-color:#feb914;
}

/* Contact Button */

#nav li.contact a {
	color:#777;
}

#nav li.contact a:hover {
	color:#FFF;
	background-color:#aaafb0;
}

#nav li.contact_active a {
	color:#FFF;
	background-color:#aaafb0;
}

/* Profile Button */

#nav li.profile a {
	color:#777;
}

#nav li.profile a:hover {
	color:#FFF;
	background-color:#09cfd6;
}

#nav li.profile_active a {
	color:#FFF;
	background-color:#09cfd6;
}
 
/* sub levels link hover */

#nav ul.vehicles {
	background-color:#BAE072;
	border: solid 1px #96CD2C;
	color:#fff;
}

#nav ul.personals {
	background-color:#FDDC79;
	border: solid 1px #feb914;
	color:#fff;
}

#nav ul a:hover {
	background: #0078ff;
	color: #fff;
 
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
 
	text-shadow: 0 1px 1px rgba(0,0,0, .1);
}
 
/* dropdown */
#nav li:hover > ul {
	display: block;
}
 
/* level 2 list */
#nav ul {
	display: none;
	margin: 0;
	padding: 0;
	width: 185px;
	position: absolute;
	top: 35px;
	left: 0;
	border: solid 1px #feb914;
	background-color:#FDDC79;
	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
 
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0, .3);
	box-shadow: 0 1px 3px rgba(0,0,0, .3);
}

#nav ul li {
	float: none;
	margin: 0;
	padding: 0;
}
 
#nav ul a {
	font-weight: normal;
}
 
/* level 3+ list */
#nav ul ul {
	left: 181px;
	top: -3px;
}
 
/* rounded corners of first and last link */
#nav ul li:first-child > a {
	-webkit-border-top-left-radius: 9px;
	-moz-border-radius-topleft: 9px;
 
	-webkit-border-top-right-radius: 9px;
	-moz-border-radius-topright: 9px;
}
#nav ul li:last-child > a {
	-webkit-border-bottom-left-radius: 9px;
	-moz-border-radius-bottomleft: 9px;
 
	-webkit-border-bottom-right-radius: 9px;
	-moz-border-radius-bottomright: 9px;
}
 
/* clearfix */
#nav:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
#nav {
	display: inline-block;
} 
html[xmlns] #nav {
	display: block;
}
 
* html #nav {
	height: 1%;
}

/* SIDEMENU STARTS HERE */

#sidemenu /* Button with CSS only */
{
	list-style-type:none;
	padding:0;
}

#sidemenu a /* Button with CSS only */
{
	margin:25px 15px;
}

/* Divider on secondary menu */

.divider {
	padding:0;
	margin:-10px 0;
	display:block;
}


/* SECONDARY MENU USING IMAGE SPRITES STARTS HERE */


#button1 /* Buttons using image sprites */
{
    background: url(../images/car_licenses.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button1:hover /* mouseOver */
{
    background: url(../images/car_licenses.jpg) 0 41px;
}

#button2 
{
    background: url(../images/passports.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button2:hover /* mouseOver */
{
    background: url(../images/passports.jpg) 0 41px;
}

#button3 
{
    background: url(../images/certificates.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button3:hover /* mouseOver */
{
    background: url(../images/certificates.jpg) 0 41px;
}

#button4 
{
    background: url(../images/identification.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button4:hover /* mouseOver */
{
    background: url(../images/identification.jpg) 0 41px;
}

#button5 
{
    background: url(../images/change_ownership.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button5:hover /* mouseOver */
{
    background: url(../images/change_ownership.jpg) 0 41px;
}

#button6 
{
    background: url(../images/police_clearance.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button6:hover /* mouseOver */
{
    background: url(../images/police_clearance.jpg) 0 41px;
}

#button7 /* Buttons using image sprites */
{
    background: url(../images/drivers_licenses.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button7:hover /* mouseOver */
{
    background: url(../images/drivers_licenses.jpg) 0 41px;
}

#button10 
{
    background: url(../images/duplicate_documents.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button10:hover /* mouseOver */
{
    background: url(../images/duplicate_documents.jpg) 0 41px;
}

#button11 
{
    background: url(../images/deregistration.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button11:hover /* mouseOver */
{
    background: url(../images/deregistration.jpg) 0 41px;
}

/* SECONDARY MENU USING IMAGE SPRITES ENDS HERE */


.button7 /* Call now image underneath secondar menu */
{
	padding:0;
	margin:0 15px;
	cursor:text;
	height:66px;
	width:261px;
	background-image:url(../images/call_now.jpg);
}

#button8 /* Button not using image sprite */
{
    background: url(../images/vehicle_services_btn.jpg) 0 0;
    height:41px;
    width:206px;
    display:block;
}

#button8:hover /* mouseOver */
{
	color:#065f84;
}

#button9 /* Button not using image sprite */
{
    background: url(../images/personal_services_btn.jpg) 0 0;
    height:41px;
    width:206px;
    display:block;
}

#button9:hover /* mouseOver */
{
	color:#065f84;
}


/* SECONDARY MENU NOT USING IMAGE SPRITES STARTS HERE */

#button20 /* Button not using image sprite */
{
    background: url(../images/personal_details.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button20:hover /* mouseOver */
{
	color:#065f84;
}

#button21 /* Button not using image sprite */
{
    background: url(../images/vehicle_details.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button21:hover /* mouseOver */
{
	color:#065f84;
}

#button22 /* Button not using image sprite */
{
    background: url(../images/documents.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button22:hover /* mouseOver */
{
	color:#065f84;
}

#button23 /* Button not using image sprite */
{
    background: url(../images/orders.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button23:hover /* mouseOver */
{
	color:#065f84;
}

#button24 /* Button not using image sprite */
{
    background: url(../images/order_history.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button24:hover /* mouseOver */
{
	color:#065f84;
}

#button25 /* Button not using image sprite */
{
    background: url(../images/services.jpg) 0 0;
    height:41px;
    width:246px;
    display:block;
}

#button25:hover /* mouseOver */
{
	color:#065f84;
}

#button26 /* Button not using image sprite */
{
    background: url(../images/dealers.jpg) 0 0;
    height:41px;
    width:206px;
    display:block;
}

#button26:hover /* mouseOver */
{
	color:#065f84;
}

/* SECONDARY MENU NOT USING IMAGE SPRITES ENDS HERE */

.button-text
{
	color:#fff;
	line-height:41px;
	text-decoration:none;
	padding:0 0 0 15px;
}

.button-text2
{
	color:#fff;
	line-height:41px;
	text-decoration:none;
	padding:0 0 0 55px;
}