/*
Item Name : Responsive Mega Menu Complete Set
Item URI : http://codecanyon.net/item/mega-menu-complete-set/152825
Author URI : http://codecanyon.net/user/Pixelworkshop
Version : 3.31
*/

/*

TABLE OF CONTENTS

01 MEGA MENU BAR
02 MEGA MENU CONTAINERS
03 DROP DOWN COLUMNS GRID
04 FLY-OUT MENU
05 MEGA MENU WEB ELEMENTS
   1. General Typography
   2. Lists
   3. Custom Paragraphs
   4. Video + Misc.
   5. Images
   6. Paragraph Icons
   7. Social Icons
   8. Form Elements
   9. Tables
06 DEFAULT THEMES, DARK & LIGHT (COMPULSORY)
   1. Dark Menu Bar
   2. Light Menu Bar
   3. Dark Drop Down
   4. Light Drop Down
   5. Neutral Colored Elements
      - Form Elements
      - Tables
07 ADDITIONAL THEMES (OPTIONNAL)
   1. Blue
   2. Brown
   3. Cherry
   4. Coffee
   5. Green
   6. Grey
   7. Ocean
   8. Orange
   9. Pink
   10. Purple
   11. Red
   12. Tan
   13. Yellow
08 VERTICAL MEGA MENU
09 MOBILE DEVICES
   1. Common Media Queries
   2. Horizontal Mega Menu Media Queries
   3. Vertical Mega Menu Media Queries

*/




/*
	Layout container
	The menu will automatically expand into your container.
	"page_wrapper" and "page_wrapper_vertical" are just used to show how the menu fits,
	those containers are not necessary, just put the menu into a container and it will
	fit exactly to its dimensions.
*/



/*  _______________________________________________

    01 MEGA MENU BAR
    _______________________________________________  */




.megamenu_container {
	position: relative;
	z-index:9999;
}

.megamenu {
	list-style:none;
	padding:0;
	position:relative; /* For IE7 */
	margin:0;
	line-height:1;
}
	.megamenu > li {
		float:left;
		font-family: 'Source Sans Pro',Arial,sans-serif;
		margin:0;
		border:none;

	}
		.megamenu > li > a {
			outline:0;
			text-decoration:none;
			display:block;
		}
		.megamenu > li .megamenu_drop {
			padding-right:30px;
		}
		.megamenu li.megamenu_button {
			display: none;
			-webkit-transition: none;
			-moz-transition: none;
			-o-transition: none;
			-ms-transition: none;
			transition: none;
		}



/*  _______________________________________________

    02 MEGA MENU CONTAINERS
    _______________________________________________  */



/* CONTAINER FÜR DROPDOWN MENU */
.megamenu li .dropdown_container,
.megamenu li .dropdown_fullwidth,
.megamenu li .dropdown_multilevel {
	position: absolute;
	margin:0;
	display: block;
	zoom:1;
	z-index:9998;
	float: left;
}


/* Showing Drop Down on Mouse Hover */

.megamenu li:hover .dropdown_container {
	top:45px;
	left:auto;
}
.megamenu li:hover .dropdown_fullwidth {
	top:45px;
	left:0px;
}


.megamenu .dropdown_fullwidth {
	width: 940px;
}




/*  _______________________________________________

    03 DROP DOWN COLUMNS GRID
    _______________________________________________  */




.megamenu .col_1,
.megamenu .col_2,
.megamenu .col_3,
.megamenu .col_4,
.megamenu .col_5,
.megamenu .col_6,
.megamenu .col_7,
.megamenu .col_8,
.megamenu .col_9,
.megamenu .col_10,
.megamenu .col_11,
.megamenu .col_12 {
	float: left;
	display:inline;
	position: relative;

	/* 
	Rounding error with IE7.
	Lower margin values will absorb the difference.
	*/
	*margin-left: 1.9%;
	*margin-right: 1.9%;
}

.megamenu .col_1 {width:4.33%;}
.megamenu .col_2 {width:12.66%;}
.megamenu .col_3 {width:21%;}
.megamenu .col_4 {width:29.33%;}
.megamenu .col_5 {width:37.66%;}
.megamenu .col_6 {width:46%;}
.megamenu .col_7 {width:54.33%;}
.megamenu .col_8 {width:62.66%;}
.megamenu .col_9 {width:71%;}
.megamenu .col_10 {width:79.33%;}
.megamenu .col_11 {width:87.66%;}
.megamenu .col_12 {width:100%;}

.megamenu .rowcontent {
	clear:left;
	/*
	IE7 clear issue.
	Display inline required.
	*/
	*display:inline;
}







/*  _______________________________________________

    05 MEGA MENU WEB ELEMENTS
    _______________________________________________  */





/* 2. Lists */


.megamenu li ul,
.megamenu li ol {
	padding:0;
	margin:0 0 18px 20px;
}
.megamenu li ul {
	list-style:disc;
}
.megamenu li ol {
	list-style:decimal;
	*margin-left: 22px;
}
	.megamenu li ul li,
	.megamenu li ol li {
		font-size:12px;
		line-height:21px; 
		position:relative;
		padding:0;
		margin:0;
		float:none;
		text-align:left;
	}
.megamenu li .list_unstyled {
	list-style: none;
	margin-left:0;
}





/* 5. Images */


.megamenu img {
/*	max-width: 100%;
	height: auto;
	border:none;
	margin-bottom: 18px;*/
}
	.megamenu img.img_left {
		float: left;
		margin-right: 18px;
	}
	.megamenu img.img_right {
		float: right;
		margin-left: 18px;
	}
.megamenu img {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	filter: alpha(opacity=70);
	opacity:0.7;
	-webkit-transition: opacity 0.3s ease-in-out; 
	-moz-transition: opacity 0.3s ease-in-out; 
	-o-transition: opacity 0.3s ease-in-out; 
	-ms-transition: opacity 0.3s ease-in-out; 
	transition: opacity 0.3s ease-in-out;  
}
.megamenu img:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity:1;
	-webkit-transition: opacity 0.3s ease-in-out; 
	-moz-transition: opacity 0.3s ease-in-out; 
	-o-transition: opacity 0.3s ease-in-out; 
	-ms-transition: opacity 0.3s ease-in-out; 
	transition: opacity 0.3s ease-in-out;  
}


/* 6. Paragraph Icons */


.megamenu .paragraph_icon {
	padding-left: 36px;
	padding-right: 20px;
	margin-bottom: 18px;
}
.megamenu .mini_icon {
	background-repeat: no-repeat;
	margin-top: 4px;
	margin-left:-34px;
	float: left;
	width: 20px;
	height: 20px;
}
.megamenu_dark .megamenu .mini_icon {
    background-image: url("/img/megamenu/icons/mini-icons-white.png");
}
.megamenu_light .megamenu .mini_icon {
    background-image: url("/img/megamenu/icons/mini-icons-black.png");
}

.megamenu .ic_archive{ background-position: 0 0;  } 
.megamenu .ic_attachment{ background-position: 0 -56px;  } 
.megamenu .ic_bookmark{ background-position: 0 -112px;  } 
.megamenu .ic_brush{ background-position: 0 -168px;  } 
.megamenu .ic_calc{ background-position: 0 -224px;  } 
.megamenu .ic_calendar{ background-position: 0 -280px;  } 
.megamenu .ic_cancel{ background-position: 0 -336px;  } 
.megamenu .ic_chat{ background-position: 0 -392px;  } 
.megamenu .ic_chats{ background-position: 0 -448px;  } 
.megamenu .ic_cloud{ background-position: 0 -504px;  } 
.megamenu .ic_delete{ background-position: 0 -560px;  } 
.megamenu .ic_documents{ background-position: 0 -616px;  } 
.megamenu .ic_down{ background-position: 0 -672px;  } 
.megamenu .ic_down_circle{ background-position: 0 -728px;  } 
.megamenu .ic_download{ background-position: 0 -784px;  } 
.megamenu .ic_edit{ background-position: 0 -840px;  } 
.megamenu .ic_empty_document{ background-position: 0 -896px;  } 
.megamenu .ic_favorite{ background-position: 0 -952px;  } 
.megamenu .ic_folder{ background-position: 0 -1008px;  } 
.megamenu .ic_fullscreen{ background-position: 0 -1064px;  } 
.megamenu .ic_graph{ background-position: 0 -1120px;  } 
.megamenu .ic_grid{ background-position: 0 -1176px;  } 
.megamenu .ic_left{ background-position: 0 -1232px;  } 
.megamenu .ic_left_circle{ background-position: 0 -1288px;  } 
.megamenu .ic_list{ background-position: 0 -1344px;  } 
.megamenu .ic_lock{ background-position: 0 -1400px;  } 
.megamenu .ic_mail{ background-position: 0 -1456px;  } 
.megamenu .ic_minus{ background-position: 0 -1512px;  } 
.megamenu .ic_ok{ background-position: 0 -1568px;  } 
.megamenu .ic_picture{ background-position: 0 -1624px;  } 
.megamenu .ic_pin{ background-position: 0 -1680px;  } 
.megamenu .ic_plus{ background-position: 0 -1736px;  } 
.megamenu .ic_power{ background-position: 0 -1792px;  } 
.megamenu .ic_print{ background-position: 0 -1848px;  } 
.megamenu .ic_refresh{ background-position: 0 -1904px;  } 
.megamenu .ic_right{ background-position: -56px 0;  } 
.megamenu .ic_right_circle{ background-position: -56px -56px;  } 
.megamenu .ic_settings{ background-position: -56px -112px;  } 
.megamenu .ic_sound{ background-position: -56px -168px;  } 
.megamenu .ic_sync{ background-position: -56px -224px;  } 
.megamenu .ic_tag{ background-position: -56px -280px;  } 
.megamenu .ic_target{ background-position: -56px -336px;  } 
.megamenu .ic_text_document{ background-position: -56px -392px;  } 
.megamenu .ic_time{ background-position: -56px -448px;  } 
.megamenu .ic_unlock{ background-position: -56px -504px;  } 
.megamenu .ic_up{ background-position: -56px -560px;  } 
.megamenu .ic_up_circle{ background-position: -56px -616px;  } 
.megamenu .ic_user{ background-position: -56px -672px;  } 
.megamenu .ic_users{ background-position: -56px -728px;  } 
.megamenu .ic_zoom{ background-position: -56px -784px;  } 







/*  _______________________________________________

    06 DEFAULT THEMES, DARK & LIGHT (COMPULSORY)
    _______________________________________________  */











/* 4. Light Drop Down */



.megamenu_light .megamenu li .dropdown_fullwidth {
	border-top:1px solid #fff;/*border um Dropdown*/
	border-left:1px solid #fff;/*border um Dropdown*/
	background: #fff;
}
.megamenu_container_vertical .megamenu li .dropdown_container,
.megamenu_container_vertical .megamenu li .dropdown_fullwidth,
.megamenu_container_vertical .megamenu li .dropdown_flyout li ul {
	border-top-width: 1px;
}







/*  _______________________________________________

    09 MOBILE DEVICES
    _______________________________________________  */




/* 1. Common Media Queries */


@media only screen and (max-width: 984px) {

	.megamenu img {
		max-width: 96%;
		height: auto;
	}
	.megamenu textarea {
		width:96%;
	}

}


@media only screen and (min-width: 480px) and (max-width: 767px) {

	.megamenu_container .megamenu > li > div > .responsive_sixths,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_sixths {
		width: 8.66%;
	}
	.megamenu_container .megamenu > li > div > .responsive_fourths,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_fourths {
		width: 17%;
	}
	.megamenu_container .megamenu > li > div > .responsive_thirds,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_thirds {
		width: 25.33334%;
	}
	.megamenu_container .megamenu > li > div > .responsive_halfs,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_halfs {
		width: 42%;
	}

}


/* 2. Horizontal Mega Menu Media Queries */


@media only screen and (min-width: 768px) and (max-width: 984px) {

	.megamenu_container .megamenu > li {
		margin:0 8px 0 0;
	}
		.megamenu_container .megamenu > li.right {
			margin-right:-1px;
		}
		.megamenu_container .megamenu > li > a {
			padding: 16px 10px 17px 10px;
		}
		.megamenu_container .megamenu > li .megamenu_drop {
			padding-right:30px;
		}

}


@media only screen and (max-width:767px) {

	
	.megamenu_container .megamenu > li,
	.megamenu_container .megamenu > li:hover,
	.megamenu_container .megamenu > li.right,
	.megamenu_container .megamenu > li.right:hover {
		float:none;
		width:auto;
		padding-right:0;
		margin-right:0;
	}

/* Abstand des Dropdown von oben und links / Höhe */
	 .megamenu_container .megamenu li:hover .dropdown_container,
	 .megamenu_container .megamenu li:hover .dropdown_fullwidth,
	 .megamenu_container .megamenu li:hover .dropdown_right {
		top:38px;
		left:0px;
	}
  	.megamenu_container .megamenu .dropdown_1column,
  	.megamenu_container .megamenu .dropdown_2columns,
  	.megamenu_container .megamenu .dropdown_3columns,
	.megamenu_container .megamenu .dropdown_4columns,
	.megamenu_container .megamenu .dropdown_5columns,
	.megamenu_container .megamenu .dropdown_6columns,
	.megamenu_container .megamenu .dropdown_7columns,
	.megamenu_container .megamenu .dropdown_8columns,
	.megamenu_container .megamenu .dropdown_9columns,
	.megamenu_container .megamenu .dropdown_10columns,
	.megamenu_container .megamenu .dropdown_11columns,
	.megamenu_container .megamenu .dropdown_12columns {
		width: 100%;
		padding-left:0;
		padding-right:0;
	}
	.megamenu_container .megamenu .col_1,
	.megamenu_container .megamenu .col_2,
	.megamenu_container .megamenu .col_3,
	.megamenu_container .megamenu .col_4,
	.megamenu_container .megamenu .col_5,
	.megamenu_container .megamenu .col_6,
	.megamenu_container .megamenu .col_7,
	.megamenu_container .megamenu .col_8,
	.megamenu_container .megamenu .col_9,
	.megamenu_container .megamenu .col_10,
	.megamenu_container .megamenu .col_11,
	.megamenu_container .megamenu .col_12 {
		width:92%;
		margin-left: 4%;
		margin-right: 4%;
	}
	.megamenu_container .megamenu > li.megamenu_searchform .megamenu_searchfield {
		margin-left: 10px;
		margin-bottom: 10px;
	}
	.megamenu .dropdown_flyout, 
	.megamenu .dropdown_flyout .dropdown_flyout_level {
		position: relative;
		left:auto;
		top:auto;
		padding: 0;
		margin: 0 4% 0 4%;
	}
	.megamenu .dropdown_flyout li,
	.megamenu .dropdown_flyout ul li {
		width: 100%;
		padding: 3px 0 3px 0;
	}
	.megamenu .dropdown_flyout li:hover > .dropdown_flyout_level {
		left:auto;
		top:auto;
	}
	.megamenu .dropdown_flyout li:hover > .dropdown_flyout_level_left {
		left:auto;
		right:auto;
	}
	.megamenu_dark .megamenu li .dropdown_flyout li ul,	
	.megamenu_light .megamenu li .dropdown_flyout li ul {
		border:none;
		background: none;
	}
	.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent {
		background:url("/img/megamenu/dropdown.png") no-repeat right 9px;
	}
	.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent {
		background:url("/img/megamenu/dropdown-b.png") no-repeat right 9px;
	}
	.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent:hover,
	.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent.active,
	.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent:hover,
	.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent.active {
		background-color:transparent;
	}

}


@media only screen and (max-width: 479px) {

	.megamenu_container .megamenu > li > div > .responsive_sixths,
	.megamenu_container .megamenu > li > div > .responsive_fourths,
	.megamenu_container .megamenu > li > div > .responsive_thirds,
	.megamenu_container .megamenu > li > div > .responsive_halfs {
		width: 42%;
	}

}


/* 3. Vertical Mega Menu Media Queries */


@media only screen and (max-width:984px) {

	.megamenu_container_vertical .megamenu li .dropvertical_container {
		width: 400px;
	}
  	.megamenu_container_vertical .megamenu .dropdown_1column,
  	.megamenu_container_vertical .megamenu .dropdown_2columns,
  	.megamenu_container_vertical .megamenu .dropdown_3columns,
	.megamenu_container_vertical .megamenu .dropdown_4columns,
	.megamenu_container_vertical .megamenu .dropdown_5columns,
	.megamenu_container_vertical .megamenu .dropdown_6columns,
	.megamenu_container_vertical .megamenu .dropdown_7columns,
	.megamenu_container_vertical .megamenu .dropdown_8columns,
	.megamenu_container_vertical .megamenu .dropdown_9columns,
	.megamenu_container_vertical .megamenu .dropdown_10columns,
	.megamenu_container_vertical .megamenu .dropdown_11columns,
	.megamenu_container_vertical .megamenu .dropdown_12columns {
		width: 100%;
		padding-left:0;
		padding-right:0;
	}
	.megamenu_container_vertical .megamenu .col_1,
	.megamenu_container_vertical .megamenu .col_2,
	.megamenu_container_vertical .megamenu .col_3,
	.megamenu_container_vertical .megamenu .col_4,
	.megamenu_container_vertical .megamenu .col_5,
	.megamenu_container_vertical .megamenu .col_6,
	.megamenu_container_vertical .megamenu .col_7,
	.megamenu_container_vertical .megamenu .col_8,
	.megamenu_container_vertical .megamenu .col_9,
	.megamenu_container_vertical .megamenu .col_10,
	.megamenu_container_vertical .megamenu .col_11,
	.megamenu_container_vertical .megamenu .col_12 {
		width:92%;
		margin-left: 4%;
		margin-right: 4%;
	}
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_sixths,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_fourths,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_thirds,
	.megamenu_container_vertical .megamenu > li > .dropvertical_container > div > .responsive_halfs {
		width: 42%;
	}

	.megamenu_container_vertical .megamenu .dropdown_flyout, 
	.megamenu_container_vertical .megamenu .dropdown_flyout .dropdown_flyout_level {
		position: relative;
		left:auto!important;
		top:auto!important;
		padding: 0;
		margin: 0 4% 0 4%;
	}
	.megamenu_container_vertical .megamenu .dropdown_flyout li,
	.megamenu_container_vertical .megamenu .dropdown_flyout ul li {
		width: 100%!important;
		padding: 3px 0 3px 0;
	}
	.megamenu_container_vertical .megamenu .dropdown_flyout li:hover > .dropdown_flyout_level {
		left:auto!important;
		top:auto!important;
	}
	.megamenu_container_vertical .megamenu .dropdown_flyout li:hover > .dropdown_flyout_level_left {
		left:auto!important;
		right:auto!important;
	}
	.megamenu_dark .megamenu_vertical li .dropdown_flyout li ul,	
	.megamenu_light .megamenu_vertical li .dropdown_flyout li ul {
		border:none;
		background: none;
	}
	.megamenu_dark .megamenu_vertical li .dropdown_flyout .dropdown_parent {
		background:url("/img/megamenu/dropdown.png") no-repeat right 9px;
	}
	.megamenu_light .megamenu_vertical li .dropdown_flyout .dropdown_parent {
		background:url("/img/megamenu/dropdown-b.png") no-repeat right 9px;
	}
	.megamenu_dark .megamenu_vertical li .dropdown_flyout .dropdown_parent:hover,
	.megamenu_dark .megamenu_vertical li .dropdown_flyout .dropdown_parent.active,
	.megamenu_light .megamenu_vertical li .dropdown_flyout .dropdown_parent:hover,
	.megamenu_light .megamenu_vertical li .dropdown_flyout .dropdown_parent.active {
		background-color:transparent;
	}

}


@media only screen and (max-width:767px) {

	.megamenu_container_vertical,
	.megamenu_container_vertical .megamenu {
		width: 100%;
	}
	.megamenu_container_vertical .megamenu > li,
	.megamenu_container_vertical .megamenu > li:hover,
	.megamenu_container_vertical .megamenu > li.right,
	.megamenu_container_vertical .megamenu > li.right:hover {
		float:none;
		width:auto;
		padding-right:0;
		margin-right:0;
	}
	.megamenu_container_vertical .megamenu li .megamenu_drop {
		padding-right:30px;
	}
	.megamenu_light_bar .megamenu_vertical li .megamenu_drop {
		background:url("/img/megamenu/dropdown-b.png") no-repeat right center;
	}
	.megamenu_dark_bar .megamenu_vertical li .megamenu_drop {
		background:url("/img/megamenu/dropdown.png") no-repeat right center;
	}
	.megamenu_container_vertical .megamenu li .dropdown_container,
	.megamenu_container_vertical .megamenu li .dropdown_fullwidth {
		margin:0 auto 0 0;
		-webkit-border-radius: 0 0 4px 4px;
		-moz-border-radius: 0 0 4px 4px;
		border-radius: 0 0 4px 4px;
	}
	.megamenu_container_vertical .megamenu li .dropdown_first {
		margin:0 auto 0 -1px;
	}
	.megamenu_container_vertical .megamenu li .dropvertical_container {
		width: 100%;
	}

	 .megamenu_container_vertical .megamenu li:hover .dropdown_container,
	 .megamenu_container_vertical .megamenu li:hover .dropdown_fullwidth,
	 .megamenu_container_vertical .megamenu li:hover .dropdown_right {
		top:auto;
		left:-1px;
	}

}