/**********************/
/****** GENERAL *******/
/**********************/
html {
	height: 100%; overflow: auto; margin: 0;
	-webkit-overflow-scrolling: touch;
}
body {
  color: #000;
  background: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  margin: 0 0 0 0;
  height: 100%; overflow: auto; margin: 0;
  -webkit-overflow-scrolling: touch;
}

h1 {
	font-family: 'Montserrat', sans-serif;
	font-size: 35px;
	color: #00489a;
}
h2 {
	font-family: 'Montserrat', sans-serif;
	font-size: 22px;	
	color: #00489a;
}
td,
span {
	font-size: 22px;
}
#contentNA .title,
#content .title{
	font-size: 35px;
	font-weight: bold;	
}
/* 
#logo {
	width: 100%;
	height: 250px;
	position: relative;	
	background-image: url(../../../../resource/SealteQ-logo.svg);
	background-repeat: no-repeat;
	background-position:center; 
	background-color:#fff;	
	background-size: auto 90%;
	float: center;	
	margin-top:20px;	
}*/

 

/*
#topmenu {
	width: 100%;
	height: 100px;
	position: relative;	
	float: center;	
	margin-top:20px;
}*/

/*****************************/
/*******    MORE	  ********/
/*****************************/
#more {
	
}
#more .rule {
	float: left;
	width: 100%;
	min-height:  150px;
	max-height:  150px;
	line-height: 150px;
}
#more .rule .icon {
	float: left;
	width: calc(20% - 5px);	
	
	text-align: center;
	min-height:  110px;
	max-height:  110px;
	line-height: 110px;	
	padding-top: 40px;
}
#more .rule .icon img {
	min-height: 64px;
	max-height: 64px;
}
#more .rule .info {
	float: left;
	width: calc(80% - 5px);	
	border-bottom: 2px solid #bbb;
		min-height:  110px;
	max-height:  110px;
	line-height: 110px;	
	overflow:hidden;
}
#more .rule .info .text{
	float: left;
	width: calc(90% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:4vw;
	font-weight: bold;
	
}
#more .rule .info .infoicon{
	float: left;
	width: calc(10% - 5px);	
	font-family: 'Montserrat', sans-serif;
	font-size:6vw;	 
	color: #bbb;
}


.popup{	
	position: absolute;
	top: 145px;
	left: 0px;
	
	z-index:99;
	

	border-radius: 4px;  
	float: left;
	border: 0px solid #000; 
	width: 100%;
	height: calc(100% - 145px);		
	background-color: #fff;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 2 2 0 2;
	padding: 0 0 0 0;	
	display:block;
}
.bottom {
	position: absolute;
    bottom: 0;
    width: calc(100% - 20px);
    height: 140px;
    overflow: hidden;
	padding-right: 20px;
}

#contentNA .block,
#content .block{	
	border-radius: 4px;  
	float: left;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:75px;
	text-align: center;
	font-size: 24px;	
	margin: 2 2 0 2;
	padding: 0 0 0 0;	
	display:block;
}

#contentNA .blockSystem,
#content .blockSystem{	
	border-radius: 15px;  
	float: left;
	border: 0px solid #000; 
	width: calc(100% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	font-weight: bold;
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 2 2 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#contentNA .blockSystem .text,
#content .blockSystem .text {	
		margin: 2 82 0 0;
}
#contentNA .blockSystem .icon,
#content .blockSystem .icon{	
	max-width: 64px;
	float: left;
	margin: 20 0 0 20;
}
#contentNA .blockSystem .icon img,
#content .blockSystem .icon img{	
	max-height: 64px;
	max-width: 64px;
}
#contentNA .blockRight,
#content .blockRight{	
	border-radius: 4px;  
	float: right;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 2 2 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#contentNA,
#content {
	width: calc(100% );
	display:block;
	min-height: 400px;
	height: calc(100% - 280px);
	/*background-color: #efefef;*/
	background-color: #fff;
	overflow: auto;
	padding: 0 0 0 0;
	position: relative;
}
#contentNA .actions,
#content .actions {
	position: absolute;
    bottom: 0;
    /*width: calc(100% - 20px);*/
	width: calc(100% );
	background-color: #f9f9f9;
	height: 140px;	
	/*overflow: auto;*/
	overflow:hidden;		 
}
#contentNA #project #actions,
#content #project #actions {
    position: absolute;
    width: 100%;
    height: 140px;
    background-color: #f9f9f9;
    overflow: scroll;
    display: block;
    bottom: 0;
    padding-left: 0px;
}

.actions .button ,
#actions .button {	
	border-radius: 10px;  
	float: left;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
.actions .buttonRight ,
#actions .buttonRight {	
	border-radius: 10px;  
	float: right;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
.button {	
	border-radius: 10px;  
	border: 0px solid #000; 
	width: 150px;	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}

.right { text-align: right; }

.isDisabled {
  color: currentColor;
  cursor: default;
  opacity: 0.5;
  text-decoration: none;
}

/**********************/
/****** LOGIN *********/
/**********************/

#loginContent {
	font-size: 4vw;	
	text-align:center;
}

#loginInput {
	font-size: 4vw;	
	text-align:center;
}
.LoginInputText {
	font-size: 3vw;	
	font-family: 'Montserrat', sans-serif;
}
input.InputLogin{
	font-size: 5vw;	
	width:100%;
	margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;	
}


input {
	font-size: 5vw;	
	width:100%;
	margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;	
}
input[type=date] {

 
	font-size: 3vw;	
	width:100%;
	margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;	

	height: 	90px;
	min-height: 90px;
	max-height: 90px;
	vertical-align: top;				   
}


[type="date"] {
  background:#fff url(../../../../resource/calendar.png)  97% 50% no-repeat ;
}
[type="date"]::-webkit-inner-spin-button {
  display: none;
}
[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
}
textarea {
	font-size: 5vw;	
	width: calc(100% - 10px);
	height: 400px;
	margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;	
	resize: none;
}
select {
	font-size: 2.0vw;	
	width:100%;
	margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;	
}


/**********************/
/****** BUTTON ********/
/**********************/
/*#button {
	background-color: #00499b;
	width:200px;
	height:75px;
	font-size: 20px;
	font-weight:bold;
	text-align: center;
	vertical-align: center;
	line-height:75px;
	font-family: 'Montserrat', sans-serif;
	color:#fff;
	float:right;
}
#button2 {
	float:left;
	background-color: #00499b;
	width:200px;
	height:75px;
	font-size: 2vw;
	font-weight:bold;
	text-align: center;
	vertical-align: center;
	line-height:75px;
	font-family: 'Montserrat', sans-serif;
	color:#fff;
}*/
#loginButton {
	float:right;	
	border-radius: 10px;  
	float: right;
	border: 0px solid #000; 
	width: calc(50%);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#button {
	float:right;	
	border-radius: 10px;  
	float: right;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#button2 {
	float:left;	
	border-radius: 10px;  
	float: right;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#question {
	text-align:left;

}
#contentNA .answers,
#content .answers {
	text-align:center;
}
#contentNA .answers .block,
#content .answers .block{	
	border-radius: 8px;  
	border: 0px solid #000; 
	width: 90%;	
	min-height:100px;		
	background-color: #00489a;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 4vw;	
	margin-top: 10px;	
	display: table;
	float: none;
	margin: 20 auto;	
}
#contentNA .answers .block33,
#content .answers .block33{
	width: 30%;	
	margin-right: 5px;
}
.uploadImg {
	max-width: 100%;
	max-height: 200px;
}
.deleteImg {
	max-width: 96px;
	max-height: 96px;
}
.editImg {
	max-width: 96px;
	max-height: 96px;
}
/*
[type="file"] {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  white-space: nowrap;
  width: 1px;
}
[type="button"], 
[type="file"] + label {
	-webkit-appearance: none;
	background-color: #000;
	border-radius: 0px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
  
	width:200px;
	height:75px;  
	font-size: 2vw;
	background-color: #00499b;
}
  
[type="file"]:focus + label,
[type="file"] + label:hover {
    background-color: #ccc;
}*/
[type="text"]{
	font-size: 3vw;	
	width:100%;
	margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 6px;
    padding-bottom: 6px;	
	height: 	60px;
	min-height: 60px;
	max-height: 60px;
	vertical-align: top;		   
}
[type="time"].datetime,
[type="date"].datetime {
	font-size: 3vw;	
	width: calc(50% - 35px);
	margin: 8px 0;
    display: inline-block;
    border: 0px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;
	text-align: right;	
	background-color: #eee;
	-webkit-appearance: none;
	height: 	90px;
	min-height: 90px;
	max-height: 90px;
	vertical-align: top;							
}
[type="time"].datetimee {
	font-size: 3vw;	
	width: calc(45% - 5px);
	margin: 0px 0;
    display: inline-block;
    border: 0px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;
	text-align: right;	
	background-color: #eee;
	-webkit-appearance: none;
	height: 	90px;
	min-height: 90px;
	max-height: 90px;
	vertical-align: top;
}
[type="date"].datetimee {
	font-size: 3vw;	
	width: calc(55% - 5px);
	margin: 0px 0;
    display: inline-block;
    border: 0px solid #ccc;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 12px;
    padding-bottom: 12px;
	text-align: right;	
	background-color: #eee;
	-webkit-appearance: none;
	height: 	90px;
	min-height: 90px;
	max-height: 90px;
	vertical-align: top;
}	
/**********************/
/****** FOOTER ********/
/**********************/
#footer {
	/*position: fixed;*/
	position: sticky;
    bottom: 0;
    width: 100%;
	border: 2px solid #ccc;
}
#footer .block {	
	border-radius: 4px;  
	float: left;
	border: 0px solid #000; 
	width: calc(20% - 5px);	
	min-height: 132px;		
	line-height:132px;
	background-color: #fff;
	color: #cdcdcd;		
	
	text-align: center;
	font-size: 24px;	
	margin: 2 2 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#footer .block .icon{	
	line-height: 84px;
	min-height:  84px;
    max-height:  84px;	
}
#footer .block .icon img{	
	margin-top: 20px;
	min-height:  64px;
    max-height:  64px;
}
#footer .block .info{	
text-align: center;
	width: 100%;
    
    display: block;
    font-size: 24px;
	line-height:45px;
	min-height: 45px;
    max-height: 45px;
    float: right;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}



/**********************/
/****** PROJECT SELECTION *********/
/**********************/
#project,
#projectSelection {
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
	height: auto;
}


#projectSelection #projectContent {
	
}

#project #projectContent .areaRule,
#projectSelection #projectContent .areaRule {
	float: left;
	width: 90%;
	min-height: 60px;
}
#project #projectContent .areaRule .check {
	float: left;
	width: calc(10% - 5px);		
	text-align: center;
	min-height:  60px;
	padding-top: 0px;
}
#project #projectContent .areaRule .back img {
	min-height: 64px;
	max-height: 64px;
}
#project #projectContent .areaRule .info {
	float: left;
	width: calc(90% - 5px);		
}
#project #projectContent .areaRule .info .text,
#projectSelection #projectContent .areaRule .info .text{
	float: left;
	width: calc(90% - 5px);	
	min-height:  60px;
	max-height:  60px;	
	line-height: 60px;
}
#project #projectContent .areaRule .info .text .title,
#projectSelection #projectContent .areaRule .info .text .title{
	float: left;
	width: calc(95% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:3vw;
	font-weight: bold;	
	display:block;
	padding-top: 0px;
    padding-bottom: 0px;
	text-overflow: ellipsis;
	overflow:hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
#project #projectContent .areaRule .rulebottom,
#projectSelection #projectContent .areaRule .rulebottom {
	float: left;
	width: calc(90% - 5px);	
	margin-left: calc(10% - 5px);	
	border-bottom: 2px solid #bbb;
	margin-top: 20px;
}

#project #projectContent .rule,
#projectSelection #projectContent .rule {
	float: left;
	width: 90%;
	min-height:  150px;
}
#project #projectContent .rule .check {
	float: left;
	width: calc(10% - 5px);		
	text-align: center;
	min-height:  110px;
	padding-top: 40px;
}
#projectSelection #projectContent .rule .icon {
	float: left;
	width: calc(20% - 5px);		
	text-align: center;
	min-height:  110px;
	padding-top: 10px;
}
#project #projectContent .rule .icon img,
#projectSelection #projectContent .rule .icon img {
	min-height: 64px;
	max-height: 64px;
}
#project #projectContent .rule .moreinfo {
	float: left;
	width: calc(90% - 5px);	
	margin-left: calc(10% - 5px);		
}
#project #projectContent .rule .info {
	float: left;
	width: calc(90% - 5px);		
}
#projectSelection #projectContent .rule .info {
	float: left;
	width: calc(80% - 5px);	
}
#project #projectContent .rule .rulebottom,
#projectSelection #projectContent .rule .rulebottom {
	float: left;
	width: calc(90% - 5px);	
	margin-left: calc(10% - 5px);	
	border-bottom: 2px solid #bbb;
	margin-top: 20px;
}
#project #projectContent .rule .info .text,
#projectSelection #projectContent .rule .info .text{
	float: left;
	width: calc(90% - 5px);	
	min-height:  150px;
	max-height:  150px;	
	line-height: 75px;
}
#project #projectContent .rule .info .text .title,
#projectSelection #projectContent .rule .info .text .title{
	float: left;
	width: calc(95% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:3vw;
	font-weight: bold;	
	display:block;
	padding-top: 0px;
    padding-bottom: 0px;
	text-overflow: ellipsis;
	overflow:hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#project #projectContent .rule .info .text .options {
	float: left;
	width: calc(95% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:2.5vw;
	font-weight: bold;	
	display:block;
	min-height: 75px;
    max-height: 75px;
    
	overflow:hidden;

}
#project #projectContent .rule .info .text .progress,
#projectSelection #projectContent .rule .info .text .description{
	float: left;
	width: calc(95% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:2.5vw;
	font-weight: bold;	
	display:block;
 
    max-height: 75px;
    text-overflow: ellipsis;
	overflow:hidden;
}
#project #projectContent .rule .info .infoicon,
#projectSelection #projectContent .rule .info .infoicon {
	float: left;
	width: calc(10% - 5px);	
	font-family: 'Montserrat', sans-serif;
	font-size:6vw;	 
	color: #bbb;
}
#project #projectContent .rule .info .expand {
	float: left;
	width: calc(10% - 5px);	
	font-family: 'Montserrat', sans-serif;
	font-size:6vw;	 
	color: #00489a;
	margin: 20px 0 0 0;
}

#project #projectContent .stepBlockReq, 
#project #projectContent .stepBlock {	
	border-radius: 10px;  
	float: left;
	border: 0px solid #000; 
	width: calc(85% - 5px);	
	min-height:75px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:75px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#project #projectContent .stepBlockFinished {	
	border-radius: 10px;  
	float: left;
	border: 0px solid #000; 
	width: calc(85% - 5px);	
	min-height:75px;		
	max-height:100px;		
	background-color: #dedede;
	color: #fff;		
	line-height:75px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#project #projectContent .stepBlockNotFinishedYet {	
	border-radius: 10px;  
	float: left;
	border: 0px solid #000; 
	width: calc(85% - 5px);	
	min-height:75px;		
	max-height:100px;		
	background-color: orange;
	color: #fff;		
	line-height:75px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}



#deliver {
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
	height: calc(100% - 310px);
	/*height: auto;*/
	overflow:auto;
}

#project{
    z-index: 1;
    float: right;
    left: 0px;
    top: 105px;
    bottom: 0px;
    width: calc(100%);
	height: calc(100% - 145px);
	/*height: auto;*/
	overflow:auto;
}

#projectSearch{
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
	height: auto;
	overflow:auto;
}
#projectSearch #text {
	width:15%;
	float: left;
	font-size: 2.5vw;
	font-weight: bold;
	padding-top: 15px;
}
#projectSearch #field {
	width:85%;
	float: right;
}
#projectSearch #field input {
	width:95%;
}
#projectSelection {
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
	height: calc(100% - 250px);
	/*height: auto;*/
	overflow:auto;
}
#contentNA #projectSelection {
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
	height: calc(100% - 420px);
	overflow:auto;
}


#deliver #projectContent,
#project #projectContent,
#projectSelection #projectContent{
	float: left;
    left: 74px;
    width: calc(100% - 20px);
    margin: 10 10 10 10;	
}
#deliver #projectContent .blockTitle span,
#project #projectContent .blockTitle span,
#project #projectContent .blockTitle {
    border: 0px solid #ccc;
	background-color: #fff;
    width: calc(100% - 10px);
    text-align: left;
    padding: 2 0 2 0;
    margin: 10 0 0 0;
   /* min-height: 75px;
    max-height: 75px;*/
   /*/ display: block;*/
    color: #000;
	font-weight: bold;
	overflow:hidden;
	font-size: 32px;
}
#deliver #projectContent .block,
#project #projectContent .block,
#projectSelection #projectContent .block {
    border: 0px solid #ccc;
	background-color: #fff;
    width: calc(100% - 10px);
    text-align: center;
    padding: 2 0 2 0;
    margin: 10 0 0 0;
    display: block;
    color: #000;
	line-height:24px;
	overflow: visible;
	height:auto;
	max-height: none;
	min-height: initial;
	
}
#deliver #projectContent .multibutton,
#project #projectContent .multibutton,
#projectSelection #projectContent .multibutton {
    border: 1px solid #ccc;
	background-color: #fff;
    width: calc(100%);
    text-align: center;
    font-size: 3vw;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 64px;
    max-height: 64px;
    display: block;
    color: #000;
	line-height:64px;
	float: left;
	border-radius: 20px;
}
#deliver #projectContent .block .button,
#project #projectContent .block .button,
#project #projectContent .button {	
	border-radius: 10px;  
	float: right;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#deliver #projectContent .block .buttonLeft,
#project #projectContent .block .buttonLeft,
#project #projectContent .buttonLeft {	
	border-radius: 10px;  
	float: left;
	border: 0px solid #000; 
	width: calc(25% - 5px);	
	min-height:100px;		
	max-height:100px;		
	background-color: #00499b;
	color: #fff;		
	line-height:100px;
	text-align: center;
	font-size: 24px;	
	margin: 20 10 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#deliver #projectContent .block .col,
#project #projectContent .block .col,
#projectSelection #projectContent .block .col {
    white-space: nowrap;

    text-align: left;
    display: block;
    font-size: 3vw;
    padding: 0 0 0 0;
    float: left;
    font-weight: bold;
}


#deliver #projectContent .block .col10 , #project #projectContent .block .col10 , #projectSelection #projectContent .block .col10 { 	width: calc(10% -  35px);	}
#deliver #projectContent .block .col20 , #project #projectContent .block .col20 , #projectSelection #projectContent .block .col20 { 	width: calc(20% -  35px);	}
#deliver #projectContent .block .col30 , #project #projectContent .block .col30 , #projectSelection #projectContent .block .col30 { 	width: calc(30% -  35px);	}
#deliver #projectContent .block .col40 , #project #projectContent .block .col40 , #projectSelection #projectContent .block .col40 { 	width: calc(40% -  35px);	}
#deliver #projectContent .block .col50 , #project #projectContent .block .col50 , #projectSelection #projectContent .block .col50 { 	width: calc(50% -  35px);	}
#deliver #projectContent .block .col60 , #project #projectContent .block .col60 , #projectSelection #projectContent .block .col60 { 	width: calc(60% -  35px);	}
#deliver #projectContent .block .col70 , #project #projectContent .block .col70 , #projectSelection #projectContent .block .col70 { 	width: calc(70% -  35px);	}
#deliver #projectContent .block .col80 , #project #projectContent .block .col80 , #projectSelection #projectContent .block .col80 { 	width: calc(80% -  35px);	}
#deliver #projectContent .block .col90 , #project #projectContent .block .col90 , #projectSelection #projectContent .block .col90 { 	width: calc(90% -  35px);	}
#deliver #projectContent .block .col100, #project #projectContent .block .col100, #projectSelection #projectContent .block .col100{ 	width: calc(100% - 35px);	}
#deliver #projectContent .block .pad   , #project #projectContent .block .pad   , #projectSelection #projectContent .block .pad   {	padding: 25 10 25 25;		}
#deliver #projectContent .block .padS  , #project #projectContent .block .padS  , #projectSelection #projectContent .block .padS  {	padding: 5 10 5 10;			}
#deliver #projectContent .block .padC  , #project #projectContent .block .padC  , #projectSelection #projectContent .block .padC  {	padding: 15 0 20 0;			}

#deliver #projectContent td,
#project #projectContent td {
	font-size: 3vw;
}
#deliver #projectContent .block .pad img  , #project #projectContent .block .pad img  , #projectSelection #projectContent .block .pad  img {	
	margin-bottom: -18px;
	min-height: 64px;
	max-height: 64px;
}
#project #projectContent .block .pad table.tabel {	
	border-collapse: collapse;
	border: 2px solid #00489a;
}

#project #projectContent .block .pad table.tabel [type="text"]{
	font-size: 3vw;	
	width:100%;
	margin: 8px 0;
    display: inline-block;
    border: 0px solid #ccc;
    box-shadow: unset;
    border-radius: unset;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 6px;
    padding-bottom: 6px;	
	height: 	60px;
	min-height: 60px;
	max-height: 60px;
	vertical-align: top;		   
}



.stepLink {
	line-height: 48px;
}

.checkbox-label {
    display: block;
    position: relative;
    /*margin: auto;*/
    cursor: pointer;
    font-size: 22px;
    line-height: 24px;
    height: 24px;
    width: 24px;
    clear: both;
}
.checkbox-label input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.checkbox-label .checkbox-custom {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 36px;
    width: 36px;
    background-color: transparent;
    border-radius: 5px;    
    border: 2px solid #00499b;
}


.checkbox-label input:checked ~ 
.checkbox-custom {
    background-color: #FFFFFF;
    border-radius: 5px;
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity:1;
    border: 2px solid #00499b;
}


.checkbox-label 
.checkbox-custom::after {
    position: absolute;
    content: "";
    left: 12px;
    top: 12px;
    height: 0px;
    width: 0px;
    border-radius: 5px;
    border: solid #FFFFFF;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(0deg) scale(0);
    -ms-transform: rotate(0deg) scale(0);
    transform: rotate(0deg) scale(0);
    opacity:1;
}


.checkbox-label :checked ~ 
.checkbox-custom::after {
  -webkit-transform: rotate(45deg) scale(1);
  -ms-transform: rotate(45deg) scale(1);
  transform: rotate(45deg) scale(1);
  opacity:1;
  left: 8px;
  top: 3px;
  width: 12px;
  height: 24px;
  border: solid #00499b;
  border-width: 0 2px 2px 0;
  background-color: transparent;
  border-radius: 0;
}







/* DELIVER */
.multibtn {
	border-radius: 20px;	
}
.multibtn20D {    
	background-color: #fff;
    width: calc(20% - 6px);
    text-align: center;
    font-size: 24px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 128px;
    max-height: 128px;
    display: block;
    color: #00489a;
	line-height: 128px;
	float: left;
	font-weight: bold;
}
/* DELIVER */


.multibtn20 {    
	background-color: #fff;
    width: calc(20% - 6px);
    text-align: center;
    font-size: 24px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 64px;
    max-height: 64px;
    display: block;
    color: #00489a;
	line-height:64px;
	float: left;
	font-weight: bold;
}
.multibtn25 {    
	background-color: #fff;
    width: calc(25% - 6px);
    text-align: center;
    font-size: 24px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 64px;
    max-height: 64px;
    display: block;
    color: #00489a;
	line-height:64px;
	float: left;
	font-weight: bold;
}
.multibtn33 {    
	background-color: #fff;
    width: calc(33.33% - 6px);
    text-align: center;
    font-size: 24px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 64px;
    max-height: 64px;
    display: block;
    color: #00489a;
	line-height:64px;
	float: left;
	font-weight: bold;
}
.multibtn50 {    
	background-color: #fff;
    width: calc(50% - 6px);
    text-align: center;
    font-size: 24px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 64px;
    max-height: 64px;
    display: block;
    color: #00489a;
	line-height:64px;
	float: left;
	font-weight: bold;
}

.multibtnLeft {
	border: 2px solid #00489a;
	border-top-left-radius: 20px 20px;
	border-bottom-left-radius: 20px 20px;
}
.multibtnMiddle {
	border-top: 2px solid #00489a;
	border-bottom: 2px solid #00489a;
	border-left: 2px solid #00489a;
}
.multibtnRight {
	border: 2px solid #00489a;
	border-top-right-radius: 20px 20px;
	border-bottom-right-radius: 20px 20px;	
}



.multibtnV {    
	background-color: #fff;
    width: calc(100% - 6px);
    text-align: center;
    font-size: 24px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    min-height: 64px;
    max-height: 64px;
    display: block;
    color: #00489a;
	line-height:64px;
	float: left;
	font-weight: bold;
}
.multibtnVTop {
	border: 2px solid #00489a;
	border-top-left-radius: 20px 20px;
	border-top-right-radius: 20px 20px;
}
.multibtnVMiddle {
	border-top: 2px solid #00489a;
	border-bottom: 2px solid #00489a;
	border-left: 2px solid #00489a;
	border-right: 2px solid #00489a;
}
.multibtnVBottom {
	border: 2px solid #00489a;
	border-bottom-left-radius: 20px 20px;	
	border-bottom-right-radius: 20px 20px;	
}
#contentNA #system .spacer,
#content #system .spacer {
	float: left;
	height: 40px;
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	text-overflow: ellipsis;
	overflow:hidden;
	white-space: nowrap;	
	width: calc(100% - 5px);
}
#contentNA #remarks .title,
#contentNA #system .title,
#content #remarks .title,
#content #system .title{
	float: left;
	width: calc(90% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:50px;
	font-weight: bold;	
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	text-overflow: ellipsis;
	overflow:hidden;
	white-space: nowrap;
}
#contentNA #system .remark,
#content #system .remark{
	float: left;
	width: calc(90% - 5px);	
	color: #000;
	font-family: 'Montserrat', sans-serif;
	font-size:24px;
	min-height: 24px;
	font-weight: bold;	
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	text-overflow: ellipsis;
}
#contentNA #system .productTable,
#content #system .productTable{
	float: left;
	width: calc(100% - 5px);	
	color: #000;
	font-family: 'Montserrat', sans-serif;
	font-size:24px;
	min-height: 24px;
	font-weight: bold;	
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	text-overflow: ellipsis;
	/*overflow:hidden;*/
	/*white-space: nowrap;*/
}
#contentNA #system .productTable table tr td.pTitle,
#content #system .productTable table tr td.pTitle{
	background-color: #00489a;
	color: #fff;
	font-size: 24px;	
}
#contentNA #remarks .remark .title,
#contentNA #system .product .title,
#content #remarks .remark .title,
#content #system .product .title{
	float: left;
	width: calc(90% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:42px;
	font-weight: bold;	
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	overflow:hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
#contentNA #remarks .remark .expand,
#contentNA #system .product .expand,
#content #remarks .remark .expand,
#content #system .product .expand {
	float: right;
	width: calc(10% - 12px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:50px;
	font-weight: bold;	
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	overflow:hidden;
	text-overflow: ellipsis;
	white-space: nowrap;	
	
}
#contentNA #remarks .remark,
#contentNA #system .product,
#content #remarks .remark,
#content #system .product {
	float: left;
    width: 100%;
    min-height: 75px;
	border: 0px solid black;
}
#contentNA #remarks .subtitle,
#contentNA #system .subtitle,
#content #remarks .subtitle,
#content #system .subtitle{
	float: left;
	width: calc(90% - 5px);	
	color: #00489a;
	font-family: 'Montserrat', sans-serif;
	font-size:26px;
	font-weight: bold;	
	display:block;
	padding-top: 4px;
    padding-bottom: 4px;
	overflow:hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
#contentNA #system .block,
#content #system .block{	
	border-radius: 4px;  
	float: left;
	border: 0px solid #000; 
	width: calc(33% - 5px);	
	min-height:90px;		
	max-height:90px;		
	background-color: #00499b;
	color: #fff;		
	line-height:25px;
	text-align: center;
	font-size: 24px;	
	margin: 2 2 0 4;
	padding: 10 0 0 0;	
	display:block;
	overflow: hidden;
	text-overflow: ellipsis;
}
#contentNA #remarks .block,
#content #remarks .block{	
	float: left;
	width: calc(100% - 5px);	
	min-height:77px;		
	max-height:100%;		
	height: auto;
	color: #00499b;		
	
	text-align: left;
	font-size: 28px;	
	font-weight: bold;
	margin: 2 2 0 2;
	padding: 10 0 0 0;	
	display:block;

	background-color: #fff;
}
#contentNA #remarks .block .date,
#content #remarks .block .date{
	width: calc(50%);
	float: left;
	text-align: left;
	border: 0px solid #000; 
	padding: 10 0 0 0;
	line-height:25px;
	font-size: 24px;	
	font-weight: bold;	
}
#contentNA #remarks .block .user,
#content #remarks .block .user{
	width: calc(50% - 40px);
	float: right;
	text-align: right;
	border: 0px solid #000; 
	padding: 10 30 0 0;
	line-height:25px;
	font-size: 24px;	
	font-weight: bold;	
}
#contentNA #remarks .block .text,
#content #remarks .block .text{
	float: none;
	overflow:auto;
	width:100%;
	font-size: 24px;	
	border: 0px solid #000; 
	padding: 10 0 0 0;
	color:#000;
	font-weight: bold;
	line-height:25px;
	max-height: 250px;
}
#contentNA #remarks .block .photo,
#content #remarks .block .photo{
	float: left;
	width:100%;
	border-bottom: 5px solid #ccc; 
	line-height:25px;
	padding: 2 0 10 0;
}
#contentNA #remarks,
#content #remarks {
	width: calc(100% );
	display:block;
	min-height: 400px;
	height: calc(100% - 250px);
	/*background-color: #efefef;*/
	background-color: #fff;
	overflow: auto;
	position: relative;
	margin: 4 4 4 4;
}
#contentNA #system,
#content #presence,
#content #system {
	width: calc(100% );
	display:block;
	min-height: 400px;
	height: calc(100% - 125px);
	/*background-color: #efefef;*/
	background-color: #fff;
	overflow: auto;
	position: relative;
	margin: 4 4 4 4;
}

#content #presence #top {
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
    height: 470px;
    overflow: auto;	
}
#content #presence #rules {
    z-index: 1;
    float: right;
    left: 0px;
    bottom: 0px;
    width: calc(100%);
    height: calc(100% - 495px);
    overflow: auto;	
}
@media (orientation: portrait) {
	#map {
		display: none;
	}
	#hideMap {
		display: none;
	}

}

#homeTitle {
	width: 100%;
	display:block;
/*	height: 100px;*/
	overflow: hidden;
}
#homeTitle #title {
	float: left;
	width: calc(75%);
}
#sorting {
	float: right;
	width: calc(25%);
}
/*
#hideMap {
	float: right;
	width: calc(25%);	
	font-family: 'Montserrat', sans-serif;
	font-size:2.5vw;	 
	color: #00489a;
	margin: 5px 0 0 0;
	text-align:right;
}*/
span .T1 {
  color: blue;
  font-family: verdana;
  font-size: 3vw;
}							   


#project #projectContent .blockTitle span, #project #projectContent .blockTitle #breadcrumb_objects{
	 width: 90%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#project #projectContent .blockTitle span, #project #projectContent .blockTitle #breadcrumb_objectsF{
	 width: 90%;
  white-space: nowrap;
  
}

#contentimg {
	width: calc(100% - 20px);
	display:block;
	min-height: 400px;
	height: calc(100%);
	/*background-color: #efefef;*/
	background-color: #fff;
	overflow: visible;
	padding: 10px 10px 10px 10px;
	position: relative;
}


#contentimg .content .drawing {
	width: calc(100% - 205px);
	float: left;
	/*height: calc(100% - 100px);*/
	/*height: calc(768px);*/
	overflow: hidden;
}
.icon {
		min-height: 64px;
	max-height: 64px;
}
#contentimg .content .drawOpt {
	/*position: absolute;
    bottom: 0;*/	
    width: calc(200px);
	float: right;
	top: 0px;
	height: auto;	
	overflow: auto;
}
.drawOpt .button ,
#drawOpt .button {	
	border-radius: 10px;  
	float: left;
	border: 0px solid #000; 
	width: calc(200px);	
	min-height:75px;		
	max-height:75px;		
	background-color: #00499b;
	color: #fff;		
	line-height:75px;
	text-align: center;
	font-size: 24px;	
	margin: 5 2 0 2;
	padding: 0 0 0 0;	
	display:block;
}
#areaImage
{
	height: calc(100%);
	background-color: #ccc;
	width: calc(45%);
	float:left;
	display:none;
}	

#landscapeNA {
	display:none;
}




#datasheetSearch{
    z-index: 1;
    float: right;
    left: 0px;
    top: 113px;
    bottom: 0px;
    width: calc(100%);
	height: auto;
	overflow:auto;
}
#datasheetSearch #text {
	width:15%;
	float: left;
	font-size: 2.5vw;
	font-weight: bold;
	padding-top: 15px;
}
#datasheetSearch #field {
	width:85%;
	float: right;
}
#datasheetSearch #field input {
	width:95%;
}





@media (orientation: landscape) {
	#landscapeNA {
		z-index:99;
		display: block;
		height: calc(100% - 175px);
		min-height: initial;
	}	
	#contentNA {
		height: calc(100% - 180px);
		min-height:initial;
		display: none;
	}		
	#content {
		height: calc(100% - 180px);  /*wim was -130px*/
		min-height:initial;
	}
	h1 {
		font-size: 24px;
		padding: 0 0 0 0;
		margin: 5 0 5 0;
	}
	#hideMap {
		font-size:12px;
	}	
	#footer .block {	
		border-radius: 4px;  
		overflow:hidden;
		width: calc(20% - 5px);	
		min-height: 100px;		
		line-height:100px;
		font-size: 12px;	
		margin: 2 2 0 2;
	}
	#footer .block .icon{	
		line-height: 60px;
		min-height:  60px;
		max-height:  60px;	
	}
	#footer .block .icon img{	
		margin-top: 5px;
		min-height:  54px; /*wim was 24*/
		max-height:  54px; /*wim was 24*/
	}
	#footer .block .info{	 
		font-size: 20px;
		line-height:35px;
		min-height: 30px;
		max-height: 20px;
 
	}
	#map {
		width: calc(50% - 10px);
		height: calc(100% - 120px);
		float: left;
	}
	#projectSelection {
		width: calc(50% - 10px);
		height: calc(100% - 195px);
		overflow:auto;
	}
	#projectSelection  #projectContent {
		height: calc(100% - 20px);
	}	
	#projectSearch {
		width: calc(50% - 10px);
		height: auto;
		overflow:auto;
	}
	#projectSelection #projectContent .rule .info {
		float: left;
		width: calc(100% - 5px);
	}
	
	#project #projectContent .rule,
	#projectSelection #projectContent .rule {
		min-height:  75px;  /*wim was 75px*/
		width: calc(100% - 5px);
	}
	#project #projectContent .rule .info .text .title,
	#projectSelection #projectContent .rule .info .text .title{ 
		font-size:24px;		 
	}	
	#project #projectContent .rule .info .text .progress,
	#projectSelection #projectContent .rule .info .text .description{
		font-size:14px;
		max-height: 37px;
		text-overflow: ellipsis;
		line-height: 37px;
		overflow:hidden;
	}
	#project #projectContent .rule .info .text,
	#projectSelection #projectContent .rule .info .text{
		min-height:  75px;  /*wim was 75px*/
		max-height:  75px;  /*wim was 75px*/	
		line-height: 37px;
	}
	#projectSelection #projectContent .rule .icon {
		display: none;
		width: calc(0%);		
	}	
	#project #projectContent .rule .info .infoicon,
	#projectSelection #projectContent .rule .info .infoicon {
		font-size:4vw;	 
	}

	#project #projectContent .rule .info .text .progress, #projectSelection #projectContent .rule .info .text .description {
		width: calc(90% - 5px);
	}
	
	#contentNA #project #actions,
	#content #project #actions {
		position: absolute;
		width: 55%;
		height: 50px;	
		background-color: #f9f9f9;
		overflow:hidden;
		display:block;
		bottom: 0;
		padding-left: 5px;
	}	
	#project/*,
	#projectSelection */{
		/*z-index: 1;
		float: right;
		left: 0px;
		top: 113px;
		bottom: 0px;
		width: calc(50%); 
		height: auto;*/
		height: calc(100% - 55px);		
		width: calc(50%);
		float:right;
		display:block;
	}
	#areaImage
	{
		height: calc(100% - 10px);
		background-color: #fff;
		width: calc(49% - 10px);
		float:left;
		display: block;
		padding: 5 5 5 5;
	}	
 
	#areaImage #prev
	{
		width: calc(45%);
		float:left;
		display: block;
		bottom: 0px;
		min-height: 40px;
		
		border-radius: 10px;		
		border: 0px solid #000;			
		background-color: #00499b;
		color: #fff;
		line-height: 40px;
		text-align: center;
		font-size: 24px;
		margin: 5 10 0 2;
		padding: 0 0 0 0;
	}	 
	#areaImage #next
	{
		width: calc(45%);
		float:right;
		display: block;
		bottom: 0px;
		min-height: 40px;
		
		border-radius: 10px;		
		border: 0px solid #000;			
		background-color: #00499b;
		color: #fff;
		line-height: 40px;
		text-align: center;
		font-size: 24px;
		margin: 5 10 0 2;
		padding: 0 0 0 0;
	}	
  
 
	#areaImage img{
		max-width: 100%;
		max-height: 100%;
	}	
	
	#project #projectContent .rule .check {
		float: left;
		width: calc(10% +10px);		
		text-align: center;
		min-height:  50px;  /*wim was 110px */
		padding-top: 25px;
	}
	#project #projectContent .rule .info {
		float: right;
		width: calc(90% - 5px);	 /*wim was 90% -5px */
		left: 150px;	
	}
	/*#projectSelection #projectContent .rule .info {
		float: left;
		width: calc(80% - 5px);	
	}*/

	#project #projectContent .rule .info .expand {
		float: left;
		width: calc(10% - 5px);	
		font-family: 'Montserrat', sans-serif;
		font-size:4vw;	 
		color: #00489a;
		margin: 20px 0 0 0;
	}
	#project #projectContent .rule .rulebottom, 
	#projectSelection #projectContent .rule .rulebottom {
		float: left;
		width: calc(90% - 5px);	
		margin-left: calc(10% - 5px);	
		border-bottom: 2px solid #bbb;
		margin-top: 10px;
	}
	#project #projectContent .rule .moreinfo {
		float: left;
		width: calc(100% - 5px);
		margin-left: calc(10% - 5px);
	}
	/*#project #projectContent .rule .info .text .progress,
	#projectSelection #projectContent .rule .info .text .description{
		float: left;
		width: calc(95% - 5px);	
		color: #00489a;
		font-family: 'Montserrat', sans-serif;
		font-size:2.5vw;
		font-weight: bold;	
		display:block;
	 
		max-height: 100px;
		text-overflow: ellipsis;
		overflow:hidden;
	}*/

	.checkbox-label .checkbox-custom {
		position: absolute;
		top: 0px;
		left: 0px;
		height: 36px;
		width: 36px;
		background-color: transparent;
		border-radius: 5px;    
		border: 2px solid #00499b;
	}
	.checkbox-label :checked ~ 
	.checkbox-custom::after {
		left: 8px;
		top: 0px;
		width: 16px;
		height: 24px;	 
	}/*
	#content .actions {
		position: absolute;
		bottom: 0;
		width: calc(100% - 20px);
		background-color: #f9f9f9;
		height: 140px;	
		overflow: auto;
	}*/
	.actions .button ,
	#actions .button {	
		border-radius: 10px;  
		float: left;
		border: 0px solid #000; 
		width: calc(25% - 5px);	
		min-height:45px;		
		max-height:45px;		
		line-height:45px;
		background-color: #00499b;
		color: #fff;			
		text-align: center;
		font-size: 18px;	
		margin: 2 10 0 2;
		padding: 0 0 0 0;	
		display:block;
	}
	.actions .buttonRight ,
	#actions .buttonRight {	
		border-radius: 10px;  
		float: right;
		border: 0px solid #000; 
		width: calc(25% - 5px);	
		min-height:100px;		
		max-height:100px;		
		background-color: #00499b;
		color: #fff;		
		line-height:100px;
		text-align: center;
		font-size: 24px;	
		margin: 20 10 0 2;
		padding: 0 0 0 0;	
		display:block;
	}
	.popup{	
		position: absolute;
		top: 73px;
		left:-2px;
		height: calc(100% - 75px);
	}
	#popup #project {
		height: calc(100% - 55px);		
		width: calc(100%);
		float:right;
		display:block;
	}
}