/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body {
    background-color: #5c87b2;
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
    color: #696969;
    background-color: #486072;
    cursor: default;
    font-family: arial;
}

.ajax-loader {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    background: url("../Content/images/loading.gif") scroll no-repeat 50% 50% transparent;  
    width: 100%;
    height: 100%;
}

.seitenumbruch {
    page-break-before:always;
}

a:link {
    color: #034af3;
    text-decoration: underline;
}

a:visited {
    color: #505abc;
}

a:hover {
    color: #1d60ff;
    text-decoration: none;
}

a:active {
    color: #12eb87;
}

p, ul {
    margin-bottom: 20px;
    line-height: 1.6em;
}

header,
footer,
nav,
section {
    display: block;
}

.cssSelectRowClickable {
    cursor: pointer;
    background: #ffff99;
}


/* HEADINGS -----------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-size: 1.5em;
    color: #000;
}

h1 {
    font-size: 2em;
    padding-bottom: 0;
    margin-bottom: 0;
}

h2 {
    padding: 0 0 10px 0;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.0em;
}

h5, h6 {
    font-size: 1em;
}

/* PRIMARY LAYOUT ELEMENTS  --------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page {
    margin-left: auto;
    margin-right: auto;
    background-image: url("./images/site_bg.gif");
    background-repeat: repeat;
    padding: 10px;
    text-align: left; 
    margin: 20px auto; 
    margin-top:20px;
    width: 1100px;
    border: 2px solid black;
}

pageheader, #pageheader {
    position: relative;
    margin-bottom: 0px;
    color: #000;
    padding: 0;
    height: 70px;
}

pageheader h1, #pageheader h1 {
    font-weight: bold;
    padding: 5px 0;
    margin: 0;
    color: #fff;
    border: none;
    line-height: 2em;
    font-size: 32px !important;
    text-shadow: 1px 1px 2px #111;
}

#pagemain {
    padding: 30px 30px 15px 30px;
    background-color: #fff;
    border-radius: 4px 0 0 0;
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
}

pagefooter, 
#pagefooter {
    background-color: #fff;
    color: #999;
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 20px 0 30px 0;
    font-size: .9em;
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
}

/* TAB MENU ---------------------------------*/
ul#menu {
    border-bottom: 1px #5C87B2 solid;
    padding: 0 0 2px;
    position: relative;
    margin: 0;
    text-align: right;
}

ul#menu li {
    display: inline;
    list-style: none;
}

ul#menu li#greeting {
    padding: 10px 20px;
    font-weight: bold;
    text-decoration: none;
    line-height: 2.8em;
    color: #fff;
}

ul#menu li a {
    padding: 10px 20px;
    font-weight: bold;
    text-decoration: none;
    line-height: 2.8em;
    background-color: #e8eef4;
    color: #034af3;
    border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
}

ul#menu li a:hover {
    background-color: #fff;
    text-decoration: none;
}

ul#menu li a:active {
    background-color: #a6e2a6;
    text-decoration: none;
}

ul#menu li.selected a {
    background-color: #fff;
    color: #000;
}

/* FORM LAYOUT ELEMENTS ----------------------*/

fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}

textarea {
    min-height: 75px;
}

input[type="text"], 
input[type="password"] {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
    width: 120px;
}

select {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
    width: auto;
}

input[type="submit"],
input[type="button"] {
    font-size: 1.2em;
    padding: 5px;
}

/* TABLE --------------------------------*/

table {
    border: solid 1px #e8eef4;
    border-collapse: collapse;
}


table td {
    padding: 5px;
    border: solid 1px #e8eef4;
}

table th {
    padding: 6px 5px;
    text-align: left;
    background-color: #e8eef4;
    border: solid 1px #e8eef4;
}

.cssTblOddRow {
    background-color: #c8ced4;
}

.cssTblHideCol {
    width: 0px ! Important;
    display: none ! Important;
}

/* MISC ---------------------------------------*/
.clear {
    clear: both;
}

.error {
    color: Red;
}

nav, 
#menucontainer {
    margin-top: 40px;
}

div#title {
    display: block;
    float: left;
    text-align: left;
}

#logindisplay {
    font-size: 1.0em;
    display: block;
    text-align: right;
    margin: 10px;
    color: White;
}

#logindisplay a:link {
    color: white;
    text-decoration: underline;
}

#logindisplay a:visited {
    color: white;
    text-decoration: underline;
}

#logindisplay a:hover {
    color: white;
    text-decoration: none;
}

/* Styles for validation helpers -----------------*/
.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 2px solid #ff0000 ! Important;
    background-color: #ffeeee;
    background-image: url("../content/images/stop.png");  
    background-position: right;  
    background-repeat: no-repeat;  
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers ---------*/
.display-label, 
.editor-label {
    margin: 0.5em 0 0 0;
}

.display-field, 
.editor-field,
.editor-field-auto,
.editor-field-breit,
.editor-field-rechts,
.editor-field-schmal2 {
    margin: 0.1em 0 0 0;
    height: 2em;
    float:none;
}

.editor-field-auto {
    width:auto ! Important;
}

.editor-field-schmal2 .single-line {
    width:3em;
}

.editor-field-breit {
    width: 12.5em;
}

.editor-field-breit .single-line {
    width: 20em;
}

.editor-field-schmal .single-line {
    width: 5em;
}

.editor-field-rechts .single-line {
    float: right;
}

.select-field {
    /*margin: 0.5em 0 0 0;
    height: 2em; */
    float:none;
}

.text-box {
    width: 10em;
}
.text-box-breit {
    width: 20em;
}

.text-box.multi-line {
    height: 6.5em;
}

.tri-state {
    width: 6em;
}


/* Menu Container ----------*/
#menucontainer 
{
    height:100%;
    width:70%;
    margin-top:10px;
    float:left;
}

#DatumPlanVon, #DatumPlanBis
{
    width:100px;
}

/* Main Menu --------------*/  
div#divMainMenu
{
    height:30px;
    width:400px;
}
  
div#divMainMenu span
{
    padding-top:10px;
    padding-bottom:10px;
    padding-right: 10px;

    font-size:1.6em;
    cursor:pointer;    
    color:Gray;
}

div#divMainMenu span a
{
    text-decoration:none;
    /*color: #63666A; */
    color:Gray;
}

div#divSubMenu1 span, div#divSubMenu1 span a, div#divSubMenu2 span a, div#divSubMenu3 span a, div#divSubMenu4 span a, div#divSubMenu5 span a
{
    text-decoration:none;
    color:Gray;
    cursor: pointer;
}

div#divMainMenu :hover
{
    color:Orange;
    cursor: pointer;
}

div#divSubMenu1 :hover, div#divSubMenu2 :hover, div#divSubMenu3 :hover, div#divSubMenu4 :hover, div#divSubMenu5 :hover
{
    color:Orange;
    cursor: pointer;
}

#divMenuRechtsOben, #divMenuRechtsUnten, .divMenuLink
{
    width:200px;float:right;margin-top:10px;
    text-decoration:none;
    text-align: right;
    /*color: #63666A; */
    color:Gray;
}

#divMenuRechtsOben a, #divMenuRechtsUnten a, .divMenuLink a
{
    text-decoration:none;
    /*color: #63666A; */
    color:Gray;
}

#divMenuRechtsOben :hover, #divMenuRechtsUnten :hover, .divMenuLink :hover
{
    color:Orange;
    cursor: pointer;
}

.DivVerticalAlign {
    display: inline-block;
    vertical-align: middle;
    white-space: normal;
}

/* DivVerticalAlignHelper wird hinter das auszurichtende Div gesetzt */
.DivVerticalAlignHelper {
    display: inline-block;
    vertical-align: middle;
    height:100%;
}

div#divMainMenu .selected
{
    color:Red ! Important;
}

div#divMainMenu span.selected a
{
    color:Red;
}

/* Sub Menu ----------------*/   
.SubMenu
{
    height:20px;
    width:400px;
    float:left;
}

.menusubsichtbar
{
visibility:inherit; 
height:20px;
text-decoration:none;
}

.menusubnichtsichtbar
{
visibility:hidden;
height:0px;
}

.SubMenu span
{
    padding-top:10px;
    padding-bottom:10px;
    padding-right: 10px;

    font-size:1.25em;
    cursor:pointer;  
    color: #63666A; 
}

.SubMenu span a
{
    text-decoration:none;
    color: #63666A;
}


.SubMenu span:hover
{
    color:Black;
}

div#divSubMenu1 span.selected a, div#divSubMenu2 span.selected a, div#divSubMenu3 span.selected a, div#divSubMenu4 span.selected a, div#divSubMenu5 span.selected a
{
    color:Red;
}

/* dynamic menu ----------------*/
div#divDynamicMenu
{
    float:right;
}

div#divDynamicMenu span
{
    padding-top:10px;
    padding-bottom:10px;
    padding-right: 10px;

    font-size:1.25em;
    cursor:pointer;  
     color: #63666A; 
}

div#divDynamicMenu span:hover
{
   color: Black; 
}

/* main container ---------------*/  
#pagemain
{
	padding:0px ! Important;
    height:650px;	
    padding-left:0px ! Important;
    padding-right:0px ! Important;
    background-color:transparent;
}
	
	
#title
{
    font-size:1.9em;
    color:#63666A;
    margin-left:15px;
    margin-top: 20px;
}


#divFilter
{
    float:left;
    
     /*margin-right:5px;*/
     /*border-right-color: #babfc7;
     border-right-style:solid;
     border-right-width:1px;*/
     height:100%;
     background-color:White;
}

#divHomeLeft
{
    float:left;    
    height:100%;
    background-color:White;
}

#divDashboard
{
    float:right;
    width:843px;
    height:650px;	
    background-color:White;
    /*border-left-color: #babfc7;
    border-left-style:solid;
    border-left-width:1px;*/  
}

#divHomeRight
{
    float:right;
    width:843px;
    height:650px;	    
}

#divResultOverview
{
    float:left;
    width:100%;
    height:650px;
    overflow-x:none;
    overflow-y:auto;	
    background-color:White;
}

#divHomeRightTop
{
    height:50%;
    width:100%;
    background-color:White; 
}

#divHomeBottom
{
    height:49%;
    width:100%;
    background-color:White; 
    margin-top:6px;
}

.filterBlockElement, .filterBlockElement table, .filterBlockElement div
{
    margin-left:0px !important;
	margin-right:0px !important;
	padding:0px !important;
	width:280px !important;
}

.homeRightTopBlockElement1, .homeRightTopBlockElement1 table, .homeRightTopBlockElement1 div
{
    margin-left:0px !important;
	margin-right:0px !important;
	padding:0px !important;
	width:267px !important;
}

.homeRightTopBlockElement2, .homeRightTopBlockElement2 div
{
    margin-left:0px !important;
	margin-right:0px !important;
	padding:0px !important;
	width:309px !important;
	height:285px;
}

.homeRightBottomBlockElement, .homeRightBottomBlockElement table, .homeRightBottomBlockElement div
{
    margin-left:0px !important;
	margin-right:0px !important;
	padding:0px !important;
	width:550px !important;
}

.homeLeftBottomBlockElement, .homeLeftBottomBlockElement table, .homeLeftBottomBlockElement div
{
    margin-left:0px !important;
	margin-right:0px !important;
	padding:0px !important;
	width:253px !important;
}

.DashboardTabDivs
{
    padding:0px ! Important;
}

#divDashboardTabs
{
	margin-left:0px;
	margin-right:0px;
	padding:0px;
	/*width:100%;*/
	height:620px;
	position: relative;
	height:650px;
	border:0;
}

#divDashboardTabs ul
{
    -moz-border-radius-topleft: 0px ! Important; 
	-webkit-border-top-left-radius: 0px ! Important; 
	-khtml-border-top-left-radius: 0px ! Important; 
	border-top-left-radius: 0px ! Important; 
	border-top-right-radius: 0px ! Important; 
	border-bottom-right-radius: 0px ! Important; 
	border-bottom-left-radius: 0px ! Important; 
}

.divDetailsContentInner
{
   height :520px;
   padding:10px;
   overflow:auto;
}

.divDashboardContentFooter
{
    position:absolute;
    
    background-color:#63666A;
    /*background: #cccccc url(images/ui-bg_highlight-soft_75_63666a_1x100.png) 50% 50% repeat-x;*/
    
    bottom:0px;
    width:100%;
    height:40px;
    display: inline-block;
}

.btnSaveDetails
{
    float:right;
    margin-top:3px;
    cursor:pointer;
	border:1px solid #63666A;
	background-color:#63666A; 
	background-image:url(./images/Check.png); 
    
	background-repeat:no-repeat;
	background-position: 2px 2px;
	width:140px;
	height:35px;
	color:White;
}

.btnDeleteDetails
{
    float:right;
    margin-top:3px;
    cursor:pointer;
	border:1px solid #63666A;
	background-color:#63666A; 
	background-image:url(./images/Stop.png); 
    
	background-repeat:no-repeat;
	background-position: 2px 2px;
	width:140px;
	height:35px;
	color:White;
}

.btnAssociationsFooter
{
    float:right;
    margin-top:3px;
    cursor:pointer;
	border:1px solid #63666A;
	background-color:#63666A; 
	background-image:url(./images/Puzzle.png); 
    
	background-repeat:no-repeat;
	background-position: 2px 2px;
	width:190px;
	height:35px;
	color:White;
}


.divDetailsLeft, .divDetailsRight
{
	display: inline-block;
	vertical-align: top;
	margin-right:50px;

	/* For IE 7 */
	zoom: 1;
	*display: inline;
}


.trUnselected
{
	background-color:transparent;
	cursor:pointer;
}

.trUnselectedDeactive
{
	background-color:transparent;
	color:Red;
	cursor:pointer;
}

.trDeactive
{
	background-color:transparent;
	color:Red;
}

.trSelected
{
	background-color: #D9EEFD;
	cursor:pointer;
}
/*Silver, c3caf0*/

.trSelectedDeactive
{
	background-color:#D9EEFD;
	color:Red;
	cursor:pointer;
}

.trSelectedCheckboxSelectList
{
    background-color:#63666A !Important;
    color:White !Important;
}

.trSelectedCheckboxSelectListDeaktive
{
    background-color:#63666A !Important;
    color:Red !Important;
}

.trUnselectedCheckboxSelectList
{
    background-color:#D9EEFD !Important;
}

.trUnselectedCheckboxSelectListDeaktive
{
    background-color:#D9EEFD !Important;
    color:Red!Important;
}


.divListHeader
{
    font-size: 11pt ! Important;
    height: 40px ! Important;
    background-color: #63666A ! Important; /*63666A*/
    color:White;
}

/*d2d2d0, cfd0cb, dadad8, e0e0de, dadad8*/

.btnHeaderLogo
{
     float:right;
     margin-top:4px;
     margin-right:15px;
     margin-left:10px;
     cursor:pointer;
}

.divListHeader h3
{
    float:left;
    margin-left:5px ! Important;
    margin-top:10px ! Important; 
    color:White;
}

#tblShifts
{

    
}

#tblVerfuegbarkeit {
width: 400px;
}

.SpalteVerfuegbarkeitErste {
float: none;
width: 80px;
padding-right: 2%;
padding-left: 2%;
}

.SpalteVerfuegbarkeit {
float: none;
width: 25px;
padding-right: 2%;
padding-left: 2%;
}

.highlight { background:yellow; } 

.cssPopup { background-color:#FF9999 ! Important; }

.cssspanlinkpopup
{
    /*color: #63666A; */
    text-decoration:underline;
    color:Blue ! Important;
}
.cssspanlinkpopup a
{
    /*color: #63666A; */
    color:Blue ! Important;
}
.cssspanlinkpopup:hover
{
    color:Orange ! Important;
    cursor: pointer;
}

.spanlinkpopup
{
    text-decoration:none;
    /*color: #63666A; */
    color:#505050;
    margin-top:5px;
}
.spanlinkpopup a
{
    text-decoration:none;
    /*color: #63666A; */
    color:#505050;
}
.spanlinkpopup:hover
{
    color:Orange;
    cursor: pointer;
}


/* ***** Sprechblasen ***** */
.sprechblase { background : #669900 url("../content/images/csc_tl.png") no-repeat;
           width : 30em;
           height : auto;
           position: absolute;
           padding : 30px 40px;
}

.tr, .bl, .br {
  position : absolute;
  width : 20px;
  height : 20px;  /* corner images are 40x40 */
  display : block;
  margin-bottom : -1px;  /* this is for IE */
}

.tr {
  background : transparent url(../content/images/csc_tr.png) no-repeat;
  top : 0;
  right : 0;
}

.bl {
  background : transparent url(../content/images/csc_bl.png) no-repeat;
  bottom : 0;
  left : 0;
}

.pfeil {
  background : #669900 url(../content/images/csc_pfeil.png) no-repeat;
  position : absolute;
  left: -19px;
  top: 50px;
  width : 19px;
  height : 39px;  /* pfeil ist 80x40 */
  display : block;
  margin-bottom : -1px;  /* IE */
}

.br {
  background : transparent url(../content/images/csc_br.png) no-repeat;
  right : 0;
  bottom : 0;
}

.aufgaben1 {
    margin-top: 1px;
    margin-left: 3px;
}

.aufgaben2 {
    margin-left: 3px;
}

.divcontainer {
display:table-cell;
width:100%;
height:100%;
vertical-align:middle;
text-align: center;
}

.zentrieren {
    position:absolute;
    display:block;
	left:50%;
	top:50%;
	/*width:32px; /* Breite des Bildes */
	/*height:32px; /* Höhe des Bildes */
	/*margin:auto; /*-100px 0 0 -150px; /* Erster Wert: -Höhe des Bildes/2; letzter Wert: -Breite des Bildes/2 */
    margin: -16px 0px 0px -16px;
	border:0;
}


.filterWrapper 
{
    margin:0 auto;
    text-align: center;   
}

.filterLabel, .filterControl , .filterSubmit
{
    display: inline;
    margin-left: 1em;
}

a.ActionButton
{
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9) );
	background:-moz-linear-gradient( center top, #f9f9f9 5%, #e9e9e9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9');
	background-color:#f9f9f9;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#666666;
	font-family:arial;
	font-size:20px;
	font-weight:bold;
	padding:10px 24px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
	margin: 15px 15px;
}

a.ActionButton:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9) );
	background:-moz-linear-gradient( center top, #e9e9e9 5%, #f9f9f9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9');
	background-color:#e9e9e9;
}

a.ActionButton:active {
	position:relative;
	top:1px;
}

.cssButtonBuchen
{
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9) );
	background:-moz-linear-gradient( center top, #f9f9f9 5%, #e9e9e9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9');
	background-color:#f9f9f9;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#666666;
	font-family:arial;
	font-size:24px!Important;
	font-weight:bold;
	padding: 14px 24px!Important;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
	margin: 15px 15px;
    margin-left:25px;
}

.cssButtonBuchen:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9) );
	background:-moz-linear-gradient( center top, #e9e9e9 5%, #f9f9f9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9');
	background-color:#e9e9e9;
}

.cssButtonBuchen:active {
	position:relative;
	top:1px;
}

.wrapperDemoControls
{
    display:inline-block;   
    margin-bottom: 10px; 
}

a.ActionButtonDemo {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
}

a.ActionButtonDemo:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}

a.ActionButtonDemo:active {
	position:relative;
	top:1px;
}

td.mark_red
{
    background-color:#FFDDDD;
}

.cssSummenzeile
{
    font-weight:bold;
}

.cssKorrekturzeile
{
    font-weight:bold;
    color:blue;
    font-style:italic;
}