/*
Theme Name : Mega Menu Complete Set
Author URI : http://themeforest.net/user/Keliah
Version : 1.0
*/

/*

TABLE OF CONTENTS

1. Menu Bar
2. Drop Down Common Container
3. Drop Down Specific Containers
4. Columns Grid
5. Drop Down Typography
6. Colors

*/



/*  _____________________________________________________________________________

    1. Menu Bar
    _____________________________________________________________________________  */



.locations #menu {
	list-style:none;
	width:140px;
	position:relative;
	z-index:9999;
	padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#FFFFFF;
	border:solid 1px #444;
	background-image:url("../../images/bg.png");
}
	.locations ul#menu  {
		padding-top: 6px;
		padding-bottom: 6px;
	}
	
	.locations #menu li {
		position:relative;
		margin:0px;
		border:none;
	}
		.locations #menu li:hover, .active {
			background:#cbcbd0;
		}
		
		.locations #menu li a {
			font-size:12px;
			color:#444444;
			text-transform:uppercase;
			text-align: center;
			outline:0;
			font-weight:600;
			text-decoration:none;
			display:block;
			padding: 10px 15px;
		}
		.locations #menu li:hover a {
			color:#333;
		}
		
		.locations #menu li .dropcontent a {
			font-size:12px;
			color:#FAC64A;
			text-transform:uppercase;
			outline:0;
			font-weight:600;
			text-decoration:none;
			display:block;
			padding: 16px 15px 16px 15px;
		}
		.locations #menu li .dropcontent a:hover {
			color:#FCE09D;
		}
		
		.locations #menu li .drop {
			padding-right:30px;
			background:url("../../images/down.png") no-repeat right center;
		}



/*  _____________________________________________________________________________

    2. Drop Down Common Container
    _____________________________________________________________________________  */



.locations #menu li .dropcontent {
	margin:0px auto 0px 140px;
	position:absolute;
	left:-9999em;
	top:0px;
	z-index:9998; /* For IE7 */
	padding:24px 0px 10px 0px;
	text-align:left;
	border:1px solid #222;
	background:#76000d;
}

/* Showing Drop Down on Mouse Hover */

.locations #menu li:hover .dropcontent {
	left:auto;
}
.locations #menu li .dropfirst {
	margin:-1px auto 0px 140px; /* Fixes a 1px issue for the 1st drop down */
}



/*  _____________________________________________________________________________

    3. Drop Down Specific Containers
    _____________________________________________________________________________  */



.locations #menu .drop1column {width: 80px;}
.locations #menu .drop2columns {width: 160px;}
.locations #menu .drop3columns {width: 240px;}
.locations #menu .drop4columns {width: 320px;}
.locations #menu .drop5columns {width: 400px;}
.locations #menu .drop6columns {width: 480px;}
.locations #menu .drop7columns {width: 560px;}
.locations #menu .drop8columns {width: 640px;}
.locations #menu .drop9columns {width: 720px;}
.locations #menu .drop10columns {width: 800px;}
.locations #menu .drop11columns {width: 880px;}
.locations #menu .drop12columns {width: 960px;}



/*  _____________________________________________________________________________

    4. Columns Grid
    _____________________________________________________________________________  */



.locations #menu .col_1,
.locations #menu .col_2,
.locations #menu .col_3,
.locations #menu .col_4,
.locations #menu .col_5,
.locations #menu .col_6,
.locations #menu .col_7,
.locations #menu .col_8,
.locations #menu .col_9,
.locations #menu .col_10,
.locations #menu .col_11,
.locations #menu .col_12 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 15px;
	margin-right: 15px;
}
.locations #menu .col_1 {width:50px;}
.locations #menu .col_2 {width:130px;}
.locations #menu .col_3 {width:210px;}
.locations #menu .col_4 {width:290px;}
.locations #menu .col_5 {width:370px;}
.locations #menu .col_6 {width:450px;}
.locations #menu .col_7 {width:530px;}
.locations #menu .col_8 {width:610px;}
.locations #menu .col_9 {width:690px;}
.locations #menu .col_10 {width:770px;}
.locations #menu .col_11 {width:850px;}
.locations #menu .col_12 {width:930px;}

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.locations #menu .col_4 {margin-bottom: 20px;}



/*  _____________________________________________________________________________

    5. Drop Down Typography
    _____________________________________________________________________________  */



.locations #menu p, .locations #menu h1, .locations #menu h2, .locations #menu h3, .locations #menu h4, .locations #menu h5, .locations #menu h6 {
	color:#FFFFFF;
	text-shadow: 1px 1px 1px #000;
}
.locations #menu h1, .locations #menu h2 {
	background:url("../../images/menu_separator.jpg") bottom repeat-x;
	padding-bottom:12px;
}
.locations #menu h1, .locations #menu h2, .locations #menu h3 {
	margin-bottom:18px;
}
.locations #menu h4, .locations #menu h5, .locations #menu h6 {
	margin-bottom:12px;
}
.locations #menu h1 {
	font-size:36px;
	line-height:36px;
}
.locations #menu h2 {
	font-size:30px; 
	line-height:42px;
}
.locations #menu h3 {
	font-size:28px; 
	line-height:28px;
}
.locations #menu h4 {
	font-size:21px; 
	line-height:24px;
}
.locations #menu h5 {
	font-size:16px; 
	line-height:16px;
	font-weight: bold;
}
.locations #menu h6 {
	font-family:"Lucida Grande","Lucida Sans Unicode",sans-serif;
	font-size:14px; 
	line-height:18px; 
	text-transform:uppercase;
}

/* Links */

.locations #menu li .dropcontent a {
	text-transform:none;
	font-size:12px;
	display:inline;
	padding:0;
}
.locations #menu li .dropcontent a:hover {
	padding:0;
}

/* Images & Boxes */

.locations #menu li .black_box {
	background-color:#111111;
	color: #eeeeee;
	text-shadow: 1px 1px 1px #000;
	padding:6px 8px 6px 8px;
	-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
	-webkit-box-shadow:inset 0 0 3px #000000;
	-moz-box-shadow:inset 0 0 3px #000000;
	box-shadow:inset 0 0 3px #000000;
}
.locations #menu .imgshadow {
	background:#000000;
	padding:4px;
	border:1px solid #222222;
	margin-top:5px;
	margin-bottom:18px;
	-moz-box-shadow:0px 0px 5px #000000;
	-webkit-box-shadow:0px 0px 5px #000000;
	box-shadow:0px 0px 5px #000000;
}
.locations #menu .img_left {
	float:left;
	margin-right:12px;
}
.locations #menu .img_right {
	float:right;
	margin-left:12px;
}

/* Paragraphs with borders */

.locations #menu .dark, .locations #menu .brown, .locations #menu .yellow, .locations #menu .red, .locations #menu .blue, .locations #menu .green {
	padding-left:15px; 
	color:#cccccc; 
	margin-bottom:18px;
}
.locations #menu .dark {border-left:#3B3B3B solid 7px}
.locations #menu .brown {border-left:#8D8767 solid 7px}
.locations #menu .yellow {border-left:#DBA742 solid 7px}
.locations #menu .red {border-left:#C05D48 solid 7px}
.locations #menu .blue {border-left:#52878B solid 7px}
.locations #menu .green {border-left:#B0BD85 solid 7px}

/* Dropcap */

.dropcap {
	display:block; 
	float:left; 
	font-size:42px; 
	line-height:36px; 
	margin:2px 8px 0 0;
}


/*  _____________________________________________________________________________

    6. Colors
    _____________________________________________________________________________  */



/* Blue */

.locations #menu.menu_blue {background-color:#536987;} /* 43% */
.locations #menu.menu_blue li .dropcontent a {color:#6a82a3;} /* 53% */
.locations #menu.menu_blue li .dropcontent a:hover {color:#536987;} /* 43% */

/* Brown */

.locations #menu.menu_brown {background-color:#866e56;}
.locations #menu.menu_brown li .dropcontent a {color:#a1886e;}
.locations #menu.menu_brown li .dropcontent a:hover {color:#866e56;}

/* Cherry */

.locations #menu.menu_cherry {background-color:#ab2d5c;}
.locations #menu.menu_cherry li .dropcontent a {color:#cc3f73;}
.locations #menu.menu_cherry li .dropcontent a:hover {color:#ab2d5c;}

/* Chrome */

.locations #menu.menu_chrome {background-color:#e6e6e8;}
.locations #menu.menu_chrome li .dropcontent a {color:#cc3f73;}
.locations #menu.menu_chrome li .dropcontent a:hover {color:#ab2d5c;}

/* Coffee */

.locations #menu.menu_coffee {background-color:#7b675c;}
.locations #menu.menu_coffee li .dropcontent a {color:#978073;}
.locations #menu.menu_coffee li .dropcontent a:hover {color:#7b675c;}

/* Green */

.locations #menu.menu_green {background-color:#788951;}
.locations #menu.menu_green li .dropcontent a {color:#93a568;}
.locations #menu.menu_green li .dropcontent a:hover {color:#788951;}

/* Grey */

.locations #menu.menu_grey {background-color:#6a6a6a;}
.locations #menu.menu_grey li .dropcontent a {color:#8c8c8c;}
.locations #menu.menu_grey li .dropcontent a:hover {color:#6a6a6a;}

/* Ocean */

.locations #menu.menu_ocean {background-color:#528a8f;}
.locations #menu.menu_ocean li .dropcontent a {color:#6aa5aa;}
.locations #menu.menu_ocean li .dropcontent a:hover {color:#528a8f;}

/* Orange */

.locations #menu.menu_orange {background-color:#e34f00;}
.locations #menu.menu_orange li .dropcontent a {color:#ff6717;}
.locations #menu.menu_orange li .dropcontent a:hover {color:#e34f00;}

/* Pink */

.locations #menu.menu_pink {background-color:#d50065;}
.locations #menu.menu_pink li .dropcontent a {color:#ff097d;}
.locations #menu.menu_pink li .dropcontent a:hover {color:#d50065;}

/* Purple */

.locations #menu.menu_purple {background-color:#68449a;}
.locations #menu.menu_purple li .dropcontent a {color:#815ab7;}
.locations #menu.menu_purple li .dropcontent a:hover {color:#68449a;}

/* Red */

.locations #menu.menu_red {background-color:#b82323;}
.locations #menu.menu_red li .dropcontent a {color:#d83636;}
.locations #menu.menu_red li .dropcontent a:hover {color:#b82323;}

/* Tan */

.locations #menu.menu_tan {background-color:#837361;}
.locations #menu.menu_tan li .dropcontent a {color:#9c8c7b;}
.locations #menu.menu_tan li .dropcontent a:hover {color:#837361;}

/* Yellow */

.locations #menu.menu_yellow {background-color:#fac64a;}
.locations #menu.menu_yellow li .dropcontent a {color:#e8c22c;}
.locations #menu.menu_yellow li .dropcontent a:hover {color:#caa616;}