/**
 * @version		$Id$
 * @author		JoomlaUX!
 * @package		Joomla.Site
 * @subpackage	mod_jux_megamenu
 * @copyright	Copyright (C) 2008 - 2013 by JoomlaUX. All rights reserved.
 * @license		http://www.gnu.org/licenses/gpl.html GNU/GPL version 3
*/

#js-mainnav.megamenu.red {
/*	background: #9B1200 url('../../images/grad1-mask.png') repeat-x top; /* you can change/delete the transparent gradient image or the background color */
background:transparent;
}

#js-mainnav.megamenu.megamenu.horizontal.red ul.level0 li:hover,
#js-mainnav.megamenu.megamenu.horizontal.red ul.level0 li.active,
#js-mainnav.megamenu.megamenu.horizontal.red ul.level0 li.over,
#js-mainnav.megamenu.megamenu.horizontal.red ul.level0 li.haschild-over { 
/*    background: url('../../images/grad1-mask.png') repeat-x top; /* you can change/remove the transparent gradient or the color */
background:#C62110;
}

#js-mainnav.megamenu.red #js-megaMenuToggle {
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}

/* lv - 0
-----------------------------------*/
/* Styling ---*/

#js-mainnav.megamenu.red ul.level0 li.mega span.mega,
#js-mainnav.megamenu.red ul.level0 li.mega a.mega,
#js-mainnav.megamenu.red .megaMenuToggle {
	border-left: 1px solid #fff;
	color: #fff;
}

#js-mainnav.megamenu.red ul.level0 li:hover,
#js-mainnav.megamenu.red ul.level0 li.active,
#js-mainnav.megamenu.red ul.level0 li.over,
#js-mainnav.megamenu.red ul.level0 li.haschild-over {
	background-color: #FC2100;
}

/* Layout ---*/
#js-mainnav.megamenu.red ul.level1 li.mega {
	border-top: 1px #000;
}

#js-mainnav.megamenu.red ul.level1 li.first {
	border-top: 0;
}

#js-mainnav.megamenu.red ul.level1 li.mega span.mega,
#js-mainnav.megamenu.red ul.level1 li.mega a.mega {
	border: 0;
}

#js-mainnav.megamenu.red ul.level1 li:hover,
#js-mainnav.megamenu.red ul.level1 li.over, 
#js-mainnav.megamenu.red ul.level1 li.haschild-over { background: rgb(223, 0, 36); }

#js-mainnav.megamenu.red ul.level1 li.haschild,
#js-mainnav.megamenu.red ul.level1 li.haschild-over {
	background-image: url(../../images/arrow.png);
	background-repeat: no-repeat;
	background-position: 95% center;
}

 /* CHILD CONTENT
-----------------------------------*/
#js-mainnav.megamenu.red .childcontent-inner {
	background-color: transparent; /*change here the color to match the new color you have set for mainnav */
	/*border: 0 none; */
	color: #000; /* after changing code above, you might want to change this color to make the text color readable  */ 
display:table-cell;
vertical-align:middle;
}

#js-mainnav.megamenu.red .childcontent-inner .group ul li.active {
	background-color: #9B1200 !important;
}

#js-mainnav.megamenu.red .childcontent .group h3 {
	background: none;
	color: #fff;
	border-bottom: 1px dotted #D81900;
}

#js-mainnav.megamenu.red .childcontent .js-moduletable a {
	border-bottom: 1px dotted #ccc;
}

#js-mainnav.megamenu.red .childcontent .moduletable {	
color: #000;
margin-top:13px;
padding:10px 15px 5px 10px;
border-right: 1px solid #000; 
background-image: -ms-linear-gradient(left, #FFFFFF 0%, #f7f7f7 50%);
background-image: -moz-linear-gradient(left, #FFFFFF 0%, #f7f7f7 50%);
background-image: -o-linear-gradient(left, #FFFFFF 0%, #f7f7f7 50%);
background-image: -webkit-gradient(linear, left, right, color-stop(0, #FFFFFF), color-stop(1, #f7f7f7));
background-image: -webkit-linear-gradient(left, #FFFFFF 0%,  #f7f7f7 50%);
background-image: linear-gradient(to right, #FFFFFF 0%,  #f7f7f7 50%);
min-height:120px;
-moz-box-shadow: 4px 4px 4px black;
-webkit-box-shadow: 4px 4px 4px black;
box-shadow: 4px 4px 4px black;
 }
#js-mainnav.megamenu.red .childcontent .moduletable:hover {	
color: #fff;
margin-top:13px;
padding:10px 15px 5px 10px;
border-right: 1px solid #000; 
background-image: -ms-linear-gradient(left, #C62110 0%, #DF0024 50%);
background-image: -moz-linear-gradient(left, #C62110 0%, #DF0024 50%);
background-image: -o-linear-gradient(left, #C62110 0%, #DF0024 50%);
background-image: -webkit-gradient(linear, left, right, color-stop(0, #C62110), color-stop(1, #DF0024));
background-image: -webkit-linear-gradient(left, #C62110 0%,  #DF0024 50%);
background-image: linear-gradient(to right, #C62110 0%,  #DF0024 50%);
min-height:120px;
 } 
#js-mainnav.megamenu ul.level1 li.mega span.mega,
#js-mainnav.megamenu ul.level1 li.mega a.mega {
color: #000;
padding:5px 10px 5px 5px;
border-right: 1px solid #000;
border-bottom: 1px solid #000; 
background-image: -ms-linear-gradient(left, #FFFFFF 0%, #f7f7f7 50%);
background-image: -moz-linear-gradient(left, #FFFFFF 0%, #f7f7f7 50%);
background-image: -o-linear-gradient(left, #FFFFFF 0%, #f7f7f7 50%);
background-image: -webkit-gradient(linear, left, right, color-stop(0, #FFFFFF), color-stop(1, #f7f7f7));
background-image: -webkit-linear-gradient(left, #FFFFFF 0%,  #f7f7f7 50%);
background-image: linear-gradient(to right, #FFFFFF 0%,  #f7f7f7 50%);
min-height:40px;
-moz-box-shadow: 4px 4px 4px black;
-webkit-box-shadow: 4px 4px 4px black;
box-shadow: 4px 4px 4px black;
 }
#js-mainnav.megamenu ul.level1 li.mega span.mega,
#js-mainnav.megamenu ul.level1 li.mega a.mega:hover {
color: #fff;
padding:5px 10px 5px 5px;
border-right: 1px solid #000; 
background-image: -ms-linear-gradient(left, #C62110 0%, #DF0024 50%);
background-image: -moz-linear-gradient(left, #C62110 0%, #DF0024 50%);
background-image: -o-linear-gradient(left, #C62110 0%, #DF0024 50%);
background-image: -webkit-gradient(linear, left, right, color-stop(0, #C62110), color-stop(1, #DF0024));
background-image: -webkit-linear-gradient(left, #C62110 0%,  #DF0024 50%);
background-image: linear-gradient(to right, #C62110 0%,  #DF0024 50%);
min-height:40px;
-moz-box-shadow: 4px 4px 4px black;
-webkit-box-shadow: 4px 4px 4px black;
box-shadow: 4px 4px 4px black;
}
#js-mainnav.megamenu ul.level1 li.mega span.menu-title:hover {
    display: block;
    color: #fff;
    text-align: center;
    margin-top: 10px;
} 

#js-mainnav.megamenu.red .childcontent .js-moduletable a:hover,
#js-mainnav.megamenu.red .childcontent .js-moduletable a:focus,
#js-mainnav.megamenu.red .childcontent .js-moduletable a:active {
	color: #fff;
	border-bottom: 1px solid #fff;
}

/* Grouped --- */
#js-mainnav.megamenu.red .group-title {
	border-bottom: 0px solid #D01B00;
}

#js-mainnav.megamenu.red .group-title .menu-title {
	color: #fff;
}

#js-mainnav.megamenu.red .group-title .menu-desc {
	color: #999;
}

/* Left alignment */
#js-mainnav.megamenu.red ul.level0 li.mega.submenu-align-left > .childcontent {
	margin-left: 1px!important;
}
#js-mainnav.megamenu.red .childcontent .moduletable .menuproduct {
height:auto;
padding:10px 15px 10px 10px;
text-align:center;
}