/*
$JA#COPYRIGHT$
*/

/* COMMON STYLES
-----------------------------------------------------------*/
#ja-toolbar { width: 100%; clear: both; visibility: hidden;}
#ja-toolbar .wrap { width: 100%; clear: both; }
#ja-toolbar .inner { padding-left: 15px; padding-right: 15px; }

#ja-toolbar a { outline: 0; }
#ja-toolbar.compact { background: none; height: 0; }

/* TOOLBAR STYLES
-----------------------------------------------------------*/
/* Normal size ---*/
#ja-toolbar {
	color: #333;
	display: block;
	font: normal 12px/normal Arial, sans-serif;
	position: fixed !important;
	width: 100%;
	z-index: 9998;
}

#ja-toolbar-main {
	margin-left: 145px;
	display: block;
}

#ja-toolbar a.ja-toolbar-logo {
	display: block;
	width: 138px;
	height: 30px;
	position: absolute;
	left: 15px;
	top: 8px;
	background: url(../images/logo-joomlart.png) no-repeat center;
}

.hasdesc a.ja-toolbar-logo { bottom: 13px !important; }

#ja-toolbar .ja-toolbar-deco { display: none; }

/* Compact size ---*/
#ja-toolbar-compact {}

/* Dim Background ---*/
#ja-toolbar-background {
	background: #444;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9995;/*must less than z-index of toolbar*/
	display: none;
}

/* Toggle Button ---*/
.ja-toolbar-toggle-btn {
	display: block;
	height: 30px;
	width: 30px;
	position: absolute;
	right: 10px;
	bottom: 1px;
	background: none;
}

.hasdesc .ja-toolbar-toggle-btn {
	bottom: 6px; 
}

.compact .ja-toolbar-toggle-btn {
	background: url(../images/toolbar-c-bg.png) no-repeat top;
	margin-right: 10px;
}

a.ja-toolbar-btn {
	background-image: url(../images/btn-toggle.png);
	background-repeat: no-repeat;
	display: block;
	height: 18px;
	width: 18px;
	margin: 8px 0 0 6px;
}

a.ja-toolbar-btn { background-position: left top; }
a.ja-toolbar-btn:hover { background-position: left bottom; }

.compact a.ja-toolbar-btn { background-position: right top; }
.compact a.ja-toolbar-btn:hover { background-position: right bottom; }

/* MENU STYLES
-----------------------------------------------------------*/
.ja-toolbar { margin: 0; padding: 0; }

.ja-toolbar a.over, .ja-toolbar a.active {
	color: #333;
}

.ja-toolbar .childcontent a.over, .ja-toolbar .childcontent a.active {
	color: #fff !important;
}

ul.megatoolbar { margin: 5px; padding: 5px; /* menu's gutter */ }
 
/* lv - 0
-----------------------------------*/
/* Styling ---*/
#ja-toolbar ul.level0 {
	border-left: 1px solid #999;
	border-right: 1px solid #ddd;
	float: left;
	margin: 0;
	padding: 0;
}

#ja-toolbar ul.level0 li.mega {
	background: none;
	display: block;
	float: left;
	list-style: none;
	margin: 0;
	padding: 0;
}

#ja-toolbar ul.level0 li.mega a.mega {
	border-left: 1px solid #ddd;
	border-right: 1px solid #999;
	color: #333;
	display: block;
	font-weight: bold;
	margin: 0;
	padding: 6px 15px 5px;
	text-decoration: none;
	text-shadow: 1px 1px 1px #f2f2f2;
}

#ja-toolbar ul.level0 li.mega .has-image {
	background-position: left top;
	background-repeat: no-repeat;
	display: block;
	overflow: hidden;
	padding-left: 25px;
}

#ja-toolbar ul.level0 li.mega span.menu-title { display: block; line-height: 1.4;}

#ja-toolbar ul.level0 li.mega span.menu-desc { color: #333; font-size: 92%; font-weight: normal; }

#ja-toolbar ul.level1 li.mega span.menu-desc { color: #999; }

#ja-toolbar ul.level0 li.mega a img { float: left; padding-right: 5px; }

#ja-toolbar ul.level0 li.over, #ja-toolbar ul.level0 li.haschild-over {
	background: url(../images/bottom/grad1.png) repeat-x top #8b898a;
}

#ja-toolbar ul.level0 li.haschild a.mega span.menu-title,
#ja-toolbar ul.level0 li.haschild-over a.mega span.menu-title {
	background: url(../images/bottom/arrow-haschild.png) no-repeat left 60%;
	padding-left: 12px;
}

#ja-toolbar ul.level0 li.haschild a.mega span.menu-desc,
#ja-toolbar ul.level0 li.haschild-over a.mega span.menu-desc { padding-left: 12px; }

#ja-toolbar ul.level0 li.active { background: url(../images/bottom/grad1.png) repeat-x top #8b898a; }

/* lv - 1 and below
-----------------------------------*/
/* Layout ---*/
.ja-toolbar li.mega .childcontent { display: block; height: auto; position: absolute; }

.ja-toolbar li.mega .childcontent,
.ja-toolbar li.haschild-over li.mega .childcontent,
.ja-toolbar li.mega li.haschild-over li.mega .childcontent ,
.ja-toolbar li.mega li.mega li.haschild-over li.mega .childcontent, 
.ja-toolbar li.mega li.mega li.mega li.haschild-over li.mega .childcontent, 
.ja-toolbar li.mega li.mega li.mega li.mega li.haschild-over li.mega .childcontent { left: -999em; /*hide the menu*/ }

.ja-toolbar li.haschild-over .childcontent,
.ja-toolbar li.mega li.haschild-over .childcontent,
.ja-toolbar li.mega li.mega li.haschild-over .childcontent,
.ja-toolbar li.mega li.mega li.mega li.haschild-over .childcontent,
.ja-toolbar li.mega li.mega li.mega li.mega li.haschild-over .childcontent,
.ja-toolbar li.mega li.mega li.mega li.mega li.mega li.haschild-over .childcontent { left: auto; /*show on parent:hover*/ }

.ja-toolbar li.mega .right,
.ja-toolbar li.haschild-over li.mega .right,
.ja-toolbar li.mega li.haschild-over li.mega .right ,
.ja-toolbar li.mega li.mega li.haschild-over li.mega .right, 
.ja-toolbar li.mega li.mega li.mega li.haschild-over li.mega .right, 
.ja-toolbar li.mega li.mega li.mega li.mega li.haschild-over li.mega .right { right: auto; /*hide the menu*/ }

.ja-toolbar li.haschild-over .right { right: 0; /*show on parent:hover*/ }

.ja-toolbar li.mega li.haschild-over .right,
.ja-toolbar li.mega li.mega li.haschild-over .right,
.ja-toolbar li.mega li.mega li.mega li.haschild-over .right,
.ja-toolbar li.mega li.mega li.mega li.mega li.haschild-over .right,
.ja-toolbar li.mega li.mega li.mega li.mega li.mega li.haschild-over .right { right: 12em; /*show on parent:hover*/ }

#ja-toolbar ul.level1 li.mega { float: none; }

 /* Columns ---*/
#ja-toolbar .megacol { float: left; }

#ja-toolbar ul.level1 li.mega { border-top: 1px solid #ddd; }

#ja-toolbar ul.level1 li.first { border-top: 0; }

#ja-toolbar ul.level1 li.mega a.mega {
	background: none;
	border: 0;
	color: #333;
	font-weight: normal;
	padding: 6px 5px;
	text-transform: capitalize;
	font-weight: bold;
}

#ja-toolbar ul.level1 li.mega a.mega span.menu-title { background: none !important; padding: 0; }

#ja-toolbar ul.level1 li.haschild { background: url(../images/arrow.png) no-repeat 95% center; padding: 0; }

#ja-toolbar ul.level1 li.over, #ja-toolbar ul.level1 li.haschild-over {
	background: url(../images/grad2.png) repeat-x top #1f86ab !important;
}

#ja-toolbar ul.level1 li.group { background: none; }

 /* CHILD CONTENT
-----------------------------------*/
#ja-toolbar .childcontent {
	color: #333;
	z-index: 999;
	margin-left: -4px;
	max-height: 500px;
	background: none;
	border: none;
	display: block;
}

#ja-toolbar .level1 .childcontent {
	padding-left: 0;
	padding-right: 0;
 	margin: -2em 0pt 0pt 89px;
 	border: none;
}
#ja-toolbar .childcontent-inner-wrap {
	padding-left: 10px;
	padding-right: 10px;
	position: relative; 
	width: 100%;
}
#ja-toolbar .level1 .childcontent-inner-l, #ja-toolbar .level1 .childcontent-inner-r {
	display: none;
}

#ja-toolbar .level1 .childcontent-inner {
	background: #fff;
	padding-top: 0;
	padding-bottom: 0;
	border: 1px solid #666;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px; 
	-webkit-box-shadow: 0 3px 8px #666;
 	-moz-box-shadow: 0 3px 8px #666;
}

#ja-toolbar .childcontent ul * { text-shadow: none; }
#ja-toolbar .childcontent-inner-l, #ja-toolbar .childcontent-inner-r {
	width: 10px;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	background-image: url(../images/childcontent-bg.png);
	background-repeat: no-repeat;
}

#ja-toolbar .childcontent-inner { 
	background-image: url(../images/childcontent-bg-m.png);
	background-repeat: repeat-x;
}

#ja-toolbar .childcontent .ja-moduletable {
	border-bottom: 0;
	color: #333;
	line-height: 1.5;
	margin: 0;
	padding: 10px 0;
}

#ja-toolbar .childcontent .ja-moduletable h3 {
	background: none;
	border-bottom: 1px solid #ccc;
	color: #333;
	margin-left: 5px;
	margin-right: 5px;
	text-indent: 5px;
	text-transform: none;
}

#ja-toolbar .childcontent .ja-moduletable .ja-box-ct { padding: 5px; }

#ja-toolbar .childcontent .ja-moduletable a {}

#ja-toolbar .childcontent .ja-moduletable a:hover,
#ja-toolbar .childcontent .ja-moduletable a:focus,
#ja-toolbar .childcontent .ja-moduletable a:active {}

#ja-toolbar .childcontent .ja-moduletable img {
	margin: 5px 0;
	text-align: center;
}

#ja-toolbar .childcontent .ja-moduletable ul:first-child { margin-top: 0 !important; }

#ja-toolbar .childcontent .ja-moduletable li {
	background: url(../images/bullet.gif) no-repeat 2px 7px !important;
	margin-bottom: 5px;
}

/* Grouped --- */
#ja-toolbar .group { }

#ja-toolbar .group-title { border-bottom: 3px solid #ccc; overflow: hidden; }

#ja-toolbar .group-title a { padding-top: 0 !important; }

#ja-toolbar .group-title .menu-title {
	color: #333;
	font-size: 115%;
	font-weight: bold;
	text-transform: uppercase;
}

#ja-toolbar .group-title .menu-desc { color: #666; padding-left: 0 !important; }

#ja-toolbar .group-content .ja-moduletable,
#ja-toolbar .group-content ul.megatoolbar {
	margin: 0; /* Group-content's gutter*/
}

/* reset --- */
#ja-toolbar .childcontent ul.megatoolbar .ja-moduletable { padding: 0; }

#ja-toolbar .childcontent ul.megatoolbar .ja-moduletable h3 { margin-left: 0; margin-right: 0; }

/* OTHERS 
------------------------------------------------*/
/* Tooltips Style 1 ----*/
.ja-toolbar-thumb-tip {
	z-index: 9999;
	float: left;
	background: url(../images/tip-thumb.png) no-repeat;
	color: #fff;
	width: 240px;
	height: 200px;
	font: normal 12px/normal Arial, sans-serif;
}

.ja-toolbar-thumb-tip div {
	padding: 15px 15px 0;
}

.ja-toolbar-thumb-tip div div {
	padding: 0;
}

.ja-toolbar-thumb-title {
	padding: 0;
	margin: 0;
	font-size: 100%;
	text-transform: uppercase;
	font-weight: bold;
}

.ja-toolbar-thumb-text {
	font-size: 100%;
	margin: 0;
}

.ja-toolbar-thumb-text img {
	border: 1px solid #666;
	margin-top: 5px;
}

/* Tooltips Style 2 ----*/
.ja-toolbar-thumb2-tip {
	z-index: 9999;
	float: left;
	background: #f2f2f2;
	border: 1px solid #999;
	max-width: 250px;
	color: #000;
	font: normal 12px/1.5 Arial, sans-serif;
	-webkit-box-shadow: 0 3px 8px #666;
 	-moz-box-shadow: 0 3px 8px #666;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px; 
}

.ja-toolbar-thumb2-tip div {
	padding: 0 12px 5px;
}

.ja-toolbar-thumb2-tip div div {
	padding: 0;
}

.ja-toolbar-thumb2-title {
	padding: 5px 12px !important;
	margin: 0 -12px 5px;
	background: url(../images/grad3.png) repeat-x top #ccc;
	border-bottom: 1px solid #999;
	font-size: 100%;
	font-weight: bold;
	display: block;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;  
	-moz-border-radius-topright: 5px;
	-webkit-border-top-right-radius: 5px;  
	-webkit-border-top-left-radius: 5px; 
}

.ja-toolbar-thumb2-text {
	font-size: 92%;
	margin: 0;
}

.ja-toolbar-thumb2-text img {
	border: 1px solid #666;
	margin-top: 5px;
}

/* Tooltips Style 3 ----*/
.ja-toolbar-thumb3-tip {
	z-index: 9999;
	float: left;
	background: url(../images/grad4.png) repeat-x top #ffffa8;
	border: 1px solid #666;
	max-width: 250px;
	color: #000;
	font: normal 12px/1.5 Arial, sans-serif;
	-webkit-box-shadow: 0 3px 8px #666;
 	-moz-box-shadow: 0 3px 8px #666;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px; 
}

.ja-toolbar-thumb3-tip div {
	padding: 0 12px 5px;
}

.ja-toolbar-thumb3-tip div div {
	padding: 0;
}

.ja-toolbar-thumb3-title {
	padding: 5px 2px 3px !important;
	margin: 0 -2px 8px;
	border-bottom: 1px solid #666;
	font-size: 100%;
	font-weight: bold;
	display: block;
}

.ja-toolbar-thumb3-text {
	font-size: 92%;
	margin: 0;
}

.ja-toolbar-thumb3-text img {
	border: 1px solid #666;
	margin-top: 5px;
}

/* Normal Tooltip ---*/
.ja-toolbar-tips-tip {
	z-index: 9999;
	font: normal 12px/normal Arial, sans-serif;
}

.ja-toolbar-tips-tip div {}

.ja-toolbar-tips-text {
	padding: 4px 10px;
	text-align: center;
	background: #FFFBCC;
	border-top: 1px solid #ddd;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	border-left: 1px solid #ddd;
}

.ja-toolbar-tips-text span {
	color: #000;
	font-size: 100%;
}

/*tooltip for toogle button ---*/
.ja-toolbar-btn-tip {
	z-index:9999;
	font: normal 12px/normal Arial, sans-serif;
	-webkit-box-shadow: 0 3px 8px #666;
 	-moz-box-shadow: 0 3px 8px #666;
}

.ja-toolbar-btn-tip div {}

.ja-toolbar-btn-title {
	padding: 4px 10px;
	text-align: center;
	background: #FFFBCC;
	border-top: 1px solid #ddd;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	border-left: 1px solid #ddd;
}

.ja-toolbar-btn-title span {
	color: #000;
	font-size: 100%;
}


/*Customized Tags ---*/
#ja-toolbar .hot a { background: url(../images/tags/hot.png) no-repeat 95% center !important; }

#ja-toolbar .free a { background: url(../images/tags/free.png) no-repeat 95% center !important; }

#ja-toolbar .new a { background: url(../images/tags/new.png) no-repeat 95% center !important; }

#ja-toolbar .bonus a { background: url(../images/tags/bonus.png) no-repeat 95% center !important; }

#ja-toolbar .feature a { background: url(../images/tags/featured.png) no-repeat 95% center !important; }

#ja-toolbar .enterprise a { background: url(../images/tags/enterprise.png) no-repeat 95% center !important; }

#ja-toolbar .coming-soon a { background: url(../images/tags/coming-soon.png) no-repeat 95% center !important; }

/* Clearfix
-------------------------------------------------------------*/
* html .clearfix {
	height: 1%; /* IE5-6 */
}

.clearfix { /* IE7xhtml*/
	display: inline-block;
} 

html[xmlns] .clearfix {/* O */
	display: block;
}

.clearfix:after {/* FF, O, etc. */
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}