/*
Traynor - 3-19-13
I'm going to add my own help info in this file to make it easier to modify for new clients.
All of my comments throughout the code are prefaced with "traynor".

160 - width/height of entire main menu
210 - padding around individual main menu items
307, 462 - width of the dropdown menus
1407, 974, 1031 - adjust the location of the little arrow icons
1054 - modify the colors of the dropdown menus
1426 - modify customtheme - gradient colors and a:hover colors
1775 - Vertical menu - Added absolute positioning so that the menu would be 100% of the height *under* the header




*/

/*
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.3
*/

/*

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.
*/


body {
	background: url("../img/background.jpg");
}
.page_wrapper,
.page_wrapper_vertical {
	width: 860px;
	margin: 36px auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:21px;
}
.menu_description {
	color:#262626;
	text-shadow:1px 1px 1px #ffffff;
	padding-bottom: 36px;
}
.menu_description h1 {
	margin-top: 24px;
	font-size:24px;
	line-height:38px;
}
.menu_description h2 {
	font-size:18px;
	line-height:24px;
}
.menu_description ul.description {
	font-size:12px;
	line-height:21px;
	list-style: square;
	margin: 0 0 0 15px;
	padding: 0;
}
.menu_description a {
	color: #888888;
	text-decoration: none;
}
.page_wrapper_vertical {
	width:960px;
	margin: 36px auto;
}
.page_wrapper_vertical .menu_description {
	float:left;
	width: 760px;
	margin-left: 40px;
}
.page_wrapper_vertical .menu_description h1 {
	margin-top: -6px;
}
.page_wrapper_fixed {
	margin: 70px auto;
}
@media only screen and (min-width: 768px) and (max-width: 984px) {
	.page_wrapper, .page_wrapper_vertical {width:768px;}
	.page_wrapper_vertical .menu_description {width: 500px;}
}
@media only screen and (max-width:767px) {
	.page_wrapper, .page_wrapper_vertical {width:420px;}
	.page_wrapper_vertical .menu_description {width: 100%;margin-left:0;}
	.page_wrapper_vertical .menu_description h1 {margin-top: 24px;}
}
@media only screen and (max-width:479px) {
	.page_wrapper, .page_wrapper_vertical {width:300px;}
}




/*  _______________________________________________

    01 MEGA MENU BAR
    _______________________________________________  */


/*
traynor
Unless you have the menu confined in a div, change the width here.
I think the height/width might come into play as well.
*/

.megamenu_container {
	width:800px;
	height: 28px;
	*height: 26px;
	margin:0 auto;
	padding-left: 45px; /* traynor - adjust this to move the entire menu left/right to center it */
	position: relative;
	z-index:9999;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.megamenu_fixed {
	width: inherit;
	position:fixed;
	top:0;
	/* IE7 Fix */
	*width:expression(this.parentNode.currentStyle['width']);
}
.megamenu {
	list-style:none;
	padding:0;
	position:relative; /* For IE7 */
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	line-height:1;
}
	.megamenu > li {
		float:left;
		margin:0;
		border:none;
		-webkit-transition: background 0.5s ease;
		-moz-transition: background 0.5s ease;
		-o-transition: background 0.5s ease;
		-ms-transition: background 0.5s ease;
		transition: background 0.5s ease;
	}
/*
traynor
Adjust the paddings here for spacing around the menu items.
*/
		.megamenu > li > a {
			font-size:12px;
			text-transform:uppercase;
			outline:0;
			text-decoration:none;
			display:block;
			padding: 12px 10px 12px 10px;
		}
		.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;
		}

		/* Right aligned menu item */
		
		.megamenu li.megamenu_right {
			float:right;
			margin-right:-1px;
		}
		.megamenu li.megamenu_right a {
			margin-right:5px;
		}

		


/*  _______________________________________________

    02 MEGA MENU CONTAINERS
    _______________________________________________  */




.megamenu li .dropdown_container,
.megamenu li .dropdown_fullwidth,
.megamenu li .dropdown_multilevel {
	position: absolute;
	margin:0;
	padding-top:24px;
	padding-bottom:10px;
	left:-9999em;
	top:-9999em;
	display: block;
	zoom:1;
	z-index:9998;
	float: left;
}
.megamenu li .dropdown_first {
	margin-left:-1px;
}
.megamenu li .droplast_right {
	margin-right:-1px;
}

/* Showing Drop Down on Mouse Hover */

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


/*
	Bigger containers need smaller padding values and
	on the opposite, smaller containers will have
	higher paddings. 
	This makes the content within each kind of drop down 
	equally distant from the left edge. 
*/

/*
traynor
The original plan is to give a percentage of the width for each of the following styles.
Seems interesting, but doesn't work for us.  We generally need an absolute fixed width.
I chose 3columns, since it was close to the size I needed, but it might not make a difference really.
Set the width to an absolute pixel amount.  You might want to futz with the padding, too.
*/

.megamenu .dropdown_1column {
	width: 8.3334%;
	padding-left: 2%;
	padding-right: 2%;
}
.megamenu .dropdown_2columns {
	width: 16.6667%;
	padding-left: 1.8333%;
	padding-right: 1.8333%;
}
.megamenu .dropdown_3columns {
	width: 190px;
	padding-left: 5px;
	padding-right: 5px;
}
.megamenu .dropdown_4columns {
	width: 33.3334%;
	padding-left: 1.333%;
	padding-right: 1.333%;
}
.megamenu .dropdown_5columns {
	width: 41.6667%;
	padding-left: 1.166%;
	padding-right: 1.166%;
}
.megamenu .dropdown_6columns {
	width: 50%;
	padding-left: 1%;
	padding-right: 1%;
}
.megamenu .dropdown_7columns {
	width: 58.3334%;
	padding-left: 0.833%;
	padding-right: 0.833%;
}
.megamenu .dropdown_8columns {
	width: 66.6667%;
	padding-left: 0.666%;
	padding-right: 0.666%;
}
.megamenu .dropdown_9columns {
	width: 75%;
	padding-left: 0.5%;
	padding-right: 0.5%;
}
.megamenu .dropdown_10columns {
	width: 83.3334%;
	padding-left: 0.333%;
	padding-right: 0.333%;
}
.megamenu .dropdown_11columns {
	width: 91.6667%;
	padding-left: 0.1666%;
	padding-right: 0.1666%;
}
.megamenu .dropdown_12columns,
.megamenu .dropdown_fullwidth {
	width: 100%;
}




/*  _______________________________________________

    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;
	margin-left: 2%;
	margin-right: 2%;
	/* 
	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:96%;}

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




/*  _______________________________________________

    04 FLY-OUT MENU
    _______________________________________________  */




.megamenu .dropdown_flyout, 
.megamenu .dropdown_flyout .dropdown_flyout_level {
	padding: 0;
	margin: 0;
	list-style: none;
	z-index: 9;
}
.megamenu .dropdown_flyout li {
	float: left;
	width: 92%;
	padding: 3px 4% 3px 4%;
}
.megamenu .dropdown_flyout ul li {
	width: 180px; /* traynor - this modifies the second level flyout menu widths */
	padding: 3px 10px 3px 10px;
}
.megamenu .dropdown_flyout a {
	display: block;
}
.megamenu .dropdown_flyout .dropdown_flyout_level {
	position: absolute;
	margin:15px 0 0 4px;
	padding:6px;
	left: -9999em;
	top:-9999em;
	display: block;
	zoom:1;
	float: left;
}
.megamenu .dropdown_flyout li:hover > .dropdown_flyout_level {
	left:95%;
	top:-21px;
}
.megamenu .dropdown_flyout li:hover > .dropdown_flyout_level_left {
	left:-108%;
	right:100%;
}




/*  _______________________________________________

    05 MEGA MENU WEB ELEMENTS
    _______________________________________________  */




/* 1. General Typography */


.megamenu p, 
.megamenu h1, 
.megamenu h2, 
.megamenu h3, 
.megamenu h4, 
.megamenu h5, 
.megamenu h6 {
	padding:0;
	margin:0 0 20px;
}
.megamenu > li > div a {
	text-decoration: none;
	outline: none;
}
.megamenu > li > div a:hover {
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	-o-transition: color 0.3s;
	-ms-transition: color 0.3s;
	transition: color 0.3s;
}
.megamenu p {
	font-size:12px; 
	line-height:21px; 
}
.megamenu h1, 
.megamenu h2, 
.megamenu h3,
.megamenu h4, 
.megamenu h5, 
.megamenu h6 {
	font-weight: bold;
	margin:0 0 20px 0;
}
.megamenu h1 {
	font-size: 24px;
	line-height: 28px;
}
.megamenu h2 {
	font-size: 20px;
	line-height: 22px;
}
.megamenu h3 {
	font-size: 16px;
	line-height: 20px;
}
.megamenu h4 {
	font-size: 14px;
	line-height: 18px;
	margin-bottom:14px;
}
.megamenu h5 {
	font-size: 12px;
	line-height: 18px;
	margin-bottom:14px;
}
.megamenu h6 {
	font-size: 10px;
	line-height: 16px;
	margin-bottom:14px;
	text-transform:uppercase;
}


/* 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;
}


/* 3. Custom Paragraphs */


.megamenu .blue, 
.megamenu .grey, 
.megamenu .orange, 
.megamenu .dark, 
.megamenu .purple {
	padding:0 0 0 15px; 
	margin-bottom:18px;
	border-left: solid 5px;
}
	.megamenu .blue {border-left-color:#929292;}
	.megamenu .grey {border-left-color:#ECE7BA;}
	.megamenu .orange {border-left-color:#BD4F33;}
	.megamenu .dark {border-left-color:#3F3F3F;}
	.megamenu .purple {border-left-color:#382E34;}

.megamenu .black_box {
	text-shadow:none;
	padding:10px;
	margin-top:-10px;
	*margin-top:0;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
}


/* 4. Video + Misc. */


.megamenu .video_container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	margin-bottom: 24px;
}
	.megamenu .video_container iframe,  
	.megamenu .video_container object,  
	.megamenu .video_container embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border:none;
	}
.megamenu .dropcap {
	display:block; 
	float:left; 
	font-size:42px; 
	line-height:36px; 
	margin:4px 8px 0 0;
}
.megamenu hr {
	width: 100%;
	height: 0;
	*height:2px;
	border:none;
	margin-bottom: 24px;
}


/* 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/icons/mini-icons-white.png");
}
.megamenu_light .megamenu .mini_icon {
    background-image: url("../img/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;  } 


/* 7. Social Icons */


.megamenu .social_icon {
	width: 42px;
	height: 42px;
	margin-bottom: 12px;
	*padding-bottom:18px;
	float: left;
    background: url("../img/icons/social-icons.png") no-repeat top left;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	opacity:0.6;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	-webkit-transition: .3s all ease-in; 
	-o-transition: .3s all ease-in;
	-moz-transition: .3s all ease-in; 
	transition: .3s all ease-in;
}
.megamenu .social_icon:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity:1;
}
.megamenu .social_icon_delicious {background-position: 0 0;} 
.megamenu .social_icon_digg {background-position: 0 -62px;} 
.megamenu .social_icon_dribble {background-position: 0 -124px;} 
.megamenu .social_icon_ember {background-position: 0 -186px;} 
.megamenu .social_icon_facebook {background-position: 0 -248px;} 
.megamenu .social_icon_flickr {background-position: 0 -310px;} 
.megamenu .social_icon_forrst {background-position: 0 -372px;} 
.megamenu .social_icon_google {background-position: 0 -434px;} 
.megamenu .social_icon_last_fm {background-position: 0 -496px;} 
.megamenu .social_icon_linkedin {background-position: 0 -558px;} 
.megamenu .social_icon_my_space {background-position: 0 -620px;} 
.megamenu .social_icon_quora {background-position: 0 -682px;} 
.megamenu .social_icon_rss {background-position: 0 -744px;} 
.megamenu .social_icon_sharethis {background-position: 0 -806px;} 
.megamenu .social_icon_skype {background-position: 0 -868px;} 
.megamenu .social_icon_stumbleupon {background-position: 0 -930px;} 
.megamenu .social_icon_tumblr {background-position: 0 -992px;} 
.megamenu .social_icon_twitter {background-position: 0 -1054px;} 
.megamenu .social_icon_vimeo {background-position: 0 -1116px;} 
.megamenu .social_icon_you_tube {background-position: 0 -1178px;} 


/* 8. Form Elements */


.megamenu .contact_form {
	display: block;
	margin: 0 0 20px 0;
}
.megamenu .contact_form label {
	font-size: 12px;
	font-family:Arial, Helvetica, sans-serif;
}
.megamenu .form_element {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	width: 90%;
	padding:6px;
	margin:12px 0 18px 0;
    -webkit-border-radius:3px;
	-moz-border-radius:3px;
    border-radius:3px;
	-webkit-transition: background-color 0.3s ease-out;
	-moz-transition: background-color 0.3s ease-out;
	-o-transition: background-color 0.3s ease-out;
	-ms-transition: background-color 0.3s ease-out;
	transition: background-color 0.3s ease-out;
}   
	.megamenu .form_element:focus {
		outline:none;
	}
.megamenu .contact_form textarea {
	width:94%;
	height:110px;
	resize:none;
}
.megamenu .contact_form .required {
	color:#C00;
}
.megamenu .contact_form .button {
	font: bold 11px Sans-Serif;
	padding: 7px 12px;
	margin:9px 12px 0 0;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: background-color 0.3s;
	-moz-transition: background-color 0.3s;
	-o-transition: background-color 0.3s;
	-ms-transition: background-color 0.3s;
	transition: background-color 0.3s;
}
.megamenu .contact_form .button:active {
	position:relative;
	top:1px;
}
.megamenu > li.megamenu_searchform {
	padding: 7px 12px 0 0;
}
.megamenu > li.megamenu_searchform input {
	font-size: 12px;
}
.megamenu > li.megamenu_searchform .megamenu_searchfield {
	margin-top: 2px;
	padding: 4px 4px 4px 6px;
	width: 202px;
	outline: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}


/* 9. Tables */


.megamenu .table_light, 
.megamenu .table_dark {
	width:100%;
	padding:0;
	margin:6px 0 18px 0;
	font-size:12px;
	border-spacing: 0px;
	border-collapse: collapse;
}
.megamenu .table_light th, 
.megamenu .table_dark th {
	text-align:left; 
	padding:12px 9px 12px 9px; 
	font-weight:bold; 
	font-size:12px;
}
	.megamenu .table_light td,
	.megamenu .table_dark td {
		padding:12px 9px 12px 9px; 
	}




/*  _______________________________________________

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




/* 1. Dark Menu Bar */


.megamenu_dark_bar {
	background: #212121;
	background: -webkit-linear-gradient(top,#333333 0%,#181818);
	background: -moz-linear-gradient(top,#333333 0%,#181818);
	background: -o-linear-gradient(top,#333333 0%,#181818);
	background: -ms-linear-gradient(top,#333333 0%,#181818);
	background: linear-gradient(top,#333333 0%,#181818);	
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.7);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.7);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.7);
}
.megamenu_dark_bar .megamenu {
	color:#FFFFFF;
}
	.megamenu_dark_bar .megamenu > li:hover, 
	.megamenu_dark_bar .megamenu > li.active {
		background: #121212;
		-webkit-box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
		-moz-box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
		box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
	}
	.megamenu_dark_bar .megamenu li.noactive {
		background:none;
		-webkit-box-shadow:none;
		-moz-box-shadow:none;
		box-shadow:none;
	}
	.megamenu_dark_bar .megamenu > li > a {
		color:#FFFFFF;
	}
	.megamenu_dark_bar .megamenu > li:hover > a {
		color:#FFFFFF;
	}
/*
traynor
If we modify the height of the menu, we need to modify the location of the right/down arrows to line up with the text.
The px value on the right seems to be the distance from the top of the menu.  So smaller is higher.
*/
	.megamenu_dark_bar .megamenu > li .megamenu_drop {
		background:url("../img/dropdown.png") no-repeat right 2px;
	}
	.megamenu_dark_bar .megamenu_vertical > li .megamenu_drop {
		background:url("../img/right.png") no-repeat right 10px;
	}
	.megamenu_dark_bar .megamenu li.megamenu_button,
	.megamenu_dark_bar .megamenu li.megamenu_button:hover {
		background:url("../img/dropdown.png") no-repeat right 12px;
	}
	.megamenu_dark_bar .megamenu li.megamenu_button_active,
	.megamenu_dark_bar .megamenu li.megamenu_button_active:hover {
		background:url("../img/dropdown-up.png") no-repeat right 12px;
	}


/* 2. Light Menu Bar */


.megamenu_light_bar {
	background: #eeeeee;
	background: -webkit-linear-gradient(top,#f8f8f8 0%,#eeeeee);
	background: -moz-linear-gradient(top,#f8f8f8 0%,#eeeeee);
	background: -o-linear-gradient(top,#f8f8f8 0%,#eeeeee);
	background: -ms-linear-gradient(top,#f8f8f8 0%,#eeeeee);
	background: linear-gradient(top,#f8f8f8 0%,#eeeeee);	
	border: 1px solid #CCCCCC;
	-webkit-box-shadow:inset 0px 0px 2px rgba(255,255,255,0.7);
	-moz-box-shadow:inset 0px 0px 2px rgba(255,255,255,0.7);
	box-shadow:inset 0px 0px 2px rgba(255,255,255,0.7);
}
.megamenu_light_bar .megamenu {
	color:#212121;
}
	.megamenu_light_bar .megamenu > li:hover, 
	.megamenu_light_bar .megamenu > li.active {
		background: #DDDDDD;
	}
	.megamenu_light_bar .megamenu li.noactive {
		background:none;
		-webkit-box-shadow:none;
		-moz-box-shadow:none;
		box-shadow:none;
	}
	.megamenu_light_bar .megamenu > li > a {
		color:#212121;
		text-shadow:1px 1px 1px #FFFFFF;
	}
	.megamenu_light_bar .megamenu > li:hover > a {
		color:#212121;
		text-shadow:1px 1px 1px #FFFFFF;
	}
/*
traynor
If we modify the height of the menu, we need to modify the location of the right/down arrows to line up with the text.
The px value on the right seems to be the distance from the top of the menu.  So smaller is higher.
*/
	.megamenu_light_bar .megamenu > li .megamenu_drop {
		background:url("../img/dropdown-b.png") no-repeat right 12px;
	}
	.megamenu_light_bar .megamenu_vertical > li .megamenu_drop {
		background:url("../img/right-b.png") no-repeat right 16px;
	}
	.megamenu_light_bar .megamenu li.megamenu_button,
	.megamenu_light_bar .megamenu li.megamenu_button:hover {
		background:url("../img/dropdown-b.png") no-repeat right 19px;
	}
	.megamenu_light_bar .megamenu li.megamenu_button_active,
	.megamenu_light_bar .megamenu li.megamenu_button_active:hover {
		background:url("../img/dropdown-b-up.png") no-repeat right 18px;
	}


/* 3. Dark Drop Down */

/*
traynor
This section modifies the colors of the dropdown section of the menu.
Change the background color from dark grey (111111) to what you need.
The foreground color might be ok as is.
If you're using the light menu motif, scroll down to the next section.
*/
.megamenu_dark .megamenu li .dropdown_container,
.megamenu_dark .megamenu li .dropdown_fullwidth,
.megamenu_dark .megamenu li .dropdown_flyout li ul {
	border:1px solid #000000;
	border-top-width: 0;
	background: #616161;
	color: #f6f6f6;
}
.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;
}
.megamenu_dark .megamenu li .dropdown_flyout li ul {
	border:1px solid #000000;
}
.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent {
	background:url("../img/right.png") no-repeat right 9px;
}
.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent:hover,
.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent.active {
	background-color:#000000;
}
.megamenu_dark .megamenu li .dropdown_flyout .dropdown_parent.noactive {
	background-color:transparent;
}
.megamenu_dark .megamenu p, 
.megamenu_dark .megamenu h1, 
.megamenu_dark .megamenu h2, 
.megamenu_dark .megamenu h3, 
.megamenu_dark .megamenu h4, 
.megamenu_dark .megamenu h5, 
.megamenu_dark .megamenu h6 {
	color: #f6f6f6;
	text-shadow: 1px 1px 1px #000000;
}
.megamenu_dark .megamenu > li > div a,
.megamenu_dark .megamenu li ul li,
.megamenu_dark .megamenu li ol li {
	color:#aaaaaa;
}
.megamenu_dark .megamenu > li > div a:hover {
	color:#dddddd;
}
.megamenu_dark .megamenu li ul li:hover,
.megamenu_dark .megamenu li ol li:hover,
.megamenu_dark .megamenu .blue, 
.megamenu_dark .megamenu .grey, 
.megamenu_dark .megamenu .orange, 
.megamenu_dark .megamenu .dark, 
.megamenu_dark .megamenu .purple {
	color:#eeeeee;
}
.megamenu_dark .megamenu .black_box {
	background: #000000;
	color:#ffffff;
}
.megamenu_dark .megamenu .grey_bg {
	background: #eeeeee;
	color: #000000;
	text-shadow:1px 1px 1px #ffffff;
}
.megamenu_dark .megamenu .form_element {
	-webkit-box-shadow: 0 1px 1px #000000;
	-moz-box-shadow: 0 1px 1px #000000;
	box-shadow: 0 1px 1px #000000;
}
.megamenu_dark .megamenu > li.megamenu_searchform:hover {
	background: none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}
.megamenu_dark .megamenu hr {
	border:none;
	border-bottom:1px solid #202020;
	border-top:1px solid #000000;
}


/* 4. Light Drop Down */


.megamenu_light .megamenu li .dropdown_container,
.megamenu_light .megamenu li .dropdown_fullwidth,
.megamenu_light .megamenu li .dropdown_flyout li ul {
	border:1px solid #CCCCCC;
	border-top-width: 0;
	background: #FAFAFA;
	color: #212121;
}
.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;
}
.megamenu_light .megamenu li .dropdown_flyout li ul {
	border:1px solid #CCCCCC;
}
.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent {
	background:url("../img/right-b.png") no-repeat right 9px;
}
.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent:hover,
.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent.active {
	background-color:#eeeeee;
}
.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent.noactive {
	background-color:transparent;
}
.megamenu_light .megamenu p, 
.megamenu_light .megamenu h1, 
.megamenu_light .megamenu h2, 
.megamenu_light .megamenu h3, 
.megamenu_light .megamenu h4, 
.megamenu_light .megamenu h5, 
.megamenu_light .megamenu h6 {
	color: #212121;
	text-shadow: 1px 1px 1px #FFFFFF;
}
.megamenu_light .megamenu > li > div a,
.megamenu_light .megamenu li ul li,
.megamenu_light .megamenu li ol li {
	color:#888888;
}
.megamenu_light .megamenu > li > div a:hover {
	color:#333333;
}
.megamenu_light .megamenu li ul li:hover,
.megamenu_light .megamenu li ol li:hover,
.megamenu_light .megamenu .blue, 
.megamenu_light .megamenu .grey, 
.megamenu_light .megamenu .orange, 
.megamenu_light .megamenu .dark, 
.megamenu_light .megamenu .purple {
	color:#444444;
}
.megamenu_light .megamenu .black_box {
	background: #212121;
	color:#ffffff;
	text-shadow:1px 1px 1px #000000;
}
.megamenu_light .megamenu .grey_bg {
	background: #eeeeee;
}
.megamenu_light .megamenu .form_element {
	-webkit-box-shadow: 0 1px 1px #efefef;
	-moz-box-shadow: 0 1px 1px #efefef;
	box-shadow: 0 1px 1px #efefef;
}
.megamenu_light .megamenu > li.megamenu_searchform:hover {
	background: none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}
.megamenu_light .megamenu hr {
	border:none;
	border-bottom:1px solid #ffffff;
	border-top:1px solid #e4e4e4;
}


/* 5. Neutral Colored Elements */


/* Form Elements */

.megamenu .form_element {
	color: #000000; 
	background-color:#fbfbfb;
	border:1px solid #dddddd;
}   
	.megamenu .form_element:hover{
		background-color:#fcfcfc;
	}
	.megamenu .form_element:focus {
		background-color:#ffffff;
	}
.megamenu .contact_form .required {
	color:#C00;
}
.megamenu .contact_form .button {
	border: 1px solid #000000;
	color: #ffffff;
	background-color: #222222;
	text-shadow: 0 1px 1px #000000;
	-webkit-box-shadow: 0 1px 1px #000000;
	-moz-box-shadow: 0 1px 1px #000000;
	box-shadow: 0 1px 1px #000000;
	background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.2));
	background-image: -moz-linear-gradient(transparent, rgba(0, 0, 0, 0.2));
	background-image: -o-linear-gradient(transparent, rgba(0, 0, 0, 0.2));
	background-image: -ms-linear-gradient(transparent, rgba(0, 0, 0, 0.2));
	background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.2));
}
.megamenu .contact_form .button:hover, 
.megamenu .contact_form .button:focus {
	color: #ffffff;
	background-color: #1A1A1A;
}
.megamenu .contact_form .button:active {
	-webkit-box-shadow: 0 0 1px #000000;
	-moz-box-shadow: 0 0 1px #000000;
	box-shadow: 0 0 1px #000000;
}
.megamenu > li.megamenu_searchform .megamenu_searchfield {
	background: #fff;
	border: solid 1px #bcbbbb;
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

/* Tables */

.megamenu .table_light {
	border:1px solid #cbcbcb;
	border-bottom:none;
}
	.megamenu .table_light th {
		color:#3A3A3A; 
		border-bottom:1px solid #cbcbcb; 
		background:#F5F5F5;
	}
	.megamenu .table_light td {
		border-bottom:1px solid #cbcbcb; 
		background:#fff; 
		color:#888;
	}

.megamenu .table_dark {
	border:1px solid #000; 
	border-bottom:none;
}
	.megamenu .table_dark th {
		color:#FFF; 
		border-bottom:1px solid #000; 
		background:#0D0D0D;
	}
	.megamenu .table_dark td {
		border-bottom:1px solid #000; 
		background:#0F0F0F; 
		color:#DDD;
	}




/*  _______________________________________________

    07 ADDITIONAL THEMES (OPTIONNAL)
    _______________________________________________  */




.megamenu_bluetheme .megamenu,
.megamenu_browntheme .megamenu,
.megamenu_cherrytheme .megamenu,
.megamenu_coffeetheme .megamenu,
.megamenu_greentheme .megamenu,
.megamenu_greytheme .megamenu,
.megamenu_oceantheme .megamenu,
.megamenu_orangetheme .megamenu,
.megamenu_pinktheme .megamenu,
.megamenu_customtheme .megamenu,
.megamenu_redtheme .megamenu,
.megamenu_tantheme .megamenu,
.megamenu_yellowtheme .megamenu {
	color:#FFFFFF;
}
	.megamenu_bluetheme .megamenu > li:hover, 
	.megamenu_bluetheme .megamenu > li.active,
	.megamenu_browntheme .megamenu > li:hover, 
	.megamenu_browntheme .megamenu > li.active,
	.megamenu_cherrytheme .megamenu > li:hover, 
	.megamenu_cherrytheme .megamenu > li.active,
	.megamenu_coffeetheme .megamenu > li:hover, 
	.megamenu_coffeetheme .megamenu > li.active,
	.megamenu_greentheme .megamenu > li:hover, 
	.megamenu_greentheme .megamenu > li.active,
	.megamenu_greytheme .megamenu > li:hover, 
	.megamenu_greytheme .megamenu > li.active,
	.megamenu_oceantheme .megamenu > li:hover, 
	.megamenu_oceantheme .megamenu > li.active,
	.megamenu_orangetheme .megamenu > li:hover, 
	.megamenu_orangetheme .megamenu > li.active,
	.megamenu_pinktheme .megamenu > li:hover, 
	.megamenu_pinktheme .megamenu > li.active,
	.megamenu_customtheme .megamenu > li:hover, 
	.megamenu_customtheme .megamenu > li.active,
	.megamenu_redtheme .megamenu > li:hover, 
	.megamenu_redtheme .megamenu > li.active,
	.megamenu_tantheme .megamenu > li:hover, 
	.megamenu_tantheme .megamenu > li.active,
	.megamenu_yellowtheme .megamenu > li:hover, 
	.megamenu_yellowtheme .megamenu > li.active {
		background: #121212;
		-webkit-box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
		-moz-box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
		box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
	}
	.megamenu_bluetheme .megamenu > li > a,
	.megamenu_browntheme .megamenu > li > a,
	.megamenu_cherrytheme .megamenu > li > a,
	.megamenu_coffeetheme .megamenu > li > a,
	.megamenu_greentheme .megamenu > li > a,
	.megamenu_greytheme .megamenu > li > a,
	.megamenu_oceantheme .megamenu > li > a,
	.megamenu_orangetheme .megamenu > li > a,
	.megamenu_pinktheme .megamenu > li > a,
	.megamenu_customtheme .megamenu > li > a,
	.megamenu_redtheme .megamenu > li > a,
	.megamenu_tantheme .megamenu > li > a,
	.megamenu_yellowtheme .megamenu > li > a {
		color:#FFFFFF;
	}
	.megamenu_bluetheme .megamenu > li:hover > a,
	.megamenu_browntheme .megamenu > li:hover > a,
	.megamenu_cherrytheme .megamenu > li:hover > a,
	.megamenu_coffeetheme .megamenu > li:hover > a,
	.megamenu_greentheme .megamenu > li:hover > a,
	.megamenu_greytheme .megamenu > li:hover > a,
	.megamenu_oceantheme .megamenu > li:hover > a,
	.megamenu_orangetheme .megamenu > li:hover > a,
	.megamenu_pinktheme .megamenu > li:hover > a,
	.megamenu_customtheme .megamenu > li:hover > a,
	.megamenu_redtheme .megamenu > li:hover > a,
	.megamenu_tantheme .megamenu > li:hover > a,
	.megamenu_yellowtheme .megamenu > li:hover > a {
		color:#FFFFFF;
	}
	.megamenu_bluetheme .megamenu > li .megamenu_drop,
	.megamenu_browntheme .megamenu > li .megamenu_drop,
	.megamenu_cherrytheme .megamenu > li .megamenu_drop,
	.megamenu_coffeetheme .megamenu > li .megamenu_drop,
	.megamenu_greentheme .megamenu > li .megamenu_drop,
	.megamenu_greytheme .megamenu > li .megamenu_drop,
	.megamenu_oceantheme .megamenu > li .megamenu_drop,
	.megamenu_orangetheme .megamenu > li .megamenu_drop,
	.megamenu_pinktheme .megamenu > li .megamenu_drop,
	.megamenu_customtheme .megamenu > li .megamenu_drop,
	.megamenu_redtheme .megamenu > li .megamenu_drop,
	.megamenu_tantheme .megamenu > li .megamenu_drop,
	.megamenu_yellowtheme .megamenu > li .megamenu_drop {
		background:url("../img/dropdown.png") no-repeat right 10px;
	}
	.megamenu_bluetheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_browntheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_cherrytheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_coffeetheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_greentheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_greytheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_oceantheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_orangetheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_pinktheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_customtheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_redtheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_tantheme .megamenu_vertical > li .megamenu_drop,
	.megamenu_yellowtheme .megamenu_vertical > li .megamenu_drop {
		background:url("../img/right.png") no-repeat right 16px;
	}

/*
traynor
This was originally purpletheme.  Make all changes in this theme.
In the gradient area, change all 5 lines.  The lower darker color is on the left, the lighter on the right.
The text colors are just below.
*/

/* 0. Custom */


.megamenu_customtheme {
	background: none;
/*	background: -webkit-linear-gradient(top,#01589C 0%,#01355D);
	background: -moz-linear-gradient(top,#01589C 0%,#01355D);
	background: -o-linear-gradient(top,#01589C 0%,#01355D);
	background: -ms-linear-gradient(top,#01589C 0%,#01355D);
	background: linear-gradient(top,#01589C 0%,#01355D);
	background-image: url("../images/trans-black-80.png"); /* traynor - added this for MSIE, which can't handle css gradients */
*/
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_customtheme .megamenu > li > div a,
.megamenu_customtheme .megamenu li ul li,
.megamenu_customtheme .megamenu li ol li {
	color:#fff;
}
.megamenu_customtheme .megamenu > li > div a:hover,
.megamenu_customtheme .megamenu li ul li:hover,
.megamenu_customtheme .megamenu li ol li:hover {
	color:#ff0;
}


/* 1. Blue */


.megamenu_bluetheme {
	background: #536987;
	background: -webkit-linear-gradient(top,#526886 0%,#4A5E79);
	background: -moz-linear-gradient(top,#526886 0%,#4A5E79);
	background: -o-linear-gradient(top,#526886 0%,#4A5E79);
	background: -ms-linear-gradient(top,#526886 0%,#4A5E79);
	background: linear-gradient(top,#526886 0%,#4A5E79);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_bluetheme .megamenu > li > div a,
.megamenu_bluetheme .megamenu li ul li,
.megamenu_bluetheme .megamenu li ol li {
	color:#6a82a3;
}
.megamenu_bluetheme .megamenu > li > div a:hover,
.megamenu_bluetheme .megamenu li ul li:hover,
.megamenu_bluetheme .megamenu li ol li:hover {
	color:#536987;
}


/* 2. Brown */


.megamenu_browntheme {
	background: #866e56;
	background: -webkit-linear-gradient(top,#866E56 0%,#78624D);
	background: -moz-linear-gradient(top,#866E56 0%,#78624D);
	background: -o-linear-gradient(top,#866E56 0%,#78624D);
	background: -ms-linear-gradient(top,#866E56 0%,#78624D);
	background: linear-gradient(top,#866E56 0%,#78624D);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_browntheme .megamenu > li > div a,
.megamenu_browntheme .megamenu li ul li,
.megamenu_browntheme .megamenu li ol li {
	color:#a1886e;
}
.megamenu_browntheme .megamenu > li > div a:hover,
.megamenu_browntheme .megamenu li ul li:hover,
.megamenu_browntheme .megamenu li ol li:hover {
	color:#866e56;
}


/* 3. Cherry */


.megamenu_cherrytheme {
	background: #ab2d5c;
	background: -webkit-linear-gradient(top,#AB2D5C 0%,#992852);
	background: -moz-linear-gradient(top,#AB2D5C 0%,#992852);
	background: -o-linear-gradient(top,#AB2D5C 0%,#992852);
	background: -ms-linear-gradient(top,#AB2D5C 0%,#992852);
	background: linear-gradient(top,#AB2D5C 0%,#992852);	
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_cherrytheme .megamenu > li > div a,
.megamenu_cherrytheme .megamenu li ul li,
.megamenu_cherrytheme .megamenu li ol li {
	color:#cc3f73;
}
.megamenu_cherrytheme .megamenu > li > div a:hover,
.megamenu_cherrytheme .megamenu li ul li:hover,
.megamenu_cherrytheme .megamenu li ol li:hover {
	color:#ab2d5c;
}


/* 4. Coffee */


.megamenu_coffeetheme {
	background: #7b675c;
	background: -webkit-linear-gradient(top,#7B675C 0%,#6E5C52);
	background: -moz-linear-gradient(top,#7B675C 0%,#6E5C52);
	background: -o-linear-gradient(top,#7B675C 0%,#6E5C52);
	background: -ms-linear-gradient(top,#7B675C 0%,#6E5C52);
	background: linear-gradient(top,#7B675C 0%,#6E5C52);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_coffeetheme .megamenu > li > div a,
.megamenu_coffeetheme .megamenu li ul li,
.megamenu_coffeetheme .megamenu li ol li {
	color:#978073;
}
.megamenu_coffeetheme .megamenu > li > div a:hover,
.megamenu_coffeetheme .megamenu li ul li:hover,
.megamenu_coffeetheme .megamenu li ol li:hover {
	color:#7b675c;
}


/* 5. Green */


.megamenu_greentheme {
	background: #788951;
	background: -webkit-linear-gradient(top,#788951 0%,#6B7B48);
	background: -moz-linear-gradient(top,#788951 0%,#6B7B48);
	background: -o-linear-gradient(top,#788951 0%,#6B7B48);
	background: -ms-linear-gradient(top,#788951 0%,#6B7B48);
	background: linear-gradient(top,#788951 0%,#6B7B48);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_greentheme .megamenu > li > div a,
.megamenu_greentheme .megamenu li ul li,
.megamenu_greentheme .megamenu li ol li {
	color:#93a568;
}
.megamenu_greentheme .megamenu > li > div a:hover,
.megamenu_greentheme .megamenu li ul li:hover,
.megamenu_greentheme .megamenu li ol li:hover {
	color:#788951;
}


/* 6. Grey */


.megamenu_greytheme {
	background: #6a6a6a;
	background: -webkit-linear-gradient(top,#6A6A6A 0%,#5F5F5F);
	background: -moz-linear-gradient(top,#6A6A6A 0%,#5F5F5F);
	background: -o-linear-gradient(top,#6A6A6A 0%,#5F5F5F);
	background: -ms-linear-gradient(top,#6A6A6A 0%,#5F5F5F);
	background: linear-gradient(top,#6A6A6A 0%,#5F5F5F);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_greytheme .megamenu > li > div a,
.megamenu_greytheme .megamenu li ul li,
.megamenu_greytheme .megamenu li ol li {
	color:#8c8c8c;
}
.megamenu_greytheme .megamenu > li > div a:hover,
.megamenu_greytheme .megamenu li ul li:hover,
.megamenu_greytheme .megamenu li ol li:hover {
	color:#6a6a6a;
}


/* 7. Ocean */


.megamenu_oceantheme {
	background: #528a8f;
	background: -webkit-linear-gradient(top,#528A8F 0%,#497B80);
	background: -moz-linear-gradient(top,#528A8F 0%,#497B80);
	background: -o-linear-gradient(top,#528A8F 0%,#497B80);
	background: -ms-linear-gradient(top,#528A8F 0%,#497B80);
	background: linear-gradient(top,#528A8F 0%,#497B80);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_oceantheme .megamenu > li > div a,
.megamenu_oceantheme .megamenu li ul li,
.megamenu_oceantheme .megamenu li ol li {
	color:#6aa5aa;
}
.megamenu_oceantheme .megamenu > li > div a:hover,
.megamenu_oceantheme .megamenu li ul li:hover,
.megamenu_oceantheme .megamenu li ol li:hover {
	color:#528a8f;
}


/* 8. Orange */


.megamenu_orangetheme {
	background: #e34f00;
	background: -webkit-linear-gradient(top,#E34F00 0%,#CB4600);
	background: -moz-linear-gradient(top,#E34F00 0%,#CB4600);
	background: -o-linear-gradient(top,#E34F00 0%,#CB4600);
	background: -ms-linear-gradient(top,#E34F00 0%,#CB4600);
	background: linear-gradient(top,#E34F00 0%,#CB4600);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_orangetheme .megamenu > li > div a,
.megamenu_orangetheme .megamenu li ul li,
.megamenu_orangetheme .megamenu li ol li {
	color:#ff6717;
}
.megamenu_orangetheme .megamenu > li > div a:hover,
.megamenu_orangetheme .megamenu li ul li:hover,
.megamenu_orangetheme .megamenu li ol li:hover {
	color:#e34f00;
}


/* 9. Pink */


.megamenu_pinktheme {
	background: #d50065;
	background: -webkit-linear-gradient(top,#D50065 0%,#BF005A);
	background: -moz-linear-gradient(top,#D50065 0%,#BF005A);
	background: -o-linear-gradient(top,#D50065 0%,#BF005A);
	background: -ms-linear-gradient(top,#D50065 0%,#BF005A);
	background: linear-gradient(top,#D50065 0%,#BF005A);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_pinktheme .megamenu > li > div a,
.megamenu_pinktheme .megamenu li ul li,
.megamenu_pinktheme .megamenu li ol li {
	color:#ff097d;
}
.megamenu_pinktheme .megamenu > li > div a:hover,
.megamenu_pinktheme .megamenu li ul li:hover,
.megamenu_pinktheme .megamenu li ol li:hover {
	color:#d50065;
}


/* 11. Red */


.megamenu_redtheme {
	background: #b82323;
	background: -webkit-linear-gradient(top,#B82323 0%,#A51F1F);
	background: -moz-linear-gradient(top,#B82323 0%,#A51F1F);
	background: -o-linear-gradient(top,#B82323 0%,#A51F1F);
	background: -ms-linear-gradient(top,#B82323 0%,#A51F1F);
	background: linear-gradient(top,#B82323 0%,#A51F1F);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_redtheme .megamenu > li > div a,
.megamenu_redtheme .megamenu li ul li,
.megamenu_redtheme .megamenu li ol li {
	color:#d83636;
}
.megamenu_redtheme .megamenu > li > div a:hover,
.megamenu_redtheme .megamenu li ul li:hover,
.megamenu_redtheme .megamenu li ol li:hover {
	color:#b82323;
}


/* 12. Tan */


.megamenu_tantheme {
	background: #837361;
	background: -webkit-linear-gradient(top,#837361 0%,#756757);
	background: -moz-linear-gradient(top,#837361 0%,#756757);
	background: -o-linear-gradient(top,#837361 0%,#756757);
	background: -ms-linear-gradient(top,#837361 0%,#756757);
	background: linear-gradient(top,#837361 0%,#756757);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_tantheme .megamenu > li > div a,
.megamenu_tantheme .megamenu li ul li,
.megamenu_tantheme .megamenu li ol li {
	color:#9c8c7b;
}
.megamenu_tantheme .megamenu > li > div a:hover,
.megamenu_tantheme .megamenu li ul li:hover,
.megamenu_tantheme .megamenu li ol li:hover {
	color:#837361;
}


/* 13. Yellow */


.megamenu_yellowtheme {
	background: #caa616;
	background: -webkit-linear-gradient(top,#CAA616 0%,#B59513);
	background: -moz-linear-gradient(top,#CAA616 0%,#B59513);
	background: -o-linear-gradient(top,#CAA616 0%,#B59513);
	background: -ms-linear-gradient(top,#CAA616 0%,#B59513);
	background: linear-gradient(top,#CAA616 0%,#B59513);
	border: 1px solid #222222;
	-webkit-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	-moz-box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
	box-shadow:inset 0px 0px 2px rgba(40,40,40,0.4);
}
.megamenu_yellowtheme .megamenu > li > div a,
.megamenu_yellowtheme .megamenu li ul li,
.megamenu_yellowtheme .megamenu li ol li {
	color:#e8c22c;
}
.megamenu_yellowtheme .megamenu > li > div a:hover,
.megamenu_yellowtheme .megamenu li ul li:hover,
.megamenu_yellowtheme .megamenu li ol li:hover {
	color:#caa616;
}




/*  _______________________________________________

    08 VERTICAL MEGA MENU 
    _______________________________________________  */




.megamenu_container_vertical {
	float:left;
	width: 200px;
	position: absolute;
	top:90px; /* This is the value of whatever is above the menu.  So we start it from here. */
	left:0px;
	background-image: url(../images/trans-black-80.png);
}
	.megamenu_container_vertical .megamenu {
		margin:0;
		float: left;
	}
	.megamenu_container_vertical .megamenu > li {
		margin:0;
		width:200px;
		float: left;
		clear: left;
	}
		.megamenu_container_vertical .megamenu li .megamenu_drop {
			padding-right:30px;
		}
		.megamenu_container_vertical .megamenu li.right {
			float:left;
			margin-right:auto;
		}
		.megamenu_container_vertical .megamenu li.right a {
			margin-right:auto;
		}
.megamenu_container_vertical .megamenu li .dropvertical_container {
	width: 820px; /* 960px minus menu width */
	margin: 0;
	position: relative;
	float: left;
}
.megamenu_container_vertical .megamenu li .dropdown_container,
.megamenu_container_vertical .megamenu li .dropdown_fullwidth {
	margin:-45px auto 0 141px;
	top:auto;
}
.megamenu_container_vertical .megamenu li .dropdown_first {
	margin:-46px auto 0 141px;
}
.megamenu_container_vertical .megamenu li .dropdown_right {
	right:auto;
}
.megamenu_container_vertical .megamenu li:hover .dropdown_right {
	left:auto;
	right:auto;
}




/*  _______________________________________________

    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 {
		height: auto;
	}
	.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;
	}
		.megamenu_container .megamenu > li > a {
			padding: 16px 10px 16px 10px;
		}
		.megamenu_container .megamenu li.right a {
			margin-right:0;
		}

	 .megamenu_container .megamenu li:hover .dropdown_container,
	 .megamenu_container .megamenu li:hover .dropdown_fullwidth,
	 .megamenu_container .megamenu li:hover .dropdown_right {
		top:auto;
		left:-1px;
	}
  	.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/dropdown.png") no-repeat right 9px;
	}
	.megamenu_light .megamenu li .dropdown_flyout .dropdown_parent {
		background:url("../img/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/dropdown.png") no-repeat right 9px;
	}
	.megamenu_light .megamenu_vertical li .dropdown_flyout .dropdown_parent {
		background:url("../img/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/dropdown-b.png") no-repeat right center;
	}
	.megamenu_dark_bar .megamenu_vertical li .megamenu_drop {
		background:url("../img/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;
	}
	.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;
	}

}