/***
 * Created by: Mienard Lumaad
 * Date: May 15, 2012
 * Website: http://themepixels.com/
***/

@import url('fonts/roboto.css');
@import url('plugins/jquery.alerts.css');
@import url('plugins/uniform.tp.css');
@import url('plugins/jquery.ui.css');
@import url('plugins/jquery.ui.autocomplete.css');
@import url('plugins/fullcalendar.css');
@import url('plugins/colorbox.css');
@import url('plugins/colorpicker.css');
@import url('plugins/jquery.jgrowl.css');
@import url('plugins/jquery.tagsinput.css');
@import url('plugins/ui.spinner.css');
@import url('plugins/jquery.chosen.css');


/***** 1. RESET STYLE *****/
/**************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

/***** 2. GENERAL STYLES *****/
/*****************************/


body { font-size: 12px; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; color: #4D4D4D; line-height: 21px; }
input, select, textarea, button { font-size: 12px; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; outline: none; margin: 0; }
a { text-decoration: none; color: #666; outline: none; }
button { outline: none; }
a img { border: 0; }
h1,h2,h3,h4,h5, span.h3 { font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; font-weight: normal; line-height: 0.9;}
small { font-size: 11px; }
h1 { font-size: 32px; }
h2 { font-size: 28px; }
h3 { font-size: 24px; }
h4 { font-size: 18px; }
h5 { font-size: 14px; }
th {text-transform:uppercase;}
span.h3 { font-size: 24px; display: block; }
.pasphoto {padding:3px;border:2px solid #d0d0d0;}

body.withvernav {
	background-color:#ffffff;
	background-image:url(images/line.ccc.png);
	background-repeat:repeat-y, repeat-x;
	background-position:230px 0, top;
} /* with left menu*/
body.withvernav-nobg { background: #fff; } /* with left menu*/
body.withvernav-nomn { background:#fff url(images/default/bgtop.png) repeat-x top; } /* with no left menu*/
body.withmenucoll { background-position: 55px 0; } /* with menu style 1 in collapsed mode */
body.withmenucoll2 { background-position: 35px 0; } /* with menu style 2 in collapsed mode */

.sradio{ font-weight:normal; margin-right:20px; color:#666;}
.fradio{ padding:5px; }

.tbox {position:absolute; display:none; padding:14px 17px; z-index:900}
.tinner {padding:15px; -moz-border-radius:5px; border-radius:5px; background:#fff url(images/preload.gif) no-repeat 50% 50%; border-right:1px solid #333; border-bottom:1px solid #333}
.tmask {position:absolute; display:none; top:0px; left:0px; height:100%; width:100%; background:#000; z-index:800}
.tclose {position:absolute; top:0px; right:0px; width:30px; height:30px; cursor:pointer; background:url(images/close.png) no-repeat}
.tclose:hover {background-position:0 -30px}

/***** 3. COLUMN STYLE *****/
/***************************/


.one_half{ width:48.5%; }
.one_third{ width:31.16%; }
.two_third{ width:65.83%; }
.one_fourth{ width:22.5%; }
.three_fourth{ width:74.5%; }
.one_fifth{ width:17.3%; }
.two_fifth{ width:38.1%; }
.three_fifth{ width:58.9%; }
.four_fifth{ width:67.7%; }
.one_sixth{ width:13.83%; }
.five_sixth{ width:83.17%; }

.one_half,.one_third,.two_third,.three_fourth,.one_fourth,.one_fifth,
.two_fifth,.three_fifth,.four_fifth,.one_sixth,.five_sixth{ position:relative; margin-right:3%; float:left; }

.last{ margin-right:0 !important; clear:right; }

/***** 4. LOGIN PAGE *****/
/*************************/

.loginpage { background: #fff; }
.loginbox { align-items: center;justify-content: center;width:300px;}
.loginbox2 {
	width: 460px; padding: 7px; background: #b3cd90; margin: 3% auto 0 auto; -moz-border-radius: 250px; -webkit-border-radius: 250px;
	border-radius: 250px; -moz-box-shadow: 0 0 2px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.3);
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
}
.loginbox-wide {
	width: 100%; /* padding: 5px;background: #F5EBC7; margin: 2% auto 0 auto; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	border-radius: 5px; -moz-box-shadow: 0 0 2px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.3);
	box-shadow: 0 0 2px rgba(0,0,0,0.3);*/
}
.loginboxinner {
	padding: 20px; /*background: #00a65a url(images/patternbg.png); -moz-border-radius: 200px;
	-webkit-border-radius: 250px; border-radius: 250px;
	text-align: center;*/
}
.loginbox-wide .loginboxinner {
	padding: 15px; /*background: #0a7e01 url(images/patternbg.png); -moz-border-radius: 5px;
	-webkit-border-radius: 5px; border-radius: 5px;
	text-align: center;*/
}
.loginbox-wide .logo, .loginbox .logo { text-align: left;border-bottom: 1px solid #c0c0c0;margin-bottom:20px; }
.loginbox-wide .logo-company, .loginbox .logo-company {
	text-align: center;
	width: 176px;
	height: 132px;
	margin: 0 auto;
}
.loginbox-wide .logo h1, .loginbox .logo h1 {
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 18px; color: #fff; border-bottom: 0px solid #56647d;
	line-height: normal; margin-bottom: 0px;
}
.loginbox-wide .logo h1 span, .loginbox .logo h1 span { color: #644601;font-weight: bold; }

.loginbox-wide .logo p, .loginbox .logo p { font-weight: 500; color: #FDFAF2; font-style: italic; font-size: 14px; border-bottom: 1px solid #c0c0c0; padding-bottom: 10px; }
.loginbox-wide .logo p span.firstletter, .loginbox .logo p span.firstletter { font-weight: bold; color: #fff; font-style: normal; font-size: 18px; }
.loginbox-wide .logo p br.br, .loginbox .logo p br.br { margin-bottom: 10px; }
.loginbox-wide .logo p span.pt, .loginbox .logo p span.pt { font-weight: bold; color: #EBC253; font-style: italic; font-size: 20px; margin-top: 10px; }
.loginbox-wide .logo p span.pt-alt, .loginbox .logo p span.pt-alt { font-weight: bold; color: #EBC253; font-style: italic; font-size: 20px; }

.loginbox form { display: block; margin-top: 10px; width: 100%; }
.loginbox .username {
	width: 100%;
	margin: 15px 0;
	background: #eee url(images/icons/username.png) no-repeat 11px center; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	border-radius: 8px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
	box-shadow: 0 1px 2px rgba(0,0,0,0.4); overflow: hidden;float:left;
}
.loginbox .usernameinner { margin-left: 35px; border-left: 1px solid #ddd; background: #fff; }
.loginbox .username input {
	padding: 9px 9px; border: 0; font-size: 14px; width: 330px; box-shadow: none; color: #666;
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
}
.loginbox .password {
	width: 100%;
	background: #eee url(images/icons/password.png) no-repeat 11px center; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	border-radius:8px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
	box-shadow: 0 1px 2px rgba(0,0,0,0.4); overflow: hidden;float:left;
}
.loginbox .passwordinner { margin-left: 35px; border-left: 1px solid #ddd; background: #fff; }
.loginbox .password input {
	padding: 9px 9px; border: 0; font-size: 14px; width: 330px; box-shadow: none; color: #666;
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
}

.loginbox-wide .logincontent {
	height: 260px;
}

.loginbox button {
	width: 100%;
	margin: 15px 0;
	background: #7c7a78 url(images/btngrad.png) repeat-x top left; border: 0; padding: 8px 0; text-align: center;
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; text-transform: uppercase;
	-moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
.loginbox button:hover { background-color: #c1bebb; color:#000 }
.loginbox .keep { margin-top: 20px; font-weight: bold; color: #ccc; font-size: 11px; }
.loginbox .loginmsg {
	background: #fffccc; color: #333; margin-bottom: 10px; padding: 5px; text-align: center; font-size: 11px;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.loginf {
	padding: 10px; background: #2e3e59; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	-moz-box-shadow: inset 0 1px 1px #23324b; -webkit-box-shadow: inset 0 1px 1px #23324b; box-shadow: inset 0 1px 1px #23324b;
	border-bottom: 1px solid #475875;
}

.loginpage .nousername, .loginpage .nopassword { display: none; }
.loginpage .nopassword { color: #fff; }
.loginpage .nopassword .thumb {
	padding: 5px; background: #fff; display: inline-block; vertical-align: top;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.loginpage .nopassword .userlogged { display: inline-block; margin-left: 10px; font-weight: bold; }
.loginpage .nopassword .userlogged h4 { font-size: 14px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.loginpage .nopassword .userlogged a { color: #ED6E00; font-style: italic; }
.loginpage .nopassword .userlogged a:hover { text-decoration: underline; }
.loginpage .notibar { border: 0; }

a.detil { color: #cd762a; }
a.detil:hover { color: #3c4e6c; }

a.menu { color: #fff; font-weight: normal; text-decoration: none; }
a.menu:hover { color: #000; font-weight: normal; text-decoration: none; }

/***** 5. TOP HEADER STYLES *****/
/********************************/

.topheader { background: #755200; padding: 8px 0px 8px 10px; position: relative; border-bottom: 0px solid #000000; }
.topheader .left h1.logo {
	background: url(images/logo-small.png) left top no-repeat;
	padding: 10px 0 25px 240px;
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-weight: normal; text-transform: uppercase; color: #ff0000;
	float: left; font-size: 20px; margin: 10px 0; z-index:10;
}.topheader .left h1.logo a { color: #ff0000; }
.topheader .left h1.logo span { color: #fff; }
.topheader .left .slogan { position: absolute; top: 55px; left: 42px;
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; padding: 0; text-transform: uppercase; z-index:15;
	border-left: 0px solid #606d84; color: #fff;  margin: -10px 0 0 208px; font-size: 12px;
}

.search { float: left; margin: 2px 10px; }
.search input[type=text] {
	border: 0; padding: 10px 8px 11px 8px; background: #32415a; float: left; color: #4a5b78; -moz-border-radius: 2px 0 0 2px; margin: 0;
	-webkit-border-radius: 2px 0 0 2px; border-radius: 2px 0 0 2px; border-bottom: 1px solid #445775; width: 200px; font-style: italic;
	-moz-box-shadow: inset 1px 1px 2px #2b384e; -webkit-box-shadow: inset 1px 1px 2px #2b384e; box-shadow: inset 1px 1px 2px #2b384e;
}
.search input[type=text]:focus { font-style: normal; color: #6a778d; }
.search .submitbutton {
	float: left; border: 0; border-bottom: 1px solid #445775; -moz-border-radius: 0 0 2px 0; -webkit-border-radius: 0 0 2px 0; cursor: pointer;
	border-radius: 0 0 2px 0; background: url(images/default/searchbutton.png) no-repeat 0 0; width: 38px; height: 37px; vertical-align: middle;
}

.topheader .right { position: absolute; top: 10px; right: 10px; }

.notification { float: left; position: relative; }
.notification a.count {
	background: #cc170e url(images/default/notibg.png) repeat-x top left; margin-right: 10px;
	font-size: 14px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; padding: 8px 13px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border-bottom: 1px solid #445775;
	-moz-box-shadow: inset 0 0 5px #400603; -webkit-box-shadow: inset 0 0 5px #400603; box-shadow: inset 0 0 5px #400603;
	color: #fff; cursor: pointer; display: inline-block;
}
.notification a.count:hover { background: #d7180e; }

.noticontent {
	position: absolute; z-index: 100; width: 300px; top: 48px; right: 10px; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px; background: #fff; -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); z-index: 200;
}


/***** 5. NOTIFICATION STYLES *****/
/**********************************/


.notitab { list-style: none; overflow: hidden; border-bottom: 1px solid #ff0000; padding: 5px 5px 0 5px; margin-bottom: 1px; }
.notitab li { display: inline-block; width: 50%; float: left; }
.notitab li a {
	display: block; padding: 10px 20px; font-weight: bold; text-align: center;
	-moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
}
.notitab li a:hover { color: #ff0000; }
.notitab li.current a { background: #ff0000; color: #fff; }

.msglist { list-style: none; }
.msglist li { border-bottom: 1px solid #eee; line-height: 16px;}
.msglist li:first-child { padding-top: 0;}
.msglist li a { padding: 5px; display: block; }
.msglist li a:hover { background: #f7f7f7; }
.msglist li .thumb { border: 1px solid #fff; display: inline-block; float: left; margin-right: 10px; }
.msglist li .thumb:hover { border: 1px solid #ff0000; }
.msglist li img { vertical-align: middle; }

.msgdetails { line-height: 18px; }
.msgdetails span { display: block; }
.msgdetails .name { font-weight: bold; color: #485B79; }
.msgdetails .msg { font-size: 11px; }
.msgdetails .time { font-size: 10px; color: #999; }

.msgbutton { text-align: right; padding: 10px; overflow: hidden; }
.msgbutton a {
	padding: 5px 10px; background: #eee; display: inline-block; font-size: 11px; font-weight: bold;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.msgbutton a:hover { background: #ff0000; color: #fff; }
.msgbutton a:first-child { float: left; }

.actlist { list-style: none; }
.actlist li { display: block; padding: 8px 10px; border-bottom: 1px solid #eee; line-height: 16px; }
.actlist li a { color: #485B79; font-weight: bold; }
.actlist li a:hover { color: #ff0000; }
.actlist li span { display: block; font-size: 10px; color: #999; }

/***** top nav *****/
.topnav { float: left; margin: 7px 0px 0px 10px; }
.topnav a.logout {
	background: url("images/default/notibg.hover.png") repeat-x scroll left top rgb(204, 23, 14);
	padding: 11px 18px 11px 18px;
	color: #fff;
	text-decoration: none;
}
.topnav a.logout:hover {
	background: url("images/default/notibg.png") repeat-x scroll left top rgb(204, 23, 14);
	padding: 11px 18px 11px 18px;
	color: #fff;
	text-decoration: none;
}

.loading{
	background:#fff url("./images/loaders/loader10.gif") center center no-repeat;
	opacity:0.75;
	width:100%;
	height:100%;
	position:absolute;
	z-index:9;
	display:none;
}

/***** 6. USER INFORMATION DROP STYLES *****/
/*******************************************/


.userinfo {
	padding: 6px 18px 6px 6px; background: #32415a url(images/default/userinfoarrow.png) no-repeat right center; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: inset 1px 1px 2px #2b384e; float: left; border-bottom: 1px solid #445775;
	-webkit-box-shadow: inset 1px 1px 2px #2b384e; box-shadow: inset 1px 1px 2px #2b384e; cursor: pointer;
}
.userinfo:hover { background-color: #2d3b53; }
.userinfo img { border: 1px solid #b9c1ce; vertical-align: middle; }
.userinfo span { color: #b9c2cf; display: inline-block; padding: 0 5px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }

.userinfodrop {
	padding: 10px; min-width: 300px; position: absolute; top: 48px; right: 0; -moz-border-radius: 2px; display: none;
	-webkit-border-radius: 2px; border-radius: 2px; background: #fff; -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); z-index: 200;
}

.userinfodrop .avatar { float: left; }

.userdata { margin-left: 105px; }
.userdata h4 { color: #2d3c54; display: inline-block; }
.userdata .email { color: #999; font-size: 11px; display: inline-block; }
.userdata ul { list-style: none; margin-top: 10px; }
.userdata ul li { display: block; margin-bottom: 1px; }
.userdata ul li:last-child { margin-bottom: 0; }
.userdata ul li a { display: block; padding: 5px; background: #f7f7f7; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.userdata ul li a:hover { background: #ff0000; color: #fff; }


/***** 7. HEADER STYLES *****/
/****************************/


.header {
	background: #755200 url(images/default/headerbg.png); min-height: 0px; overflow: hidden; border-bottom: 30px solid #9a7013;
	-moz-box-shadow: inset 0 1px 0 #50627f; -webkit-box-shadow: inset 0 1px 0 #50627f; box-shadow: inset 0 1px 0 #50627f;
	position: relative;
}
.head { height: 30px; }
.headermenu { overflow: hidden; list-style: none; border-right: 0px solid #666; display: inline-block; margin-top: -12px; margin-right: -10px; }
.headermenu li { float: left; display: inline-block; border-left:0px solid #666; border-right: 0px solid #666; }
.headermenu li:first-child { border-left: 0px solid #666; }
.headermenu li a {
	display: block; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; color: #fff; text-transform: uppercase;
	padding: 17px 10px;
}
.headermenu li a { min-width: 80px; text-align: center; }
.headermenu li a span { opacity: 0.5; }
.headermenu li a span.icon { height: 30px; display: block; margin-bottom: 10px; }

.headermenu li a span.icon-flatscreen { background: url(images/icons/flatscreen.white.png) no-repeat center center; }
.headermenu li a span.icon-pencil { background: url(images/icons/pencil.white.png) no-repeat center center; }
.headermenu li a span.icon-speech { background: url(images/icons/speech.white.png) no-repeat center center; }
.headermenu li a span.icon-message { background: url(images/icons/message.white.png) no-repeat center center; }
.headermenu li a span.icon-chart { background: url(images/icons/chart.white.png) no-repeat center center; }
.headermenu li a span.icon-selling { background: url(images/icons/chart.white.png) no-repeat center center; }
.headermenu li a span.icon-marketing { background: url(images/icons/marketing.white.png) no-repeat center center; }
.headermenu li a span.icon-finance { background: url(images/icons/finance.white.png) no-repeat center center; }
.headermenu li a span.icon-user { background: url(images/icons/users.white.png) no-repeat center center; }
.headermenu li a span.icon-system { background: url(images/icons/system.white.png) no-repeat center center; }
.headermenu li a span.icon-crm { background: url(images/icons/crm.white.png) no-repeat center center; }
.headermenu li a span.icon-warehouse { background: url(images/icons/warehouse.white.png) no-repeat center center; }
.headermenu li a:hover {
	background: url(images/default/bghover.png) no-repeat center bottom; -moz-box-shadow: inset 0 1px 0 #4f627e;
	-webkit-box-shadow: inset 0 1px 0 #4f627e; box-shadow: inset 0 1px 0 #4f627e;
}

.headermenu li.current { border-left: 0px solid #444; border-right: 0px solid #444;  }
.headermenu li.current a {
	background: url(images/default/arrow-active.png) no-repeat center bottom; -moz-box-shadow: inset 0 1px 0 #4f627e;
	-webkit-box-shadow: inset 0 1px 0 #4f627e; box-shadow: inset 0 1px 0 #4f627e; }
.headermenu li.current a span { opacity: 1; }


.headerwidget { position: absolute; top: 10px; right: 10px; }
.headerwidget .earnings {
	background: #32415a; padding: 8px 10px; overflow: hidden; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	min-width: 200px; -moz-box-shadow: inset 1px 1px 2px #29374e; -webkit-box-shadow: inset 1px 1px 2px #29374e; box-shadow: inset 1px 1px 2px #29374e;
	border-bottom: 1px solid #516686;
}
.headerwidget .earnings h4 {
	font-weight: normal; text-transform: uppercase; color: #eee; font-size: 11px;
	font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; margin-bottom: 8px;
}
.headerwidget .earnings h2 {
	color: #f6e4a5; font-size: 32px; font-weight: normal; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; margin-bottom: 8px;
}


/***** 8. PAGE HEADER STYLES *****/
/*********************************/


.pageheader {padding-top: 20px;  position: relative;border:0px solid #000; }
.pageheader .pagetitle { border-bottom:1px solid #c0c0c0; margin: 0 10px; color: #ff0000; font-weight: normal; font-size: 28px; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; padding-bottom: 2px; }
.pageheader .pagedesc { color: #666; margin: 0 10px; }
.notab { border-bottom: 1px solid #ddd; padding-bottom: 20px; }
.pageheader #print {padding-top: 2px;padding-right: 20px;  position: relative;float:right;}



/***** 9. HORIZONTAL NAVIGATION STYLES *****/
/*******************************************/


.hornav { list-style: none;  margin: 0 20px; border-bottom: 1px solid #ccc; padding: 0 10px; height: 41px; }
.hornav li { display: inline-block; float: left; margin-right: 5px; }
.hornav li a {
	display: block; padding: 10px 20px; background: #ccc; color: #fff; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase; font-size: 14px; -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
	border: 1px solid #ccc; border-bottom: 0;
}
.hornav li a:hover { background: #bbb; border-color: #aaa; }
.hornav li.current a { background: #fff; color: #ff0000; }
.hornav li.current a:hover { border-color: #ccc; }

.editornav { list-style: none; margin-top: 15px; border-bottom: 1px solid #ccc; padding: 0 20px; height: 41px; }
.editornav li { display: inline-block; }
.editornav li a {
	display: block; padding: 10px 20px; background: #ccc; color: #fff; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase; font-size: 14px; -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
	border: 1px solid #ccc; border-bottom: 0; cursor: pointer;
}
.editornav li a:hover { background: #bbb; border-color: #aaa; }
.editornav li.current a { background: #fff; color: #ff0000; }
.editornav li.current a:hover { border-color: #ccc; }




/***** 9. HORIZONTAL2 NAVIGATION STYLES *****/
/*******************************************/


.hornav2 { list-style: none;  margin: 0 20px; border-bottom: 1px solid #ccc; padding: 0 10px; height: 41px; }
.hornav2 li { display: inline-block; float: left; margin-right: 5px; }
.hornav2 li a {
	display: block; padding: 10px 20px; background: #ccc; color: #fff; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase; font-size: 14px; -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
	border: 1px solid #ccc; border-bottom: 0;
}
.hornav2 li a:hover { background: #bbb; border-color: #aaa; }
.hornav2 li.current a { background: #fff; color: #ff0000; }
.hornav2 li.current a:hover { border-color: #ccc; }

.editornav2 { list-style: none; margin-top: 15px; border-bottom: 1px solid #ccc; padding: 0 20px; height: 41px; }
.editornav2 li { display: inline-block; }
.editornav2 li a {
	display: block; padding: 10px 20px; background: #ccc; color: #fff; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase; font-size: 14px; -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
	border: 1px solid #ccc; border-bottom: 0; cursor: pointer;
}
.editornav2 li a:hover { background: #bbb; border-color: #aaa; }
.editornav2 li.current a { background: #fff; color: #ff0000; }
.editornav2 li.current a:hover { border-color: #ccc; }


/***** 10. VERTICAL NAVIGATION STYLES *****/
/******************************************/


.vernav { width: 230px; position: absolute; left: 0; top: 160px; }
.vernav ul { list-style: none; margin: 10px; }
.vernav ul li { display: block; margin-bottom: 1px; position: relative; }
.vernav ul li a {
	display: block; padding: 12px 10px; background: #f7f7f7; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; color: #666;
	text-transform: uppercase; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.vernav ul li a:hover { background-color: #32415A; color: #eee; }
.vernav ul li.current a { background-color: #32415a; color: #ff0000; }
.vernav ul ul { margin: 0; margin-left: 10px; display: none; }
.vernav ul ul li a { color: #999; background: #fff url(images/line.dashed.png) no-repeat -25px center; border-left: 1px dashed #ccc; padding-left: 10px; }
.vernav ul ul li a:hover { background-color: #fff; color: #666; }
.vernav ul li.current ul { display: block; }
.vernav ul li.current ul li a { background-color: #fff; color: #999; }
.vernav ul li.current ul li a:hover { color: #666; }
.vernav ul li.current ul li.current a { color: #ff0000; background-color: #fff; }

.vernav2 { width: 230px; position: absolute; left: 0; }
.vernav2 ul { list-style: none; margin: 0; }
.vernav2 ul li { display: block; border-bottom: 1px solid #eee; position: relative; }
.vernav2 ul li a {
	display: block; padding: 9px 10px; background: #fff; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; color: #32415a;
	text-transform: uppercase;
}
.vernav2 ul li a:hover { background-color: #fcfcfc; }
.vernav2 ul li.current a { background-color: #f7f7f7; color: #ff0000; }
.vernav2 ul ul { margin: 0; padding-left: 10px; border-top: 1px solid #eee; display: none; }
.vernav2 ul ul li { border-bottom: 0; }
.vernav2 ul ul li a {
	color: #999; background: url(images/line.dashed.png) no-repeat -25px center; border-left: 1px dashed #ccc; padding-left: 10px;
}
.vernav2 ul ul li a:hover { background-color: #fff; color: #666; }
.vernav2 ul ul li:last-child { border-bottom: 0; }
.vernav2 ul li.current ul { display: block; }
.vernav2 ul li.current ul li a { background-color: #fff; color: #999; }
.vernav2 ul li.current ul li a:hover { background-color: #fafafa; color: #666; }
.vernav2 ul li.current ul li.current a { background-color: #fafafa; color: #ff0000; }

.vernav ul li span.arrow, .vernav2 ul li span.arrow {
	position: absolute; top: 17px; right: 10px; background: url(images/default/menuarrow.png) no-repeat 0 0;
	width: 11px; height: 5px;
}
.vernav ul li.current span.arrow, .vernav2 ul li.current span.arrow { background-position: 0 -5px; }

.iconmenu ul li a {

}
.iconmenu ul li a:hover { color : #999; }
.iconmenu ul li.current a:hover { color : #444; }
.iconmenu ul ul { padding-left: 25px; }

.iconmenu ul li a.editor { background-position: 8px 10px; }
.iconmenu ul li a.gallery { background-position: 8px -61px; }
.iconmenu ul li a.elements { background-position: 8px -133px; }
.iconmenu ul li a.widgets { background-position: 8px -205px; }
.iconmenu ul li a.calendar { background-position: 8px -278px; }
.iconmenu ul li a.support { background-position: 8px -349px; }
.iconmenu ul li a.typo { background-position: 8px -421px; }
.iconmenu ul li a.tables { background-position: 8px -493px; }
.iconmenu ul li a.error { background-position: 8px -565px; }
.iconmenu ul li a.addons { background-position: 8px -638px; }
.iconmenu ul li a.inbox { background-position: 8px -708px; }
.iconmenu ul li a.drafts { background-position: 8px -780px; }
.iconmenu ul li a.sent { background-position: 8px -853px; }
.iconmenu ul li a.trash { background-position: 8px -923px; }

.iconmenu ul li.current a.editor { background-position: 8px -24px; }
.iconmenu ul li.current a.gallery { background-position: 8px -97px; }
.iconmenu ul li.current a.elements { background-position: 8px -169px; }
.iconmenu ul li.current a.widgets { background-position: 8px -240px; }
.iconmenu ul li.current a.calendar { background-position: 8px -314px; }
.iconmenu ul li.current a.support { background-position: 8px -385px; }
.iconmenu ul li.current a.typo { background-position: 8px -457px; }
.iconmenu ul li.current a.tables { background-position: 8px -530px; }
.iconmenu ul li.current a.error { background-position: 8px -601px; }
.iconmenu ul li.current a.addons { background-position: 8px -674px; }
.iconmenu ul li.current a.inbox { background-position: 8px -744px; }
.iconmenu ul li.current a.drafts { background-position: 8px -816px; }
.iconmenu ul li.current a.sent { background-position: 8px -889px; }
.iconmenu ul li.current a.trash { background-position: 8px -959px; }

.menucoll { width: 55px; }
.menucoll ul li { height: 36px; position: relative; margin-bottom: 0; }
.menucoll ul li span.arrow { display: none; }
.menucoll > ul > li { margin-bottom: 1px; }
.menucoll > ul > li > a { overflow: hidden; width: 0; height: 36px; padding: 0 0 0 35px; }
.menucoll > ul > li.hover > a { background-color: #32415A; background-image: url(images/default/icons_sprite2.png); }
.menucoll > ul > li.current > a { background-image: url(images/default/icons_sprite.png); }
.menucoll ul ul {
	position: absolute; z-index: 200; top: 0; left: 24px; padding: 0; width: 200px; background: none; border: 1px solid #ccc;
	-moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.1); -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1); box-shadow: 2px 1px 3px rgba(0,0,0,0.1);
}
.menucoll ul ul li { display: block; border-bottom: 1px solid #eee; height: auto; }
.menucoll ul ul li a { background-image: none; border-left: 0; height: auto; padding: 11px 10px 10px 10px; }
.menucoll ul ul span {
	background: #f7f7f7; font-weight: bold; display: block; padding: 9px 10px 10px 10px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}
.menucoll ul li.current ul { display: none; }
.menucoll ul li.current ul span { background-color: #32415A; color: #ff0000; }


.menucoll2 { width: 40px; }
.menucoll2 ul li { height: 36px; position: relative; }
.menucoll2 ul li span.arrow { display: none; }
.menucoll2 > ul > li > a > span { display: none; }
.menucoll2 ul ul {
	position: absolute; z-index: 100; top: 0; left: 40px; padding: 0; width: 200px; background: none; border: 1px solid #ccc;
	-moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.1); -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.1); box-shadow: 2px 1px 3px rgba(0,0,0,0.1);
}
.menucoll2 ul ul li { display: block; border-bottom: 1px solid #eee; height: auto; }
.menucoll2 ul ul li a { background-color: #fff; border-left: 0; height: auto; padding: 11px 10px 10px 10px; }
.menucoll2 ul ul span {
	background: #f7f7f7; font-weight: bold; display: block; padding: 9px 10px 10px 10px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}
.menucoll2 ul li.current ul { display: none; }
.menucoll2 ul li.current ul span { color: #d82e3a; }



.togglemenu {
	border-left: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; display: block; height: 21px; cursor: pointer;
	background: url(images/menucollapsed.png) no-repeat center 0; margin: 10px;
}
.togglemenu_collapsed { background-position: center -21px; margin: 10px 5px; border-width: 0; }

.vernav .togglemenu { margin: 10px; }
.vernav .togglemenu_collapsed { width: 35px; margin: 10px auto; border-width: 1px; }



/***** 11. CENTER CONTENT STYLES *****/
/*************************************/


.centercontent { margin-left: 230px; position: relative; }
body.withvernav-nobg .contentpopup { margin-left: 10px; position: relative; }
.centercontent .pagetitle { margin: 0 20px 10px 20px;text-transform: uppercase; }
.centercontent .pagedesc { margin: 0 20px; }
.centercontent .hornav { padding: 0 20px; }

.withmenucoll .centercontent { margin-left: 56px; }
.withmenucoll2 .centercontent { margin-left: 40px; }


/***** 12. MAIN CONTENT STYLES *****/
/***********************************/


.contentwrapper { padding: 20px; border:0px solid #000;margin-top:-30px;}
.contentwrapper p { margin: 10px 0; }
.contentwrapper .grf {border:1px solid #c0c0c0;}
.withrightpanel { margin-right: 260px; }
.subcontent { background:#fff; position: relative; padding:10px; margin-top:7px;border:0x solid #000;  -moz-border-radius: 5px ; -webkit-border-radius: 5px ;
	border-radius: 5px ;border:1px solid #ccc;}

.subcontent2 { background:#fff; position: relative; padding:10px; margin-top:7px;border:0x solid #000;  -moz-border-radius: 5px ; -webkit-border-radius: 5px ;
	border-radius: 5px ;border:1px solid #ccc;}

.contenttitle {
	background: #32415A; color: #ff0000; text-transform: uppercase; -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0;
	border-radius: 2px 2px 0 0; font-size: 14px; font-weight: normal;
}
.contenttitle h4 { padding: 12px 10px; font-size: 14px; }

.contenttitle2 { margin: 20px 0; border-bottom: 2px solid #ff0000; padding-bottom: 5px;  display: inline-block;width:100%; }
.contenttitle2 h3 { font-size: 16px; font-weight: normal; text-transform: uppercase; }



/***** 13. DASHBOARD STYLES *****/
/********************************/

.shortcuts { list-style: none;margin-top:15px; }
.shortcuts li {
	float: left; margin-right: 7px; margin-bottom: 20px; width: 99px; height: 99px; background: #444;
	padding: 8px; -moz-border-radius: 20px; -webkit-border-radius: 20px;  border-radius: 20px; position: relative;
	-moz-box-shadow: inset 1px 1px 2px #ddd; -webkit-box-shadow: inset 1px 1px 2px #ddd; box-shadow: inset 1px 1px 2px #ddd;
}
.shortcuts li a {
	width: 98px; height: 98px; display: block; background-color: #ddd; background: #ededed;background-repeat: no-repeat; background-position: center 8px; background-size: 50px 50px;
	border: 1px solid #fff; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px;
}
.shortcuts li a:hover { border-color: #ddd; background: #fcdd00;background-repeat: no-repeat;background-position: center 10px;}
.shortcuts li a span {
	text-align: center; display: block; padding-top: 70px; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif;
	text-transform: uppercase;font-size:11px;line-height:12px;
}
.shortcuts li a.settings { background-image: url(images/icons/64/settings.png); }
.shortcuts li a.users { background-image: url(images/icons/64/users.png); }
.shortcuts li a.gallery { background-image: url(images/icons/64/images.png); }
.shortcuts li a.events { background-image: url(images/icons/64/events.png); }
.shortcuts li a.analytics { background-image: url(images/icons/64/analytics.png); }
.shortcuts li a.finance { background-image: url(images/icons/64/finance.png); }
.shortcuts li a.messages { background-image: url(images/icons/64/messages.png); }
.shortcuts li a.logoff { background-image: url(images/icons/64/logoff.png); }
.shortcuts li a.warehouse { background-image: url(images/icons/64/warehouse.png); }


.toplist { list-style: none; }
.toplist li {
	display: block; margin-bottom: 10px; border: 1px solid #ddd; overflow: hidden; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0 1px 1px rgba(0,0,0,0.1); line-height: 21.5px;
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1); box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}
.toplist li a { overflow: hidden; display: block; }
.toplist li a:hover { color: #68768d; }
.toplist li .left { display: block; padding: 10px; }
.toplist li .right { background: #fcfcfc; display: block; border-left: 1px solid #ddd; padding: 20px 10px; text-align: center; }
.toplist li .title {
	text-transform: uppercase; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif;
	font-size: 14px; color: #32415A; display: block;
}
.toplist li .desc { color: #ff0000; font-weight: bold; font-size: 11px; }

.overviewhead {
	padding: 10px; border: 1px solid #ddd; background: #fcfcfc;  -moz-border-radius: 2px; -webkit-border-radius: 2px; min-height: 32px;
	border-radius: 2px; -moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}
.overviewselect { float: right; margin-top: 1px; }
.overviewhead input { border: 1px solid #ccc; padding: 8px 5px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }

.overviewtable tr td, .overviewtable tr th { text-align: right !important; }
.overviewtable tbody tr td { font-size: 24px; color: #111; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; }


/***** 14. FILE MANAGER STYLES *****/
/***********************************/


.filemgr { position: relative; min-height: 400px; }
.filemgr .filemgr_right { position: absolute; width: 250px; top: 62px; right: 0; }
.filemgr .filemgr_rightinner { margin: 20px 0; padding: 0 20px; border-left: 1px dashed #ddd; }

.filemgr_head {
	padding: 15px 20px; background: #fcfcfc; border-bottom: 1px solid #ddd; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}

.filemgr_menu { list-style: none; position: relative; }
.filemgr_menu li { display: inline-block; float: left; }
.filemgr_menu li.right { float: right; }
.filemgr_menu li a {
	padding: 4px 10px 5px 10px; border: 1px solid #ccc; display: block; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; font-weight: bold; -moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff;
	box-shadow: inset 0 1px 0 #fff; background-color: #fff;
}
.filemgr_menu li a:hover { background-color: #eee; border-color: #bbb; cursor: pointer; }
.filemgr_menu li a.prev, .filemgr_menu li a.next { display: block; padding: 15px; border: 1px solid #ccc; cursor: pointer; background-color: #fff; }
.filemgr_menu li a.prev:hover, .filemgr_menu li a.next:hover { background-color: #eee; border-color: #bbb; }
.filemgr_menu li a.prev {
	border-right: 0; background: #fff url(images/arrow.png) no-repeat 10px 8px; -moz-border-radius: 2px 0 0 2px;
	-webkit-border-radius: 2px 0 0 2px; border-radius: 2px 0 0 2px;
}
.filemgr_menu li a.prev_disabled { background-position: 10px -46px; cursor: default; }
.filemgr_menu li a.prev_disabled:hover { border-color: #ccc; background-color: #fff; }
.filemgr_menu li a.next {
	background: #fff url(images/arrow.png) no-repeat -39px 8px; -moz-border-radius: 0 2px 2px 0; -webkit-border-radius: 0 2px 2px 0;
	border-radius: 0 2px 2px 0;
}
.filemgr_menu li a.next_disabled { background-position: -39px -46px; cursor: default; }
.filemgr_menu li a.next_disabled:hover { border-color: #ccc; background-color: #fff; }

.filemgr_menu li a.selectall {
	background-image: url(images/selectall.png); background-position: 7px 7px; background-repeat: no-repeat; padding-left: 27px;
}
.filemgr_menu li a.preview {
	background-image: url(images/preview.png); background-position: 7px 8px; background-repeat: no-repeat; padding-left: 30px;
}
.filemgr_menu li a.preview_disabled { opacity: 0.5; }
.filemgr_menu li a.preview_disabled:hover { background-color: #fff; cursor: default; }

.filemgr_menu li a.newfolder {
	padding: 15px; background-image: url(images/addfolder.png); background-position: 7px 8px; background-repeat: no-repeat;
}
.filemgr_menu li a.trash {
	padding: 15px; background-image: url(images/trash.png); background-position: 7px 7px; background-repeat: no-repeat;
}
.filemgr_menu li a.trash_disabled { opacity: 0.5; }
.filemgr_menu li a.trash_disabled:hover { background-color: #fff; cursor: default; }

.filemgr_menu form input.filekeyword { padding: 7px 7px 8px 7px; width: 200px; background: #fff; color: #999; font-style: italic; }
.filemgr_menu form input.filekeyword:focus { color: #666; font-style: normal; }

.filemgr_content { padding: 20px; margin-right: 250px; }

.filemgr_category { padding: 10px 0; margin: 0 20px; border-bottom: 1px dashed #ddd; margin-right: 270px; }
.filemgr_category ul { list-style: none; }
.filemgr_category ul li { display: inline-block; margin-right: 5px; }
.filemgr_category ul li.right { float: right; }
.filemgr_category ul li a { display: block; padding: 5px 10px; font-weight: bold; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.filemgr_category ul li a:hover {
	background: #fcfcfc; -moz-box-shadow: inset 1px 1px 1px #ddd; -webkit-box-shadow: inset 1px 1px 1px #ddd;
	box-shadow: inset 1px 1px 1px #ddd;
}
.filemgr_category ul li.current a {
	background: #eee; -moz-box-shadow: inset 1px 1px 1px #ccc; -webkit-box-shadow: inset 1px 1px 1px #ccc;
	box-shadow: inset 1px 1px 1px #ccc;
}
.filemgr_category ul li .pagenuminfo { display: inline-block; margin-top: 5px; }

.filemgr_menu li a.newfilebutton {
	display: block; padding: 4px 10px 5px 10px; text-align: center; border: 1px solid #ddd; background: #ff0000; color: #fff;
	font-weight: bold; font-size: 12px; -moz-box-shadow: inset 0 1px 0 rgba(250,250,250,0.3);
	-webkit-box-shadow: inset 0 1px 0 rgba(250,250,250,0.3); box-shadow: inset 0 1px 0 rgba(250,250,250,0.3);
}
.filemgr_menu li a.newfilebutton:hover { background: #485B79; border: 1px solid #ddd; }

.menuright { list-style: none; }
.menuright li { display: block; margin-bottom: 1px; }
.menuright li a { display: block; padding: 8px 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold; }
.menuright li a:hover { background: #eee; }
.menuright li.current a { background: #999; color: #fff; }

.listfile { list-style: none; }
.listfile li { display: inline-block; margin: 5px 10px 5px 0; }
.listfile li a { display: block; border: 1px solid #eee; padding: 10px; }
.listfile li a:hover { cursor: pointer; border-color: #ddd; }
.listfile li a span.filename { display: block; margin-top: 5px; font-size: 11px; text-align: center; }
.listfile li.selected a { border-color: #ff0000; background: #fff4eb; }



/***** 15. RIGHT PANEL STYLES *****/
/**********************************/


.rightpanel { width: 250px; position: absolute; top: 85px; right: 10px; }
.rightpanelinner { }

.widgetbox { margin-top: 10px; }
.widgetbox .title { padding: 0 20px 5px 0; margin: 20px 0; display: inline-block; border-bottom: 1px solid #ddd;width:98%; }
.widgetbox:first-child .title { margin-top: 0; }
.widgetbox .title h4 { font-size: 16px; font-weight: normal; text-transform: uppercase; }


/***** 16. WIDGET BOX STYLES *****/
/*********************************/

.widgetbox { }
.widgetbox .title { margin: 20px 0; }
.widgetbox .title h3 {
	font-size: 16px; text-transform: uppercase; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; font-weight: normal; }
.widgetbox .widgetcontent { line-height: 21px; }
.widgetcontent ul.linklist { list-style: none; }
.widgetcontent ul.linklist li { border-bottom: 1px dotted #ddd; padding: 1px 0; }
.widgetcontent ul.linklist li a { display: block; padding: 2px 5px; color: #666; }
.widgetcontent ul.linklist li a:hover { background: #f7f7f7; text-decoration: none; }

.widgetbox .titlehover h2 span { background: #333 url(images/icons/arrow.png) no-repeat right; }
.widgetbox .widgettoggle { overflow: hidden; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }

.widgetbox .listthumb { list-style: none; margin: 0; }
.widgetbox .listthumb li { padding: 0; margin: 8px 0; }
.widgetbox .listthumb img { vertical-align: middle; }
.widgetbox .thumb { list-style: none; margin: 0; }
.widgetbox .thumb li { display: inline-block; padding: 0; margin-right: 5px; }

.widgetbox .widgetoptions {
	padding: 10px; border: 1px solid #ddd; border-bottom: 0; background: #f7f7f7; position: relative;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}
.widgetbox .widgetoptions a {
	padding: 5px 15px; display: inline-block; border: 1px solid #ccc; background: #fff; font-weight: bold; font-size: 11px; color: #333;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0 1px 0 #fff;
	-webkit-box-shadow: 0 1px 0 #fff; box-shadow: 0 1px 0 #fff; line-height: 21px;
}
.widgetbox .widgetoptions a:hover {
	border: 1px solid #bbb; background-color: #f7f7f7; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}
.widgetbox .widgetoptions .right { float: right; }

.contentwrapper .widgetbox { margin-bottom: 20px; margin-top: 0; }

.userlistwidget { border: 1px solid #ddd; }
.userlistwidget ul { list-style: none; }
.userlistwidget ul li { font-size: 11px; line-height: 18px; border-bottom: 1px dashed #ddd; padding: 10px; }
.userlistwidget ul li:last-child { border-bottom: 0; }
.userlistwidget ul li .avatar { float: left; margin-right: 10px; padding: 2px; border: 1px solid #eee; }
.userlistwidget ul li a { font-weight:  bold; }
.userlistwidget .more {
	display: block; text-align: center; background: #f5f5f5; color: #069; padding: 5px 0; font-size: 10px;
	text-transform: uppercase; font-weight: bold; border-top: 1px solid #ddd; }
.userlistwidget .more:hover { text-decoration: none; background: #e7e7e7; }

/***** RECENT ACTIVITY *****/
.recent_list { list-style: none; font-size: 11px; line-height: 16px; }
.recent_list li {
	display: block; background-color: #eee; background-repeat: no-repeat; background-position: 10px 10px;
	border: 1px solid #ddd; border-top: 0;
}
.recent_list li:first-child { border-top: 1px solid #ddd; }

.recent_list li.message { background-image: url(images/icons/mail.png); }
.recent_list li.user { background-image: url(images/icons/users.png); }
.recent_list li.call { background-image: url(images/icons/call.png); }
.recent_list li.calendar { background-image: url(images/icons/calendar.png); }
.recent_list li.settings { background-image: url(images/icons/settings.png); }

.recent_list li.new { background-color: #fff; }
.recent_list li .msg { margin-left: 35px; background: #f7f7f7; padding: 8px 10px; border-left: 1px solid #ddd; }
.recent_list li.new .msg { background: #fff; }
.recent_list li a.subject { margin: 2px 0; color: #333; font-weight: bold; display: block; }
.recent_list li a.subject:hover { text-decoration: none; color: #666; }
.msgmore a {
	display: block; text-align: center; color: #069; background: #eee; border: 1px solid #ddd; padding: 5px 0; margin-top: 5px;
	font-size: 10px; font-weight: bold; text-transform: uppercase; }
.msgmore a:hover { text-decoration: none; background: #bbb; color: #333; }



/***** 17. CONTENT SLIDER STYLES *****/
/*************************************/

.bx-wrapper { border: 1px solid #ddd; width: auto !important; line-height: 21px; overflow: hidden; }
.slide_wrap{ padding: 20px 50px ; min-height: 60px; }
.bx-prev {
	position: absolute; top: 0; left: 0; width: 30px; height: 100%; opacity: 0.6; vertical-align: middle;
	background: #eee url(images/prev.png) no-repeat center center; border-right: 1px solid #ddd;
}
.bx-next {
	position: absolute; top: 0; right: 0; width: 30px; height: 100%; opacity: 0.6; vertical-align: middle;
	background: #eee url(images/next.png) no-repeat center center; border-left: 1px solid #ddd;
}
.bx-prev:hover, .bx-next:hover { opacity: 1; }
.slide_img { float: left; }
.slide_content { margin-left: 120px; }
.slide_content h4 { font-size: 18px; font-weight: normal; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.slide_content h4 a { color: #ff0000; }
.slide_content h4 a:hover { color: #485B79; }
.slide_content p { margin: 10px 0; }


/***** 18. CALENDAR STYLES *****/
/*******************************/


#external-events p { font-size: 11px; }
.external-event {
	background: #ff0000; color: #fff; padding: 8px 10px; margin-bottom: 5px; font-weight: bold;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; cursor: move;
}

.fc-header-left span.fc-state-active {
	background: #eee; color: #ff0000; border: 1px solid #ccc;
}
.fc-header-title {
	font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; text-transform: uppercase; padding: 5px 10px;
	border-bottom: 2px solid #ff0000;
}
.fc-header-title h2 { font-size: 18px; }
.fc-button-prev:hover, .fc-button-next:hover { background: #eee; color: #ff0000; border-color: #ccc; }
.fc-button-today:hover { color: #ff0000; background: #eee; border-color: #ccc; }

input.hasDatepicker {
	background-image: url(images/icons/calendar.png) !important; background-repeat: no-repeat !important;
	background-position: 5px 7px !important; padding-left: 27px !important; width: 80px !important;
}


/***** 19. STANDARD TABLES STYLES *****/
/**************************************/

#pos_r {float:right;border:0px solid #000;margin-bottom:10px;}
.pos_r_button {position:absolute; right: 60px; top: -10px; border:0px solid #000;margin-bottom:10px; width:auto;z-index: 1000;padding:0;}

.stdtable { width: 100%; border:3px solid #c0c0c0;padding:3px;margin-bottom:5px;background:#FBFBFB;}
.stdtable .con0 { background: #f6feff; }
.stdtable .con1 { background: #F3F3F3; }
.stdtable .con2 { background: #E4E4E4;font-weight:bold; }
.stdtable th {background:#999;color:#fff;padding: 5px 10px;}
.stdtable td {line-height: 21px; vertical-align: top; color: #333;height:15px;;}
.stdtable thead th, .stdtable thead td { border: 1px solid #ddd; text-align: center; }
.stdtable tfoot th, .stdtable tfoot td { padding: 7px 10px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; text-align: left; }
.stdtable thead th:first-child, .stdtable tfoot th:first-child,
.stdtable thead td:first-child, .stdtable tfoot td:first-child { border-left: 1px solid #ddd; }
.stdtable thead th.head0, .stdtable tfoot th.head0, .stdtable thead td.head0, .stdtable tfoot td.head0 { background-color: #fcfcfc; }
.stdtable thead th.head1, .stdtable tfoot th.head1, .stdtable thead td.head1, .stdtable tfoot td.head1 { background-color: #f7f7f7; }
.stdtable thead th.sorting, .stdtable thead td.sorting {
	background-image: url(images/sort_both.png); background-repeat: no-repeat; background-position: right center; }
.stdtable thead th.sorting_asc, .stdtable thead td.sorting_asc {
	background-image: url(images/sort_asc.png); background-repeat: no-repeat; background-position: right 9px; }
.stdtable thead th.sorting_desc, .stdtable thead td.sorting_desc  {
	background-image: url(images/sort_desc.png); background-repeat: no-repeat; background-position: right 9px; }
.stdtable thead th.nosort { background-image: none !important; }
.stdtable thead td { font-weight: bold; }
.stdtable thead td.center { text-align: center; }
.stdtable tbody tr td { padding: 8px 10px; border-right: 1px solid #eee; border-bottom: 1px solid #eee; color: #666; }
.stdtable tbody tr:last-child td { border-bottom: 1px solid #ddd; }
.stdtable tbody tr td:first-child { border-left: 1px solid #ddd; }
.stdtable tbody tr td:last-child { border-right: 1px solid #ddd; }
.stdtable tbody tr.togglerow td { background: #fff; padding: 15px; }
.stdtable tbody tr.togglerow:hover td { background: #fff; }
.stdtable tbody tr.hiderow { display: none; }
.stdtable .actions { text-align: center; }
.stdtable .actions a { display: inline-block; margin-left: 5px; border-left: 1px solid #ccc; padding-left: 5px; }
.stdtable .actions a:first-child { border-left: 0; margin-left: 0; }
.stdtable .actions a:hover { color: #ff0000; }
.stdtable a.title { font-weight: bold; color: #32415a; }
.stdtable a.title:hover { color: #ff0000; }
.stdtable a{ font-weight: bold; color: #0000FF; text-decoration:underline;font-size:102%;}
.stdtable a:hover { color: #A52A2A; }

/* icons on data table */
.stdtable a.add { background: url(images/icons/add.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.add span { display: none; }
.stdtable a.edit { background: url(images/icons/edit.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.edit span { display: none; }
.stdtable a.approve { background: url(images/icons/approve.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.approve span { display: none; }
.stdtable a.delete { background: url(images/icons/delete.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.delete span { display: none; }
.stdtable a.check { background: url(images/icons/check.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.check span { display: none; }
.stdtable a.detail { background: url(images/icons/detail.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.detail span { display: none; }
.stdtable a.print { background: url(images/icons/print.png) no-repeat left top; padding: 1px 10px; }
.stdtable a.print span { display: none; }

.rndtable { width: 100%; border:1px solid #c0c0c0; padding:0px; margin-bottom:5px; -moz-border-radius:5px; border-radius:5px; }
.rndtable thead th, .rndtable thead td {background:#f3f3f4; font-weight:bold; padding:5px; border-right: 1px solid #c0c0c0; border-bottom: 1px solid #c0c0c0; text-align: center;  }
.rndtable tbody tr td { padding:5px; border-right: 1px solid #c0c0c0; border-bottom: 1px solid #c0c0c0; color: #666; }

.tableoptions {
	background: #fcfcfc; border: 1px solid #ddd; border-bottom: 0; padding: 8px;
	-moz-border-radius: 0 1px 0 #fff; -webkit-border-radius: 0 1px 0 #fff; border-radius: 0 1px 0 #fff;
}
.tableoptions button {
	background: #fcfcfc; font-size: 11px; color: #999; padding: 8px 10px; border: 1px solid #ccc; margin: 0; outline: none;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.tableoptions button:hover { background: #eee; cursor: pointer; }
.tableoptions select {
	background: #fff; padding: 6px 5px 7px 5px; border: 1px solid #ccc; margin: 0; outline: none; font-size: 11px; color: #666;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}

.dataTables_wrapper { position: relative; }
.dataTables_length {border: 0px solid #ddd; border-bottom: 0; padding-top: 5px; }
.dataTables_paginate { padding: 8px; }
/*.dataTables_length, .dataTables_paginate { -moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; }*/
.dataTables_wrapper select {
	background: #fff; padding: 5px; border: 1px solid #bbb; margin: 0; outline: none; font-size: 11px; color: #666;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; margin: 0 5px;
}
.dataTables_wrapper input { border: 1px solid #ddd; padding: 7px 5px 8px 5px; width: 200px; background: #fff; }
.dataTables_filter { position: absolute; top: 7px; right: 8px; }
.dataTables_info { position: absolute; bottom: 5px; left: 40%; right:40%;margin-top: -15px;font-size:10px}
.dataTables_paginate { text-align: right; height:15px; }
.dataTables_paginate span { display: inline-block; }
.dataTables_paginate .paginate_button {
	border: 1px solid #ccc; padding: 5px 7px; margin-left: 5px; font-weight: bold; background: #fcfcfc;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;  font-size: 11px;
	-moz-box-shadow: 1px 1px 2px #ddd; -webkit-box-shadow: 1px 1px 2px #ddd; box-shadow: 1px 1px 2px #ddd;
}
.dataTables_paginate .paginate_active {
	border: 1px solid #ddd; background: #ddd;  color: #fff; padding: 5px 7px; margin-left: 5px; font-weight: bold;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-size: 11px;
}
.dataTables_paginate .paginate_button:hover { background: #ddd; border: 1px solid #ccc; cursor: pointer; color: #333; }


/***** 20. STANDARD FORM STYLES *****/
/************************************/


form input[type=text] {
	padding: 8px 5px; border: 1px solid #ccc; width: 85%; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; vertical-align: middle; -moz-box-shadow: inset 0 1px 3px #ddd;
	-webkit-box-shadow: inset 0 1px 3px #ddd; box-shadow: inset 0 1px 3px #ddd; color: #666;
}

form input[type=number] {
	padding: 8px 5px; border: 1px solid #ccc; width: 85%; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; vertical-align: middle; -moz-box-shadow: inset 0 1px 3px #ddd;
	-webkit-box-shadow: inset 0 1px 3px #ddd; box-shadow: inset 0 1px 3px #ddd; color: #666;
}

form input[type=password] {
	padding: 8px 5px; border: 1px solid #ccc; width: 85%; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; vertical-align: middle; -moz-box-shadow: inset 0 1px 3px #ddd;
	-webkit-box-shadow: inset 0 1px 3px #ddd; box-shadow: inset 0 1px 3px #ddd; color: #666;
}

form input:focus {
	background: #fff; -moz-box-shadow: inset 1px 1px 2px #eee; -webkit-box-shadow: inset 1px 1px 2px #eee; box-shadow: inset 1px 1px 2px #eee;
}
form textarea {
	padding: 6px 5px; border: 1px solid #ccc; width: 85%; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; -moz-box-shadow: inset 0 1px 3px #ddd; -webkit-box-shadow: inset 0 1px 3px #ddd;
	box-shadow: inset 0 1px 3px #ddd; background: #fcfcfc; color: #666;
}
form input[type=radio], form input[type=checkbox] { width: auto; margin: 0; vertical-align: middle; }
form input[type=submit], form input[type=button].btnSubmit {
	width: auto; margin: 0; font-weight: bold; color: #eee; background: #ff0000; border: 1px solid #ddd; padding: 7px 10px;
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px;text-transform: uppercase;
}
form input[type=submit]:hover, form input[type=button].btnSubmit:hover { background: #000000; border: 1px solid #3f526f; }
form input[type=reset], form input[type=button], input[type=button] {
	width: auto; margin: 0; font-weight: bold; color: #666; border: 1px solid #ccc; background: #eee; padding: 7px 10px;
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; margin-left: 5px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px;text-transform: uppercase;
}
form input[type=reset]:hover, form input[type=button]:hover , input[type=button]:hover { background: #ddd; cursor: pointer; color: #333; text-transform: uppercase;}
form select {
	border: 1px solid #ccc;  padding: 6px 5px 8px 5px; background: #fcfcfc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	-moz-box-shadow: inset 1px 1px 2px #ddd; -webkit-box-shadow: inset 1px 1px 2px #ddd; box-shadow: inset 1px 1px 2px #ddd; color: #666;height:33px;
}
form textarea:focus, form select:focus {
	background: #fff; -moz-box-shadow: inset 1px 1px 2px #eee; -webkit-box-shadow: inset 1px 1px 2px #eee; box-shadow: inset 1px 1px 2px #eee;
}

form button { border: 1px solid #ddd; background: #ff0000; color: #fff; cursor: pointer; padding: 7px 10px; font-weight: bold;text-transform: uppercase; }
form button.submit:hover { background: #485B79; border: 1px solid #ddd; color: #fff; }
form button:active {
	-moz-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.button-simpan{
	position: absolute;
	right: 20px;
	top: 10px;
}

form {color:#000;size:19px;}
form label{color:#000;size:19px; font-weight:bold;}
form .vsmallest, form input.vsmallest, form textarea.vsmallest { width: 5%; }
form .vsmallinput, form input.vsmallinput, form textarea.vsmallinput { width: 20%; }
form .smallinput, form input.smallinput, form textarea.smallinput { width: 40%; }
form .mediuminput, form input.mediuminput, form textarea.mediuminput { width: 60%; }
form .mediuminput1, form input.mediuminput1, form textarea.mediuminput1 { width: 40%; }
form .longinput, form input.longinput, form textarea.longinput { width: 85%; }
form input.v10, form textarea.v10 , form select.v10 { width: 10%; }
form input.v15, form textarea.v15 , form select.v15 { width: 15%; }
form input.v20, form textarea.v20 { width: 20%; }
form input.v30, form textarea.v30 { width: 30%; }
form input.v40, form textarea.v40 { width: 40%; }
form input.v45, form textarea.v45 { width: 45%; }
form input.v50, form textarea.v50 { width: 50%; }
form input.v60, form textarea.v60 { width: 60%; }
form input.v70, form textarea.v70 { width: 70%; }
form input.v80, form textarea.v80 { width: 80%; }
form input.v90, form textarea.v90 { width: 90%; }

form input.error { border: 1px solid #f00; }
form textarea.error { border: 1px solid #f00; }
form textarea.error { border: 1px solid #f00; }
form select.error { border: 1px solid #f00; }
form label.error { float: none; color: #f00; font-size: 11px; display: block; text-align: left; font-weight: bold; }
form label#stitle {width:90%;float:left;border:0px solid #000;text-align:left;padding:5px 10px;margin-bottom:5px;background:#CBD4E2;}
.stitle {width:100%;float:left;border:0px solid #000;text-align:left;padding:5px 10px;margin-bottom:5px;background:#CBD4E2;}
.stdform p, .stdform div.par { margin: 5px 0; }
.stdform div.par { overflow: hidden; }
.stdform div.field { margin-left: 22%; display: block; position: relative;border:0px solid #c0c0c0;min-height:30px; }
.stdform div.fieldC { margin-left: 22%; display: block; position: relative;border:0px solid blue;min-height:30px; }
.stdform div.fieldB { margin-left: 22%; display: block; position: relative;border:0px solid green;min-height:30px; }
.stdform div.fieldA { margin-left: 42%; display: block; position: relative;border:0px solid #ff0000;min-height:30px; }
.stdform span.field { margin-left: 22%; display: block; position: relative;border-bottom:1px solid #eee; line-height: 30px; padding-left: 5px; }
.stdform span.fieldA { margin-left: 42%; display: block; position: relative;border:0px solid #ff0000; line-height: 30px; padding-left: 10px; }
.stdform span.fieldC { margin-left: 22%; display: block; position: relative;border:0px solid #ff0000;;line-height: 30px; padding-left: 10px;  }
.stdform .formwrapper { display: block; padding-top: 5px; margin-left: 22%; line-height: 25px; }
.stdform label { width:20%;float: left; text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-right:10px;border:0px solid #ff0000;}
.stdform label.l-input-small { width:20%;float: left; text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-right:10px;border:0px solid #ff0000;}
.stdform label.l-input-small2 { width:40%;float: left; text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-right:10px;border:0px solid #ff0000;;}
.stdform label.l-input-small3 { width:24%;float: left; text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-right:10px;border:0px solid #ff0000;}
.stdform label.l-input-blue{ float: left; width: 120px; text-align: left; padding: 5px 0 5px 20px;background :#cfe3ef;margin-right:10px;border:0px solid #ff0000;}
.stdform div.field-blue { margin-left: 140px; display: block; position: relative;border:0px solid #c0c0c0;min-height:30px; }
.stdform span.text, .stdform div.text { margin-left: 220px; display: block; position: relative; }
.stdform span.field-inline{ display: inline-block; width: 200px; text-align: right; padding: 5px 20px 5px 0; background :#F3F3F4; margin-right:10px; margin-left: 20px;}
.stdform button.cancel { background: #eee; color: #666; border: 1px solid #ddd; }
.stdform button.cancel:hover { background: #ddd; border: 1px solid #ccc; }
.stdform button.cancel:active {
	-moz-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.7); -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.7);
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.7);
}
.stdform small.desc { font-size: 11px; color: #999; font-style: italic; display: block; margin: 5px 0 0 220px; }
.stdform .stdformbutton { margin-left: 220px; }
.stdform .btnSave{ position:absolute;top:5px;right:15px;}

/*** ANOTHER FORM STYLE ***/
.stdform2 p, .stdform2 div.par { border: 1px solid #ddd; background: #fcfcfc; margin: 0; border-top: 0; }
.stdform2 div.terms { border: 0; background: none; }
.stdform2 p:first-child, .stdform2 div.par:first-child { border-top: 1px solid #ddd; }
.stdform div.par { overflow: hidden; }
.stdform2 label { display: inline-block; padding: 20px; vertical-align: top; text-align: left; font-weight: bold; }
.stdform2 label.error { margin-left: 0; padding: 0; }
.stdform2 label small { font-size: 11px; color: #999; display: block; font-weight: normal; line-height: 16px; }
.stdform2 span.field, .stdform2 div.field { margin-left: 220px; display: block; background: #fff; padding: 20px; border-left: 1px solid #ddd; }
.stdform2 .stdformbutton { margin-left: 0; padding: 20px; background: #fff; }

/*** DUAL BOX ***/
.dualselect { margin-left: 220px; display: block; }
.dualselect select { height: 200px; width: 40%; }
.dualselect .ds_arrow { display: inline-block; vertical-align: top; padding-top: 60px; margin: 0 10px; }
.dualselect .ds_arrow .ds_prev, .dualselect .ds_arrow .ds_next {
	display: block; padding: 5px 10px 7px 10px; border: 1px solid #ccc; margin-bottom: 5px; font-size: 24px; font-weight: bold;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; background: #eee url(images/titlebg.png) repeat-x top left;
}
.dualselect .ds_arrow .ds_prev:hover, .dualselect .ds_arrow .ds_next:hover {
	background: #ff0000; color: #fff; border-color: #ddd; cursor: pointer;
}

/* CHARACTER COUNT */
.counter { display: block; margin: 5px 0; font-size: 14px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.warning { color: #bb0000; }
.exceeded { color: #ff0000; }



/***** 21. WIZARD STYLES *****/
/*****************************/


.wizard .hormenu { list-style: none; }
.wizard .hormenu li { float: left; width: 33%; padding: 10px 0; }
.wizard .hormenu li a { display: block; }
.wizard .hormenu li a:hover { text-decoration: none; }
.wizard .hormenu li a span.h2 {
	font-size: 16px; color: #999; text-align: center; display: block; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif;
	margin-bottom: 5px;
}
.wizard .hormenu li a span.dot {
	display: block; height: 20px; margin-top: 5px; text-align: center; background: url(images/stepline.png) repeat-x center left;
}
.wizard .hormenu li span.label { display: block; text-align: center; font-weight: bold; color: #999; margin-top: 10px; }
.wizard .hormenu li a span.dot span { width: 20px; height: 20px; display: inline-block; background: url(images/steps.png) no-repeat 0 -40px; }
.wizard .hormenu li:first-child a span.dot { margin-left: 47%; text-align: left; }
.wizard .hormenu li:last-child a span.dot { margin-right: 47%; text-align: right; }
.wizard .hormenu li a.done span.label { color: #666; }
.wizard .hormenu li a.done span.h2 { color: #ff0000; }
.wizard .hormenu li a.done span.dot span { background-position: 0 -20px; }
.wizard .hormenu li:first-child a.done span.dot span { background-position: 0 0; }
.wizard .hormenu li a.selected span.dot span { background-position: 0 -120px; }
.wizard .hormenu li:first-child a.selected span.dot span { background-position: 0 -100px; }
.wizard .hormenu li a.selected span.label { color: #666; }
.wizard .hormenu li a.selected span.h2 { color: #ff0000; }


/***** TABBED WIZARD *****/
.wizard .tabbedmenu { list-style: none; background: #f7f7f7; padding: 10px; padding-bottom: 0; border: 1px solid #ddd; }
.wizard .tabbedmenu li { display: inline-block; margin-right: 5px; position: relative; bottom: -1px; }
.wizard .tabbedmenu li a { display: block; padding: 10px 20px; color: #999; border: 1px solid #ddd; background: #eee; }
.wizard .tabbedmenu li a { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.wizard .tabbedmenu li a span { font-weight: bold; }
.wizard .tabbedmenu li a span.h2 {
	color: #999; display: block; font-size: 24px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-weight: normal; }
.wizard .tabbedmenu li a:hover { text-decoration: none; }
.wizard .tabbedmenu li a.selected, .wizard .tabbedmenu li a.done { background: #fff; color: #333; border-bottom: 1px solid #fff; }
.wizard .tabbedmenu li a.selected span.h2, .wizard .tabbedmenu li a.selected span { color: #ff0000; }
.wizard .tabbedmenu li a.done span.h2, .wizard .tabbedmenu li a.done span { color: #ff0000; }

.stepContainer {
	width: auto !important; height: auto !important; border: 1px solid #ddd; border-bottom: 0;  overflow: hidden;
	-moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0; padding: 0;
}
.stepContainer .content h4 {
	padding: 20px; border-bottom: 1px solid #ddd; background: #f9f9f9; -moz-border-radius: 2px 2px 0 0;
	-webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}
.stepContainer p { margin: 20px 0; }
.stepContainer .par p { margin: 10px; line-height: 21px; }
.stepContainer .par p:last-child { border-bottom: 0; }
.actionBar {
	padding: 20px; position: relative; overflow: hidden; clear: both; background: #fcfcfc; border: 1px solid #ddd;
	-moz-border-radius: 0 0 2px 2px; -webkit-border-radius: 0 0 2px 2px; border-radius: 0 0 2px 2px;
}
.actionBar .loader { float: left; display: none; }
.actionBar a {
	float: right; display: inline-block; padding: 7px 15px; background: #ff0000; color: #fff; margin-left: 5px; font-weight: bold;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; line-height: 21px; border: 1px solid #ddd;
}
.actionBar a:hover { text-decoration: none; background: #485B79; color: #fff; border: 1px solid #ddd; }
.actionBar a:active {
	-moz-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.3);
}
.actionBar a.buttonDisabled { background: #eee; border: 1px solid #ccc; color: #999; }
.actionBar a.buttonDisabled:hover { background: #eee; color: #999; cursor: default; }
.actionBar a.buttonDisabled:active { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
.actionBar .msgBox { margin: 40px 0 10px 0; position: relative; }
.actionBar .msgBox .content { padding: 7px 10px; background: #fffccc; color: #333; border: 1px solid #FEEA7A; }
.actionBar .msgBox .close {
	padding: 0 2px 2px 2px; background: none; line-height: 10px; text-transform: lowercase; font-size: 10px; position: absolute; top: 5px; right: 7px;
	color: #333; text-shadow: none; font-weight: bold; -moz-border-radius: 1px; -webkit-border-radius: 1px; border-radius: 1px;
}
.actionBar .msgBox .close:hover { background: #333; color: #eee; }


/***** VERTICAL WIZARD *****/
.verwizard .verticalmenu { list-style: none; float: left; width: 250px; }
.verwizard .verticalmenu li { margin-bottom: 2px; }
.verwizard .verticalmenu a { display: block; padding: 10px; color: #999; }
.verwizard .verticalmenu a:hover { text-decoration: none; }
.verwizard .verticalmenu a.selected { background: #ff0000; color: #fff; }
.verwizard .verticalmenu a.done { background: #999; color: #fff; }
.verwizard .verticalmenu a span { font-weight: bold; }
.verwizard .stepContainer { margin-left: 270px; }
.verwizard .actionBar { margin: 0 0 0 270px; }



/***** 22. BLOG STYLES *****/
/***************************/


.quickform p { margin: 10px 0; }
.quickform input { width: 60%; color: #666; }
.quickform input.xsmall { width: 20px; }
.quickform input.small { width: 50px; }
.quickform label { width: 100px; float: left; }
.quickform .quickformbutton button {
	margin-top: 10px; text-align: right; padding: 7px 20px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 0;
	background: #eee; border: 1px solid #ccc; cursor: pointer; font-weight: bold; color: #666;
}
.quickform .quickformbutton button:hover { background: #ddd; color: #333; }
.quickform .quickformbutton button:active {
	-moz-box-shadow: inset 1px 1px 3px #888; -webkit-box-shadow: inset 1px 1px 3px #888; box-shadow: inset 1px 1px 3px #888;
}
.quickform .quickformbutton button.update { background: #ff0000; color: #fff; border: 1px solid #ddd; }
.quickform .quickformbutton button.update:hover { background: #485B79; border: 1px solid #ddd; }
.quickform .quickformbutton button.update:active {
	-moz-box-shadow: inset 1px 1px 3px #1a2434; -webkit-box-shadow: inset 1px 1px 3px #1a2434; box-shadow: inset 1px 1px 3px #1a2434;
}
.quickform .monthselect { width: 80px; display: inline-block; vertical-align: middle; }
.quickform .loading { margin: 0 10px; font-style: italic; color: #999; font-size: 11px; display: none; }
.quickform .loading img { vertical-align: middle; margin-right: 5px; }


.quickform2 { margin: 10px; }
.quickform2 p { margin: 10px 0; }
.quickform2 label { display: block; margin-bottom: 5px; color: #333; width: 100px; }
.quickform2 input { width: 300px !important; }
.quickform2 input.smallinput { width: 60px !important; }
.quickform2 .action { margin-left: 120px; }



/***** 23. PROGRESS BAR STYLES *****/
/***********************************/


.progress { margin: 5px 0; }
.progress .bar { background: #eee; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; padding: 1px; border: 1px solid #bbb; }
.progress .bar {height:30px; -moz-box-shadow: inset 2px 2px 3px #fff; -webkit-box-shadow: inset 2px 2px 3px #fff; box-shadow: inset 2px 2px 3px #fff; }
.progress .bar .value {  height:26px;
	height: 5px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; background-image: url(images/progress.png); }
.progress .bar2 { height:30px; background: #eee; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; padding: 1px; border: 1px solid #bbb; }
.progress .bar2 { height:30px; -moz-box-shadow: inset 2px 2px 3px #fff; -webkit-box-shadow: inset 2px 2px 3px #fff; box-shadow: inset 2px 2px 5px #ccc; }
.progress .bar2 .value { height:26px; padding: 2px 0; text-align: center; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; color: #fff; }
.progress .bar2 .value { height:26px; background-image: url(images/progress.png); background-position: 0 0; font-size: 11px; font-weight: bold; }

.progress .bluebar {
	background-color: #06f; -moz-box-shadow: inset 1px 1px 2px #9af; -webkit-box-shadow: inset 1px 1px 2px #9af;
	box-shadow: inset 1px 1px 2px #9af;
}
.progress .orangebar { background-color: #F90; }
.progress .redbar { background-color: #cc0000; }

.progress150 { width: 150px; }


/***** 24. PAGINATION STYLE *****/
/********************************/


.pagination { list-style: none; overflow: hidden; margin-top: 5px; }
.pagination li { display: inline-block; float: left; margin-right: 5px; }
.pagination li.first, .pagination li.previous, .pagination li.next, .pagination li.last { font-size: 11px; }
.pagination li a { display: block; font-weight: bold; border: 1px solid #ccc; padding: 2px 10px; color: #333; line-height: 21px; vertical-align: top; }
.pagination li a { background: #f7f7f7; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.pagination li a:hover { cursor: pointer; text-decoration: none; background: #eee; }
.pagination li a.current { background: #ff0000; color: #fff; border: 1px solid #ddd; }
.pagination li.first a:active, .pagination li.previous a:active, .pagination li.next a:active, .pagination li.last a:active {
	background: #333; color: #fff; border:1px solid #272727;
}
.pagination li a.disable { color: #ccc; }
.pagination li a.disable:hover { background: #f7f7f7; cursor: default; }
.pagination li a.disable:active { background: #f7f7f7; border: 1px solid #ccc; color: #ccc; }

.pagination2 li a { padding: 4px 12px 6px 12px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; }


/***** 25. SLIM SCROLLBAR STYLES *****/
/*************************************/


.slimScrollDiv { border: 1px solid #ddd; }
.entrylist li { display: block; padding: 20px; border-bottom: 1px solid #ddd; }
.entrylist li.even { background: #fcfcfc; }
.entry_wrap { min-height: 60px; }
.entry_img { float: left; }
.entry_content { margin-left: 120px; }
.entry_content h4 { font-size: 18px; font-weight: normal; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.entry_content h4 a { color: #ff0000; }
.entry_content h4 a:hover { color: #485B79; }
.entry_content p { margin: 10px 0; }
.entry_content p:last-child { margin-bottom: 0; }



/***** 26. BREADCRUMBS STYLE *****/
/*********************************/


.breadcrumbs { display: block; list-style: none; border: 0px solid #ccc;height:20px; margin: 2px 20px 10px 10px; margin-top:-15px;font-color:#666;}
.breadcrumbs li { display: inline-block; background: url(images/breadcrumbs.png) no-repeat right center; margin-right: 2px; font-size: 10px; margin-top:-3px;border:0px solid #000;padding-right:10px;}
.breadcrumbs li:last-child { background: none; color: #666; }
.breadcrumbs li a { display: block; padding: 5px 4px 5px 5px;color:#666;}
.breadcrumbs li:first-child a { padding-left: 10px;color:#666; }
.breadcrumbs li a.hover { font-color:#F60;}

.breadcrumbs2 { background: none; }



/***** 27. COLOR PICKER STYLES *****/
/***********************************/


.colorselector {
	display: inline-block; height: 28px; width: 28x; vertical-align: middle;
	position: relative; vertical-align: middle; margin-left: 5px;
}
.colorselector span {
	display: block; height: 28px; width: 28px; position: absolute; left: 0; top: 0; cursor: pointer;
	background: #000 url(images/colorpicker/select2.png) no-repeat -4px -4px;
}



/***** 28. NOTIFICATION MESSAGES *****/
/*************************************/


.notibar {
	height: 51px; overflow: hidden; position: relative; margin-bottom: 20px; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px; line-height: 21px; -moz-box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.8);
	-webkit-box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.8); box-shadow: inset 0 1px 0 rgba(250, 250, 250, 0.8);
}
.notibar p { margin: 15px 10px 0 55px; font-size: 13px; color: #333; }
.notibar a.close {
	position: absolute; width: 14px; height: 14px; top: 5px; right: 5px; background-image: url(images/close.png); background-repeat: no-repeat; }
.notibar a.close:hover { cursor: pointer; }
.msgalert a.close { background-position: -14px 0; }
.msgalert a.close:hover { background-position: -14px -14px; }
.msginfo a.close { background-position: -42px 0; }
.msginfo a.close:hover { background-position: -42px -14px; }
.msgsuccess a.close { background-position: -28px 0; }
.msgsuccess a.close:hover { background-position: -28px -14px; }
.msgerror a.close { background-position: 0 0; }
.msgerror a.close:hover { background-position: 0 -14px; }
.announcement a.close { background-position: -56px 0; }
.announcement a.close:hover { background-position: -56px -14px; }

.msgalert { border: 1px solid #eac572; background: #ffe9ad url(images/notifications.png) no-repeat 0 -52px; }
.msginfo { border: 1px solid #99c4ea; background: #d1e4f3 url(images/notifications.png) no-repeat 0 -156px; }
.msgsuccess { border: 1px solid #c1d779; background: #effeb9 url(images/notifications.png) no-repeat 0 -104px; padding: 0 0 0 54px; }
.msgerror { border: 1px solid #e18b7c; background: #fad5cf url(images/notifications.png) no-repeat 0 0; padding: 0 0 0 54px; }
.announcement {
	border: 1px solid #fbe187; background: #ffffdf url(images/icons/blogperfume/Advertisment/advertisment-32.png) no-repeat 10px 10px;
	color: #95673f; height: auto;
}
.announcement h3 { margin: 15px 10px 10px 55px; }
.announcement p { margin: 15px 10px 15px 55px; }


/***** 29. CUSTOMER SUPPORT STYLES *****/
/***************************************/


.contactlist { list-style: none; line-height: 21px; }
.contactlist li { border: 1px solid #eee; border-top: 0; position: relative; padding: 1px; }
.contactlist li span.msgcount {
	position: absolute; top: 12px; right: 10px; font-size: 10px; padding: 3px 5px; line-height: 10px; color: #fff; background: #ff0000; font-weight: bold;
	-moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px;
}
.contactlist li a { padding: 8px 5px; display: block; color: #666; }
.contactlist li.online a { background: url(images/online.png) no-repeat right 16px; }
.contactlist li.new a { font-weight: bold; }
.contactlist li a:hover { background-color: #fcfcfc; text-decoration: none; }
.contactlist li a img { vertical-align: middle; display: inline-block; margin-right: 10px; }

.chatsearch { padding: 5px; background: #eee; border: 1px solid #ddd; overflow: hidden; }
.chatsearch input {
	float: left; border: 1px solid #ddd; padding: 7px 5px 7px 35px; width: 196px; background: #fff url(images/search.png) no-repeat left center;
	color: #ccc;
}
.chatsearch input:focus { color: #333; }

.chatcontent { height: 500px; position: relative; padding: 0; line-height: 21px; }
.chatcontent .messagebox { position: absolute; bottom: 0; left: 0; width: 100%; background: #f7f7f7; border: 1px solid #ddd; padding: 10px 0; }
.chatcontent .inputbox { display: block; margin-right: 90px; padding-right: 47px; }
.chatcontent .messagebox input {
	border: 1px solid #ccc; padding: 8px 5px 8px 30px; display: inline-block; margin-left: 10px;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	background: #fff url(images/chat.png) no-repeat 8px 8px; width: 100%;
}
.chatcontent .messagebox input:focus { -moz-box-shadow: 0 0 5px #eee; -webkit-box-shadow: 0 0 5px #eee; box-shadow: 0 0 5px #eee; }
.chatcontent .messagebox button {
	border: 1px solid #ddd; padding: 7px 0; text-align: center; font-weight: bold; background: #ff0000; color: #fff; float: right;
	display: inline-block; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;	width: 70px; margin-right: 10px;
}
.chatcontent .messagebox button:hover { background: #485B79; border: 1px solid #ddd; cursor: pointer; }
.chatmessage { height: 425px; border: 1px solid #ddd; background: #fdfdfd; overflow: auto; position: relative; }

#chatmessageinner p img { display: inline-block; vertical-align: middle; float: left; }
#chatmessageinner p { padding: 10px; }
#chatmessageinner .msgblock {
	background: #fff; margin-left: 40px; padding: 10px; border: 1px solid #ddd; display: block; -moz-box-shadow: 1px 1px 0 1px rgba(0,0,0,0.05);
	-webkit-box-shadow: 1px 1px 0 1px rgba(0,0,0,0.05); box-shadow: 1px 1px 0 1px rgba(0,0,0,0.05);
}
#chatmessageinner .time { font-size: 11px; color: #999; font-style: italic; }
#chatmessageinner .msg { margin-top: 10px; display: block; }

#chatmessageinner p.reply img { display: inline-block; vertical-align: middle; float: right; }
#chatmessageinner p.reply .msgblock { margin: 0 40px 0 0; }



/***** 30. BUTTONS & ICONS STYLES *****/
/**************************************/


.anchorbutton {
	padding: 8px 10px; border: 1px solid #ddd; background: #f7f7f7; display: inline-block; font-weight: bold;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}

form input[type=submit].add {
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	background-repeat: no-repeat; background-image: url(images/icons/sprites.png); background-color: #f7f7f7;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #666;
	background-position: -190px -12px; padding-left:30px;
}

form input[type=submit].edit {
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	background-repeat: no-repeat; background-image: url(images/icons/sprites.png); background-color: #f7f7f7;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #f7f7f7;
	background-position: -195px -484px; padding:10px; font-size:0px;
}

form input[type=submit].delete {
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	background-repeat: no-repeat; background-image: url(images/icons/sprites.png); background-color: #f7f7f7;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #f7f7f7;
	background-position: -195px -516px; padding:10px; font-size:0px;
}

form input[type=submit].save {
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	background-repeat: no-repeat; background-image: url(images/icons/sprites.png); background-color: #f7f7f7;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #666;
	background-position: -195px -549px; padding:0px; padding-left:20px;  padding-bottom:5px;
}

form input[type=submit].cancel {
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	background-repeat: no-repeat; background-image: url(images/icons/sprites.png); background-color: #f7f7f7;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #666;
	background-position: -195px -579px; padding:0px; padding-left:20px;  padding-bottom:5px;
}


.buttonlist { list-style: none; }
.buttonlist li { display: inline-block; margin-bottom: 15px; margin-right: 10px; }
a.tmb{
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #666;
}
a.tmb:hover { text-decoration: none; color: #ff0000; border: 1px solid #bbb; }
a.tmb span {
	padding: 5px 10px; width: 10px; display: block; background: #f7f7f7; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}
a.btn{
	display: inline-block; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: bold;
	background-repeat: no-repeat; background-image: url(images/icons/sprites.png); background-color: #f7f7f7;
	-moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; color: #666;
}
a.btn:hover { text-decoration: none; color: #ff0000; border: 1px solid #bbb; }
a.btn span {
	padding: 5px 10px; margin-left: 25px; display: block; background: #f7f7f7; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;text-transform: uppercase;
}
a.btn2 { -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; }
a.btn2 span { -moz-border-radius: 0 50px 50px 0; -webkit-border-radius: 0 50px 50px 0; border-radius: 0 50px 50px 0; padding-right: 15px; }
a.btn3 { width: 34px; height: 32px; }
a.btn4 { width: 34px; height: 32px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; }

a.btn_search { background-position: -10px -12px; }
a.btn_trash { background-position: -47px -12px; }
a.btn_flag { background-position: -82px -12px; }
a.btn_home { background-position: -119px -12px; }
a.btn_link { background-position: -154px -12px; }
a.btn_book { background-position: -190px -12px; }

a.btn_mail { background-position: -10px -47px; }
a.btn_help { background-position: -47px -47px; }
a.btn_rss { background-position: -82px -47px; }
a.btn_archive { background-position: -119px -47px; }
a.btn_info { background-position: -154px -47px; }
a.btn_bell { background-position: -190px -47px; }

a.btn_world { background-position: -10px -83px; }
a.btn_bulb { background-position: -47px -83px; }
a.btn_cloud { background-position: -82px -83px; }
a.btn_clip { background-position: -119px -83px; }
a.btn_folder { background-position: -154px -83px; }
a.btn_lock { background-position: -190px -83px; }

a.btn_tag { background-position: -10px -119px; }
a.btn_note { background-position: -47px -119px; }
a.btn_key { background-position: -82px -119px; }
a.btn_stop { background-position: -119px -119px; }
a.btn_airplane { background-position: -154px -119px; }
a.btn_info2 { background-position: -190px -119px; }

a.btn_alarm { background-position: -10px -155px; }
a.btn_clock { background-position: -47px -155px; }
a.btn_calendar { background-position: -82px -155px; }
a.btn_basket { background-position: -119px -155px; }
a.btn_dollartag { background-position: -154px -155px; }
a.btn_cart { background-position: -190px -155px; }

a.btn_cart2 { background-position: -10px -191px; }
a.btn_user { background-position: -47px -191px; }
a.btn_users { background-position: -82px -191px; }
a.btn_male { background-position: -119px -191px; }
a.btn_female { background-position: -154px -191px; }
a.btn_refresh { background-position: -190px -191px; }

a.btn_chart { background-position: -10px -227px; }
a.btn_pie { background-position: -47px -227px; }
a.btn_address { background-position: -82px -227px; }
a.btn_zip { background-position: -119px -227px; }
a.btn_document { background-position: -154px -227px;margin-top:5px; }
a.btn_blanc { background-position: -1000px -299px; }
a.btn_pdf { background-position: -190px -227px; }

a.btn_marker { background-position: -10px -262px; }
a.btn_sign { background-position: -47px -262px; }
a.btn_note { background-position: -82px -262px; }
a.btn_cut { background-position: -119px -262px; }
a.btn_pencil { background-position: -154px -262px; }
a.btn_paint { background-position: -190px -262px; }

a.btn_battery { background-position: -10px -299px; }
a.btn_battery2 { background-position: -47px -299px; }
a.btn_chat { background-position: -82px -299px; }
a.btn_chat2 { background-position: -119px -299px; }
a.btn_message { background-position: -154px -299px; }
a.btn_message2 { background-position: -190px -299px; }

a.btn_phone { background-position: -10px -335px; }
a.btn_call { background-position: -47px -335px; }
a.btn_inbox { background-position: -82px -335px; }
a.btn_inboxo { background-position: -119px -335px; }
a.btn_inboxi { background-position: -154px -335px; }
a.btn_bluetooth { background-position: -190px -335px; }

a.btn_wifi { background-position: -10px -370px; }
a.btn_settings { background-position: -47px -370px; }
a.btn_settings2 { background-position: -82px -370px; }
a.btn_settings3 { background-position: -119px -370px; }
a.btn_hd { background-position: -154px -370px; }
a.btn_hd2 { background-position: -190px -370px; }

a.btn_image { background-position: -10px -408px; }
a.btn_image2 { background-position: -47px -408px; }
a.btn_sound { background-position: -82px -408px; }
a.btn_media { background-position: -119px -408px; }
a.btn_mic { background-position: -154px -408px; }
a.btn_print { background-position: -190px -408px; }

a.btn_laptop { background-position: -10px -443px; }
a.btn_mouse { background-position: -47px -443px; }
a.btn_camera { background-position: -82px -443px; }
a.btn_video { background-position: -119px -443px; }
a.btn_grid { background-position: -154px -443px; }
a.btn_grid2 { background-position: -190px -443px; }

a.btn_list { background-position: -10px -480px; }
a.btn_list2 { background-position: -47px -480px; }
a.btn_table { background-position: -82px -480px; }

.stdbtn {
	font-weight: bold; padding: 7px 10px; border: 1px solid #ccc; background: #eee url(images/buttons.png) repeat-x top left; color: #333;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; cursor: pointer; opacity: 0.8;
}
.stdbtn:hover { text-decoration: none; opacity: 1; }

.btn_yellow { background-position: 0 -38px; border-color: #ebb205; color: #ae510d; }
.btn_blue { background-position: 0 -76px; border-color: #0282ce; color: #fff; }
.btn_black { background-position: 0 -114px; border-color: #222; color: #fff; }
.btn_lime { background-position: 0 -152px; border-color: #59bf04; color: #367501; }
.btn_orange { background-position: 0 -190px; border-color: #cd7a03; color: #6e3c17; }
.btn_red { background-position: 0 -228px; border-color: #a31314; color: #fff; }

.stdbtn:active { background: #eee; }
.btn_yellow:active { background: #ffde06; }
.btn_blue:active { background: #0591e5; }
.btn_black:active { background: #333333; }
.btn_lime:active { background: #6adc0b; }
.btn_orange:active { background: #ff9702; }
.btn_red:active { background: #eb2f30; }


/***** CUSTOM COLOR *****/
a.btn_orange {
	background-image: url(images/icons/sprites.white.png); background-color: #ff0000; color: #fff;
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-color: #ddd; opacity: 0.9;
}
a.btn_orange span { background-color: #ff0000; border-left: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
a.btn_orange:hover { opacity: 1; color: #fff; border-color: #ddd; }

a.btn_blue {
	background-image: url(images/icons/sprites.white.png); background-color: #0f91f5; color: #fff;
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-color: #0976c9; opacity: 0.9;
}
a.btn_blue span { background-color: #0f91f5; border-left: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
a.btn_blue:hover { opacity: 1; color: #fff; border-color: #0976c9; }

a.btn_black {
	background-image: url(images/icons/sprites.white.png); background-color: #333; color: #fff;
	-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-color: #222; opacity: 0.9;
}
a.btn_black span { background-color: #333; border-left: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
a.btn_black:hover { opacity: 1; color: #fff; border-color: #222; }

a.btn_yellow {
	background-color: #fee74d; color: #fff; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
	border-color: #ebb205; opacity: 0.9;
}
a.btn_yellow span { background-color: #fee74d; border-left: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
a.btn_yellow:hover { opacity: 1; color: #fff; border-color: #ebb205; }


/***** 31. TYPOGRAPHY STYLES *****/
/*********************************/

blockquote {
	font-size: 16px; font-family: Georgia, "Times New Roman", Times, serif; background: url(images/quote.png) no-repeat 0 0;
	font-style: italic; line-height: 24px; padding-left: 30px; margin: 10px 0;
}
blockquote.alignleft { width: 300px; float: left; margin: 10px 10px 5px 0; }
blockquote.alignright { width: 300px; float: right; margin: 10px 0 5px 10px; text-align: left; }



/***** 32. NEWS FEED STYLES *****/
/********************************/


.statusbox {
	border: 1px solid #ddd; padding: 15px; overflow: hidden; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px; background: #fcfcfc;
}
.status_thumb {
	float: left; padding: 5px; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	vertical-align: middle; background: #fff; -moz-box-shadow: 0 1px 0 #ddd; -webkit-box-shadow: 0 1px 0 #ddd; box-shadow: 0 1px 0 #ddd;
}
.status_content { margin-left: 85px; padding-right: 20px; }
.status_content textarea {
	background: #fff; display: block; width: 100%; border: 1px solid #ddd; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px; padding: 10px; color: #666; min-height: 47px
}
.statusbox .photoupload { float: left; margin-left: 82px; }
.statusbox .submit { margin-top: 10px; text-align: right; }


.updatelist { list-style: none; }
.updatelist li { display: block; margin: 10px 0; padding: 10px 0; border-bottom: 1px solid #eee; }
.updatelist li:first-child { margin-top: 0; padding-top: 0; }
.updatethumb {
	float: left; padding: 5px; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	background: #fff; -moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee;
}
.updatecontent { margin-left: 75px; min-height: 70px;  }
.updatecontent .top { font-size: 11px; }
.updatecontent .top a:hover { text-decoration: underline; }
.updatecontent .top .user { font-size: 12px; font-weight: bold; color: #ff0000; }
.updatecontent .text { margin: 10px 0; line-height: 21px; }
.updatecontent .photo {
	margin: 10px 0; padding: 5px; display: inline-block; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; -moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee;
}

.news_photopreview { padding: 10px; }
.news_photodetails { padding: 0 10px 10px 10px; }

.commentlist { overflow: hidden; margin-bottom: 50px; line-height: 21px; }
.commentlist li { border-bottom: 1px solid #eee; margin-bottom: 20px; }
.commentlist li:last-child { margin-bottom: 0; }
.comment_authorimg {
	float: left; padding: 3px; border: 1px solid #ddd; background: #fff; -moz-box-shadow: 0 1px 0 #eee;
	-webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee;
}
.commenttitle { margin: 10px 0; border-bottom: 1px solid #eee; padding-bottom: 10px; font-size: 14px; }

.commentcontent { margin-left: 45px; }
.commentcontent .top { font-size: 11px; }
.commentcontent .top a:hover { text-decoration: underline; }
.commentcontent .top .user { font-size: 12px; font-weight: bold; color: #ff0000; }
.commentcontent .text { margin: 10px 0 20px 0; line-height: 21px; }
.commentcontent .photo {
	margin: 10px 0; padding: 10px; display: inline-block; border: 1px solid #ddd; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px;
}

.news_commentform { position: absolute; left: 0; bottom: 0; width: 100%; }
.news_commentform form { display: block; padding: 10px; margin: 5px; background: #f7f7f7; border-top: 1px solid #ddd; overflow: hidden; }
.news_commentform form input { width: 100%; }


/***** 33. PROFILE PAGE STYLES *****/
/***********************************/

.profile_wrapper { width: 700px; padding-right: 20px; border-right: 1px solid #ddd; }
.profilepic {
	padding: 5px; background: #fff; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; float: left; display: block; margin-left: 20px;
}
.profilepic img { width: 40px; }
.profiletitle { border:0px solid #000;margin-left: 85px; }
.profiletitle .pagetitle, .profiletitle .pagedesc { margin: 0; }

.followbtn { position: absolute; top: 0; right: 0; }
.profile_summary {
	list-style: none; border: 1px solid #ddd; overflow: hidden; display: inline-block; background: #f7f7f7;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff; line-height: 12px;
}
.profile_summary li { display: inline-block; float: left; }
.profile_summary li a { display: block; font-weight: bold; padding: 10px 20px; border-left: 1px solid #ddd; }
.profile_summary li a:hover { background: #fff; }
.profile_summary li.current a { background: #fff; }
.profile_summary li:first-child a { border-left: 0; }
.profile_summary li a span { color: #ff0000; }

blockquote.bq2 {
	background: #fcfcfc url(images/quote2.png) no-repeat 10px 10px; padding: 10px 35px; font-size: 14px; position: relative;
	border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; margin: 40px 0 20px 0;
}

.edit_status {
	display: inline-block; background: url(images/icons/sprites.png) no-repeat -162px -269px; width: 16px; height: 16px;
	position: absolute; top: 5px; right: 5px; opacity: 0.8; display: none;
}
.edit_status:hover { opacity: 1; cursor: pointer; }

.profile_about { line-height: 21px; }
.profile_about p:first-child { margin-top: 0; }

.recentblog { min-height: 200px; }
.blogthumb {
	padding: 5px; border: 1px solid #ddd; background: #fff; float: left; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; -moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee;
}
.blogthumb:hover img { opacity: 0.8; }
.blogsummary { line-height: 21px; margin-left: 280px; min-height: 200px; }
.blogsummary h3 { font-weight: normal; margin-bottom: 5px; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.blogsummary h3 a:hover { color: #ff0000; }

.blogviewthumb {
	padding: 5px; border: 1px solid #ddd; background: #fff; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	-moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee;
}
.blogcontent { line-height: 21px; margin-left: 0; }
.blogcontent h3 { font-weight: normal; margin: 20px 0 5px 0; font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }

.addcomment { padding-right: 10px; margin-bottom: 20px; }
.addcomment textarea { width: 100%; }

.recentshots { list-style: none; }
.recentshots li { float: left; overflow: hidden; margin: 0 20px 20px 0; }
.recentshots li:last-child { margin-right: 0; }
.recentshots li a.th {
	border: 1px solid #ddd; display: block; padding: 5px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.recentshots li a.th:hover img { opacity: 0.8; }
.recentshots h4 { display: block; margin-top: 10px; }
.recentshots h4 a { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; font-size: 14px; color: #ff0000; }
.recentshots h4 a:hover { text-decoration: underline; }

.followerlist { list-style: none; }
.followerlist li { display: block; margin-bottom: 20px; }
.userfollow { border: 1px solid #ddd; padding: 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; overflow: hidden; }
.userfollow .th { float: left; }
.userfollow .cn { margin-left: 40px; }
.userfollow .cn a { display: block; }
.userfollow .cn a:hover { color: #ff0000; }
.userfollow .cn small { color: #999; }



/***** 34. PHOTO SHARING STYLES *****/
/************************************/


.photosharing_head {
	padding: 15px 20px; background: #fcfcfc; border-bottom: 1px solid #ddd; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}

.photosharing_menu { list-style: none; position: relative; }
.photosharing_menu li { display: inline-block; float: left; }
.photosharing_menu li a {
	padding: 4px 10px 5px 10px; border: 1px solid #ccc; display: block; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; font-weight: bold; -moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff;
	box-shadow: inset 0 1px 0 #fff; background-color: #fff;
}
.photosharing_menu li a:hover { background-color: #eee; border-color: #bbb; cursor: pointer; }
.photosharing_menu li a.prev, .photosharing_menu li a.next {
	display: block; padding: 15px; border: 1px solid #ccc; cursor: pointer; background-color: #fff;
}
.photosharing_menu li a.prev:hover, .photosharing_menu li a.next:hover { background-color: #eee; border-color: #bbb; }
.photosharing_menu li a.prev {
	border-right: 0; background: #fff url(images/arrow.png) no-repeat 10px 8px; -moz-border-radius: 2px 0 0 2px;
	-webkit-border-radius: 2px 0 0 2px; border-radius: 2px 0 0 2px;
}
.photosharing_menu li a.prev_disabled { background-position: 10px -46px; cursor: default; }
.photosharing_menu li a.prev_disabled:hover { border-color: #ccc; background-color: #fff; }
.photosharing_menu li a.next {
	background: #fff url(images/arrow.png) no-repeat -39px 8px; -moz-border-radius: 0 2px 2px 0; -webkit-border-radius: 0 2px 2px 0;
	border-radius: 0 2px 2px 0;
}
.photosharing_menu li a.next_disabled { background-position: -39px -46px; cursor: default; }
.photosharing_menu li a.next_disabled:hover { border-color: #ccc; background-color: #fff; }

.photosharing_menu li a.viewsizes {
	background-image: url(images/preview.png); background-position: 7px 8px; background-repeat: no-repeat; padding-left: 30px;
}
.photosharing_menu li a.trash {
	padding: 15px; background-image: url(images/trash.png); background-position: 7px 7px; background-repeat: no-repeat;
}

.dropdown { position: relative; }
.dropdown ul { display: none; }
.dropdown .dropdown_label { padding-right: 30px; }
.dropdown span.arrow {
	position: absolute; top: 12px; right: 10px; background: url(images/default/menuarrow.png) no-repeat 0 0; width: 11px; height: 5px;
	display: block;
}
.dropdown ul {
	position: absolute; min-width: 150px; top: 0; left: 0; background: #fff; z-index: 100; border: 1px solid #ddd;
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.05); -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.05); box-shadow: 1px 1px 2px rgba(0,0,0,0.05);
}
.dropdown ul li { display:  block; float: none; }
.dropdown ul li a { border: 0; border-bottom: 1px solid #ddd; background: none; display: block; }
.dropdown ul li a:hover { background: #f9f9f9; border-color: #ddd; color: #ff0000; }
.dropdown ul li:last-child a { border-bottom: 0; }

.photosharing_wrapper { width: 700px; padding: 20px; margin-right: 0; }
.photopreview {
	padding: 10px; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	-moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee; background: #fff;
}
.photosharing_wrapper h2 { font-family: 'RobotoCondensed', Arial, Helvetica, sans-serif; }
.photosharing_wrapper .desc { margin: 15px 0; }
.photosharing_wrapper .desc p { margin: 15px 0; }
.photosharing_wrapper .desc p:first-class { margin-top: 0; }

.ps_sidebar { width: 250px; padding: 20px 0; }
.ps_sidebar .ps_author {
	float: left; padding: 3px; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	background: #fff; -moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee; display: block;
}
.ps_sidebar .ps_authorinfo { margin-left: 45px; line-height: 18px; }
.ps_sidebar .ps_authorinfo a { font-weight: bold; color: #ff0000; }
.ps_sidebar .ps_authorinfo a:hover { text-decoration: underline; }
.ps_sidebar .viewinfo { margin: 20px 0; border-bottom: 1px dashed #ddd; padding-bottom: 5px; }
.ps_sidebar .viewinfo span { padding-left: 22px; display: inline-block; }
.ps_sidebar .viewinfo .numviews { background: url(images/icons/bar.png) no-repeat left center; margin-right: 20px; }
.ps_sidebar .viewinfo .numcomments { background: url(images/icons/comment.png) no-repeat left center; }

.morephotolist { list-style: none; }
.morephotolist li { display: inline-block; float: left; margin: 0 10px 10px 0; }
.morephotolist li a {
	display: block; padding: 5px; border: 1px solid #ddd; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; -moz-box-shadow: 0 1px 0 #eee; -webkit-box-shadow: 0 1px 0 #eee; box-shadow: 0 1px 0 #eee;
}
.morephotolist li a:hover { border-color: #999; opacity: 0.8; }

.sharing_commentform form { margin: 20px 0; display: block; }
.sharing_commentform form input { width: 100%; }



/***** 35. PRODUCT LIST STYLES *****/
/***********************************/


.prodwrapper { width: 800px; border-right: 1px solid #ccc; overflow: hidden; }

.prodhead {
	padding: 15px 20px; background: #fcfcfc; border-bottom: 1px solid #ddd; -moz-box-shadow: inset 0 1px 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 #fff; box-shadow: inset 0 1px 0 #fff;
}

.prodhead_menu { list-style: none; position: relative; }
.prodhead_menu li { display: inline-block; float: left; }
.prodhead_menu li a {
	padding: 4px 10px 5px 10px; border: 1px solid #ccc; display: block; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; font-weight: bold; -moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff;
	box-shadow: inset 0 1px 0 #fff; background-color: #fff;
}
.prodhead_menu li a:hover { background-color: #eee; border-color: #bbb; cursor: pointer; }
.prodhead_menu li a.prev, .prodhead_menu li a.next {
	display: block; padding: 15px; border: 1px solid #ccc; cursor: pointer; background-color: #fff;
}
.prodhead_menu li a.prev:hover, .prodhead_menu li a.next:hover { background-color: #eee; border-color: #bbb; }
.prodhead_menu li a.prev {
	border-right: 0; background: #fff url(images/arrow.png) no-repeat 10px 8px; -moz-border-radius: 2px 0 0 2px;
	-webkit-border-radius: 2px 0 0 2px; border-radius: 2px 0 0 2px;
}
.prodhead_menu li a.prev_disabled { background-position: 10px -46px; cursor: default; }
.prodhead_menu li a.prev_disabled:hover { border-color: #ccc; background-color: #fff; }
.prodhead_menu li a.next {
	background: #fff url(images/arrow.png) no-repeat -39px 8px; -moz-border-radius: 0 2px 2px 0; -webkit-border-radius: 0 2px 2px 0;
	border-radius: 0 2px 2px 0;
}
.prodhead_menu li a.next_disabled { background-position: -39px -46px; cursor: default; }
.prodhead_menu li a.next_disabled:hover { border-color: #ccc; background-color: #fff; }
.prodhead_menu li.right { float: right; }
.prodhead_menu li .pagenuminfo { margin-top: 5px; display: inline-block; }

.prodlist { list-style: none; margin: 20px; }
.prodlist li {
	display: inline-block; position: relative; color: #eee; cursor: pointer; text-shadow: 1px 1px rgba(0,0,0,0.3); margin-bottom: 3%; }
.prodlist li a { color: #ff0000; }
.prodlist li .thumb { padding: 5px; border: 1px solid #ddd; }
.prodlist li .thumb img { width: 225px; }
.prodlist li .content { position: absolute; top: 5px; left: 5px; width: 225px; height: 163px; overflow: hidden; }
.prodlist li .contentinner { background: url(images/bluetrans.png); padding: 5px 7px; margin-top: 132px; height: 163px; }
.prodlist li .title { color: #fff; font-family: 'RobotoCondensed',Arial,Helvetica,sans-serif; font-size: 13px; }
.prodlist li .title:hover { color: #ff0000; }
.prodlist li .price { color: #fff; font-weight: bold; float: right; }
.prodlist li .by { font-size: 11px; font-style: italic; }
.prodlist li .desc { font-size: 11px; margin: 5px 0; line-height: 16px; }



/***** 36. MESSAGES STYLES *****/
/*******************************/


.mailinbox tbody tr td { background: #fafafa; }
.mailinbox tbody tr.unread td { background: #fff; font-weight: bold; }
.mailinbox tbody tr.selected td { background: #fcfee4; }
.mailinbox a.title { font-weight: normal; }
.mailinbox tbody tr.unread a.title { font-weight: bold; }
.mailinbox td.star, .mailinbox td.attachment { text-align: center; }
.msgstar {
	display: inline-block; width: 16px; height: 16px; background: url(images/icons/unstar.png) no-repeat 0 0;
	cursor: pointer; opacity: 0.5;
}
.msgstar:hover { opacity: 1; }
.starred { background-image: url(images/icons/star.png); opacity: 1; }

.msghead { padding-bottom: 20px; }

.msghead_menu { list-style: none; position: relative; }
.msghead_menu li { display: inline-block; float: left; }
.msghead_menu li a {
	padding: 4px 10px 5px 10px; border: 1px solid #ccc; display: block; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; font-weight: bold; -moz-box-shadow: inset 0 1px 0 #fff; -webkit-box-shadow: inset 0 1px 0 #fff;
	box-shadow: inset 0 1px 0 #fff; background-color: #fff;
}
.msghead_menu li a:hover { background-color: #eee; border-color: #bbb; cursor: pointer; }
.msghead_menu li a.prev, .msghead_menu li a.next {
	display: block; padding: 15px; border: 1px solid #ccc; cursor: pointer; background-color: #fff;
}
.msghead_menu li a.prev:hover, .msghead_menu li a.next:hover { background-color: #eee; border-color: #bbb; }
.msghead_menu li a.prev {
	border-right: 0; background: #fff url(images/arrow.png) no-repeat 10px 8px; -moz-border-radius: 2px 0 0 2px;
	-webkit-border-radius: 2px 0 0 2px; border-radius: 2px 0 0 2px;
}
.msghead_menu li a.prev_disabled { background-position: 10px -46px; cursor: default; }
.msghead_menu li a.prev_disabled:hover { border-color: #ccc; background-color: #fff; }
.msghead_menu li a.next {
	background: #fff url(images/arrow.png) no-repeat -39px 8px; -moz-border-radius: 0 2px 2px 0; -webkit-border-radius: 0 2px 2px 0;
	border-radius: 0 2px 2px 0;
}
.msghead_menu li a.next_disabled { background-position: -39px -46px; cursor: default; }
.msghead_menu li a.next_disabled:hover { border-color: #ccc; background-color: #fff; }

.msghead_menu li a.reportspam {
	background-image: url(images/icons/info.png); background-position: 7px 8px; background-repeat: no-repeat; padding-left: 30px;
}
.msghead_menu li a.msgtrash {
	padding: 15px; background-image: url(images/trash.png); background-position: 7px 7px; background-repeat: no-repeat;
}
.msghead_menu li.right { float: right; }
.msghead_menu .pageinfo { padding-right: 20px; display: block; margin-top: 5px; }
.msghead_menu .dropdown_label, .msghead_menu .msgtrash, .msghead_menu .reportspam { display: none; }



/***** 37. ERROR PAGES STYLES *****/
/**********************************/


.errorwrapper {
	margin: 40px auto; border: 1px solid #ddd; padding: 20px; background: #fcfcfc;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
}
.errorwrapper h1 { font-size: 25px; margin-bottom: 20px; }
.errorwrapper h3 { font-size: 18px; }
.errorwrapper ul { list-style: none; line-height: 28px; }
.errorwrapper ul li { text-indent: 30px; background: url(images/list.png) no-repeat 0 4px; }



/***** 38. CUSTOM STYLES *****/
/*****************************/


.alignright { text-align: right; }
.aligncenter { text-align: center !important; }
.radius2 { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.nopadding { padding: 0; }
.padding10 { padding: 10px; }
.width100, form input.width100 { width: 100px; }
.width50, form input.width50 { width: 50px; }
.clearall { clear: both; display: block; }
.nomargin { margin: 0; }
.marginleft5 { margin-left: 5px; }
.marginleft10 { margin-left: 10px; }
.marginleft20 { margin-left: 20px; }
.margin20 { margin: 20px; }
.margin1020 { margin: 10px 20px; }
.marginbottom0 { margin-bottom: 0; }
.nomargintop { margin-top: 0; }
.lineheight21 { line-height: 21px; }
.floatright { float: right; }
.noradiusright, form input.noradiusright {
	-moz-border-radius: 2px 0 0 2px;
	-webkit-border-radius: 2px 0 0 2px;
	border-radius: 2px 0 0 2px;
}
.orangeboldlink { color: #ff0000; font-weight: bold; }
.orangeboldlink:hover { text-decoration: underline; }
.orangeborderbottom5 { border-bottom: 5px solid #ff0000; }
.changetheme { position: absolute; left: 10px; bottom: 10px; font-size: 11px; }
.changetheme a { display: inline-block; margin-top: 5px; width: 15px; height: 15px; cursor: pointer; }
.changetheme a.default { background: #ff0000; }
.changetheme a.blueline { background: #319cff; }
.changetheme a.greenline { background: #78ce07; }
.changetheme a.contrast { background: #ff4800; }
.changetheme a.custombg { background: #666; }



/***** 39. GALLERY STYLES *****/
/******************************/


.gallerywrapper { padding: 20px; }
.imagelist { list-style: none; }
.imagelist li {
	float: left; padding: 5px; margin: 0 20px 20px 0; background: #fff; border: 1px solid #ddd; -moz-border-radius: 2px;
	-webkit-border-radius: 2px; border-radius: 2px;
}
.imagelist li:hover { border-color: #ccc; }
.imagelist li img { display: block; margin-bottom: 10px; width: 230px; }
.imagelist li span { display: block; text-align: right;}
.imagelist li span a { vertical-align: middle; }
.imagelist li span a.name { font-weight: bold; float: left; color: #999; }
.imagelist li span a.name:hover { color: #333; text-decoration: none; }
.imagelist li span a.edit, .imagelist li span a.view, .imagelist li span a.delete {
	display: inline-block; width: 16px; height: 16px; cursor: pointer; margin-left: 5px; vertical-align: middle; opacity: 0.5;
}
.imagelist li span a.edit:hover, .imagelist li span a.view:hover, .imagelist li span a.delete:hover { opacity: 1; }
.imagelist li span a.edit { background: url(images/icons/editor.png); }
.imagelist li span a.view { background: url(images/icons/glass.png); }
.imagelist li span a.delete { background: url(images/icons/trash.png); }

.photoEdit { width: 480px; }
.photoEdit h3 { font-size: 18px; }
.notifyMessage { padding: 7px 10px; font-weight: bold; margin: 10px 0; display: none; }
.notifySuccess { border: 1px solid #C1D779; background: #EFFEB9; display: block; }
.notifyError { border: 1px solid #E18B7C; background: #FAD5CF; display: block; }


/***** 40. SORTABLE LIST *****/
/*****************************/

.sortlist { list-style: none; }
.sortlist > li { display: block; margin-bottom: 7px; }
.sortlist > li div.label { padding: 10px; border: 1px solid #ccc; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; -moz-box-shadow: 0 1px 1px rgba(0,0,0,.05); -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
	box-shadow: 0 1px 1px rgba(0,0,0,.05); background: #eee url(images/titlebg.png) repeat-x top left; position: relative;
}
.sortlist > li span.moveicon {
	display: inline-block; width: 16px; height: 16px; background: url(images/icons/widgets.png) no-repeat 0 center; vertical-align: middle;
	margin-right: 10px; opacity: 0.3;
}
.sortlist > li span.moveicon:hover { opacity: 0.5; cursor: move; }
.sortlist > li span.arrowdrop {
	position: absolute; display: block; width: 20px; height: 30px; background: url(images/sort_desc.png) no-repeat center center;
	top: 6px; right: 5px; opacity: 0.5; border-left: 1px solid #ccc;
}
.sortlist > li span.arrowup { background-image: url(images/sort_asc.png); }
.sortlist > li span.arrowdrop:hover { opacity: 0.8; cursor: pointer; }
.sortlist > li div.details {
	border: 1px solid #ccc; border-top: 0; padding: 10px; -moz-border-radius: 0 0 2px 2px; -webkit-border-radius: 0 0 2px 2px;
	border-radius: 0 0 2px 2px; -moz-box-shadow: 0 1px 1px rgba(0,0,0,.05); -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
	box-shadow: 0 1px 1px rgba(0,0,0,.05); background: #fcfcfc; display: none;
}
.sortlist > li div.details p { margin: 10px 0; }
.sortlist > li div.details p:first-child { margin-top: 0; }
.sortlist > li div.details p:last-child { margin-bottom: 0; }


/***** 41. INVOICE STYLES *****/
/******************************/

.invoicewrapper { position: relative; }

.invoicelogo { height: 100px; overflow: hidden; }
.invoicefor { margin-top: 22px; }

.table { border-collapse: collapse; width: 100%; }
.table tr td { padding: 7px 10px; border: 1px solid #ddd; }
.table tr td:first-child { text-align: right; background: #fcfcfc; }

.invoiceinfo { margin-top: 40px; }
.invoicetable { margin-top: 40px; width: 100%; }
.invoicetable thead th.right { text-align: right; }
.invoicetable tr td { vertical-align: top; }
.invoicetable tr td.right { text-align: right; }

.amountdue { text-align: right; margin-top: 40px; }
.amountdue h1 span { font-size: 18px; }
.amountdue a {
	margin-top: 20px; display: inline-block; padding: 10px 40px; font-size: 14px; background: #ff0000;
	color: #fff; font-family: 'RobotoCondensed',Arial,Helvetica,sans-serif; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; border: 1px solid #e88125; -moz-box-shadow: inset 0 1px 0 rgba(250,250,250,0.3); text-shadow: 1px 1px rgba(0,0,0,0.1);
	-webkit-box-shadow: inset 0 1px 0 rgba(250,250,250,0.3); box-shadow: inset 0 1px 0 rgba(250,250,250,0.3);
}
.amountdue a:hover { opacity: 0.8; }

.companyinfof {
	position: absolute;
	top: 94px;
	left: 10px;
	z-index: 2;
	color: #fff;
	font-weight:normal;
}

.companyinfof a { color: #fff; }
.companyinfof a:hover { color: #ff0000; }

.userinfof {
	position: absolute;
	top: 91px;
	right: 20px;
	z-index: 2;
	color: #fff;
}
.userinfof span { font-weight: normal; }
.userinfof span.separator { font-size: 14px; }

.realupload {
	position:absolute;
	opacity:0;
	-moz-opacity:0;
	filter:alpha(opacity:0);
	border:solid 1px #000;
	width:350px;
	margin-left:5px;
	cursor:pointer;
}

.fakeupload {
	position:absolute;
	height:30px;
	width:350px;
	margin-top:-32px;
	margin-left:5px;
	background: url(../assets/images/upload.png) right no-repeat;
	cursor:pointer;
}

.grad{
	border:solid 1px #CCC;
	padding:5px;
	margin-bottom:20px;
	background: -webkit-linear-gradient(#F0F0F0,#FCFCFC);
	background: -o-linear-gradient(#F0F0F0,#FCFCFC);
	background: -moz-linear-gradient(#F0F0F0,#FCFCFC);
	background: linear-gradient(#F0F0F0,#FCFCFC);
}

.infobox{
	border:solid 1px #CCC;
	padding:10px;
	margin:10px;
	background: -webkit-linear-gradient(#F0F0F0,#FCFCFC);
	background: -o-linear-gradient(#F0F0F0,#FCFCFC);
	background: -moz-linear-gradient(#F0F0F0,#FCFCFC);
	background: linear-gradient(#F0F0F0,#FCFCFC);
	-moz-border-radius: 5px; -webkit-border-radius: 5px;
	border-radius: 5px;
}
.infotext{color: #32415a;margin-left:5px; }
.infotext a{ font-weight: bold; color: #32415a; }
.infotext a:hover { color: #ff0000; }
.infotext-l-input-small{width:15%;font-weight: bold;display:inline-block;text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-left:10px;margin-right:5px;border:0px solid #ff0000;}
.right-top{	position:absolute;right: 20px;top:15px;}

 /*CSS UCUP*/

fieldset{
  display: block;
  -webkit-margin-start: 2px;
  -webkit-margin-end: 2px;
  -webkit-padding-before: 0.35em;
  -webkit-padding-start: 0.75em;
  -webkit-padding-end: 0.75em;
  -webkit-padding-after: 0.625em;
  border: 1px solid #ccc;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
  min-width: -webkit-min-content;
  padding:10px;
   -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
}

legend{
  display: block;
  padding:0 2px;
  -webkit-padding-start: 2px;
  -webkit-padding-end: 2px;
  border: none;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
  font-size:11px;
  font-weight:bold;
  text-transform: uppercase;
}

legend.h4 {font-size: 12px;color: #434343;}

form input[type=date] {
	padding: 8px 5px; border: 1px solid #ccc; width: 85%; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	border-radius: 2px; background: #fcfcfc; vertical-align: middle; -moz-box-shadow: inset 0 1px 3px #ddd;
	-webkit-box-shadow: inset 0 1px 3px #ddd; box-shadow: inset 0 1px 3px #ddd; color: #666;
}

.splitter .left{
	float: left;
	width: 70%;
}

.splitter .right{
	width: 30%;
	float: right;
}

.splitter .left > p.title{
	font-size: 1.5em;
	font-weight: bold;
}

.splitter .right > p.title{
	font-size: 1.5em;
	font-weight: bold;
}

.splitter-box-prepared{
	margin-top: 3%;
	width: 30%;
	float: left;
}

.splitter-box-approval{
	 margin-top: 7%;
	float: left;
	width: 100%;
}

.approval-perencanaan{
	text-align: center;
}

.jabatan-wrapper{
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.5em;
}

.nama-wrapper
{
	font-size: 1.5em;
}

.splitters{
}

.splitters .sales-left{
	width: 1%;
	padding: 2%;
	font-size: 1.3em;
}

.splitters .sales-middle{
	float: left;
	width: 23%;
	text-align: left;
	padding: 2%;
	margin-top: -6.55%;
	margin-left: 4%;
}

.splitters .sales-right{
	float: left;
	width: 63%;
	padding: 0%;
	margin-top: -4.1%;
}

.splitters .sales-right .split{
	float: left;
	width: 45%;
}

.splitters .sales-right .split > p.title-wrapper{
	font-size: 1.3em;
	text-transform: uppercase;
}

.splitters .sales-middle > p.title-wrapper{
	font-size: 1.3em;
}

.splitters .sales-middle > p.subtitle-wrapper{
	font-size: 1.1em;
	text-align: right;
	padding:4%;
}

.splitters .sales-right .split-input .split{
	margin-bottom: 1.6%;
}

.splitters .sales-right .split-input2 .split{
	margin-bottom: 1.6%;
}

.splitters .sales-right .split-input2{
	margin-top:5.3%;
	padding-bottom: 1.6%;
}

.splitter .foto-pengesahan{
	background-color: green;
	float: left;
	margin-right: 2%;
}

.splitter .input-pengesahan{
}

.splitter .pengesahan-left{
	width: 50%;
}

.splitter .pengesahan-right{
	width: 50%;
	float: right;
	position: absolute;
	margin-left: 43.5%;
	margin-top: -4.1%;
}

.announcement h5 { margin: 15px 10px 10px 55px; }
#chartContainer{margin-bottom: 10px;}
#chartContainer-2{margin-bottom: 10px;}
#chartContainer-3{margin-bottom: 10px;}
#chartContainer-4{margin-bottom: 10px;}
#chartContainer-5{margin-bottom: 10px;}

.ucup-box{ width: 95%; height: 300px; margin: 0 auto;}
.ucup-box-header{ background-color: rgba(255, 255, 255, 0.3); padding: 10px; text-align: center; }
.ucup-box-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.ucup-box-content{ text-align: center; color: #FFF; padding-top: 80px; }
.ucup-box-number{ font-size: 5em; vertical-align: middle; }
.ucup-box-description{font-size: 1.3em; padding-top: 10px; color: #CCC;}

.ucup-box2{ width: 95%; height: 150px; margin: 0 auto;}
.ucup-box2-header{ background-color: rgba(255, 255, 255, 0.3); padding: 10px; text-align: center; }
.ucup-box2-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.ucup-box2-content{ text-align: center; color: #FFF; padding-top: 30px; }
.ucup-box2-number{ font-size: 5em; vertical-align: middle; }

.ucup-box3{ width: 95%; height: 125px; margin: 20px auto 0 auto;}
.ucup-box3-header{ background-color: rgba(255, 255, 255, 0.3); padding: 2px; text-align: center; }
.ucup-box3-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.ucup-box3-content{ text-align: center; color: #FFF; padding-top: 8px; }
.ucup-box3-number{ font-size: 5em; vertical-align: middle; }

.dark-orchid{ background-color: #9A00AD; }
.camarone{ background-color: #297140; }
.goldenrod{ background-color: #E1A300 }
.citrus{ background-color: #9CB500 }
.caper{ background-color: #C2D69B }
.moon-raker{ background-color: #B2A1C7 }
.allports{ background-color: #31849B }
.chocolate{ background-color: #E36C0A }
.pink { background-color: #FFB9B7;}
.murky-green { background-color: #9BCA3E; }
.sky-blue{ background-color: #E8F2FF; }
.light-blue { background-color: #3DD2F9; }
.green-blur { background-color: #BADB84; }
.purple-orchid { background-color: #E5B9FF; }

th.rotate {
  height: 150px;
  white-space: nowrap;
}

th.rotate > div {
  transform: translate(0px, 120px) rotate(270deg);
  width: 30px;
}

.ucup-icon {background-repeat: no-repeat; padding-left: 20px; line-height: 16px; }
.email { background-image: url(images/icons/mail.png);}
.call { background-image: url(images/icons/call.png);}
.ucup-full-width { width: 100% !important;}
/*END CSS UCUP*/

/**MAZTE**/

.alignCenter { text-align: center; }
.alignLeft { text-align: left; }
.alignRight { text-align: right; }
.required {
  color: red;
}
.stdform label.l-input-smallspan { width:12%;float: left; text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-right:10px;border:0px solid #ff0000;}
.stdform label.l-input-medium { width:29%;float: left; text-align: right; padding: 5px 20px 5px 0;background :#F3F3F4;margin-right:10px;border:0px solid #ff0000;}
#contentwrapper form label.error {
  background: none repeat scroll 0 0 transparent;
  color: #f00;
  display: block;
  float: none;
  font-size: 11px;
  font-weight: bold;
  left: 0;
  margin: 0;
  padding-left: 160px;
  text-align: left;
  width: 100%;
}
.pos_r_button_popup {position:absolute; right: 60px; border:0px solid #000;margin-bottom:10px; width:auto;z-index: 1000;padding:0;}

#sfilter {
  display: none;
}
/**END MAZTE*/

/* BULE CSS */
.box{
	height:auto;
	width:95%; margin-left:5px;
	border:1px solid #efefef;
	border-radius: 3px;
	position:absolute;
	margin-top: 5px;
	-moz-box-shadow: inset 0 -40px 40px -40px #cfcdcd;
    -webkit-box-shadow: inset 0 -40px 40px -40px #cfcdcd;
    box-shadow: inset 0 -40px 40px -40px #cfcdcd;
}

.box img{
	padding: 5px;
	border: 1px solid #efefef;
	border-radius: 5px;
	width: 90px;
}

/* END BULE CSS */

.subtitle{
  font-weight: normal;
  font-size: 10px;
  font-style: italic;
}
.ji{
background-image: url(images/icons/calendar.png) !important;
background-repeat: no-repeat !important; background-size: 18px;
background-position: 5px 8px !important; padding-left: 27px !important; width: 120px !important;
}

/* CSS PANJUL CSS */
.widgetbox1 { margin-top: 30px; }
.widgetbox1 .title { padding: 0 20px 5px 0; margin: 20px 0; display: inline-block; border-bottom: 2px solid #ff0000;width:98%; }
.widgetbox1:first-child .title { margin-top: 0; }
.widgetbox1 .title h4 { font-size: 16px; font-weight: normal; text-transform: uppercase; }

.widgetbox1 { }
.widgetbox1 .title { margin: -10px 0; }
.widgetbox1 .title h3 {
	font-size: 16px; text-transform: uppercase; font-family: 'RobotoBoldCondensed', Arial, Helvetica, sans-serif; font-weight: normal; }
.widgetbox1 .widgetcontent { line-height: 21px; }
.widgetcontent ul.linklist { list-style: none; }
.widgetcontent ul.linklist li { border-bottom: 1px dotted #ddd; padding: 1px 0; }
.widgetcontent ul.linklist li a { display: block; padding: 2px 5px; color: #666; }
.widgetcontent ul.linklist li a:hover { background: #f7f7f7; text-decoration: none; }

.widgetbox1 .titlehover h2 span { background: #333 url(images/icons/arrow.png) no-repeat right; }
.widgetbox1 .widgettoggle { overflow: hidden; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }

/* END CSS PANJUL */

a.next{
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #ff0000;
}


.box2{ width: 95%; height: 150px; margin: 0 auto;border-radius:10px;}
.box2-header{ background-color: rgba(255, 255, 255, 0.3); padding: 10px; text-align: center; }
.box2-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.box2-content{ text-align: center; color: #FFF; padding-top: 30px; }
.box2-number{ font-size: 5em; vertical-align: middle; }

.box3{ width: 95%; height: 125px; margin: 20px auto 0 auto;}
.box3-header{ background-color: rgba(255, 255, 255, 0.3); padding: 2px; text-align: center; }
.box3-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.box3-content{ text-align: center; color: #FFF; padding-top: 8px; }
.box3-number{ font-size: 5em; vertical-align: middle; }

.bintang-box{ width: 80%; margin: 0 auto;}
.bintang-box-header{ background-color: rgba(255, 255, 255, 0.3); padding: 10px; text-align: center; }
.bintang-box-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.bintang-box-content{ text-align: center; color: #FFF; padding-top: 80px; }
.bintang-box-number{ font-size: 5em; vertical-align: middle; }
.bintang-box-description{font-size: 1.3em; padding-top: 10px; color: #CCC;}

.bintang-box2{ width: 95%; height: 150px; margin: 0 auto;}
.bintang-box2-header{ background-color: rgba(255, 255, 255, 0.3); padding: 10px; text-align: center; }
.bintang-box2-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.bintang-box2-content{ text-align: center; color: #FFF; padding-top: 30px; }
.bintang-box2-number{ font-size: 5em; vertical-align: middle; }

.bintang-box3{ width: 95%; height: 125px; margin: 20px auto 0 auto;}
.bintang-box3-header{ background-color: rgba(255, 255, 255, 0.3); padding: 2px; text-align: center; }
.bintang-box3-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.bintang-box3-content{ text-align: center; color: #FFF; padding-top: 8px; }
.bintang-box3-number{ font-size: 5em; vertical-align: middle; }

.dashboard-box{ width: 95%; height: 150px; margin: 0 auto;border-radius:10px;}
.dashboard-box-header{ background-color: rgba(255, 255, 255, 0.3); padding: 10px; text-align: center; }
.dashboard-box-title{ color: #FFF; text-transform: uppercase; font-weight: bold; font-size: 1.2em; }
.dashboard-box-title-content{ background-color: rgba(255, 255, 255, 0.3); padding: 5px; text-align: center; margin-bottom:0;}
.dashboard-box-content{ text-align: center; color: #FFF; padding-top: 30px; }
.dashboard-box-number{ font-size: 5em; vertical-align: middle; }

.dark-orchid{ background-color: #9A00AD; }
.camarone{ background-color: #297140; }
.goldenrod{ background-color: #E1A300; }
.citrus{ background-color: #9CB500; }
.caper{ background-color: #C2D69B; }
.moon-raker{ background-color: #B2A1C7; }
.allports{ background-color: #31849B; }
.chocolate{ background-color: #E36C0A; }
/*.purple-orchid{ background-color: #CBC0D9; }
.light-blue { background-color: #B7DDE7; }
.murky-green { background-color: #D6E3BC; }
.orange{ background-color: #FBD4B4; }*/
.purple-orchid{ background-color: #E5B9FF; }
.purple-orchid2{ background-color: #ECE8FF; }
.light-blue { background-color: #3DD2F9; }
.murky-green { background-color: #9BCA3E; }
.pale-green { background-color: #EAFFF1; }
.sky-blue{ background-color: #E8F2FF; }
.orange { background-color: #FF9945; }
.pink { background-color: #FFB9B7;}
.pink2 { background-color: #FFEDF5; }
.merahtua { background-color: #800000 }
.top-right{position:absolute; top:0; right:0; margin-right:20px; margin-top:10px;}

.btn-appr {
	background-color: #04aa6d;
	padding: 2px;
	width: 100%;
	color: #f5f5f5;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-pending {
	background-color: #ffe000;
	padding: 2px;
	width: 100%;
	color: #000000;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-success2 {
	background-color: #2ecc71;
	padding: 2px;
	width: 100%;
	color: #000000;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-unappr {
	background-color: #ff0000;
	padding: 2px;
	width: 100%;
	color: #ffffff;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-koreksi {
	background-color: #000dff;
	padding: 2px;
	width: 100%;
	color: #ffffff;
	border-radius: 5px;
	border: 1px solid #eee;
}


/* STATUS BUTTON */

.btn-success{
	background-color: #2ecc71;
	color:#000; padding:3px 15px 3px 15px;
	font-weight: bolder;
	width: 80px;
	border-radius: 3px;
}

.btn-primary{
	background-color: #3498db;
	color:#000; padding:3px 15px 3px 15px;
	font-weight: bolder;
	width: 80px;
	border-radius: 3px;
}

.btn-warning{
	background-color: #f1c40f;
	color:#000; padding:3px 15px 3px 15px;
	font-weight: bolder;
	width: 80px;
	border-radius: 3px;
}

.btn-danger{
	background-color: #e74c3c;
	color:#000; padding:3px 15px 3px 15px;
	font-weight: bolder;
	width: 80px;
	border-radius: 3px;
}

.btn-default{
	background-color: #34495e;
	color:#000; padding:3px 15px 3px 15px;
	font-weight: bolder;
	width: 80px;
	border-radius: 3px;
}
/* END BULE CSS */


/***** GRID CONTAINER MONITORING *****/
.grid-containerrr {
	display: grid;
	grid-template-columns: auto auto auto auto;
	padding: 5px;
}

.grid-itemmm {
	padding: 10px;
	text-align: center;
}

/***** GRID CONTAINER *****/
.grid-container {
	display: grid;
	grid-template-columns: auto auto;
	padding: 5px;
}

.grid-item {
	padding-top: 10px;
	text-align: center;
}
/***** GRID CONTAINER TUGAS *****/
.grid-container-tugas {
	display: grid;
	grid-template-columns: auto auto auto;
	padding: 5px;
}

.grid-item-tugas {
	padding-top: 10px;
	text-align: center;
}


.btn-appr-kordinasi {
	background-color: #04aa6d;
	padding: 0px;
	width: 80px;
	color: #ffffff;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-unappr-kordinasi {
	background-color: #ff0000;
	padding: 0px;
	width: 80px;
	color: #ffffff;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-prospek-kordinasi {
	background-color: #ffc800;
	padding: 0px;
	width: 80px;
	color: #5c5c5c;
	border-radius: 5px;
	border: 1px solid #eee;
}


.btn-prospek {
	background-color: #ffc800;
	padding: 0px;
	width: 100%;
	color: #5c5c5c;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-progres {
	background-color: #02c0e2;
	padding: 0px;
	width: 100%;
	color: #ffffff;
	border-radius: 5px;
	border: 1px solid #eee;
}

.btn-defaults {
	background-color: #a5a8a0;
	padding: 0px;
	width: 100%;
	color: #ffffff;
	border-radius: 5px;
	border: 1px solid #eee;
}
