/*
Item Name : Universal Mega Menu
Item URI : http://codecanyon.net/item/universal-responsive-mega-menu/4984236
Author URI : http://codecanyon.net/user/Pixelworkshop/
Version : 1.1
*/

/*

TABLE OF CONTENTS

01 MENU BAR
   1. Mega Menu Bar
   2. Mega Menu Trigger Button
02 DROP DOWNS
	1. Common Styling
	2. Footer
	3. Drop Down Containers
03 COLUMNS GRID
04 MULTILEVEL DROP DOWN
05 CONTENT & TYPOGRAPHY
   1. Basic Typography 
   2. Lists
   3. Other Styling
   4. Inline Images
   5. Icons
   6. Form Elements
06 DROP DOWN TABS
07 MOBILE DEVICES
08 RETINA DISPLAYS

*/
/*  _______________________________________

    01 MENU BAR
    _______________________________________  */
/* 
  If you have several menus on the same page, you can here 
  define some properties separately for each of them
  by using their respective ID.
*/
#mgmenu1 {
	z-index: 12;
}
#mgmenu2 {
	margin-top: 12px;
	z-index: 11;
}
/* 1. Mega Menu Bar */
.mgmenu_container,
.mgmenu_fixed,
.mgmenu_footer {
	width:100%;
	height: 41px;
	z-index:10;
    /*background: #282828;
    background: -webkit-linear-gradient(top, #282828 0%, #1f1f1f 100%);
    background: -moz-linear-gradient(top, #282828 0%, #1f1f1f 100%);
    background: -o-linear-gradient(top, #282828 0%, #1f1f1f 100%);
    background: -ms-linear-gradient(top, #282828 0%, #1f1f1f 100%);
    background: linear-gradient(top, #282828 0%, #1f1f1f 100%);*/
}
.mgmenu_container {
	position:relative;
	margin:0 auto;
}
.mgmenu_fixed,
.mgmenu_footer {
    width: inherit;
    max-width: inherit;
    /*position:fixed;
	top:0;*/
    /* IE7 Fix */
    *width:expression(this.parentNode.currentStyle['width']);
}
.mgmenu_footer {
	top: auto;
	bottom:0;
}
.mgmenu {
	font-family:Arial, Helvetica, sans-serif;
	/*font-size:13px;*/
	list-style:none;
	padding:0;
	margin:0;
	position:relative; /* For IE7 */
	line-height:1;
}
	.mgmenu > li {
	    float: left;
	    margin: 0;
	    /*padding-right: 15px;*/
	    -webkit-transition:background .3s;
	    -moz-transition:background .3s;
	    -o-transition:background .3s;
	    -ms-transition:background .3s;
	    transition:background .3s;    
	}
		.mgmenu > li:hover,
		.mgmenu > li.active {
			background-color:#131313;
		}
		.mgmenu li.noactive {
			background:none;
		}
		.mgmenu > li > a,
		.mgmenu > li > span {
			display: block;
			color:#ffffff;
			text-shadow:1px 1px 1px #000000;
			/*font-size:12px;*/
			outline:0;
			text-decoration:none;
			padding:15px 0 14px 15px;
		}
		.mgmenu > li > span:hover,
		.mgmenu > li > a:hover,
		.mgmenu > li > a:focus {
			cursor:pointer;
			color:#ffffff;
			outline:none;
		}
		.mgmenu > li .mgmenu_drop {
			background-image:url("../img/downArrow.png");
			background-repeat: no-repeat;
			background-position:right 19px;
			padding-right:20px;
		}
		.mgmenu_footer .mgmenu > li .mgmenu_drop {
			background-image:url("../img/upArrow.png");
		}
		.mgmenu > li.right_item {
			float:right;
			margin-right:0;
		}
		.mgmenu_container > .mgmenu > li.mgmenu_button,
		.mgmenu_fixed > .mgmenu > li.mgmenu_button,
		.mgmenu_footer > .mgmenu > li.mgmenu_button {
			display: none;
			cursor: pointer;
			-webkit-transition: none;
			-moz-transition: none;
			-o-transition: none;
			-ms-transition: none;
			transition: none;
			font-weight: bold;
			background-color:transparent;
			background-image:url("../img/toggle.png");
			background-repeat: no-repeat;
			background-position:96% 10px;
			line-height:12px;
			padding:18px 4% 16px 4%;
			color:#ffffff;
			text-shadow:1px 1px 1px #000000;
		}
		.mgmenu_container > .mgmenu > li.mgmenu_button_active,
		.mgmenu_fixed > .mgmenu > li.mgmenu_button_active,
		.mgmenu_footer > .mgmenu > li.mgmenu_button_active {
			/*background-color:#000000;*/
		}
/*  _______________________________________

    05 CONTENT & TYPOGRAPHY
    _______________________________________  */
/* 1. Basic Typography */
.mgmenu a {
	text-decoration: none;
	color:#222222;
	-webkit-transition:color .3s;
	-moz-transition:color .3s;
	-o-transition:color .3s;
	-ms-transition:color .3s;
	transition:color .3s;    
}
.mgmenu a:hover {
	color:#777777;
}
.mgmenu a:focus {
	background: none;
}
/* 2. Lists */
.mgmenu > li ul,
.mgmenu > li ol {
	padding:0 0 0 18px;
	margin:0 0 18px 0;
}
.mgmenu > li ul {
	list-style:square;
}
.mgmenu > li ol {
	list-style:decimal;
}
.mgmenu > li ul.no_bullets {
	list-style:none;
	padding:0;
}
.mgmenu > li ul.no_bullets li {
	line-height: 24px;
}
.mgmenu > li ul li,
.mgmenu > li ol li {
	font-size:12px;
	line-height:22px;
	position:relative;
	color:#222222;
	text-shadow:1px 1px 1px #ffffff;
}
/* 5. Icons */
.mgmenu .mini_icon {
    background-image: url("../img/icons/mini-icons-white.png");
	background-repeat: no-repeat;
	margin-top: -2px;
	padding-left: 6px;
	float: left;
	width: 20px;
	height: 20px;
}
/* Row 1 */
.mgmenu .ic_empty_document{ background-position: 0 0;  } 
.mgmenu .ic_documents{ background-position: -32px 0;  } 
.mgmenu .ic_text_document{ background-position: -64px 0;  } 
.mgmenu .ic_folder{ background-position: -96px 0;  } 
.mgmenu .ic_picture{ background-position: -128px 0;  } 
.mgmenu .ic_cloud{ background-position: -160px 0;  } 
.mgmenu .ic_archive{ background-position: -192px 0;  } 
.mgmenu .ic_download{ background-position: -224px 0;  }
.mgmenu .ic_user{ background-position: -256px 0;  } 
.mgmenu .ic_tag{ background-position: -288px 0;  } 
/* Row 2 */
.mgmenu .ic_lock{ background-position: 0 -32px;  } 
.mgmenu .ic_unlock{ background-position: -32px -32px;  } 
.mgmenu .ic_mail{ background-position: -64px -32px;  } 
.mgmenu .ic_brush{ background-position: -96px -32px;  } 
.mgmenu .ic_refresh{ background-position: -128px -32px;  } 
.mgmenu .ic_grid{ background-position: -160px -32px;  } 
.mgmenu .ic_list{ background-position: -192px -32px;  } 
.mgmenu .ic_delete{ background-position: -224px -32px;  } 
.mgmenu .ic_settings{ background-position: -256px -32px;  } 
.mgmenu .ic_time{ background-position: -288px -32px;  } 
/* Row 3 */
.mgmenu .ic_bookmark{ background-position: 0 -64px;  } 
.mgmenu .ic_calendar{ background-position: -32px -64px;  } 
.mgmenu .ic_graph{ background-position: -64px -64px;  } 
.mgmenu .ic_pin{ background-position: -96px -64px;  } 
.mgmenu .ic_chat{ background-position: -128px -64px;  } 
.mgmenu .ic_chats{ background-position: -160px -64px;  } 
.mgmenu .ic_print{ background-position: -192px -64px;  } 
.mgmenu .ic_attachment{ background-position: -224px -64px;  } 
.mgmenu .ic_power{ background-position: -256px -64px;  } 
.mgmenu .ic_favorite{ background-position: -288px -64px;  } 
/* Row 4 */
.mgmenu .ic_sound{ background-position: 0 -96px;  } 
.mgmenu .ic_edit{ background-position: -32px -96px;  } 
.mgmenu .ic_fullscreen{ background-position: -64px -96px;  } 
.mgmenu .ic_target{ background-position: -96px -96px;  } 
.mgmenu .ic_sync{ background-position: -128px -96px;  } 
.mgmenu .ic_zoom{ background-position: -160px -96px;  } 
.mgmenu .ic_plus{ background-position: -192px -96px;  } 
.mgmenu .ic_minus{ background-position: -224px -96px;  } 
.mgmenu .ic_cancel{ background-position: -256px -96px;  } 
.mgmenu .ic_ok{ background-position: -288px -96px;  } 
/* Row 5 */
.mgmenu .ic_users{ background-position: 0 -128px;  } 
.mgmenu .ic_calc{ background-position: -32px -128px;  } 
.mgmenu .ic_left{ background-position: -64px -128px;  } 
.mgmenu .ic_right{ background-position: -96px -128px;  } 
.mgmenu .ic_up{ background-position: -128px -128px;  } 
.mgmenu .ic_down{ background-position: -160px -128px;  } 
.mgmenu .ic_up_circle{ background-position: -192px -128px;  }
.mgmenu .ic_down_circle{ background-position: -224px -128px;  } 
.mgmenu .ic_left_circle{ background-position: -256px -128px;  } 
.mgmenu .ic_right_circle{ background-position: -288px -128px;  } 
.mgmenu .menubar_icon {
	padding: 0;
	list-style: none;
	float: left;
}
.mgmenu .menubar_icon:hover {
	background:none;
}
.mgmenu .menubar_icon ul > li {
	list-style: none;
	float: left;
	-webkit-transition:background-color .3s;
	-moz-transition:background-color .3s;
	-o-transition:background-color .3s;
	-ms-transition:background-color .3s;
	transition:background-color .3s;    
}
.mgmenu .menubar_icon ul > li:hover {
	background-color:#131313;
}
.mgmenu .menubar_icon ul > li > a {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 24px 24px;
	display: block;
	padding: 7px 4px 9px 4px;
	width: 24px;
	height: 24px;
}
.mgmenu .icon_vimeo {
    background-image: url("../img/icons/icon_vimeo.png");
}
.mgmenu .icon_dribbble {
    background-image: url("../img/icons/icon_dribbble.png");
}
.mgmenu .icon_twitter {
    background-image: url("../img/icons/icon_twitter.png");
}
.mgmenu .icon_facebook {
    background-image: url("../img/icons/icon_facebook.png");
}
.mgmenu .icon_flickr {
    background-image: url("../img/icons/icon_flickr.png");
}
/*  _______________________________________

    07 MOBILE DEVICES
    _______________________________________  */
@media only screen and (min-width: 768px) and (max-width: 984px) {


	.mgmenu > li {
	    padding-right: 10px;
	}
		.mgmenu > li > a,
		.mgmenu > li > span {
			padding-left:10px;
		}
	.mgmenu .mini_icon {
		padding-left: 3px;
	}
}
@media only screen and (min-width: 768px) {
	.mgmenu_container .mgmenu > li,
	.mgmenu_fixed .mgmenu > li,
	.mgmenu_footer .mgmenu > li {
		display: block !important;
	}
	    .mgmenu_container > .mgmenu > li.mgmenu_button,
	    .mgmenu_fixed > .mgmenu > li.mgmenu_button,
	    .mgmenu_footer > .mgmenu > li.mgmenu_button {
	        display: none !important;
	    }
}
@media only screen and (max-width: 767px) {
	.mgmenu_container,
	.mgmenu_fixed,
	.mgmenu_footer {
		width:100%;
		height:auto;
		margin:0;
		position:relative;
		left:auto;
		top:auto;
		bottom:auto;
	}
	.mgmenu_container .mgmenu > li,
	.mgmenu_fixed .mgmenu > li,
	.mgmenu_footer .mgmenu > li {
		float:none;
		width:auto;
		border:none;
		display: none;
		padding: 0;
		background-color: #424242;
		-moz-border-bottom-colors: none;
    	border-color: rgba(105, 105, 105, 0.8) rgba(105, 105, 105, 0.5) rgba(105, 105, 105, 0.2);
    	border-image: none;
    	border-style: solid;
    	border-width: 1px 0;  	
	}
	    .mgmenu_container > .mgmenu > li.mgmenu_button,
	    .mgmenu_fixed > .mgmenu > li.mgmenu_button,
	    .mgmenu_footer > .mgmenu > li.mgmenu_button {
	        display: block;
	    }
	.mgmenu > li > span,
	.mgmenu > li > a {
		display: block;
	}
		.mgmenu > li .mgmenu_drop {
			background-position:96% 19px;
		}
	.mgmenu > li .dropdown_container,
	.mgmenu > li .dropdown_fullwidth,
	.mgmenu_footer .mgmenu > li .dropdown_container,
	.mgmenu_footer .mgmenu > li .dropdown_fullwidth {
		position:absolute;
		top:auto;
		bottom:auto;
		width: 100%;
		margin:0 0 0 -1px;
		-webkit-border-radius:0 0 3px 3px;
		-moz-border-radius:0 0 3px 3px;
		border-radius:0 0 3px 3px;
		-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.05);
		-moz-box-shadow: 0 2px 2px rgba(0,0,0,0.05);
		-o-box-shadow: 0 2px 2px rgba(0,0,0,0.05);
		box-shadow: 0 2px 2px rgba(0,0,0,0.05);
		border:1px solid #CCCCCC;
		border-top:none;
	}
	.mgmenu li .dropdown_1column,
	.mgmenu li .dropdown_2columns,
	.mgmenu li .dropdown_3columns,
	.mgmenu li .dropdown_4columns,
	.mgmenu li .dropdown_5columns,
	.mgmenu li .dropdown_6columns,
	.mgmenu li .dropdown_7columns,
	.mgmenu li .dropdown_8columns,
	.mgmenu li .dropdown_9columns,
	.mgmenu li .dropdown_10columns,
	.mgmenu li .dropdown_11columns,
	.mgmenu li .dropdown_fullwidth {
		width: 100%;
		padding-left:0;
		padding-right:0;
	}
	.mgmenu .col_1,
	.mgmenu .col_2,
	.mgmenu .col_3,
	.mgmenu .col_4,
	.mgmenu .col_5,
	.mgmenu .col_6,
	.mgmenu .col_7,
	.mgmenu .col_8,
	.mgmenu .col_9,
	.mgmenu .col_10,
	.mgmenu .col_11,
	.mgmenu .col_12 {
		width:92%;
		margin-left: 4%;
		margin-right: 4%;
		padding: 0;
		float: left;
		display: block;
	}
	.mgmenu .col_border {
		box-shadow:none;
	}

	/* Multilevel drop down */

	.mgmenu .dropdown_flyout, 
	.mgmenu .dropdown_flyout .dropdown_flyout_level,
	.mgmenu .dropdown_flyout .dropdown_flyout_level_left {
		position: relative;
		left:auto;
		right:auto;
		top:auto;
		padding: 0;
		margin: 6px 4% 0 4%;
	}
	.mgmenu .dropdown_flyout .dropdown_flyout_level {
		border:none;
		background: none;
		box-shadow:none;
	}
	.mgmenu .dropdown_flyout li,
	.mgmenu .dropdown_flyout ul li {
		width: 100%;
		padding: 6px 0 6px 0;
	}
	.mgmenu li .dropdown_flyout .dropdown_parent {
		background:url("../img/downArrow-b.png") no-repeat 98% 14px;
	}

	/* Tabs */

	.mgmenu li > .mgmenu_tabs {
		width: 100%;
	}
	.mgmenu_tabs .mgmenu_tabs_nav {
		width:100%;
		float:left;
		margin:0;
		padding: 0;
	}
	.mgmenu_tabs .mgmenu_tabs_panels {
		padding: 21px 0 12px 0;
		width: 100%;
	}

	/* Other Elements */

	.mgmenu_trigger {
		display: none;
	}
	.mgmenu blockquote {
		margin-left: 12px;
	}
	.mgmenu .img_description {
		text-align: left;
	}

	.mgmenu .menubar_icon {
		z-index: 9;
		float: none !important;
		padding: 0 0 14px 0 !important;
	}
	.mgmenu .menubar_icon ul {
		width: 100%;
		padding: 0 0 9px 0 !important;
	}
	.mgmenu .menubar_icon ul > li {
		padding-left: 2%;
		padding-right: 2%;
	}


}



/*  _______________________________________

    08 RETINA DISPLAYS
    _______________________________________  */




@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {


	.mgmenu > li .mgmenu_drop {
		background-size: 9px 5px;
		background-image:url("../img/downArrow@2x.png");
	}
	.mgmenu_footer .mgmenu > li .mgmenu_drop {
		background-size: 9px 5px;
		background-image:url("../img/upArrow@2x.png");
	}
	.mgmenu_container > .mgmenu > li.mgmenu_button,
	.mgmenu_fixed > .mgmenu > li.mgmenu_button,
	.mgmenu_footer > .mgmenu > li.mgmenu_button {
		background-size: 24px 24px;
		background-image:url("../img/toggle@2x.png");
	}
	.mgmenu_trigger {
		background-size: 35px 35px;
		background-image:url("../img/button_up@2x.png");
	}
	.mgmenu_trigger.active {
		background-size: 35px 35px;
		background-image:url("../img/button_down@2x.png");
	}
	.mgmenu_footer ~ .mgmenu_trigger {
		background-size: 35px 35px;
		background-image:url("../img/button_down@2x.png");
	}
	.mgmenu_footer ~ .mgmenu_trigger.active {
		background-size: 35px 35px;
		background-image:url("../img/button_up@2x.png");
	}
	.mgmenu .dropdown_flyout .dropdown_parent {
		background-size: 5px 9px;
		background-image:url("../img/rightArrow@2x.png");
	}
	.mgmenu .dropdown_flyout .dropdown_parent_left {
		background-size: 5px 9px;
		background-image:url("../img/leftArrow@2x.png");
	}
	.mgmenu .mini_icon {
	    background-image: url("../img/icons/mini-icons-white@2x.png");
		background-repeat: no-repeat;
		background-size: 304px 144px;
	}

	.mgmenu .menubar_icon ul > li > a {
		background-size: 24px 24px;
	}
	.mgmenu .icon_vimeo {
	    background-image: url("../img/icons/icon_vimeo@2x.png");
	}
	.mgmenu .icon_dribbble {
	    background-image: url("../img/icons/icon_dribbble@2x.png");
	}
	.mgmenu .icon_twitter {
	    background-image: url("../img/icons/icon_twitter@2x.png");
	}
	.mgmenu .icon_facebook {
	    background-image: url("../img/icons/icon_facebook@2x.png");
	}
	.mgmenu .icon_flickr {
	    background-image: url("../img/icons/icon_flickr@2x.png");
	}


}


@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {

	.mgmenu li .dropdown_flyout .dropdown_parent {
		background-size: 9px 5px;
		background-image:url("../img/downArrow-b@2x.png");
	}

}