/*
Item Name : CSS3 Mega Drop Down Menu
Author URI : http://codecanyon.net/user/Pixelworkshop/
Item URI : http://codecanyon.net/item/css3-mega-drop-down-menu/126387
Version : 5.0
*/

/*

TABLE OF CONTENTS

01 MENU BAR
02 DROP DOWN MENU
03 CONTENT STYLING
04 CONTACT FORM 
05 LIGHT THEME
06 DARK THEME
07 COLORS
08 MOBILE DEVICES

*/



/*  _______________________________________

	01 MENU BAR
    _______________________________________  */



/* IMPORTANT NOTICE
   If you're using the whole width menu, you should use at least a reset like :
   * {margin:0; padding:0;}
   Otherwise, some browsers may add margins and won't place the menu properly.
   It generally helps to include a CSS reset like : 
   http://meyerweb.com/eric/tools/css/reset/
   Keep in mind that a reset must be placed first, before any other CSS markup.
*/

.wrapper_menu_full {
    margin:0;
    position: relative;
    z-index:9999;
}
	.wrapper_menu_full .menu {
		/* width:100%;
		padding:0;
		height:43px;
		/* custom */
			height:32px;
			background:url(../gfx/menu-bg.png) top center no-repeat;	
			width:100%;
			text-align:center;
			font-family: 'Glass Antiqua', cursive;
			text-transform:uppercase;
			font-size:18px;
			
	}
	.wrapper_menu_full .menu_whole_width {
		list-style:none;
		width:730px;
		margin:0 auto;
		height:32px;
		padding:0;
	}
.menu li {
	/*float:left;
	text-align:center;
	position:relative;
	margin-right:20px;
	margin-top:6px;
	border:none;
	/* custom */
		display:block;
		list-style:none;
		float:left;
		position:relative;
		margin:0 10px;
		padding:2px 0 0 0;
		height:30px;
	
}
.menu .fullwidth {
	position: static !important;

}
.menu li:hover {
	
}

.menu li a {
	display:block;
	height:26px;
	line-height:30px;
	
	margin:0;
	padding:0 10px;
	text-decoration:none;
	color:#83755d;
	text-shadow:1px 1px 0px rgba(255,255,255,.8), -1px -1px 1px rgba(0,0,0,.2);
	border:1px inset rgba(255,255,255,0);
	
}
.menu li:hover a,
.menu li:active a {
	
	border:1px inset rgba(0,0,0,.2);
	background:	rgba(131,117,93,.1);
	border-radius:3px;
	
}

.menu li.current-page-ancestor,
.menu li.current-menu-item {
	border-radius:5px;
	border-bottom:5px solid rgba(255,255,255,.6);

}
.menu li.current-page-ancestor a,
.menu li.current-menu-item a {
	background:rgba(255,255,255,.6);

}
.menu li.current-page-ancestor:hover a,
.menu li.current-menu-item:hover a,
.menu li.current-page-ancestor:active a,
.menu li.current-menu-item:active a {
	border:1px inset rgba(0,0,0,.2);
	border-radius:3px;
	border-bottom:5px solid rgba(0,0,0,.2);
	background:	rgba(131,117,93,.1);
}

.menu li:hover div a,
.menu li:active div a {
	display:inline;
}
.menu li .drop,
.menu li:hover .drop,
.menu li:active .drop {
	
}

/* Right aligned menu item */

.menu li.right {
	float:right;
	right:0;
	margin-right:0;
}
.menu li.right:hover,
.menu li.right:active {
	margin-right:-1px;
}



/*  _______________________________________

	02 DROP DOWN MENU
    _______________________________________  */



/* Left & right aligned common styles */

.indicator {
	display:block;
	width:100%;
	position:absolute;
	top:-11px;
	left:0;
	width:20px;
	height:13px;
	background:url(../gfx/sub-menu-indicator.png) no-repeat;	
}

/* Indicator placement for Jamilla's site */
#menu-item-10 .indicator {
	left:25px;
}
#menu-item-27 .indicator {
	left:195px;
}
#menu-item-30 .indicator {
	left:350px;
}
#menu-item-37 .indicator {
	left:600px;
}
#menu-item-290 .indicator {
	left:480px;
}

.menu .dropdown_fullwidth {
	margin:0 auto;
	padding-top:6px;
	left:-999em;
	position:absolute;
	
}

.menu .dropdown_fullwidth .submenu-panel {
	position:absolute;
	width:100%;
	padding:10px;
	text-align:left;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	min-height:80px;
	background:#FFFFFF;
	background:rgba(255,255,255,1);
	border:1px solid #a6a6a6;
	box-shadow:1px 1px 5px rgba(0,0,0,.3);
}

/* Drop Downs Sizes */


.menu .dropdown_fullwidth {
	width: 720px;

}


/* Showing Drop Down on Mouse Hover - Left aligned */
.menu li:hover .dropdown_fullwidth,
.menu li:active .dropdown_fullwidth {
	left:50%;
	margin-left:-365px;
	top:30px;
	display: block;
}


/* Columns Sizes */

.menu .col_6
{
	float: left;
	margin-left: 10px;
	width:690px;
	padding:10px;
	border-radius:4px;
	min-height:60px;
}
.menu .col_3
{
	float: left;
	margin-left: 10px;
	width:335px;
	padding:10px;
	border-radius:4px;
	min-height:60px;
}
.menu .col_2
{
	float: left;
	margin-left: 10px;
	width:210px;
	padding:10px;
	border-radius:4px;
	min-height:60px;
}
.menu .col_6:hover,
.menu .col_3:hover,
.menu .col_2:hover,
.menu .col_6:active,
.menu .col_3:active,
.menu .col_2:active {
	background:#f6f6f6;
	background:rgba(240,240,240,.6);
	cursor:pointer;
	min-height:60px;
}


/* IMPORTANT */

/* Use the firstcolumn class for the items that stick to the left edge of the dropdown */
.menu .firstcolumn {
	margin-left: 0; /* Clearing margin & left */
	clear: left;
}



/*  _______________________________________

	03 CONTENT STYLING
    _______________________________________  */

.dropdown_fullwidth  {
	font-family:'Junge', serif;
	text-transform:none;
	font-size:11px;
	line-height:14px;
	line-height:auto;
}
.submenu-heading {
	padding:0;
	margin:0 0 6px 0;
}


.menu li .dropdown_fullwidth a {
	display:inline;
	border:none;
	background:none;
	font-family:'Junge', serif;
	font-size:11px;
	line-height:14px;
	padding:0;
	margin:0;
	text-decoration:underline;
	color:#c33a57;
}

.menu li .dropdown_fullwidth .submenu-heading a {
	display:block;
	border:none;
	width:100%;
	padding:0;
	margin:0;
	font-family: 'Glass Antiqua', cursive;
	text-transform:uppercase;
	text-decoration:none;
	font-size:14px;
	line-height:14px;
	height:14px;
	border-bottom:1px solid #dedede;
	text-shadow:none;
	color:#000;
	background:transparent url(../gfx/more-arrow.png) center right no-repeat;
}

.menu li .dropdown_fullwidth .col_6 p {
	font-size:12px;
	line-height:16px;
	
}

.menu li .dropdown_fullwidth .col_6 p.submenu-heading a {
	font-size:16px;
	line-height:16px;
	height:16px;
}

.menu .col_6:hover .submenu-heading a,
.menu .col_3:hover .submenu-heading a,
.menu .col_2:hover .submenu-heading a,
.menu li .dropdown_fullwidth .submenu-heading a:hover,
.menu li .dropdown_fullwidth .submenu-heading a:active {
	color:#c13956;
}



/*  _______________________________________

	08 MOBILE DEVICES
    _______________________________________  */



.menu li.noactive,
.menu li.noactive:hover {
	background:none;
	border:none;
	margin-right:20px;
}
.menu li.noactive a {
	padding: 5px 27px 3px 10px;
	text-shadow: 1px 1px 1px #000;
	border-bottom:none;
}
.menu li.noactive.right {
	margin-right:0;
}


@media only screen and (max-width: 820px) {
	
	/*	
	html {
		height: 100%; 
		font-size: 100%; 
		overflow-y: scroll; 
		-webkit-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
	} 
	body {
		margin: 0; 
		min-height: 100%; 
		-webkit-font-smoothing:antialiased; 
		font-smoothing:antialiased; 
		text-rendering:optimizeLegibility;
	}
	*/

	/* Menu Containers */
	
	.wrapper_menu,
	.wrapper_menu_full {
		width:100%;
		margin:0;
		float:left;
	}
	.wrapper_menu .menu {
		padding:6px 0 3px 0;
	}
	.wrapper_menu_full .menu,
	.wrapper_menu_full .menu .menu_whole_width {
		padding:3px 0 1px 0;
	}
	.wrapper_menu .menu,
	.wrapper_menu_full .menu,
	.wrapper_menu_full .menu .menu_whole_width {
		width:100%;
		margin:0;
		height:auto;
		float:left;
		border:none;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
	
	/* Menu Items */
	
	.menu > li,
	.menu .menu_whole_width > li,
	.menu > li.right,
	.menu .menu_whole_width > li.right {
		height:44px;
		position:static;
		margin:0 15px 0 0;
		float:left;
		right:auto;
	}
	.menu > li:hover,
	.menu .menu_whole_width > li:hover,
	.menu > li.right:hover,
	.menu .menu_whole_width > li.right:hover {
		height:44px;
		margin-right:14px;
	}
	.menu > li.nodrop:hover,
	.menu .menu_whole_width > li.nodrop:hover {
		height:20px;
		margin-bottom:5px;
	}
	
	.menu li a {
		margin:-8px 0;	
	}
	
	/* Menu Drop Downs */
	
	.menu .dropdown_1column, 
	.menu .dropdown_2columns, 
	.menu .dropdown_3columns, 
	.menu .dropdown_4columns,
	.menu .dropdown_5columns,
	.menu .dropdown_fullwidth,
	.menu li .align_right  {
		width: 96%;
		border:none;
		margin:0;
		float:none;
		padding:2%;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
	
	/* Menu Drop Downs Columns */
	
	.menu .col_1,
	.menu .col_2,
	.menu .col_3,
	.menu .col_4,
	.menu .col_5,
	.menu .col_6 {
		margin-left: 0;
		margin-right: 0;
		width: 92%;
		float: left;
		display: block;
	}
	

	.menu li:hover .dropdown_1column, 
	.menu li:hover .dropdown_2columns, 
	.menu li:hover .dropdown_3columns,
	.menu li:hover .dropdown_4columns,
	.menu li:hover .dropdown_5columns,
	.menu li:hover .dropdown_fullwidth,
	.menu li:hover .align_right,
	.menu li.right:hover .dropdown_fullwidth,
	.wrapper_menu_full .menu li.right:hover .dropdown_fullwidth {
		left:0;
		top:auto;
		margin:-1px 0 0 0;
	}
	
	/* Menu Typography and Elements */
	
	.menu h1 {
		font-size: 1.7em; 
		margin-bottom: 0.6em;
	} 
	.menu h2 {
		font-size: 1.4em; 
		margin-bottom: 0.6em;
	} 
	.menu h3 {
		font-size: 1.1em; 
		margin-bottom: 0.6em;
	} 
	.menu p, 
	.menu ul {
		font-size: 0.9em; 
		line-height: 1.8em; 
		margin-bottom: 1.5em;
	}
	.menu li .greybox li,
	.menu li .greybox li:hover {
		margin:0 15px 4px 0;
		padding:4px 9px 4px 9px;
		width:auto;
	}
	
	/* Regular Drop Down (turned into a list) */
	
	.menu .levels li,
	.menu .levels li ul	{
		position: relative;
		width:auto;
		top:auto;
		margin:0;
		padding:0;
		left: auto;
		float:left;
		border:none;
		background:none;
	}
	.menu .levels li a {
		width:auto;
		float:left;
		display:inline;
		margin:0 20px 12px 0;
	}
	.menu .levels li:hover ul, 
	.menu .levels li:hover ul ul, 
	.menu .levels li:hover ul ul ul {
		left: auto;
	}
	.menu_dark_theme ul .levels a.parent,
	.menu_dark_theme ul .levels a.parent:hover,
	.menu_dark_theme ul .levels li ul,
	.menu_light_theme ul .levels a.parent, 
	.menu_light_theme ul .levels a.parent:hover,
	.menu_light_theme ul .levels li ul,
	.menu_dark_theme ul .levels a.parent:active,
	.menu_light_theme ul .levels a.parent:active {
		background: none;
		border:none;
	}
	
	/* Menu Contact Form */
	
	.contact_form label {
		width:96%;
	}
	.contact_form input, 
	.contact_form textarea, 
	.contact_form select {
		width:96%;
	}   
	.contact_form .form_buttons {
		margin:4px 0 0 0;
	}


}

/*iPhone*/
@media only screen and (max-width: 520px) {
	

	.menu > li,
	.menu > li:hover,
	.menu > li:active,
	.menu > li.right,
	.menu > li.right:hover,
	.menu > li.right:active,
	.menu .menu_whole_width > li,
	.menu .menu_whole_width > li:hover,
	.menu .menu_whole_width > li.right,
	.menu .menu_whole_width > li.right:hover,
	.menu .menu_whole_width > li.right:active  {
		float:none;
		width:auto;
		padding-right:0;
		margin-right:0;
	}
	.menu > li.nodrop,
	.menu .menu_whole_width > li.nodrop {
		height:32px;
	}
	.menu > li.nodrop:hover,
	.menu .menu_whole_width > li.nodrop:hover,
	.menu > li.nodrop:active,
	.menu .menu_whole_width > li.nodrop:active {
		height:22px;
		margin-bottom:0px;
	}
	.menu .dropdown_1column, 
	.menu .dropdown_2columns, 
	.menu .dropdown_3columns, 
	.menu .dropdown_4columns,
	.menu .dropdown_5columns,
	.menu .dropdown_fullwidth,
	.menu .align_right  {
		display:none !important;
		
	}


}

/* iPhone Retina */

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 520px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 520px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 520px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 520px),
only screen and (                min-resolution: 192dpi) and (min-width: 520px),
only screen and (                min-resolution: 2dppx)  and (min-width: 520px) { 
	
	.wrapper_menu,
	.wrapper_menu_full {
		width:100%;
		margin:0;
		float:none;
		
	}
	
	.wrapper_menu .menu,
	.wrapper_menu_full .menu,
	.wrapper_menu_full .menu .menu_whole_width {
		width:100%;
		margin:0;
		height:auto;
		float:left;
		border:none;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		background:#FFF;
	}

	.menu > li,
	.menu > li:hover,
	.menu > li:active,
	.menu > li.right,
	.menu > li.right:hover,
	.menu > li.right:active,
	.menu .menu_whole_width > li,
	.menu .menu_whole_width > li:hover,
	.menu .menu_whole_width > li.right,
	.menu .menu_whole_width > li.right:hover,
	.menu .menu_whole_width > li.right:active  {
		float:none;
		font-size:3em;
		line-height:3.2em;
		height:auto;
		width:auto;
		padding: 12px 0;
		margin:0;
		border-bottom:1px solid #DDD !important;
	}
	
	.menu li a {
		
		padding:12px 0;
	}
	
	
	.menu > li.nodrop,
	.menu .menu_whole_width > li.nodrop {
		height:4em;
	}
	.menu > li.nodrop:hover,
	.menu .menu_whole_width > li.nodrop:hover,
	.menu > li.nodrop:active,
	.menu .menu_whole_width > li.nodrop:active {
		height:44px;
		margin-bottom:0px;
	}
	.menu .dropdown_1column, 
	.menu .dropdown_2columns, 
	.menu .dropdown_3columns, 
	.menu .dropdown_4columns,
	.menu .dropdown_5columns,
	.menu .dropdown_fullwidth,
	.menu .align_right  {
		display:none !important;
		
	}


}