@font-face {
	font-family: Noir;
	src: url(Noir.ttf);
}

body {
	margin: 0;
	color:#8B8D8E;
	font: 12px Noir;
}
#loadingScreen{
	position:absolute;
	left:0;
	top:70px;
	width:100%;
	height:100%;
	z-index:40;
	background-color:rgba(139, 141, 142, .5);
	display: flex;
  	justify-content: center;
  	align-items: center; 
}
.loader {
    border-bottom: 5px solid #7AB100; /* Light grey */
    border-left: 5px solid #7ba277; /* Blue */
    border-right: 5px solid #7AB800; /* Blue */
    border-top: 5px solid #7ba277; /* Green */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    margin-left:auto;
	margin-right:auto;
    animation: spin 2.5s linear infinite;
    opacity:0.7;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
#fullContent{
    width: 100%;
    height: 100%;
    top:0;
    left:0;
}
#headBar{
	position:fixed;
	width:100%;
	height:40px;
	top:0;
	display:block;
	z-index:99;
	background:#ffffff;
}
#content
{
	width: 	100%;
    height: 100%;
    margin-top:65px;
    padding-top:30px;
}
#headL{
	width:22%;
	height:100%;
	padding-left:1%;
	padding-top:5px;
	display:inline-block;
    /* background:blue; */
}
#headC{
	width:54%;
	padding-top:5px;
    display:inline-block;
    vertical-align:top;
    text-align:center;
}
#headR{	
    width:22%;
    height:100%;
    display:inline-block;
	padding-top:5px;
	padding-right:1%;
	text-align:right;
    vertical-align:top;
    text-transform: uppercase;
    overflow:hidden;
    font-size:10px;
}
.blurThings
{
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	-webkit-filter: blur(5px);
  	-moz-filter: blur(5px);
  	-ms-filter: blur(5px);
  	-o-filter: blur(5px);
  	filter: blur(5px);
  	opacity:0.8;
  	transition: ease-in 0.5s;
}
.weekSelectStyle
{
    width:70%;
    height:65px;
    display: inline-block;
    font-size: 25px;
    text-align:center;
    cursor:default;
    margin-top:10px;
}
.weekCalTriggerSub
{
	font-size: 14px;
	line-height:17px;	
}
.calenderNav {
	display-inline:block;
	vertical-align:middle;
	width:15%;
	height:35px;
}
.verticalCenterSpan
{
	display: inline-block;
	vertical-align: middle;
}
.weekSelectVerySmall
{
	width:0px;
    height:0px;
    border:0;
    color:#FFFFFF;
    font: 0px Geneva, Arial, Helvetica, sans-serif;
    text-align:center;
    cursor:default;
	background:#FFFFFF;
}
/* WEEK SELECT END */

/* WEEK DAYS 7 DAYS */

.datesContent{
	width:95%;
	cursor:default;
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
	/* background:#fcfdee; */
}
div#dayContThings0.dayContThings {
	border-top: 1px solid rgba(70, 70, 70, .5);
}
div#dayContThings6.dayContThings {
	border-bottom: 1px solid rgba(70, 70, 70, .5);
}
.datesTitle{
	width:10%;
	display:inline-block;
    text-align:center;
    /* background: #deffb9; */
}
.datesTodayHead {
	display:inline-block;
	vertical-align:top;
	margin-top:15px;
	width:1%;
}
.dayContThings{
	width:83%;
	display:inline-block;
	vertical-align:top;
	border-bottom: 1px solid rgba(0, 0, 0, .5);
	padding-left:1%;
	position:relative;
 	/* background:#deffb9; */
}
.dayContThings.last{
	border-bottom:0;
}
.dayContHeaderAndBtn{
	padding-bottom:10px;
 	/* background:#804000;  */
}
.dayContThingsContainer{
	height:35px;
	z-index: 59;
}
.dayContThingsProj{
	width:86%;
	max-height:20px;
	font: 11px Noir;
	line-height: 10px;
	display:inline-block;
	vertical-align:middle;
	overflow:hidden;
	color: #000000;
	/* background:#e2fee9; */
}
.dayContThingsTime{
	width:12%;
	display:inline-block;
	text-align:right;
	font: 12px Noir;
	vertical-align:middle;
	color: #000000;
}
.dayContThingsTimeTotal{
	font: 13px Noir;
	color:#c0c1c2;
}
/* .datesProjNotFakt:nth-of-type(odd){
    background: #f5f5f5;
    border-bottom:1px solid #8B8D8E;
}
.datesProjNotFakt:nth-of-type(even){
    background: #FFF;    
} */
.datesProjFakt:nth-of-type(odd){
	background:#f3ffe6;
	/* color:#c89999;
	background:#f0e3e3; */
}
.datesProjFakt:nth-of-type(even){
	background:#e8ffce;
	/* color:#c89999;
    background:#e9d6d6; */
}
.datesContent:nth-of-type(7) .datesTitle {
	color:#e9142b;
	opacity:0.5;
}
.datesTitleDate{
	font: 25px Noir;
	display:block;
	line-height:30px;
}
.datesTitleText{
	font: 25px Noir;
	display:block;
	line-height:25px;
}
.datesTitleTextTime{
	font: 12px Noir;
	display:block;
}
.datesToday{
	height:5px;
	width:5px;
	display:inline-block;
	vertical-align:middle;
	line-height:30px;
	border-radius:50%;
	background:#7AB800;
	margin-top:5px;
	margin-left:auto;
	margin-right:auto;
}
.dayBtnFiller
{
	width:55%;
	height:19px;
	display:inline-block;
	vertical-align:top;
	padding-top:6px;
	padding-left:3%;
	font: bold 12px Geneva, Arial, Helvetica, sans-serif;
	white-space: nowrap;
	overflow:hidden;
	 /* background:#ff0080; */
}
.dayBtn
{
	position:relative;
	width:17%;
	height:25px;
	font: 11px Noir;
	display:inline-block;
	text-align:center;
	vertical-align:top;
	font:30px Noir;
	border-radius:2px; 
	margin-left:1%; 
	line-height: 25px;
	/* box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.2); */
}
.dayMenuFiller{
	width:100%;
	height:100%;
	line-height:5px;	
}
.dayContThingsContainerButtonBack
{
	height:40px;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	-webkit-filter: blur(5px);
  	-moz-filter: blur(5px);
  	-ms-filter: blur(5px);
  	-o-filter: blur(5px);
  	filter: blur(5px);
  	opacity:0.8;
	transition: all 1s;
}
.containerBtn
{
	height:40px;
	display:inline-block;
	padding-left:25px;
	padding-right:25px;
}
.dayContThingsContainerButtons
{
	position: absolute;
	width:100px;
	left:40%;
	top:0;
	opacity:0;
    z-index: 60;
    text-align:center;
    white-space: nowrap;
    height:60px;
    max-height:60px;
   /*  -webkit-transition: width 1s, height 1s, margin 1s;
    -moz-transition: width 1s, height 1s, margin 1s;
    -ms-transition: width 1s, height 1s, margin 1s;
    transition: width 1s, height 1s, margin 1s; */
    /* background:#888; */
    /* -webkit-transition: all 2s; 
    -moz-transition: all 2s; 
    -o-transition: all 2s; 
    transition: all 2s; */
}
/*drop down Menu */

.dropMenu{
	display:none;
	opacity:0;
	position:absolute;
	right:0;
	/* background:#e0e0e0; */
	background:#FFF;
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.2);
	z-index: 51;
}
.dropMenuItem{
	/* width:100%; */
	border-bottom:1px solid #d4d4d4;
	text-align:left;
	min-width:80px;
	color:#444;
	font: 14px Geneva, Arial, Helvetica, sans-serif;
    padding: 10px 12px;
    z-index: 3;
    cursor: pointer;
    white-space: nowrap;
}

/*Change color of dropdown links on hover*/
.dropMenuItem:hover {
	background: #f1f1f1
}

/*Change the background color of the dropdown button when the dropdown content is shown*/
.dropMenuItem:active{
    background: #7AB800;
}

.dropMenuItem:hover, .dropMenuItem:active{
	background: #7AB800;
}

/* Drop menu end */

/* END WEEK DAYS 7 DAYS */

#holidayHeader{
	font-size:16px;
	line-height:35px;
}
.holidayButtonImg{
	width:100%;
}
.holidayPicker{
	height:80px;
}
.holidayPickerElement{
	display:inline-block;
	vertical-align: middle;
}
.holidayPickerElement.holidayPickerElement-LR{
	width: 20%;
}
.holidayPickerElement.holidayPickerElement-C{
	width: 59%;
	text-align:center;
	font-size: 16px;
}
.holidayPickerElement.monthName
{
	margin-left:10px;
	width:30%;
}
.holidayMonthRow{
	width:100%;
	padding-top:5px;
	padding-bottom:5px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
}
.holidayMonthRow.holidayMonthRowColor:nth-child(odd){
	background:#eee;
}
.holidayMonthRow.holidayMonthRowColor:nth-child(15){
	background:#deffb9;
}

/* @media only screen and (max-width: 730px) and (orientation:portrait){ */
@media screen and (min-width: 374px)
{
    /*  .ui-datepicker {
    	width: 100%;
    	margin-left:auto;
    	margin-right:auto;
    	left:0;
	}  */
}

@media screen and (min-width: 568px)
{
	.epSearchClearBtn{
		width:5%;
	}
}
@media screen and (min-width: 1025px)
{
	#content{
		width:30%;
		margin-left:auto;
		margin-right:auto;
	}
	#headL{
		width:39%;
	}
	#headC{
		width:20%;
	}
	#headR{
		width:39%;
	}
	.epCenterFrame{
		width:40%;
	}
	.dayBtnFiller
	{
		width:75%;
	}
	.dayBtn
	{
		/* width:16%; */
		width:8%;
	}
	.datesTitle{
		width:6%;
	}
	.dayContThings{
		width:92%;
	}
}