/* 
    Document   : mps_style
    Created on : July 24, 2013, 12:27:24 AM
    Author     : odyman
    Description:
    Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

body {
    font: 68%/1.4 Verdana, Arial, Helvetica, sans-serif;
    background: #FFFFFF;
    margin: 0;
    padding: 0;
    color: #000;
}

table {
	font: Verdana, Arial, Helvetica, sans-serif;
	border-collapse: collapse;
}

hr {
	border: none;
	border-bottom: solid 1px #cccccc;
}
/* ~~ Element/tag selectors ~~ */
ul, dl { 
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
    margin:1px;
    padding: 1px;
}
a img { 
	border: none;
}

a:link {
	color: #42413C;
	text-decoration: underline; 
}
a:visited {
	color: #6E6C64;
	text-decoration: underline;
}
a:hover, a:active, a:focus { 
	text-decoration: none;
}
.desc {
    line-height: 18px;
    
}
.desc p {
    margin-bottom: 20px;
    padding-bottom: 10px;
}
/* ~~ this fixed width container surrounds the other divs ~~ */
.container {
	width: 99%;
	/*background: url(../images/sync3.png) top right no-repeat;*/
	margin: 0px auto 0px auto;
	display: block;
}

.header {
	height: 85px;
	display: block;
}

.header #header-left {
	width: 50%;
	background: none;
	float: left;
	display: inline;
}

.header #header-right {
	width: 30%;
	background: none;
	padding: 10px;
	float: right;
	display: inline;
    color: #000000;
}

.header #header-right span {
	width: 500px;
	float: right;
	text-align: right;
	font-weight: normal;
	display: block;
	color: #EEE;
	margin: 0px 0px 10px 0px;
    color: #000000;
}

.header #header-right span#log {
	width: 500px;
	float: right;
	text-align: right;
	font-weight: bold;
	display: block;
	margin: 0px 0px 0px 0px;
	color: #666;
	text-decoration: none;
}

.header #header-right span a {
	color: #666;
	text-decoration: none;
}

.header #header-right span a:hover {
	color: #999;
    text-decoration: underline;
}

.header #header-left h2, .header #header-left h1, .header #header-left h3 {
	padding:1px;
	margin:1px;
	color:#FFF;
	text-shadow: #0A4869 0px 0px 10px;
}

.content {
/*    min-height: 500px;
    max-height: 1024px*/
    height: auto;
    
    width: 100%;
    background: #f8f8f8;
    display:block;

    clear: both;
    padding: 0px 0px 10px 0px;
    margin-top: 5px;
    -moz-border-radius: 2px; 
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px; 
    -moz-box-shadow:1px 1px 2px 1px #999999;    
    -webkit-box-shadow:1px 1px 2px 1px #999999;    
    -khtml-box-shadow: 1px 1px 2px 1px #999999;    
    box-shadow: 1px 1px 2px 1px #999999;    
}

.sub_content {
    padding: 4px;
    margin: 2px;
}

.sub_content h2 {
    color: #666;
}
/* ~~ The footer ~~ */
.footer {
    color: #000000;
    clear: both;
    margin: 0px 0px 10px 0px;
    padding: 10px 0;
    background: none;
    border: none;
    text-align: center;
}

/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {  
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/**********************************menu************************************************/
.pure_menu {
    display:block;
    background:#999;
    height: 30px;
    padding: 0px 10px 0px 4px;
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* W3C */  
    -moz-border-radius: 4px 4px 0px 0px; 
    -webkit-border-radius: 4px 4px 0px 0px;
    -khtml-border-radius: 4px 4px 0px 0px;
}
#pcm{display:none;}
ul.pureCssMenu ul{
    display:none;
}
ul.pureCssMenu li:hover>ul{
    display:block;
}
ul.pureCssMenu ul{
    position: absolute;
    left:-1px;
    top:98;
}
ul.pureCssMenu ul ul{
    position: absolute;
    left:98%;
    top:-1px;
}
ul.pureCssMenu,ul.pureCssMenu li > ul.pureCssMenum {
    margin:0px;
    list-style:none;
    padding:0px 1px 1px 0px;
    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top, #eeeeee 0%, #cccccc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #eeeeee 0%,#cccccc 100%); /* W3C */  
    border-color:#A6A6A6;
    border-width:0px;
    border-style:solid;
    
    z-index: 100;
}
ul.pureCssMenu li > ul.pureCssMenum{
	border-right:solid 1px #bbb;
}
ul.pureCssMenu li > ul.pureCssMenum:last-of-type{
	border-right:none;
}
ul.pureCssMenu table {border-collapse:collapse}ul.pureCssMenu {
    display:block;
    zoom:1;
    float: left;
}
ul.pureCssMenu ul{
    /*width:137.55px;*/
    width: 210px;
    min-width: 150px;
}
ul.pureCssMenu li{
    display:block;
    margin:1px 0px 0px 1px;
    font-size:0px;
}
ul.pureCssMenu a:active, ul.pureCssMenu a:focus {
   outline-style:none;
}
ul.pureCssMenu a, ul.pureCssMenu li.dis a, ul.pureCssMenu li.sep a {
    display:block;
    vertical-align:middle;
    border-width: 0px;
    border-color:#FCEEB0;
    border-style:solid;
    text-align:left;
    text-decoration:none;
    padding: 7px;
    padding-left: 6px;
    font:normal 12px Arial;
    color: #000000;
    text-decoration:none;
    cursor:pointer; 
}

ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
    background: #bbbbbb; /* Old browsers */ 	
} 

ul.pureCssMenu span{
    overflow:hidden;
}
ul.pureCssMenu li {
    float:left;
}
ul.pureCssMenu li#right a {
    float:right;
}
ul.pureCssMenu ul li {
    float:none;
}
ul.pureCssMenu ul a {
    text-align:left;
    white-space:nowrap;
}
ul.pureCssMenu li.sep{
    text-align:left;
    padding:0px;
    line-height:0;
    height:100%;
}
ul.pureCssMenu li.sep span{
    float:none;	
    padding-right:0;
    width:3;
    height:100%;
    display:inline-block;
    background-color:#A6A6A6;	
    background-image:none;
}
ul.pureCssMenu ul li.sep span{
    width:100%;
    height:3;
}
ul.pureCssMenu li:hover{
    position:relative;
}
ul.pureCssMenu li:hover>a{
    /*background-color:#FF1C1C;*/
    background-color:#36F;
    border-color:#4C99AB;
    border-style:solid;
    font:normal 12px Arial;
    color: #ffffff;
    text-decoration:none;
}
ul.pureCssMenu li a:hover{
    position:relative;
    /*background-color:#FF1C1C;*/
    background-color: #36F;
    border-color:#4C99AB;
    border-style:solid;
    font:normal 12px Arial;
    color: #ffffff;
    text-decoration:none;
}
ul.pureCssMenu li.dis a {
    color: #AAAAAA !important;
}
ul.pureCssMenu img {
    border: none;
    float:left;
    _float:none;
    margin-right:10px;
    width:16px;
    height:16px;
}
ul.pureCssMenu ul img {
    width:16px;
    height:16px;
}
ul.pureCssMenu img.over{
    display:none;
}
ul.pureCssMenu li.dis a:hover img.over{
    display:none !important;
}
ul.pureCssMenu li.dis a:hover img.def {
    display:inline !important;
}
ul.pureCssMenu li:hover > a img.def {
    display:none;
}
ul.pureCssMenu li:hover > a img.over {
    display:inline;
}
ul.pureCssMenu a:hover img.over,ul.pureCssMenu a:hover ul img.def,ul.pureCssMenu a:hover a:hover ul img.def,ul.pureCssMenu a:hover a:hover a:hover ul img.def,ul.pureCssMenu a:hover a:hover img.over,ul.pureCssMenu a:hover a:hover a:hover img.over,ul.pureCssMenu a:hover a:hover a:hover a:hover img.over{
    display:inline;
}
ul.pureCssMenu a:hover img.def,ul.pureCssMenu a:hover ul img.over,ul.pureCssMenu a:hover a:hover ul img.over,ul.pureCssMenu a:hover a:hover a:hover ul img.over,ul.pureCssMenu a:hover a:hover img.def,ul.pureCssMenu a:hover a:hover a:hover img.def,ul.pureCssMenu a:hover a:hover a:hover a:hover img.def{
    display:none;
}
ul.pureCssMenu a:hover ul,ul.pureCssMenu a:hover a:hover ul,ul.pureCssMenu a:hover a:hover a:hover ul{
    display:block;
}
ul.pureCssMenu a:hover ul ul,ul.pureCssMenu a:hover a:hover ul ul{
    display:none;
}
ul.pureCssMenu span{
    display:block;
    background-image:url(../images/arrv_blue_2.gif);
    background-position:right center;
    background-repeat: no-repeat;
    padding-right:10px;
}
ul.pureCssMenu li:hover>a>span{	
    background-image:url(../images/arrv_white_2.gif);
}
ul.pureCssMenu a:hover span{	
    _background-image:url(../images/arrv_white_2.gif);
}
ul.pureCssMenu ul span,ul.pureCssMenu a:hover table span{
    background-image:url(../images/arr_blue_2.gif);
}
ul.pureCssMenu ul li:hover > a span{	
    background-image:url(../images/arr_white_2.gif);
}
ul.pureCssMenu table a:hover span,ul.pureCssMenu table a:hover a:hover span,ul.pureCssMenu table a:hover a:hover a:hover span{
    background-image:url(../images/arr_white_2.gif);
}
ul.pureCssMenu table a:hover table span,ul.pureCssMenu table a:hover a:hover table span{
    background-image:url(../images/arr_blue_2.gif);
}
ul.pureCssMenu li a.pureCssMenui0{
    font:n;
}
ul.pureCssMenu li a.pureCssMenui0:hover{
    font:o;
}
ul.pureCssMenu li > ul.pureCssMenum  li ul.pureCssMenum{
	z-index:999 !important;
	width:auto !important;
	position:absolute;
	border:solid 1px #888;
}
/**********************************end menu************************************************/

#breadrumbs ul li {
    list-style-type:none;
    padding:0;
    margin-left:0.75em;
}		
#crumbs {
    background: #E6E7E8;
    height:2.3em;
    border:1px solid #dedede;
    -moz-border-radius: 0px 0px 6px 6px; 
    -webkit-border-radius: 0px 0px 6px 6px;
    -khtml-border-radius: 0px 0px 6px 6px;
}
#crumbs li {
    float:left;
    line-height: 2.3em;
    font-size: 10px;
    color:#777;
    padding-left:.75em;
}		
#crumbs li a {
    background: url(../images/arrow.png) no-repeat right center;
    display: block;
    color:#777;
    margin: 0px 0px 0px 0px;
    padding: 0px 15px 0px 0px;
}							
#crumbs li a:link,
#crumbs li a:visited {
    color:#777;
    text-decoration:none;
}	
#crumbs li a:hover,
#crumbs li a:focus {
    color:#444;
    background:url(../images/arrowhover.png) no-repeat right center;
}
    
.box_notify {
    border: solid 1px #d5f2f5;
    font-weight: bold;
}

.header_notify {
    padding: 4px;
    background: #eaeded;
}

.loading {
    margin-left: 10px;
    display: none;
}
.loading img {
    vertical-align: middle;
}

.link-alt a {
    font-weight: 700;
    font-size: 12px;
    text-decoration: none;
    color: #0099cc;
}

.link-alt a:hover {
    text-decoration: underline;
    font-weight: 800;
    color: #006699;
}

/* *******************************   accordion   ********************************** */

section{
    display: block;
} 

.accordion {
    background-color: none;
    padding: 4px;
    margin: 0px auto;
}

.accordion section {
    border: 1px solid #ddd;
    margin: 5px;
    background-color: #eee;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ddd));
    background-image: -webkit-linear-gradient(top, #eee, #ddd);
    background-image:    -moz-linear-gradient(top, #eee, #ddd);
    background-image:     -ms-linear-gradient(top, #eee, #ddd);
    background-image:      -o-linear-gradient(top, #eee, #ddd);
    background-image:         linear-gradient(top, #eee, #ddd);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.accordion h2,
 .accordion p {
    margin: 0;
}

.accordion p {
    padding: 10px;
}

.accordion h2 a {
    display: block;
    position: relative;
    font: 14px/1 'Trebuchet MS', 'Lucida Sans';
    padding: 10px;
    color: #333;
    text-decoration: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border-bottom: #ddd 1px solid;
}

.accordion h2 a:hover {
    background-color: #f2f2f2;
    border-bottom: #ddd 1px solid;
}

.accordion div {
    height: auto;
}

.accordion h2 + div {
    height: 0px;
    overflow: hidden;
    -moz-transition: height 0.3s ease-in-out;
    -webkit-transition: height 0.3s ease-in-out;
    -o-transition: height 0.3s ease-in-out;
    transition: height 0.3s ease-in-out;
}

.accordion :target h2 a:after{
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -3px;
    border-top: 5px solid #333;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.accordion :target h2 + div {
    height: auto;
    padding: 0px 0px 10px 0px;
}

table#statistik {
    margin: 10px;
    width: 930px;
    border: #ccc 1px solid;
}

table#statistik tr td {
    background-color: #f1f1f1;
    padding: 10px 10px 20px 10px;
    color: #666;
}

table#statistik tr th {
    background-color: #eee;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ddd), to(#eee));
    background-image: -webkit-linear-gradient(top, #ddd, #eee);
    background-image:    -moz-linear-gradient(top, #ddd, #eee);
    background-image:     -ms-linear-gradient(top, #ddd, #eee);
    background-image:      -o-linear-gradient(top, #ddd, #eee);
    background-image:         linear-gradient(top, #ddd, #eee);
    padding: 10px 0px 10px 0px;
    border: #ccc 1px solid;
}

table#notif {
    margin: 10px;
    width: 930px;
    border: #ddd 1px solid;
}

table#notif tr {
    border: #ccc 1px solid;			
}

table#notif tr:nth-child(odd) {
    background: #DCE3E8;
}

table#notif tr:nth-child(even) {
    background: #E2E7EB;
}

table#notif tr:hover {
    background: #EDF0F2;
}

table#notif tr td {
    padding: 6px;
}

div.trigger
{
    cursor: pointer;
    display: block;
    clear: both;
    padding: 6px 4px 6px 4px;
    border: solid 1px #C2CBE0;
    background-color: #2F6A9E;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#2F6A9E), to(#4688C2));
    background-image: -webkit-linear-gradient(top, #2F6A9E, #4688C2);
    background-image:    -moz-linear-gradient(top, #2F6A9E, #4688C2);
    background-image:     -ms-linear-gradient(top, #2F6A9E, #4688C2);
    background-image:      -o-linear-gradient(top, #2F6A9E, #4688C2);
    background-image:         linear-gradient(top, #2F6A9E, #4688C2);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2F6A9E', endColorstr='#4688C2',GradientType=0 ); /* IE6-9 */
    margin-bottom: 2px;
    -moz-border-radius: 6px; 
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
}

div.trigger a
{
    margin: 2px;
    color: #FFFFFF;
    font-size: 14px;
    text-shadow: 0px 0px 2px #284478;
    filter: dropshadow(color=#284478, offx=0, offy=0);  
    text-decoration: none;
}

.login_box {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;    
}
.form_info {
    margin: 2px;
    padding: 4px;
    background: #ffffff;

    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;

    -webkit-box-shadow: 1px 1px 2px 1px #999999;
    -moz-box-shadow: 1px 1px 2px 1px #999999;
    box-shadow: 1px 1px 2px 1px #999999;    
}
.form_info h2 {
    padding: 1px;
    margin: 2px;
}
.form_info label {
    display: block;
}
.form_info input[type='text'], .form_login input[type='password'] {
    padding: 8px;
    width: 95%;
    border: solid 1px #cccccc;
}

.form_info .layout_table {
    border-bottom: solid 1px #999999;
    margin-top: 10px;
    margin-bottom: 30px;
}

.form_info a {
    color: #1d61ce;
}

.form_login {
    margin: 2px;
    padding: 4px;
    background: #e5e5e5;

    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;

    -webkit-box-shadow: 1px 1px 2px 1px #999999;
    -moz-box-shadow: 1px 1px 2px 1px #999999;
    box-shadow: 1px 1px 2px 1px #999999;    
}
.form_login h2 {
    padding: 1px;
    margin: 2px;
}
.form_login label {
    display: block;
}
.form_login input[type='text'], .form_login input[type='password'] {
    padding: 8px;
    width: 95%;
    border: solid 1px #cccccc;
}

.form_login .layout_table {
    border-bottom: solid 1px #999999;
    margin-top: 10px;
    margin-bottom: 30px;
}

.form_login a {
    color: #1d61ce;
}

.link_shortcut ul {
    margin: 0;
    padding: 0;
}

.link_shortcut ul li {
    list-style: none;
}

.link_shortcut ul li a {
    display: block;
    padding: 6px;
    text-decoration: none;

    margin-bottom: 10px;
    
    border-bottom: dotted 1px #cccccc;
}

.link_shortcut ul li a:hover {
    border: solid 1px #cccccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* W3C */
    color: #000000;
}

.link_shortcut ul li a:active {
    background: #f3f3f3;
}

.link_shortcut ul li a img {
    vertical-align: middle;
    margin-right: 10px;
}

/******************************tabs************************************/
ul.tabs {
	margin: 0;
	padding: 0;
	
	list-style: none;
	height: 32px; /*--Set height of tabs--*/
	border-bottom: 1px solid #999;
	border-left: 1px solid #999;
	width: 100%;
}
ul.tabs li {
	float: left;
	margin: 0;
	padding: 0;
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
	border: 1px solid #999;
	border-left: none;
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
	overflow: hidden;
	position: relative;
	background: #e0e0e0;
}
ul.tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	font-size: 1.2em;
	padding: 0 20px;
	border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
	outline: none;
}
ul.tabs li a:hover {
	background: #ccc;
}
html ul.tabs li.active, html ul.tabs li.active a:hover  { /*--Makes sure that the active tab does not listen to the hover properties--*/
	background: #fff;
	border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/
}

.tab_container {
	border: 1px solid #999;
	border-top: none;
	overflow: hidden;
	clear: both;
	 
        width: 100%;
	background: #fff;
}
.tab_content {
	padding: 10px;
	font-size: 1.2em;
}
/**************************************************end tabs************************************/

div.desc ul li{
    padding-left: 6px;
    margin-left: 30px;
    list-style: square;
}

.info {
    line-height: 18px;
    padding: 4px;
    border: solid 1px #666666;
}

.info h3 {
    border-bottom: solid 1px #666666;
    margin-bottom: 10px;
}

.info h4 {
    margin-left: 6px;
}

div.desc .link_shortcut ul li {
    list-style: none;
	margin-right: 30px;
}

ul.desc_check {
    margin: 0;
    padding: 0;
}

ul.desc_check li {
    display: block;
    list-style: none;
}

ul.desc_check li input[type=checkbox]:active {
    background: #99ccff;
}

span.label_checkbox {
    display: inline-block;
    margin-left: 2px;
}
#toolbar-wrapper{display:inline-block; margin-bottom:10px; height:30px; width: 100%;}
#toolbar{ 
    width: 99%;
    background: 
    transparent; 
    padding:5px; 
    float:left;
}
#wrapper{ 
    padding: 0;
    margin: 10px 18px 10px 0;
}

.buttonAddNew
{
    height:16px;
    width:16px;
    line-height: 16px;
    background: url(../images/add.png) no-repeat center left;
    display:inline-block;
}	

.notif{
	display:block;
	background:#fff url(../images/notif-bg.png) left bottom repeat-x;
	border-radius:3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
	padding:3px 5px;
	-moz-box-shadow: 0 1px 3px #888;
	-webkit-box-shadow: 0 1px 3px#888;
	box-shadow: 0 1px 3px #888;
	font-size:12px;
	font-weight:bold;
	margin-bottom:10px;
}
/*---- Messages ------ */
.notif{
	display:block;
	background:#fff url(../images/notif-bg.png) left bottom repeat-x;
	border-radius:3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
	padding:3px 5px;
	-moz-box-shadow: 0 1px 3px #888;
	-webkit-box-shadow: 0 1px 3px#888;
	box-shadow: 0 1px 3px #888;
	font-size:12px;
	font-weight:bold;
	margin-bottom:10px;
}

.error, .warning, .info, .success{ line-height:1.3em; padding-left:24px; overflow:hidden; text-align:left; }

.error{
	color:#961311;
	background: url(../images/error.png) no-repeat;
}

.success{
	color:#3F5218;
	background: url(../images/success.png) no-repeat;
}

.warning{
	color:#84732C;
	background: url(../images/warning.png) no-repeat;
}

.info{
	color:#4C5153;
	background: url(../images/info.png) no-repeat;
}

.button-icon {
    height:16px;
    width:16px;
    line-height: 16px;
    display:inline-block;
}
.button-icon.grid
{
    background: url(../images/table_add.png) no-repeat center left;
}	

.button-icon.print
{
    background: url(../images/printer.png) no-repeat center left;
}	


.button-icon.download
{
    background: url(../images/download.png) no-repeat center left;
}

.button-icon.reorder
{
    background: url(../images/reorder.png) no-repeat center left;
}

.redRowClass{ background-color:#FF6F72 !important; background-image: none !important;}
.orangeRowClass{ background-color:#FEB572 !important; background-image: none !important;}
.yellowRowClass{ background-color:#E7FF91 !important; background-image: none !important;}
.greenRowClass{ background-color:#84FD9F !important; background-image: none !important;}
.color-legend{padding: 0.5em 0.4em 0.4em; border:solid 1px #DDDDDD; display:inline-block;}
.color-box-wrapper{padding:1px; position:relative;}
.color-box-wrapper span{float:left; position:relative;}
.color-box{width:10px; height:10px; margin:3px 7px 0px 15px; border:solid 1px #999; }

.error-box{
	background:#E65350 url(../images/red-warn.png) 5px center no-repeat;
	border-radius:3px;
	border:solid 1px #710200;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
	padding:5px 10px 5px 25px;
	-moz-box-shadow: 0 1px 3px #888;
	-webkit-box-shadow: 0 1px 3px#888;
	box-shadow: 0 1px 3px #888;
	font-size:12px;
	font-weight:bold;
	margin:0px auto;
	color:#fff;
}

#steps{padding:0px; text-align:center;}
#steps li{ display:inline-block; margin-left:-8px; }
#steps li.start{ margin-left:0px; }
.clickable{cursor:pointer;}
#steps li a, #steps li a img{border:none;}
#steps > li > a.clickable:hover{ padding:0px 4px;}
#terbilang {
    height: 20px;
    display: block;
    padding: 2px;
    margin: 2px;
    border-bottom: dotted 1px #cccccc;
    background: #FFF;
    font-style: italic;
    text-align: right;
    
}

div#modules li {
        display: list-item !important;
        list-style: none;
}