﻿/*START background image application*/
.mainbg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: -1;
}

* html .mainbg {
    display: none;
}

/*END background image application*/

/*START main.css*/

.aceeditor {
    margin: auto;
    position: relative;
    height: 500px;
    top: 10px;
    bottom: 0;
    left: 0;
    right: 0;
}


/* GENERAL */
* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: inherit;
}

body {
    font-family: Arial; /*background: #B3BAC2;*/
    font-size: 11px;
}

error {
    color: #B30500;
}

admin {
    border: 1px solid red;
}

h1 {
    border-bottom: 3px double #444;
    font-size: 14px;
    margin-bottom: 15px;
    color: #444;
    text-align: left;
}

input, select, textarea {
    font-family: Arial;
    font-size: 11px;
    border: 1px solid #777;
}

input, textarea {
    padding: 1px 0px;
}

    input.button {
        width: 100%;
        margin-top: 10px;
        border: 1px solid #444466;
    }

    input.smallbutton {
        width: 100px;
        margin-top: 10px;
        border: 1px solid #444466;
    }

    input.full, textarea.full {
        width: 100%;
    }

    input[type="checkbox"], input[type="radio"] {
        border: 0;
        vertical-align: middle;
        margin-right: 2px;
    }

table {
    border-collapse: collapse;
    background-color: Transparent;
    width: 100%;
}

    table.auto {
        width: auto;
    }

    table.middle td {
        vertical-align: middle;
    }


    table.padding, table.padding td, table.padding th {
        padding: 2px;
    }

    table.zero, table.zero td {
        padding: 0;
        margin: 0;
        vertical-align: middle;
    }

        table.zero td.title {
            vertical-align: top;
        }

td.zero {
    padding: 0;
}

.centered {
    margin: 0 auto;
}

td {
    text-align: left;
    padding: 2px;
}

    td.title {
        font-weight: bold;
        width: 150px;
        vertical-align: top;
        line-height: 18px;
    }

    td.center {
        text-align: center;
    }

    td.tablespace {
        width: 20px;
    }

tr.highlcontent {
    background-color: #FFD4BA;
}

tr.highlcontentyellow {
    background-color: #F7C261;
}

tr.highlcontentred {
    background-color: #FF3333;
}

tr.multilinecontent {
    vertical-align: top;
}

tr.multilinehighlcontent {
    background-color: #FFD4BA;
    vertical-align: top;
}

.pastState {
    background-color: #A4FF9E;
}

.nextState {
    background-color: #FFD4BA;
}

.alarmState {
    background-color: #F22738;
}

.followState {
    background-color: #FFD177;
}

p {
    padding: 5px 0;
}

a {
    color: #002570;
    text-decoration: none;
}

    a.currentlink {
        color: #e0472c;
    }

    a:hover {
        text-decoration: underline;
    }

.error {
    color: Red;
}

.errorPanel {
    border: 1px solid #F7941D;
    background: #FEEFDA url(../../images/validationerror.png) no-repeat left;
    padding: 5px 5px 5px 30px;
}

div.help {
    float: right;
    text-align: right;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: 30px;
}

    div.help a {
        color: White;
        font-weight: bold;
        font-size: 12px;
    }

ul, ol {
    margin-left: 20px;
}

.nowrap {
    white-space: nowrap;
}
/* HEADER */
#headerCtrl {
    width: 100%;
    height: 115px;
    background-color: #fff;
    margin-bottom: 10px;
}

#headerTop {
    width: 100%;
    height: 90px;
    background-color: #000000;
}



#headerBottomLeft {
    float: left;
    height: 25px;
    margin-left: 22px;
    font-size: 10px;
    cursor: pointer;
    padding-top: 3px;
}


#fullmenu {
    height: 25px;
    width: 100%;
}

/* FOOTER */
div#wizardDiv {
    height: 26px;
    padding-top: 1px;
}

table.wizardTable {
    width: 100%;
    margin-top: 10px;
}

    table.wizardTable td {
        padding: 2px;
        height: 20px;
        vertical-align: middle;
        background-color: #444;
        color: #fff;
        border: 1px solid #000;
        text-align: center;
        cursor: pointer;
    }

        table.wizardTable td a {
            color: #fff;
        }

        table.wizardTable td.write {
            background-color: #f00;
            color: #000;
        }

        table.wizardTable td.written {
            background-color: #008B00;
            color: #000;
        }

            table.wizardTable td.written:hover, table.wizardTable td.write:hover, table.wizardTable td.writing {
                background-color: #FFA500;
                color: #000;
            }

        table.wizardTable td.reading, table.wizardTable td:hover {
            background-color: #fff;
            color: #444;
        }

            table.wizardTable td:hover a {
                color: #444;
                display: block;
            }

        table.wizardTable td.selected {
            background-color: #fff;
            color: #444;
        }

    table.wizardTable .link {
        background-color: #444;
        color: #ffffff;
        text-align: center;
    }
/* SIDE  MENU */
#leftPanel {
    font-size: 11px;
    width: auto; /*background-color: #dee0e2;*/ /*border: 1px solid #444;*/
    padding-top: 0px;
    padding-bottom: 0px; /*margin-right: 15px;*/
}

    #leftPanel .nav ul {
        list-style-type: circle;
        margin-left: 20px;
    }

        #leftPanel .nav ul li {
            line-height: 18px;
            text-align: left;
            white-space: nowrap;
            padding-right: 5px;
        }

            #leftPanel .nav ul li a {
                color: #002570;
            }

                #leftPanel .nav ul li a.currentlink {
                    color: #e0472c;
                }

    #leftPanel a {
        white-space: nowrap;
        text-decoration: none;
        cursor: pointer;
    }

    #leftPanel span.title {
        padding: 5px;
        display: block;
        font-size: 14px;
        font-weight: bold;
        color: #000;
        text-align: left; /*background-color: #ccc;*/
        text-decoration: none;
        white-space: nowrap;
    }

    #leftPanel img.updown {
        vertical-align: bottom;
        padding-right: 4px;
    }

/* ANSWERWIZARD*/
#wizardsteps td {
    text-align: center;
}

    #wizardsteps td.selected, #wizardsteps td:hover {
        background-color: #444;
        color: #fff;
        cursor: pointer;
    }

        #wizardsteps td:hover a {
            color: #fff;
        }

span.question {
    font-size: large;
}

.questionPoints {
    width: 250px;
}

    .questionPoints td, .questionPoints th {
        text-align: center;
        border-bottom: 1px solid #444;
    }

        .questionPoints td.middle, .questionPoints th.middle {
            border-left: 1px solid #444;
            border-right: 1px solid #444;
        }

    .questionPoints tr.data:hover {
        background-color: #ccc;
        cursor: pointer;
    }

    .questionPoints tr.selected {
        background-color: #444;
        color: #fff;
        cursor: pointer;
    }

/* CONTENT */
div#container {
    padding: 0px 13px;
    margin-bottom: 13px;
}

div#contentPanel {
    /*background-color: #fff;*/
    border: 1px solid #444;
    text-align: left;
    _float: left;
    _margin-right: 15px;
}

div#contentPanelFull {
    /*background-color: #fff;*/
    border: 1px solid #444;
    text-align: left;
    overflow: auto;
}

div#content {
    /*padding: 10px;*/
}

    div#content p.title {
        font-size: 18px;
        font-weight: bold;
    }

div.mycontent {
    margin: 0 auto;
    width: 800px;
    background-color: #fff;
    border: 1px solid #444;
}

fieldset {
    width: auto;
    border: 1px solid #444;
    margin: 10px auto 0px auto;
    padding: 0px 10px 10px 10px;
}

legend {
    border: 1px solid #444;
    padding: 3px;
    margin-left: 10px;
    font-weight: bold;
    background-color: #444466;
    color: white;
}

table.stats {
    border-spacing: 2px;
    border-collapse: separate;
}

    table.stats th, table.stats td {
        padding: 2px;
        text-align: center;
        border: 1px solid #444;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        border-radius: 8px;
        behavior: url(/scripts/PIE.htc);
    }

    table.stats td {
        font-size: 12px;
        font-weight: bold;
    }

    table.stats.siss {
        border-spacing: 0px;
        border-collapse: collapse;
        width: auto;
        float: left;
        margin-right: 10px;
        min-width: 100px;
    }

        table.stats.siss th, table.stats.siss th a {
            background-color: Navy;
            color: White;
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            border-radius: 0px;
        }

        table.stats.siss td, table.stats.siss td a {
            color: Black;
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            border-radius: 0px;
        }

.statsYellow {
    background-color: #ffff00;
}

.statsOrange {
    background-color: #ff8000;
}

.statsGreen {
    background-color: #00ff00;
}

.statsRed {
    background-color: #ff0000;
}

.statsBlue {
    background-color: #9cf;
}

table.infoTable {
    width: 100%;
    border-spacing: 2px;
    background-color: #fff;
    border: 1px solid #444;
}

    table.infoTable td {
        height: 20px;
        vertical-align: middle;
        border: solid 1px #444;
        text-align: center;
    }

    table.infoTable th {
        font-family: Arial;
        font-weight: bold;
        font-size: 11px;
        color: #fff;
        height: 20px;
        vertical-align: middle;
        border: solid 1px #444;
        background-color: #446;
        text-align: center;
    }

        table.infoTable th a {
            color: #fff;
            text-decoration: underline;
        }

input.empty {
    color: #b7b7b7;
    font-style: italic;
    width: 100%;
}



/*
div.banner {
  margin: 0;
  font-size: 100%;
  font-weight: bold;
  line-height: 1.1;
  text-align: center;
  position: fixed;
  top: 15em;
  left: auto;
  width: 17em;
  right: 2em;
}
div.banner p {
  margin: 0; 
  padding: 0.3em 0.4em;
  background: #CCCCCC;
  border: thin outset #000;
  color: #002570;  
}
div.banner span {display: block; margin: 0 0.5em}
*/


/* Cost Center */
div#costcenter input[type=radio]:checked + label {
    font-weight: bold;
    font-size: 13px;
}

div#costcenter label {
    font-weight: normal;
    float: none;
    display: inline;
}

/* Last modification date */
span.lastmodif {
    font-size: 80%;
    float: right;
    font-style: italic;
    padding: 5px;
    margin: 10px;
}
/* Locked by message */
span.locked {
    color: red;
    font-size: 80%;
    float: right;
    font-style: italic;
    padding: 5px;
    margin: 10px;
}



/* Required field */
span.required {
    color: Red;
    display: inline;
}

span.oprequired {
    color: #880000;
    display: inline;
}

div.hrm h2 {
    font-size: larger;
    margin: 0px 0px 1em 10px;
    display: block;
    clear: both;
}


/* Form Layout General */
div.hrm fieldset {
    margin: 1.5em 0 0 0;
    padding: 0;
}

div.hrm legend {
    margin-left: 1em;
    color: #000000;
    font-weight: bold;
}

div.hrm fieldset ol {
    /*	padding: 1em 1em 0 1em;  */
    list-style: none;
}

div.hrm fieldset li {
    /*padding-bottom: 1em;  */
}

div.hrm fieldset.submit {
    border-style: none;
}

/* Form Layout Left align */
div.hrm label {
    float: left;
    width: 20em;
    margin-right: 2em;
    font-weight: bold;
}

div.hrm table.HorizontalCheckBoxList label {
    width: auto;
}


div.hrm label.help {
    clear: both;
    width: 20em;
    font-weight: lighter;
    font-style: italic;
}

div.hrm label.warning {
    clear: both;
    width: 20em;
    font-weight: lighter;
    font-style: italic;
    color: Red;
}


div.hrm fieldset li {
    float: left;
    clear: left;
    width: 100%;
    margin-bottom: 1em;
    position: relative; /*todo delete this */
}

    div.hrm fieldset li.rtLI /*fix spacing for radtreeview*/ {
        margin-bottom: auto;
    }

div.hrm fieldset {
    float: left;
    clear: both;
    width: 100%;
    margin: 0 0 1.5em 0;
    padding: 0;
    border-style: none;
}

    div.hrm fieldset.left {
        width: 49%;
        margin: 0 0 0 0;
    }

    div.hrm fieldset.leftleft {
        width: 35%;
        margin: 0 0 0 0;
    }

    div.hrm fieldset.leftright {
        width: 15%;
        clear: none;
        margin: 0 0 0 0;
    }

        div.hrm fieldset.leftright label, div.hrm fieldset.rightright label {
            float: left;
            width: 8em;
            margin-right: 1em;
            font-weight: bold;
        }

    div.hrm fieldset.right {
        width: 50%;
        float: right;
        clear: right;
        margin: 0 0 0 0;
    }

    div.hrm fieldset.rightleft {
        width: 35%;
        clear: right;
        margin: 0 0 0 0;
    }

    div.hrm fieldset.rightright {
        width: 15%;
        float: right;
        clear: right;
        margin: 0 0 0 0;
    }

        div.hrm fieldset.rightright li, div.hrm fieldset.leftright li {
            margin-bottom: 1.5em;
        }

    div.hrm fieldset.middle {
        /*width: 100%; */ /*margin: 0 0 0 0; */
        position: relative;
        left: 20em;
        clear: both;
    }

    div.hrm fieldset.left input.full, div.hrm fieldset.right input.full {
        max-width: 45%;
    }


    div.hrm fieldset.submit {
        float: none;
        width: auto;
        border: 0 none #FFF;
        padding-left: 12em;
    }

    div.hrm fieldset table {
        /*width: auto;     padding-left: 20em;*/
    }

        div.hrm fieldset table label {
            float: none;
            width: auto;
            margin-right: 0;
            font-weight: normal;
        }

/* Form Layout Legend */
div.hrm legend {
    margin-left: 1em;
    padding: 0;
    color: #000;
    font-weight: bold;
}
/*
fieldset {    
	float: left;    
	clear: both;    
	width: 100%;    
	margin: 0 0 1.5em 0;    
	padding: 0;    

	border: 1px solid #BFBAB0;    
	background-color: #F2EFE9;    

}
*/
/*
fieldset.submit {    
	float: none;    
	width: auto;    
	border-style: none;    
	padding-left: 12em;    
	background-color: transparent;    
}
*/

/* Form Layout inner fieldsets 
fieldset fieldset {      
	margin-bottom: -2.5em;      
	border-style: none;      
	background-color: transparent;      
	background-image: none;      
}      
fieldset fieldset legend {      
	margin-left: 0;      
	font-weight: normal;      
}      
fieldset fieldset ol {      
	position: relative;      
	top: -1.5em;      
	margin: 0 0 0 11em;      
	padding: 0;      
}      
fieldset fieldset label {      
	float: none;      
	width: auto;      
	margin-right: auto;      
}
*/


/* Form input layout
input.button {
	background-color:#E1EDF8;
	border:1px solid #AFCFE8;
	color:#004374;
	float:left;
	font-size:1em;
	padding:5px;
	text-decoration:none;
}
h1 
{
	
	
	text-align: left;
	
	font-size:1.7em;
	margin-bottom:10px;
}
*/


.suggest table {
    margin-left: 0px;
    padding-left: 0px;
}
/* Banner 
.dragContainer{ background-color: #DEE0E2; border:1px solid #444444; font-size:11px; padding-bottom:0; padding-top:0; width:auto;
float: right;
                
                }
.dragHeader{background-color: #CCCCCC; font-size:14px; font-weight:bold; padding:0px; text-align:left; text-decoration:none; white-space:nowrap;}
.dragContainer ul {list-style-type: circle; margin-left: 20px;}
.dragContainer ul li {display: inline;color: #002570; line-height: 18px; text-align: left; white-space: nowrap; padding-right: 5px;}
.dragContainer span.title {padding: 5px; display: block; font-size: 14px; font-weight: bold; color: #000; text-align: left; background-color: #ccc; text-decoration: none; white-space: nowrap;}
.dragContainer img.updown {vertical-align: bottom; padding-right: 4px;}
*/

/* banner
.tabset_tabs	{ font-size:14px; font-weight:bold;  margin: -15px 0 10px -10px; padding:0; list-style-type:none; position:relative; z-index:2; white-space:nowrap }
.tabset_tabs li	{ margin:0; padding:0; display:inline }
.tabset_tabs a	{ color:#339 ! important; background-color:#def ! important; border:1px solid #99c; text-decoration:none; padding:0 0.6em; border-left-width:0; border-bottom:none }
.tabset_tabs a:hover	{ color:#00c ! important; background-color:#eff ! important }
.tabset_tabs a.active	{ color:black ! important; background-color:white ! important; border-color:black; border-left-width:1px; cursor:default; border-bottom:white; padding-top:1px; padding-bottom:1px }
.tabset_tabs li.firstchild a	{ border-left-width:1px }
.tabset_content	{ border:1px solid black; background-color:white; position:relative; z-index:1; padding:0.5em 1em; display:none }
.tabset_label	{ display:none }
.tabset_content_active	{ display:block }
 */


/* Wizard */
ul.banner {
    display: block;
    background: #CCCCCC; /*border-bottom:solid 1px black;*/ /*margin-bottom:1em;*/
    margin: -10px -10px 10px -10px;
    padding: 5px 15px 5px 15px;
    font-size: 14px; /*font-weight: bold;*/
    list-style: none;
    color: black;
}

.banner li {
    display: inline;
    margin: 0 1em 0 0;
}
/*
ul#wizard {
	list-style: none; 
	display:block;
	margin-bottom:2em; 
	height:33px;
	border-bottom:solid 2px #DEE0E2;
	margin-top:15px;
	

}

#wizard h1
{
	text-decoration:none;
	display:inline;
	border:none;
	margin:0;
	padding:0;
	
}

#wizard li.active em
{
	color:#444444;
	border:solid 2px #444444;
}
#wizard li.last
{
	font-size:xx-large;

}


#wizard li {
	display:inline;
	color:#444444;
	
}

#wizard li.active {
	float:left;
	width:40%;
	font-weight:bold;
}


#wizard li em
{
	position:relative;
	bottom:0px;
	color:#CCCCCC;
	margin:0;
	background:#DEE0E2;
	padding:0 5px 0 5px;
	border:solid 2px #CCCCCC;
	font-style:normal;
	font-size:xx-large;
}

#wizard li span{
	padding-left:10px;

}


*/




.hrm .button {
    color: black;
    background: #CCCCCC;
}

    .hrm .button:hover {
        color: #444444;
        background: #DEE0E2;
    }

.hrm input[disabled], .hrm input[readonly], .hrm select[disabled], .hrm select[readonly], .hrm checkbox[disabled], .hrm checkbox[readonly], .hrm textarea[disabled], .hrm textarea[readonly] {
    background-color: #FFFFFF;
    border: #DDDDDD 1px solid;
    color: #000000;
    cursor: default;
    font-style: normal;
}


.highlight {
    background-color: #FFFACD;
}

.modalBackground {
    background-color: #CCCCFF;
    filter: alpha(opacity=40);
    opacity: 0.5;
}

fieldset .helpImage {
    display: inline;
    position: absolute;
    left: 20em;
    top: 0px;
    padding: 0;
    margin: 0;
}



IMG#bg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: -1;
}

.page {
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0px auto 0px 0px; /*margin: 0px auto 0px auto;*/
    padding-left: 0px;
    padding-right: 0px;
}


/* Logistics */
.pickupExtraInfoToolTip {
    width: 200px;
}

.expressRow {
    background-color: #EBE0F5;
}

.regularRow {
    background-color: #F2F2B2;
}

/*END main.css*/


/*START Quickmenu*/

.quickmenugradient {
    z-index: 5;
    background: #14387E url(../../images/quickmenu/quickmenu_bggradient1px.png) left top;
    background-repeat: repeat-y;
    width: 100%;
    height: 65px;
    display: block;
}

.gradienttopwhitebottomtransparent {
    z-index: 5;
    background: transparent url(../../images/quickmenu/topwhitebottomtransparentgradient.png) left top;
    background-repeat: repeat-x;
    width: 100%;
    height: 25px;
    height: 65px;
}

.quickmenugradientcontent {
    z-index: 5;
    background: transparent;
    width: 100%;
}

.quickmenubottomborder {
    z-index: 100;
    background: transparent url(../../images/quickmenu/quickmenubottomborder.png) left top;
    background-repeat: repeat-x;
    width: 100%;
    height: 26px;
}

SPAN#quickmenuleft {
    display: inline-block;
    padding-top: 5px;
    padding-left: 8px;
    text-align: left;
    height: 50px;
}

DIV#quickmenucenter {
    padding-top: 8px;
    height: 40px;
    text-align: left;
}

DIV#quickmenuright {
    padding-top: 8px;
    float: right;
}

.quickmenuitem {
    position: relative;
    display: inline-block;
    height: 40px;
    padding: 0px;
    z-index: 0;
}

    .quickmenuitem:hover {
        display: inline-block;
        height: 40px;
        padding: 0px;
        z-index: 0;
        background: transparent url(../../images/quickmenu/quickmenuitemhover.png) no-repeat left top;
    }

.quickmenuImage {
    z-index: 1;
}

.quickmenuOverlay {
    position: absolute;
    bottom: 0px;
    left: 10px;
    font-size: smaller;
    color: White;
    padding-left: 5px;
    padding-right: 5px;
    background-color: #ffa500;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
}

/*END Quickmenu*/

/*START FullMenu*/
DIV#fullmenu {
    padding-top: 0px;
}
/*END FullMenu*/


/*START Notifications/Counters*/
.notificationRed {
    margin: 0px 0px 0px 0px;
    padding: 8px 0px 0px 0px;
    width: 32px;
    height: 24px;
    color: White;
    font-weight: bold;
    text-align: center;
    background: url(../../images/notificationcounters/counter_red.png) no-repeat left top;
}

.notificationBlue {
    margin: 0px 0px 0px 0px;
    padding: 8px 0px 0px 0px;
    width: 32px;
    height: 24px;
    color: White;
    font-weight: bold;
    text-align: center;
    background: url(../../images/notificationcounters/counter_blue.png) no-repeat left top;
}

.notificationYellow {
    margin: 0px 0px 0px 0px;
    padding: 8px 0px 0px 0px;
    width: 32px;
    height: 24px;
    color: Black;
    font-weight: bold;
    text-align: center;
    background: url(../../images/notificationcounters/counter_yellow.png) no-repeat left top;
}

.notificationGreen {
    margin: 0px 0px 0px 0px;
    padding: 8px 0px 0px 0px;
    width: 32px;
    height: 24px;
    color: White;
    font-weight: bold;
    text-align: center;
    background: url(../../images/notificationcounters/counter_green.png) no-repeat left top;
}

.notificationOrange {
    margin: 0px 0px 0px 0px;
    padding: 8px 0px 0px 0px;
    width: 32px;
    height: 24px;
    color: Black;
    font-weight: bold;
    text-align: center;
    background: url(../../images/notificationcounters/counter_orange.png) no-repeat left top;
}

.notificationPeacock {
    margin: 0px 0px 0px 0px;
    padding: 8px 0px 0px 0px;
    width: 32px;
    height: 24px;
    color: White;
    font-weight: bold;
    text-align: center;
    background: url(../../images/notificationcounters/counter_peacock.png) no-repeat left top;
}

/*END Notifications/Counters*/

/*START LeftMenu*/
.leftmenuitem {
    display: inline-block;
    height: 30px;
    padding: 0px;
    z-index: 0;
}

.leftmenuitemselected {
    color: #D14B13;
}

.leftmenuheader {
    color: White;
    font-size: large;
}
/*END LeftMenu*/


.roundedcornerflatrightpadding10 {
    padding: 10px;
}

/* START CSS3 Rounded Borders*/

.myprofileemployeesummary ul#banner {
    -webkit-border-top-left-radius: 8px;
    -moz-border-top-left-radius: 8px;
    border-top-left-radius: 8px;
}

.roundedcornerContentBorder {
    background: transparent url(../../images/roundedcorners/backgroundlesstransparant.png);
    background-repeat: repeat;
    padding: 10px;
    margin: 2px;
    border: 2px solid #99A1C6;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    behavior: url(/scripts/PIE.htc);
}

.roundedcornerflatrightContentBorder {
    background: transparent url(../../images/roundedcorners/backgroundlesstransparant.png);
    background-repeat: repeat;
    margin: 2px 0px 2px 1px;
    padding: 10px;
    border: 2px solid #99A1C6;
    border-right: 0px;
    -webkit-border-radius: 8px 0px 0px 8px;
    -moz-border-radius: 8px 0px 0px 8px;
    border-radius: 8px 0px 0px 8px;
    behavior: url(/scripts/PIE.htc);
}

.roundedcornerflatleftContentBorder {
    background: transparent url(../../images/roundedcorners/backgroundlesstransparant.png);
    background-repeat: repeat;
    margin: 2px 1px 2px 0px;
    padding: 5px;
    border: 2px solid #99A1C6;
    border-left: 0px;
    -webkit-border-radius: 0px 8px 8px 0px;
    -moz-border-radius: 0px 8px 8px 0px;
    border-radius: 0px 8px 8px 0px;
    behavior: url(/scripts/PIE.htc);
}

.roundedcornerflatleftContentMenu {
    background: transparent url(../../images/roundedcorners/backgroundlesstransparant.png);
    background-repeat: repeat;
    margin: 2px 1px 2px 0px;
    padding: 5px;
    border: 2px solid #99A1C6;
    border-left: 0px;
    -webkit-border-radius: 0px 8px 8px 0px;
    -moz-border-radius: 0px 8px 8px 0px;
    border-radius: 0px 8px 8px 0px;
    behavior: url(/scripts/PIE.htc);
}

    .roundedcornerflatleftContentMenu:hover {
        background: url(../../images/roundedcorners/BorderColor.png);
        background-repeat: repeat;
    }

.roundedcornerflatleftContentHeaderBorder {
    background: url(../../images/roundedcorners/BorderColor.png);
    background-repeat: repeat;
    margin: 2px 1px 0px 0px;
    padding: 5px;
    border: 2px solid #99A1C6;
    border-left: 0px;
    -webkit-border-radius: 0px 8px 8px 0px;
    -moz-border-radius: 0px 8px 8px 0px;
    border-radius: 0px 8px 8px 0px;
    behavior: url(/scripts/PIE.htc);
    min-width: 150px;
}
/* END CSS3 Rounded Borders*/


.transparentbackground {
    margin: 0px auto 0px auto;
    background: transparent url(../../images/backgroundhalftransparant.png);
    background-repeat: repeat;
}

/* Semantic zoom */
ul#zoom {
    list-style: none;
    margin: 0; /*border:solid 1px black;*/
    padding: 0 0px 20px 20px;
    margin: 20px 30px 60px 10px;
    border-bottom: solid 2px #DEE0E2;
}

#zoom p {
    display: inline;
}

#zoom li {
    display: inline;
    float: left;
    text-align: center;
}

    #zoom li.other_page, #zoom li.last_page {
        padding: 7px; /*new*/
        position: relative;
        top: -10px;
    }

    #zoom li.current_page {
        padding: 14px; /*new*/
        position: relative;
        top: -18px;
    }

    #zoom li.context {
        /*border-bottom:dotted 2px #DEE0E2;*/
    }

#zoom .other_page p, #zoom .last_page p {
    color: #CCCCCC;
    font-size: large;
    width: 35px;
    height: 35px;
    background: transparent url('images/other_page.png') no-repeat 50% 50%;
    padding: 13px;
}

#zoom .other_page span {
    position: relative;
    top: 32px;
    left: -50%;
    color: #CCCCCC; /*font-size:normal;*/
    font-weight: bold;
}

#zoom li.last_page {
    float: right;
}

#zoom li.current_page {
    /*border-bottom:solid 2px #DEE0E2;*/
}

#zoom .current_page p {
    color: #444444;
    font-size: x-large;
    width: 55px;
    height: 55px;
    padding: 24px;
    background: transparent url('images/current_page.png') no-repeat 50% 50%;
}

#zoom .current_page span {
    position: relative;
    top: 35px;
    left: -50%;
    color: #444444;
    font-size: medium;
    font-weight: bold;
}

#zoom h1 {
    text-decoration: none;
    display: inline;
    border: none;
    margin: 0;
    padding: 0;
}

.RadCalendar {
    width: auto;
}

.RadAppointmentTitle {
}

.RadAppointmentSubject {
    font-style: italic;
}

.RadAppointmentExport {
    text-align: right;
}

.RadScheduler .rsExportButton {
    position: absolute;
    bottom: 0;
    right: 0;
    border: 0;
    height: 16px;
    width: 16px;
    background: url('images/outlook.gif') no-repeat center center;
}

.RadScheduler .rsAllDayRow .rsExportButton {
    right: 20px;
    height: 16px;
    width: 16px;
    background: url('images/outlook.gif');
}

.rfdSelectBox li, .rfdSelectText {
    font-size: 11px !important;
}

.rfdSelect .rfdSelectOuter span {
    margin-right: 18px !important;
}

a.rfdSelect:hover {
    text-decoration: none !important;
}

/*START controls.css*/

.menu {
    width: auto;
    height: 20px;
    float: right;
}

    .menu tr td {
        padding: 0;
    }

        .menu tr td a.staticItem {
            padding: 0px 10px 0px 10px;
            color: #002570;
            font-size: 12px;
            font-weight: bold;
            text-align: center;
            background-color: transparent;
            border-left: 1px solid #446;
        }

        .menu tr td a.currentlink {
            color: #e0472c;
        }

table.search {
    padding: 0;
    margin: 0px 0px 20px 0px;
}

    table.search td {
        padding: 0;
        margin: 0;
    }

/* GRIDVIEW */
div.divGridView {
    overflow: auto;
}

.gridView {
    width: 100%;
    border: 1px solid #303435;
}

tr.gridHeader, tr.gridHeader th a, tr.gridHeader th {
    font-family: Arial;
    font-weight: bold;
    font-size: 11px;
    background-color: #444466;
    color: white;
    border: 0;
}

    tr.gridHeader th a {
        text-decoration: underline;
    }

    tr.gridHeader th {
        text-align: left;
        padding: 2px 6px 2px 2px;
    }

tr.totalWage, tr.totalWage th a, tr.totalWage th {
    font-family: Arial;
    font-weight: bold;
    font-size: 11px;
    background-color: green;
    color: white;
    border: 0;
}

    tr.totalWage th a {
        text-decoration: underline;
    }

    tr.totalWage th {
        text-align: left;
        padding: 2px 6px 2px 2px;
    }



tr.gridFooter td {
    font-family: Arial;
    font-weight: bold;
    font-size: 11px;
    background-color: #AAAACC;
    color: black;
    border: 0;
}

tr.gridItem td {
    padding: 2px 6px 2px 2px;
    background-color: #fff;
}

    tr.gridItem td.cf, tr.gridItemOdd td.cf {
        white-space: nowrap;
        width: 1px;
    }

tr.gridItemOdd td {
    padding: 2px 6px 2px 2px;
    background-color: #F0F0F0;
}

tr.gridItemSelected td {
    padding: 2px 6px 2px 2px;
    background-color: #ffff99;
}

tr.gridInsert td.gridInsert {
    border-top: 1px solid #444466;
}

.gridCellRed {
    background-color: #ff9090 !important;
    text-align: center;
}

.gridCellOrange {
    background-color: #ffb050 !important;
    text-align: center;
}

.gridCellGreen {
    background-color: #a0ff70 !important;
    text-align: center;
}

tr.gridItem td a, tr.gridItemOdd td a, tr.gridItemSelected td a {
    color: #002570;
    font-weight: bold;
    text-decoration: underline;
}

tr.gridPager {
    background-color: #303435;
}

    tr.gridPager td {
        padding: 1px 5px 1px 5px;
        font-weight: bold;
        font-size: 11px;
        color: Orange;
    }

        tr.gridPager td a {
            font-weight: bold;
            color: White;
        }

    tr.gridPager table {
        width: auto;
        float: right;
    }

/* imagebutton */
.imagebutton {
    margin-bottom: -3px;
}

/*tree*/
.tree {
    text-align: left;
}

    .tree table {
        width: auto;
        margin-right: 10px;
    }

        .tree table td {
            padding: 0px;
            font-size: 11px;
            white-space: nowrap;
            line-height: 6px;
        }

    .tree td div {
        height: 20px !important;
    }

.node {
    padding: 0px 2px;
}

.treeselected {
    color: #e0472c;
}

.treetitle {
    padding-left: 2px;
    font-size: 11px;
    font-weight: bold;
}

.ddl {
    width: auto;
}

tr.gridItem td.datepickerfieldleft, tr.gridItemOdd td.datepickerfieldleft {
    width: auto;
    padding: 0;
    text-align: left;
}

    tr.gridItem td.datepickerfieldleft input.date, tr.gridItemOdd td.datepickerfieldleft input.date {
        width: 100%;
    }

tr.gridItem table.datepicker td.datepickerfieldright, tr.gridItemOdd table.datepicker td.datepickerfieldright {
    width: 20px;
    text-align: right;
}

tr.gridItem table.datepicker, tr.gridItemOdd table.datepicker {
    width: auto;
    display: inline-table;
    vertical-align: bottom;
}

table.datepicker {
    width: auto;
    display: inline-table;
    vertical-align: middle;
}

    table.datepicker td {
        border: 0;
        padding: 0;
        margin: 0;
    }

        table.datepicker td.datepickerfieldright {
            padding-left: 3px;
            padding-top: 3px;
        }

table#pdquestions {
    border: 1px solid #444466;
    margin-bottom: 10px;
}

    table#pdquestions td {
        padding: 2px 5px;
        width: 50%;
    }

table.book {
    border: 1px solid #444466;
    margin-bottom: 10px;
}

    table.book td {
        padding: 2px 5px;
    }

.radiobuttonlist input {
    border: 0;
    vertical-align: middle;
}

.radiobuttonlist label {
    margin-right: 5px;
}

#tblLayout td {
    border: 1px solid #444466;
}

#tblLayout td, #tblRemoveRow td {
    padding: 0px;
    margin: 0px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
}

    #tblLayout td.selected {
        background-color: #ffff99;
    }

    #tblLayout td.hover, #draggables.hover {
        background-color: #bbccdd;
    }

    #tblLayout td.full {
        background-color: #99bbdd;
    }

#draggables {
    border: 1px solid #444466;
    height: 100px;
    width: 500px;
    margin: 10px auto 0px auto;
    padding: 10px;
}

    #draggables span {
        padding: 5px;
        margin-right: 10px;
        cursor: move;
        position: relative;
        left: 0px;
        top: 0px;
    }

#tblLayout td span {
    padding: 5px;
    cursor: move;
    position: relative;
    left: 0px;
    top: 0px;
}

span.title {
    font-weight: bold;
    text-decoration: underline;
    vertical-align: top;
}

.LeadAlertIcon {
    vertical-align: bottom;
    padding-right: 4px;
    text-decoration: underline;
    font-weight: bold;
}

table.searchuc, table.searchuc td {
    vertical-align: top;
    padding: 0;
    margin: 0;
    border: 0;
    vertical-align: middle;
}

input.callon {
    min-width: 120px;
    width: 100%;
    height: 50px;
    margin-top: 10px;
    border: 2px solid #000000;
    background-color: #00ff00;
    font-size: 20px;
    font-weight: bold;
}

input.calloff {
    min-width: 120px;
    width: 100%;
    height: 50px;
    margin-top: 10px;
    border: 2px solid #000000;
    background-color: #ff0000;
    font-size: 20px;
    font-weight: bold;
}

td.wflabel {
    font-weight: bold;
    width: 150px;
}

/* Style voor required workflow velden */
.wfRequired {
}

td.wflabel, td.wfcontrol {
    vertical-align: top;
    line-height: 18px;
    padding: 2px;
}

.wflabelsubtable {
    border: 0px;
    width: 800px;
}

.rcbHeader ul, .rcbFooter ul, .rcbItem ul, .rcbHovered ul, .rcbDisabled ul {
    width: 100%;
    display: inline-block;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.rcbSlide .col1, .rcbSlide .col2, .rcbSlide .colLastNr,
.racSlide .col1, .racSlide .col2, .racSlide .colLastNr,
.rcbSlide .colloc1, .rcbSlide .colloc2, .rcbSlide .colloc3, .rcbSlide .colloc4,
.racSlide .colloc1, .racSlide .colloc2, .racSlide .colloc3, .racSlide .colloc4,
.rcbSlide .navcol1, .rcbSlide .navcol2, .rcbSlide .navcol3, .rcbSlide .navcol4 {
    float: left;
    margin: 0;
    padding: 0 5px 0 0;
    line-height: 14px;
}

.rcbSlide .colLastNr {
    float: right;
}

.rcbSlide .col1 {
    width: 200px;
}

.rcbSlide .col2 {
    width: auto;
}

/*--Specific for location*/
.rcbSlide .colloc1 {
    width: 200px;
}

.rcbSlide .colloc2 {
    width: 125px;
}

.rcbSlide .colloc3 {
    width: 200px;
}

.rcbSlide .colloc4{
    width: auto;
}
/*--*/

.rcbSlide .colLastNr {
    width: auto;
}

.rcbSlide .navcol1 {
    width: 75px;
}

.rcbSlide .navcol2 {
    width: 300px;
}

.rcbSlide .navcol3 {
    width: 100px;
}

.rcbSlide .navcol4 {
    width: auto;
}

table#assignmentPartsFilter {
    width: auto;
    margin: 0 auto;
}

    table#assignmentPartsFilter td {
        border: 1px solid black;
    }

input.date {
    width: 65px;
}

.RadTreeView_Default .rtHover .rtIn, .RadTreeView_Default .rtIn {
    background-color: Transparent !important;
    background-image: none !important;
    border-width: 0 !important;
    margin-left: 0 !important;
    padding: 2px 1px 1px !important;
    font-family: Arial !important;
    font-size: 11px !important;
    color: #002570 !important;
    cursor: pointer;
}

.RadTreeView_Default .rtSelected .rtIn, .RadTreeView_Default .rtSelected.rtHover .rtIn {
    color: #E0472C !important;
    cursor: pointer;
}

.treenoselection .RadTreeView_Default .rtSelected .rtIn {
    color: #002570 !important;
}


.RadTreeView .rtSp {
    height: 16px !important;
}

.RadTreeView .rtTop, .RadTreeView .rtMid, .RadTreeView .rtBot {
    padding: 1px 0 1px 22px !important;
}

.RadTreeView .rtLines .rtTop, .RadTreeView .rtLines .rtMid, .RadTreeView .rtLines .rtBot {
    background-position: 0px -2px !important;
    background-repeat: no-repeat !important;
}

.RadTreeView .rtPlus, .RadTreeView .rtMinus {
    margin-left: -19px !important;
    margin-right: 7px !important;
    margin-top: 3px !important;
}


/*PLANNING*/
.planningTable {
    overflow: auto;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

.planningTableTD {
    width: 70px;
    text-align: center;
    border: 1px solid;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

.planningTable {
    overflow: auto;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

.toPlanTableTD {
    width: 65px;
    text-align: center;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

/* drag objects (DIV inside table cells) */
.drag {
    cursor: move;
    z-index: 10;
    text-align: center;
    width: 100%; /* without width, IE6/7 will not apply filter/opacity to the element ?! */
}

/* table cells */
div#drag td {
    text-align: center;
}

.mark {
    width: 70px;
    text-align: center;
    border: 1px solid;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
}

/* blank cells (upper left corner) */
.blank {
    background-color: white;
}

.dark {
    color: #444;
    background-color: #e0e0e0;
}

span.validation, span.validation img {
    vertical-align: middle;
}

td.radio {
    text-align: center;
}

table.wizardMenu {
    width: auto;
    clear: both; /*float: left;*/
    margin: 0 auto 20px auto;
}

    table.wizardMenu td {
        border: 1px solid #333333;
    }

        table.wizardMenu td.header {
            font-weight: bold;
            text-align: center;
            padding: 5px 10px;
            color: #000000;
            font-size: 18px;
            white-space: nowrap;
        }

        table.wizardMenu td.menuItem, table.wizardMenu td.menuItemCurrent {
            font-weight: bold;
            vertical-align: middle;
            text-align: center;
            font-size: 12px;
            color: #000077;
            padding: 3px;
            background-color: #bbbbff;
            width: 20px;
            cursor: pointer;
        }

            table.wizardMenu td.menuItem:hover {
                background-color: #9999dd;
            }

        table.wizardMenu td.menuItemCurrent {
            background-color: #ffffff;
            cursor: auto;
        }

.fullmenu, .fullmenu ul.rmRootGroup {
    width: 100%;
}


/*END controls.css*/


.valsum {
    border: 2px solid red;
    color: red;
    margin: 5px 0px;
    padding: 10px;
    background: #fff url(../../images/validationerror.png) no-repeat 5px 50%;
}

    .valsum ul {
        margin: 0;
        padding: 0;
        margin-left: 80px;
        list-style: square;
    }

img.leftcollapseexpand {
    text-align: right;
    float: right;
    cursor: pointer;
}

img.topexpanded {
    z-index: 3001;
    position: absolute;
    top: 70px;
    right: 2px;
    cursor: pointer;
}

img.topcollapsed {
    z-index: 3001;
    position: absolute;
    top: 5px;
    right: 2px;
    cursor: pointer;
}

img.lefttopexpanded {
    z-index: 3001;
    position: absolute;
    top: 70px;
    right: 20px;
    cursor: pointer;
}

img.lefttopcollapsed {
    z-index: 3001;
    position: absolute;
    top: 5px;
    right: 20px;
    cursor: pointer;
}

table.searchline {
    width: auto;
    margin-bottom: 10px;
}

    table.searchline td {
        vertical-align: bottom;
    }

        table.searchline td td {
            vertical-align: inherit;
        }

.RadTreeInlineBlock {
    display: inline-block;
}

table.scan, table.scan td, table.scan th {
    font-size: 20px;
    white-space: nowrap;
    padding: 0px 10px;
}

    table.scan td.found {
        background-color: #00ff00;
    }

    table.scan td.notfound {
        background-color: #ff0000;
    }

    table.scan td.scanned {
        background-color: #0000ff;
    }

.gridMoneyField {
    white-space: nowrap;
}

div#logisticsscan h1, div#logisticsscan input, div#logisticsscan {
    font-size: 30px;
}

input.rightText {
    text-align: right;
    padding-right: 2px;
}

.clickableImage {
    cursor: pointer;
}

.formexpression_error {
    border: 2px solid red;
}

.planningTimeEditor {
    position: absolute;
    top: 4px;
    left: 0px;
}

    .planningTimeEditor input {
        width: 60px;
    }

.box {
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 4px 4px 4px 2px rgba(0, 0, 0, 0.5);
    margin-bottom: 36px;
    background-color: #CCCCCC;
}

    .box dl {
        margin: 0;
        padding: 18px 15px;
    }

dl {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    padding: 10px;
}

.box dd {
    color: #265EA0;
    font-weight: bold;
    word-wrap: break-word;
    padding-bottom: 10px;
    padding-left: 5px;
}

.box dt {
    font-weight: bold;
    font-family: Verdana, "Lucida Grande",Helvetica,Arial,sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #585858;
}

dt {
    display: block;
    padding-bottom: 10px;
}

.grid-4 {
    width: auto;
    max-width: 400px;
    display: inline;
    float: left;
    position: relative;
    margin: 0 10px;
}

.section {
    margin-bottom: 20px;
}

.ui-slider .tick {
    z-index: 2;
    position: absolute;
    height: 100%;
    font-size: 1em;
    line-height: 1em;
    background: none;
    border-top: none;
    border-right: none;
    border-bottom: none;
    text-align: left;
}

div.version {
    text-align: center;
    width: 100%;
}

.mailtitle {
    font-size: x-large;
    width: 100%;
}

.mailsubtitle {
    font-size: larger;
    width: 100%;
    white-space: nowrap;
}

.rgFilterBox.rfdDecorated {
    width: 100% !important;
}

/* Date column*/
.rgFilterRow .RadPicker {
    width: 100% !important;
}

.RadPicker .rcTable .rcInputCell {
    width: auto !important;
}

/* Ddl column*/
.rgFilterRow .rfdSelect.rfdSelect_Windows7 {
    width: 100% !important;
}

/* Numeric column*/
.rgFilterRow .riSingle.RadInput {
    width: 100% !important;
}

.RadGrid {
    outline: none;
}

.infoPanel {
    border: 1px solid #F7941D;
    background: #CCCCCC no-repeat left;
    padding: 0px 0px 10px 5px;
}

.RadGrid {
    outline: none;
}

.rgFilterBox.rfdDecorated {
    width: 100% !important;
}

/* Date column*/
.rgFilterRow .RadPicker {
    width: 100% !important;
}

.RadPicker .rcTable .rcInputCell {
    width: auto !important;
}

#weeklyRegime table {
    width: auto;
}

.historyChanged td, td.historyChanged {
    background-color: red !important;
    color: White !important;
}

.historyNew td {
    background-color: green;
    color: White;
}

#trackingGoogleInfoWindow {
    width: 220px;
    height: 65px;
}

.GridSearchPersonDiv table tr td {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

    .GridSearchPersonDiv table tr td.rcbInputCell {
        padding-left: 5px !important;
        padding-right: 4px !important;
    }

div.RadComboBox {
    height: 26px !important;
}

a.nounderline:hover {
    text-decoration: none;
}

#defaultTableLeft {
    padding-right: 5px;
    vertical-align: top;
}

#defaultTableRight {
    padding-left: 5px;
    vertical-align: top;
    width: 490px;
}

#tdToolBar1 {
    vertical-align: top;
    white-space: nowrap;
    padding-left: 5px;
}

#tdToolBar2 {
    padding-left: 5px;
}

tr.patrolentry {
    height: 30px;
}

.OutbreakImage {
    float: right;
}

div#divPlanningStyleLegend {
    float: left;
    width: 30%;
}

div#divPlanningFunctionalityLegend {
    float: left;
    width: 30%;
}

div#divPlanningClickLegend {
    float: left;
    width: 30%;
}

.HrmButton {
    padding-right: 5px !important;
    width: 50%;
}

.RadPicker_Default {
    display: inline-block !important;
}

.underplanned {
    color: red;
}



.correctlyplanned {
    color: green;
}

.overplanned {
    color: orange;
}

.crmlegend {
    background-color: transparent !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
}
