/********************** OVerride start  **********************/
@-ms-viewport{
	width:extend-to-zoom;
	zoom:1.0
}

*{outline:none}

.icon-zoom-in{position:relative;left:23px;top:-8px;z-index:999}
.input-append input{height:30px;padding-left:25px}
.btn:focus,.btn:active:focus,.btn.active:focus{outline:0px}
.col-xs-paddingright-0{padding-right:0}
.col-xs-paddingleft-0{padding-left:0}

@media (min-width:768px){
	.col-sm-paddingright-0{padding-right:0}
	.col-sm-paddingleft-0{padding-left:0}
}
@media (min-width:992px){
	.col-md-paddingright-0{padding-right:0}
	.col-md-paddingleft-0{padding-left:0}
}
@media (min-width:1200px){
	.col-lg-paddingright-0{padding-right:0}  
	.col-lg-paddingleft-0{padding-left:0} 
}


html {
    overflow-y:scroll;
}

html.modalOpen{
	overflow-y: hidden;
}

body{
	font-size:62,5%;
	background-color: #ededed; 
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
}

div{ font-family: Lucida Sans Unicode, Lucida Grande, sans-serif; }

h4, .h4 {
    font-size: 1.4rem;
    padding: 0;
}


html input[disabled] {
    cursor: default;
    background-color: #f2f2f2;
}

a:focus{ outline: 0; }

.loginWrapper a:link, .loginWrapper a:active, .loginWrapper a:visited{
	color: #428bca;
	text-decoration: underline;
}

.container{ padding: 0; }

section{ float:left; margin-bottom: 6em; }

ul{float:left;width:100%}

li{ word-break: initial;}

.faded-text{ color: #cccccc; }

.testmark {
    text-shadow: 1px 1px #333;
    -ms-transform: rotate(7deg);
    -webkit-transform: rotate(7deg);
    transform: rotate(-29deg);
    position: fixed;
    font-size: 1.2em;
    color: #fff;
    padding: 0.5em;
    z-index: 59;
    text-decoration: underline;
}

.page-wrapper{
	margin: 0 0 2em 0;
	padding-left: 0;
	padding-right: 0;
}

.page-title { margin: 2em 0 0em 0; }
 

@media (min-width:500px){
	.page-wrapper { padding: 0 15px; }
	/*.page-title{ padding: 0; }*/
}

/*********************** FORM start ***********************/
.skrenten-input{
	font-size: 1.4rem;
	border: 1px solid #999;
	padding: 0.65em;
	color: #333;
	margin-bottom: 0.5em;
	width: 100%;
	max-width: 100%;
}

/*********************** FORM slutt ***********************/

/*********************** CSS LOAD SPIINNER start ***********************/
.sk-fading-circle {
  margin: 0px auto;
  width: 18px;
  height: 18px;
  position: relative;
}

.sk-fading-circle .sk-circle {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.sk-fading-circle .sk-circle:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #333;
  border-radius: 100%;
  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
          animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}

.sk-fading-circle .sk-circle2 { -webkit-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); }
.sk-fading-circle .sk-circle3 { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); }
.sk-fading-circle .sk-circle4 { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.sk-fading-circle .sk-circle5 { -webkit-transform: rotate(120deg); -ms-transform: rotate(120deg); transform: rotate(120deg); }
.sk-fading-circle .sk-circle6 { -webkit-transform: rotate(150deg); -ms-transform: rotate(150deg); transform: rotate(150deg); }
.sk-fading-circle .sk-circle7 { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
.sk-fading-circle .sk-circle8 { -webkit-transform: rotate(210deg); -ms-transform: rotate(210deg); transform: rotate(210deg); }
.sk-fading-circle .sk-circle9 { -webkit-transform: rotate(240deg); -ms-transform: rotate(240deg); transform: rotate(240deg); }
.sk-fading-circle .sk-circle10 { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }
.sk-fading-circle .sk-circle11 { -webkit-transform: rotate(300deg); -ms-transform: rotate(300deg); transform: rotate(300deg); }
.sk-fading-circle .sk-circle12 { -webkit-transform: rotate(330deg); -ms-transform: rotate(330deg); transform: rotate(330deg); }
.sk-fading-circle .sk-circle2:before { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
.sk-fading-circle .sk-circle3:before { -webkit-animation-delay: -1s; animation-delay: -1s;  }
.sk-fading-circle .sk-circle4:before { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
.sk-fading-circle .sk-circle5:before { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }
.sk-fading-circle .sk-circle6:before { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }
.sk-fading-circle .sk-circle7:before { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }
.sk-fading-circle .sk-circle8:before { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }
.sk-fading-circle .sk-circle9:before { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }
.sk-fading-circle .sk-circle10:before { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; }
.sk-fading-circle .sk-circle11:before { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; }
.sk-fading-circle .sk-circle12:before { -webkit-animation-delay: -0.1s; animation-delay: -0.1s; }

@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; } 
}

/*********************** CSS LOAD SPINNER end ***********************/

/*********************** CSS MODAL start ***********************/

.calendar-drop-down{ display: none; }

.reqvac-wrapper input[id*='show']:checked + label[for*='show'] #cssModal-layer form.form-booking { background: #fff; }

.appvac-wrapper input[id*='show']:checked + label[for*='show'] #cssModal-layer form.form-booking { background: #fff; }

input[id*='show']{ display:none; }

#cssModal-layer{ display: none;}

input[id*='show']:checked + label[for*='show'] #cssModal-layer, 
#cssModal-layer.active{
	display:block;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10;
	overflow-y: scroll;
	overflow-x: hidden;
	background-color: rgba(0,0,0,0.5);
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
}

.cssModal-outerwrapper,
#cssModal-outer-wrapper{ margin: 1em; }

input[id*='show']:checked + label[for*='show'] #cssModal-inner-wrapper,
#cssModal-inner-wrapper{
  	margin: 2em auto;
  	width: 450px;
 	max-width: 100%;
}

input[id*='show']:checked + label[for*='show'] #cssModal-inner-wrapper form.form-booking,
#cssModal-inner-wrapper form{
	background-color: #fff;
	float:left;
	max-width: 100%;
	padding: 1em 2em;
	border-radius: 10px;
	color: #666;
	
}

#cssModal-layer h4{
	font-size: 1.4rem;
    padding: 1em 0 0.75em 0;
    text-align: left;
    color: #407DA0;
    letter-spacing: 0.1em;
    border-bottom: 1px solid #dcdcdc;
    margin: 0 0 1em 0;
    text-transform: uppercase;
}

#cssModal-layer h4 i{
	color: rgb(152, 191, 208);
  float: right;
  font-size: 1.5em;
  position: relative;
  top: -0.25em;
}


/*********************** CSS MODAL end ***********************/

/*********************** FORM TRIGGER start ***********************/
 
.click_item { cursor: pointer; }
.click_item.add i{
	  padding: 0 1em 0 0;
  		font-size: 1.2em;
}
/*********************** FORM TRIGGER end ***********************/

/*********************** COLOR PRESETS start ***********************/
.wl-positive{
	background-color: rgb(141, 166, 93);
	border-bottom: 1px solid #c2db91;
}

.wl-negative{
	background-color: #C86262;
	border-bottom: 1px solid #db7b6c;
}
 
.wl-neutral{
	background-color: #f6f2ba;
	border-bottom: 1px solid #fef46e;
}

.wl-positive-content{
	color: rgb(141, 166, 93);
	text-align: center;
}
 
.wl-negative-content{
	color: #C86262;
	text-align: center;
}
 
.wl-neutral-content{
	color: #f6f2ba;
	text-align: center;
}

.status-deleted{
	background-color: rgb(255, 224, 229);
	color: brown;
}

.status-done{
	background-color: rgb(241, 250, 223);
    color: rgb(95, 115, 57);
}

.status-todo{
    background: #E9F0F8;
    color: #526773;
}

/*********************** COLOR PRESETS end ***********************/

/*********************** HEADER start ***********************/

header a, header a:link, header a:visited, header a:focus, header a:active{
	color: #fff;
	line-height: 1.4em;
}

header .active a,
header a.active,
header a:hover{
	color: #7ac9ff;
	text-decoration: none;
}

header{
	float:left;
	width: 100%;
}

header .site-title{
	text-align: left;
	font-size: 3em;
}


header .logged-user{
	text-align: right;
	padding-top: 1.6em;
	font-size: 1.2em;
}

header .logged-user i{
	font-size: 2em;
	padding-left: 1em;
	margin-top: -0.2em;
	float: right;
}

#toggle-menu-icon,
#toggle-housing-icon,
#toggle-status-icon{
	display: inline-block;
}

#toggle-housing-icon:hover,
#toggle-menu-icon:hover,
#toggle-status-icon:hover,
#toggle-housing-icon.selected,
#toggle-menu-icon.selected,
#toggle-status-icon.selected{
	
	text-decoration: none;
	color: #7ac9ff;
	cursor: pointer;
}


/*********************** HEADER end ***********************/

/*********************** STATUS start ***********************/

.status-wrapper{
	float:left;
	width: 100%;
}

/*********************** STATUS end ***********************/

/*********************** SIDE TITTEL start ***********************/
.sub-title-wrapper.main-menu{ margin-bottom: 3em; }

.sub-title, .side-title{
	font-size: 1.8rem;
    padding: 0.5em 0;
    text-align: left;
    color: #407DA0;
    letter-spacing: 0.1em;
    border-bottom: 1px solid #dcdcdc;
}

.side-title{ margin: 1em 0;}

.sub-title { font-size: 2em;  border: 0; text-align: left;}

.sub-title a.new-page:link,
.sub-title a.new-page:visited,
.sub-title a.new-page:focus,
.sub-title a.new-page:active{
	float: right;
	text-decoration: none;
}

.sub-title a.last-page:link,
.sub-title a.last-page:visited,
.sub-title a.last-page:focus,
.sub-title a.last-page:active{
	float: left;
	text-decoration: none;
}

.sub-title a i{
	color: rgb(125, 154, 164);
	font-size: 1.8em;
}
.sub-title a:hover i{
	color: #E3AE57;
	text-decoration: none;
}
/*********************** SIDE TITTEL end ***********************/

/*********************** LISTER start ***********************/
a.active-sub i{
	color: #E3AE57;
	text-decoration: none;
}

.calendar-wrapper{
	float:left;
	width: 100%;
}

.listWrapper{
	clear: both;
	float:left;
	width: 100%;
} 

.listWrapper table{
	font-size: 1.4rem;
	text-align: center;	
}

.edit-wrapper .listWrapper th.icon-text-no i{ padding: 0; }

.listWrapper td i{ font-size: 2rem; }

.listWrapper .click_item{
  color: rgb(125, 154, 164);
  text-decoration: none;
}

.listWrapper .click_item:hover{
  color: #333;
  text-decoration: none;
}

.listWrapper .colHeader{
	vertical-align: bottom;
	font-weight: normal;
	color: #7D9AA4;
}

.leftColCategory { display: none; }

.listWrapper th,
.listWrapper td{ text-align: center; }

.listWrapper th{ word-break: initial; }

.listWrapper th.name-col,
.listWrapper td.name-col,
.listWrapper th.users-col,
.listWrapper td.users-col{ text-align: left; }

.listWrapper td.users-col li:before { content: "- "; }

.listWrapper td.name-col{
	font-size: 1.4rem;
	color: #666;
	word-break: initial;
}

.listWrapper.userlist td.name-col{ font-size: 1em; }

.listWrapper td.name-col i{
	font-size: 1em;
	padding-right: 0.25em;
	color: rgb(169, 169, 63);
}

.listWrapper td.users-col { color: #666;  }


.table-striped > tbody > tr:nth-child(odd) { background-color: #f9f9f9; }

.listWrapper td.edit-top .click_item{ display: none; }
.listWrapper td.edit-bottom .click_item{ display: block; }


@media (max-width:599px){
	.leftColCategory {
		  min-width: 50px;
		  text-align: left;
		  float: left;	
		  display: block;
		  font-size: 1.2em;
	}
	
	.listWrapper thead{ display: none; }
	.listWrapper td{ text-align: left; float:left; width: 100%; border-top: 0 !important; padding: 0 10px 6px 10px !important;}
	
	.listWrapper td.name-col{   
		font-weight: normal;
		  padding-top: 10px !important;
		  font-size: 1.2em;
		  padding-right: 45px !important;
		  position:relative;
  	}
  	
  	.listWrapper td.users-col { width: 50%; }
  	.listWrapper td.users-col ul{ margin-bottom: 0; }
  	
  	.listWrapper td.edit-top .click_item{ display: block; }
  	.listWrapper td.edit-bottom .click_item{ display: none; }
	
  	.listWrapper td.edit-top .click_item{
  		 position: absolute;
	  	right: 0.75em;
	 	 top: 0.75em;
	  	font-size: 1em;
  	}
  	
  	.listWrapper td.edit-top .click_item i{
  		color: rgb(125, 154, 164);	
  		text-decoration: none;
	  	font-size: 1.2em;
	  	padding: 0;
  	}
  	
  	.listWrapper td.edit-top .click_item:hover i{ color: #333;}

	.listWrapper td i {
		  font-size: 1.2em;
  			padding-top: 3px;
	}
	
	.listWrapper tr.sortRow{ border-top: 1px solid #ddd; }
} 

@media (max-width:399px){
	.listWrapper td.users-col { width: 100%; }
}


/*********************** LISTER end ***********************/

/*********************** GJENSTÅENDE FORESPØRSLER start ***********************/

.remaining-request-list ul{
	text-align: left;
	width: 100%;
	float: left;
}

.remaining-request-list li{
	border-bottom: 1px solid #ddd;
	border-top: 0;
	width: 100%;
	float: left;
	padding: 0.5em 0;
}

.remaining-request-list li .wr-dates{
	font-weight: bold;
	padding: 0 0 0.2em 0;
}
.remaining-request-list li .wr-name{
	color: #666;
	padding: 0 0 0.2em 0;
}

/*********************** GJENSTÅENDE FORESPØRSLER slutt ***********************/

/*********************** LIST STATUS start ***********************/
ul.list-status{
	background-color: none; 
	padding: 0;
}

.list-status, .list-status li{
	float:left;
	color: grey;
	text-align: left;
}

.list-status li input
{
	float: left;
	width: 100%;
	text-align: left;
}

.list-status li label{ text-align: center; }
.list-status li.user{ padding: 0 0 1em 0; }
.list-status li.user.empty{ display: none; }
.list-status li i{ font-size: 1em; }

.status-wrapper li i{
  font-size: 1.4em;
  float:left;
  position: relative;
  top: 0.1em;
}

.status-content-wrapper {
  padding: 0 1em 0 2em;
  width: 100%;
}

.list-status li.admin{ margin: 1.5em 0em 4em 0; }

.list-status li.admin label{
	text-align: left;
	color: brown;
}

.list-status li.admin label:before{
	content: "Deaktivert - trykk her for å aktivere";
	padding: 0.75em;
	border-radius: 3px;
	background-color: rgb(255, 224, 229);
	border: 1px solid brown;
	cursor: pointer;
	text-align: left;
	float:left;
}

.txt-statusIconpicker,
.txt-statusname,
.cb-status-wrapper{
	padding-left: 0;
	padding-right: 0;
	margin-bottom:0.5em;
}

.txt-statusIconpicker{ margin-bottom:1em; }

.iconpicker-input{
	border-top-left-radius:0;
	border-bottom-left-radius:0;
}

.cb-status-wrapper{ margin:0.5em 0 0 0; }

.list-status li.admin .name{
	text-align: left;
	font-size: 1.2em;
}

.list-status li.user{ color: #C86262 }

.list-status li.user .name{
	  font-size: 1.2em;
  letter-spacing: 0.1em;
  padding: 0 0 0 0;
  float: left;
   width: 100%;
}

.list-status li .comment{
	color: #999;
  float: left;
  width: 100%;
  padding: 0;
}

.list-status li input[type=checkbox]{ display: none; }
.list-status li input[type=checkbox]:checked + label,
.list-status li .checked{ color: rgb(95, 115, 57); }

.list-status li input[type=checkbox]:checked + label:before{
	content: "Aktivert - trykk her for å deaktivere";
	padding: 0.75em;
	border-radius: 3px;
	border: 1px solid rgb(95, 115, 57);
	background-color: rgb(241, 250, 223);
	cursor: pointer;
	text-align: left;
	float:left;
}

.dialogWrapper .inputWrapper .inputTable td input{ width: 75px; }

.listWrapper td{ vertical-align: top; }

.iconpicker{ float: left; }

.list-status li .iconpicker-item{ padding: 9px 16px 14px 8px; }
.list-status li .iconpicker-item i{ font-size: 2rem; }

/*********************** LIST STATUS end ***********************/

/*********************** LIVE SEARCH start ***********************/
.livesearchWrapper{
	width: 100%;
	float:left;
	padding: 0 0 3em 0;
}

.dialogWrapper .livesearchWrapper #live-search .skrenten-input{ font-size: 1.2rem; }
.dialogWrapper .livesearchWrapper #live-search i {
    padding: 0.5em 0.5em;
    font-size: 1.4rem;
}

#live-search{
	max-width: 100%;
	width: 300px;
	border: 1px solid #a9a9a9;
	position: relative;
	float: left;
}

#live-search .skrenten-input{
	border:0;
	margin: 0;
	float:left;
}

#live-search i{
	position: absolute;
  padding: 0.5em 0.5em;
  font-size: 1.8rem;
  color: #ccc;
  right: 0;
}

/*********************** LIVE SEARCH slutt ***********************/

.input-group-addon{ border: 1px solid #999; }

/*********************** BUTTON start ***********************/

.skrenten-button,
.skrenten-approve-button,
.skrenten-reject-button,
.datepick .datepick-month a.closeCSSModal,
a.closeCSSModal{
	font-size: 1.2rem;
	padding: 0.8em 2em;
  	margin: 1em 1em 1em 0;
  	border-radius: 4px;
  	text-align: center;
  	display: block;
  	float:left;
  	cursor: pointer;
  	text-decoration: none;
  	width: auto; 
}

.skrenten-button{
	  border: 1px solid #526773;
	  color: #f2f2f2;
	  background-color: #526773;
	  text-transform: uppercase;
	  opacity: 0.8;
}

.additem-wrapper .skrenten-button{ margin-top: 0; }

.skrenten-approve-button{
	background-color: rgb(241, 250, 223);
	color: rgb(95, 115, 57);
	border: 1px solid rgb(95, 115, 57);
}

.skrenten-button i{
	padding: 0 0.1em 0 0;
	font-size: 1.6rem;
}

.skrenten-button i.fa.fa-plus {
    padding: 0 1em 0 0;
    font-size: 0.9em;
}


.skrenten-reject-button{
	background-color: rgb(255, 224, 229);
	color: brown;
	border: 1px solid brown;
}

.datepick .datepick-month a.closeCSSModal,
header a.closeCSSModal,
a.closeCSSModal{
  background-color: transparent; 
  color: #005377;
  border: 1px solid #005377;
}

.skrenten-button:hover,
.skrenten-approve-button:hover,
.skrenten-reject-button:hover,
.datepick .datepick-month a.closeCSSModal:hover,
a.closeCSSModal:hover{
	opacity: 0.5;
	text-decoration: none;
}

.edit-wrapper .skrenten-button{ margin: 0 0 1em 0; }

/*********************** BUTTON slutt ***********************/


/*********************** CALENDAR start ***********************/

.datepick-month td span{ color: #CCCCCC; }
.datepick-month td .datepick-today{ background-color: #E3AE57; }
.datepick-month td .datepick-selected.datepick-today{ background-color: #4297d7; }

.datepick span.datepick-weekend{
	background-color: #fff;
	color: #CCCCCC;
}

div.content-header {
	font-size: 1.2em;
	padding: 0.5em 0;
	color: #999;
}

.radioWrapper .reqvac-names{ background-color: transparent; }

.reqvac-names, .appvac-names{
    float: left;
    width: 100%;

}

.reqvac-names{ background-color: lightblue; }

.appvac-names{background-color: #BCE6AD; border-radius:0px; }

.appvac-names.open i, .reqvac-names.open i{ color: #5F7339; padding-right: 5px;}
.appvac-names.closed i, .reqvac-names.closed i{ color: brown; padding-right: 5px; }

.reqvac-wrapper, 
.appvac-wrapper{ position: relative; }

.reqvac-wrapper .reqvac-names, 
.appvac-wrapper .appvac-names{
	-webkit-box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.75);
	box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.75);
	cursor: pointer;
}

.appvac-wrapper label,
.reqvac-wrapper label{
	display: block;
	margin-bottom: 0;
	font-weight: 0;
}

.membersCheckWrapper{
	height: 222px;
	overflow: scroll;
}

.dialogWrapper .inputWrapper .membersCheckWrapper li{ padding: 2px 0; }
.dialogWrapper .inputWrapper .membersCheckWrapper input{ width: 60px; }

.dialogWrapper {
	float:left;
	width: 100%;
}

.dialogWrapper ul{
	float:left;
	width: 300px;
	padding: 10px 0 20px 64px;
}

.dialogWrapper ul li{
	float:left;
	width: 100%;
	border-bottom: 1px solid #EDEDED;
	font-size: 0.85em;
}

.dialogWrapper ul li .dateDay{
	width: 250px;
	text-align:left;
}

.dialogWrapper ul li .day{
	text-align:left;
	border-right: 1px dotted #999999;
	width: auto;
	padding-right: 10px;
}

.dialogWrapper ul li .date{
	padding-left: 10px;
	text-align:left;
	width: auto;
}

.dialogWrapper .selectRegistrateWrapper{ clear:left; }

.dialogWrapper label
{
	text-align: left;
	padding-top: 4px;
	width: 100%;
	float: left;
}

.dialogWrapper .hoursWrapper{
	float:left;
	width: 380px;
	padding-bottom: 20px;
}

.dialogWrapper .hoursWrapper .hoursItem{
	float:left;
	width: 380px;
	padding-bottom: 10px;
}

.dialogWrapper .hoursWrapper .hoursItem select{
    float: left;
    width: 250px;
}

.dialogWrapper .hoursWrapper .hoursText
{
	width: 20px;
	float: left;	
}


.dialogWrapper .checkWrapper, .dialogWrapper .inputWrapper,
.dialogWrapper .radioWrapper, .dialogWrapper .selectWrapper, 
.dialogWrapper .textareaWrapper,
.checkWrapper, .inputWrapper,
.radioWrapper, .textareaWrapper{
	text-align:left;
	width: 100%;
	float:left;
	margin-bottom: 20px;
	
}

.dialogWrapper .checkWrapper label, .dialogWrapper .inputWrapper label,
.dialogWrapper .radioWrapper label, .dialogWrapper .selectWrapper label,
.dialogWrapper .textareaWrapper label{ text-align:left; }

.dialogWrapper .inputWrapper label{
	width: 100%;
	float:left;
	max-width: 100%;
}

.dialogWrapper .inputWrapper .input-text{
	float:left;
	width:100%;
}

.user-calendar label{
	color: #333; /*#D6D6D6;*/
	font-size: 1.2em;
	font-weight: normal;
	margin-top: 0.5em;
}


.dialogWrapper .inputWrapper input.calendar{ width: 200px; }
.dialogWrapper .inputWrapper img{ float:left; }

.dialogWrapper .selectWrapper label{
	width: 100px;
	float:left
}

.dialogWrapper .selectWrapper input{
	width: 250px;
	float:left;
	text-align: left;
}

.dialogWrapper .checkWrapper label{
	width: 100%;
	float:left;
}

.dialogWrapper .checkWrapper input{
	width: 30px;
	float:left;
	text-align: left;
	margin-top: 1px;
}

.dialogWrapper .radioWrapper label{
	width: 100%;
	float:left;
}

.dialogWrapper .radioWrapper input,
.radioWrapper input{
	width: 30px;
	float:left;
	text-align: left;
	margin-top: 1px;
}

.dialogWrapper .textareaWrapper label{
	width: 100%;
	float:left;
}

.dialogWrapper .textareaWrapper textarea{
	width: 250px;
	height: 60px;
	float:left;
	text-align: left;
}

.dialogWrapper .textareaWrapper textarea#list_comment {
    width: 100%;
    height: 150px;
}

.dialogWrapper .userListWrapper{
	float: left;
	width: 100%;
	padding: 1em; 
	border: 1px solid #ccc;
	background-color: #DEDEDE;
}

.dialogWrapper .userListWrapper .textareaWrapper{
	float:left;
	width: 100%;
}

@media (min-width:500px){
	.dialogWrapper .userListWrapper .textareaWrapper{
		width: 49%;
		margin-right: 1%;
	}
}

.usersCheckWrapper {
	  float: left;
	  width: 100%;
	  background-color: #fff;
	  height: 180px;
	  overflow: auto;
	  padding: 0.5em;
}

.usersCheckWrapper label{
	margin: 0;
	padding: 0;
}

.usersCheckWrapper ul{
	padding: 0;
	width: 100%;
}

.usersCheckWrapper ul input[type=checkbox]{ margin: 0.5em; } 

.select-dates-calendar{ margin-bottom: 3em; }

@media (min-width:768px){
	.select-dates-calendar{ margin-bottom: 0em;}
}

.admin-calendar label{ font-weight: normal;	}

.form-booking{ text-align: left; }

.form-regitrate{ max-width: 500px; }

form h4{ color: #333; }

form h4 i{
	color: rgb(152, 191, 208);
  float: left;
  font-size: 1.5em;
  position: relative;
  top: -0.25em;
}

.appvac-wrapper .form-booking h4 i{ color: rgb(151, 183, 151); }


.admvac-name{
	font-weight: bold;
	color: #666;
	padding: 0 0 1em 0;
}

.admvac-name span.num-days{
	font-weight: normal;
	color: #666;
	display: inline-block;
}

.modal-comment {
    float: left;
    width: 100%;
    padding: 0 0 1em 0;
    word-break: break-word;
    font-style: italic;
}

.datepick-month span.personname-initials,
.datepick-month span.personname-full{ color: #666; }

.datepick-month span.personname-initials{
	display: inline-block;	
	padding: 0em
}

.datepick-month .reqvac-names span.personname-initials:after{ content:'?'; }

.datepick-month span.personname-full{ display: none; }		

.datepick .reqvac-names, 
.datepick .appvac-names{
    height: 4.75em;
    overflow: hidden;
    	margin: 0.5em 0;
    padding: 0.5em 0;
}

@media (min-width:500px){
	.additem-wrapper{float: right; }
} 
@media (min-width:768px){
	.datepick-month span.personname-full{     
		display: block;
	    word-break: break-word;
	    font-size: 1rem;
	    height: 3em;
	    float: left;
	    overflow: hidden;
		/*word-spacing: 999px; */
    }
    	
	.datepick-month span.personname-initials{ display: none; }		
} 

.admin-calendar .appvac-wrapper{
	float:left;
	width: 100%;
}

.edit-wrapper table{
	color: #999;
	text-align: left;
}

.edit-wrapper th i{
	padding: 0 0 0 0.5em;
	  font-size: 2em; 
	  display: none;
}
/*********************** FORMS slutt ***********************/

/*********************** VALIDATE start ***********************/

.submit-status,
.submit-status-admincheck {
    float: left;
    width: 100%;
    color: brown;
    margin: 0.5em 0 1em 0;
}

#form-status{
	font-size: 1.2em;
    padding: 15px 0 5px 0;
    float: left;
    width: 100%;
    display: none;
}

#form-status.form-approved{ color: rgb(95, 115, 57); display: block;}
#form-status.form-error{ color: brown; display: block;}
.form-substatus{ float: left; width: 100%; padding: 0 0 15px 0; }

@media (min-width:500px){
	#form-status { padding: 0 0 5px 0; }
} 


input.input-error{
	border-color: #f779a4;
  	background-color: #fde6ee;
}


input.input-accepted{
	border-color: #88d2b6;
  	background-color: #f5fbf8;
}

#errorMessage {
    float: left;
    width: 100%;
    margin: 0 0 2em;
}

.denied {
    color: brown;
    margin: 0 0 1em 0;
}
 
.dialogWrapper .inputWrapper #usernameStatus,
.dialogWrapper .inputWrapper #passwordStatus,
.dialogWrapper .inputWrapper #reppasswordStatus{
	float:left;
	width: 100%;
}

/*********************** VALIDATE slutt ***********************/

/*********************** NAV start ***********************/

.main-nav{
	background-color: transparent;
	float:left;
	padding: 0.5em;
	width: 100%;
}

.main-nav:hover{ background-color: #fff; }

.main-nav li{ margin: 0.5em; }
.main-nav li a:hover{ background-color: #f2f2f2; }

.main-nav h1{
	text-align: center;
	color: #333;
}

.loginWrapper h1{
	font-size: 2.5em;
	color: rgb(125, 154, 164);
}

.nav-pills>li.active>a, .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus {
	color: #ccc;
	background-color: transparent;
	border: 1px solid #E3AE57;
}

.nav>li>a{
	text-decoration: none;
	color: #999;
	background-color: transparent;
	border: 1px solid #333;
	margin: 0 0.3em 0.3em 0;
	font-size: 1.2em;
}

.nav>li>a:hover, .nav>li>a:focus {
	text-decoration: none;
	color: #f2f2f2;
	background-color: transparent;
	border: 1px solid #E3AE57;
}

/*********************** NAV slutt ***********************/

.header-background{
	float:left;
	width: 100%;
	box-shadow: 2px 5px 10px #999;	
}

.box-wrapper {
  background-color: #fff;
  padding: 0;
  float: left;
  width: 100%;
  box-shadow: 4px 6px 10px #ccc;
}

@media (min-width:500px){
	.box-wrapper { padding: 15px 0; }
}

/*********************** HELP start ***********************/
.help-row{
	color: #999;
	text-align: left;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

.help-row .header{
	color: #E3AE58;
	font-size: 1.5em;
}

.help-row .appvac-names,
.help-row .reqvac-names{ color: #333; }

/*********************** HELP slutt ***********************/

/*********************** MAIN MENU start ***********************/

.mainmenu-selected{
  font-size: 2.5em;
  color: #fff;
  padding: 1.5em 0 0 0;
  border: 0;
  background: transparent;
  float: left;
  letter-spacing: 0.1em;

}

.mainmenu-selected i{ display: none; }
.mainmenu-selected.selected{ color:#7ac9ff; }

.fa.menuArrowRight{ display: none;	}
.fa.menuArrowDown{ display: none; }

@media (min-width:768px){
	.fa.menuArrowRight{ display: inline-block;	}
	.fa.menuArrowDown{ display: none; }
	
	.mainmenu-selected:hover{
	  color:#7ac9ff;
	  cursor:pointer;
	}
	
	.mainmenu-selected i{
	  font-size: 1em;
	  padding-left: 0.5em;
	  display: block;
	}
} 


.menu-wrapper-housing{
	  color: #333;
	  background-color: #005377;
	  padding: 0.5em 0 2em 0;
	  float:left;
	  width: 100%;
		
	/*	background: #75A3B7; /* Old browsers */
	/*	background: -moz-linear-gradient(-45deg,  #75A3B7 0%, #005377 15%); /* FF3.6+ */
	/*	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#75A3B7), color-stop(15%,#005377)); /* Chrome,Safari4+ */
	/*	background: -webkit-linear-gradient(-45deg,  #75A3B7 0%,#005377 15%); /* Chrome10+,Safari5.1+ */
	/*	background: -o-linear-gradient(-45deg,  #75A3B7 0%,#005377 15%); /* Opera 11.10+ */
	/*	background: -ms-linear-gradient(-45deg,  #75A3B7 0%,#005377 15%); /* IE10+ */
	/*	background: linear-gradient(180deg,  #75A3B7 0%,#005377 15%); /* W3C */
	/*	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75A3B7', endColorstr='#005377',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.menu-wrapper-options{
	  color: #fff;
	  background-color: #005377;
	  border-top: 1px solid #7D9AA4;
	padding: 0.8em 0 0.4em 0;
	float:left;
	width: 100%;
	display: none;
}

.menu-wrapper-status{
	padding: 2em 0 0 0;
	display: none;
	float: left;
  	width: 100%;
}


.menu-wrapper-housing .header-user-wrapper {
  color: #fff;
   padding: 0.5em 0 0 0;
  position: absolute;
  right: 1.5em;
}

.menu-wrapper-housing .header-user-wrapper span.link-separator { padding: 0 0.75em; }
.menu-wrapper-housing .header-user-wrapper>div { float:left; }
.menu-wrapper-housing .header-user-wrapper i{
  padding: 0;
  font-size: 1.8em;
  width: 2em;
  text-align: center;
}

.menu-wrapper-housing .header-user-wrapper .editUser:hover {
  text-decoration: none;
  color: #7ac9ff;
  cursor: pointer;
}

@media (min-width:768px){
	#toggle-housing-icon{display: none;}
	#toggle-status-icon{display: none; }
	.menu-wrapper-status{ display: block !important; }
	.menu-wrapper-options{ display: block !important; }
	#toggle-menu-icon{display: none;}
} 

@media (min-width:450px) and (max-width:991px){
	ul.list-status li {
	  min-height: 7em;
	}
}


@media (min-width:450px) and (max-width:649px){
	ul.list-status li {
	  float: left;
	  width: 50%;
	}
}

@media (min-width:650px) and (max-width:767px){
	ul.list-status li {
	  float: left;
	  width: 33%;
	}
}

ul.mainmenu{
	width: 100%;
  	padding-top: 0em;
  	float:left;
  	display: none;
  	margin: 0;
}

ul.mainmenu li input[type=submit]{
	font-size: 1.6em;
	padding: 0.5em 0em;
	background-color: transparent;
	border: 0;
	color: #fff;
	text-align: left;
}

ul.mainmenu li input[type=submit]:hover{ color: #7ac9ff; }

ul.mainmenu li{
	float:left;
	width: 100%;
}

ul.mainmenu li i{ display: none; }
ul.mainmenu li:hover i{
	display: block;
	text-align: right;
}

ul.mainmenu li form { color: #fff; }
ul.mainmenu li form:before { content: " - "; }
ul.mainmenu li form:hover { color: #7ac9ff; }

.header-responsiv-icons{
	width: 100%;
	float left;
	position: absolute;
	bottom: -1em;
	right: 2em;
}

@media (min-width:450px){
	ul.mainmenu li {
	  float: left;
	  width: 50%;
	}

}

@media (min-width:600px){
	ul.mainmenu li {
	  float: left;
	  width: 33%;
	}
}


@media (min-width:768px){
	ul.mainmenu {
  		width: auto;
  		padding-top: 3.5em;
  	}
	
	ul.mainmenu li{ width: auto; }
	ul.mainmenu li input[type=submit]{ padding: 0.6em 1em 0 1em; }
	ul.mainmenu li form:before { content: " "; }
	
	.menu-wrapper-housing .header-user-wrapper {
	  top: 0;
	  bottom:inherit;
	}
	
	.menu-wrapper-housing .header-user-wrapper i { font-size: 1.6em; }
}

/**** options start ****/

ul.optionsmenu{
	width: 100%;
	float:left;
	padding: 0.5em 0;
}

ul.optionsmenu li{
	font-size: 1.2em;
	float:left;
  	letter-spacing: 0;
  	width: 100%;
  	padding: 0.5em 0;
}

ul.optionsmenu li i{
	font-size: 1em;
	padding: 0 0.5em 0 0;
}

@media (min-width:450px){
	ul.optionsmenu li {
	  float: left;
	  width: 50%;
	}
}

@media (min-width:650px){
	ul.optionsmenu li {
	  float: left;
	  width: 33%;
	}
}


@media (min-width:900px){
	ul.optionsmenu li{
		width: auto;
		padding: 0 3em 0 0;
	}
}

/**** options slutt ****/

/*********************** MAIN MENU slutt ***********************/

/*********************** REQUEST LIST start ***********************/

ul.request-list{ margin: 1em 0; }
ul.request-list li{
	padding: 0.5em 0;
	border-bottom: 1px solid #ddd;
}

/*********************** REQUEST LIST slutt ***********************/

/*********************** TODOLIST start ***********************/

.todo-wrapper {
	float: left;
	width: 100%;
	border: 0;
}

.todo-wrapper i{ padding:0 0.5em 0 0; }


.todo-wrapper #tabs.ui-corner-all{
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	border: 0;
}

.todo-wrapper #tabs .ui-widget-header{
    border: 0;
    background-color: transparent;
    background: none;
    border-bottom: 1px solid #aaaaaa;
}
.todo-wrapper #tabs .ui-state-default, 
.todo-wrapper #tabs .ui-widget-content .ui-state-default, 
.todo-wrapper #tabs .ui-widget-header .ui-state-default {
    background: none;
    background-color: #526773; /*#e6e6e6;*/
}

.todo-wrapper #tabs .ui-state-default a, 
.todo-wrapper #tabs .ui-state-default a:link, 
.todo-wrapper #tabs .ui-state-default a:visited {
    color: #f2f2f2;
    text-decoration: none; 
}

.todo-wrapper #tabs .ui-tabs-active.ui-state-active{
	background-color: #fff;
	color: #526773;
}
.todo-wrapper #tabs .ui-tabs-active.ui-state-active:hover{ opacity: 1; }

.todo-wrapper #tabs .ui-tabs-active.ui-state-active,
.todo-wrapper #tabs .ui-tabs-active.ui-state-active a,
.todo-wrapper #tabs .ui-tabs-active.ui-state-active a:link{ color: #526773; }

.todo-wrapper #tabs .ui-state-default:hover { opacity: 0.6; }

.todo-wrapper .searchlistWrapper { margin: 0 -2.4em; }
.todo-wrapper.bigdevices .searchlistWrapper { margin: 0 -1em; }

.todo-wrapper li.membersRow {
    float: left;
    padding: 0em 1em;
    width: 100%;
    cursor: pointer;
    margin: 1em 0;
}

.todo-wrapper li.membersRow:hover .inner-wrapper{
    box-shadow: 0px 2px 3px #666;
    -moz-box-shadow: 0px 2px 3px #666;
    -webkit-box-shadow: 0px 2px 3px #666;
}

@media (min-width:768px){
	.todo-wrapper li.membersRow { width: 50%; }
}

@media (min-width:900px){
	.todo-wrapper li.membersRow { width: 100%; }
}

@media (min-width:1100px){
	.todo-wrapper li.membersRow { width: 50%; }
}

.todo-wrapper #tabs li a{
    padding: 1em 2em;
    text-transform: uppercase;
    font-size: 0.9em;
}

.todo-wrapper li .inner-wrapper {
    padding: 1em 3em 3em 1em;
    box-shadow: 0px 1px 1px #333;
    -moz-box-shadow: 0px 1px 1px #333;
    -webkit-box-shadow: 0px 1px 1px #333;
    position: relative;
    width: 100%;
	float: left;
	border-radius: 4px;
}

.todo-wrapper li .inner-wrapper div.list-comment {
	font-size: 1.2em;
	line-height: 1.6em;
	width: 100%;
	float: left;
}
.todo-wrapper li .inner-wrapper div.list-user-name {
	position: absolute;
    left: 1em;
    bottom: 1em;
    color: #999;
}
.todo-wrapper li .inner-wrapper div.list-date-created {
	position: absolute;
    right: 1em;
    bottom: 1em;
    color: #999;
}

.todo-wrapper li .inner-wrapper div.list-icon {
	position: absolute;
    right: 1em;
    top: 1em;
    color: #999;
}

.todo-wrapper li .inner-wrapper div.list-icon i {
	font-size: 1.4em;
    padding: 0;
}

.todo-wrapper li .inner-wrapper.status-todo div.list-user-name,
.todo-wrapper li .inner-wrapper.status-todo div.list-date-created,
.todo-wrapper li .inner-wrapper.status-todo div.list-icon ,
.radioWrapper .status_todo{
	color: #9DA6AC;
}

.todo-wrapper li .inner-wrapper.status-done div.list-user-name,
.todo-wrapper li .inner-wrapper.status-done div.list-date-created,
.todo-wrapper li .inner-wrapper.status-done div.list-icon ,
.radioWrapper .status_done{
	color: #9FAC87;
}

.todo-wrapper li .inner-wrapper.status-deleted div.list-user-name,
.todo-wrapper li .inner-wrapper.status-deleted div.list-date-created,
.todo-wrapper li .inner-wrapper.status-deleted div.list-icon,
.radioWrapper .status_deleted{
	color: #B08282;
}

.radioWrapper .status_todo input,
.radioWrapper .status_done input,
.radioWrapper .status_deleted input{
	margin-top: 5px;
}

.radioWrapper .status_todo i,
.radioWrapper .status_done i,
.radioWrapper .status_deleted i{
    position: relative;
    top: 0.2em;
}

.no-result{ padding: 1.5em; }

.smalldevices{ display:block; }
.bigdevices{ display: none; }

@media (min-width:900px){
	.smalldevices{ display:none; }
	.bigdevices{ display: block; }
}

/*********************** TODOLIST slutt ***********************/

/*********************** LOGIN / FORGOT PASSWORD start ***********************/

.loginWrapper a{
	display: block;
	float: left;
	width: 100%;
	padding: 1em 0 0 0;
}

.loginWrapper .postMessage{
	display: block;
	float:left;
	width: 100%;
	padding: 1em 0 0 0;
	color: #666;
}


/*********************** LOGIN / FORGOT PASSWORD slutt ***********************/

/*********************** INVITE CHECKLIST start *****************/

.dialogWrapper ul.checkList {
    float: left;
    width: 100%;
    padding: 10px 0 20px 30px;
    font-size: 1.2em;
}
/*
.dialogWrapper ul.checkList li .radioWrapper input{
    padding: 0 0 0.5em 0;
}*/


/*********************** INVITE CHECKLIST slutt *****************/
