html,body{background-color:#faf8f6;}

.header{
	background:$white;
	box-shadow: 0 5px 15px 0 rgba(0,0,0,.07) !important;
	
	img{height:3rem;display:block;margin:0.75rem 0;}
	.cell{padding:1rem;}
	
}

.row{
	margin:1.5rem 0;
	
	h1{color:$primary-color;}
	
	.callout{border-radius:0.25rem;
		background-color:$primary-color;
		margin:1rem 0;
		border:none;
		color:$white;
		//background: rgba( $light-gray,0.25) url(/images/icon-contact.svg) no-repeat calc(100% - 1.5rem) calc(100% - 1.5rem);
		//background-size: 3rem 3rem;  
		padding:1.5rem;
		p{margin:0 0 0.75rem 0;}
		a{color:$white;text-decoration:underline;}
	}
	p.disclaimer{margin-top:1.5rem;font-size:0.875rem;}
}

.expertise-calculator{
	
	.form-row{
		margin-bottom:$global-margin;
		label{font-weight:700;font-size:1rem;}
		input{height:auto;padding:0.75rem;border:solid 1px $light-gray;box-shadow:none;border-radius:0.25rem;}
		input:disabled{background:rgba($primary-color,0.05) !important;}
	}
	
	
	.slider-wrapper{position:relative;}
	.slider-wrapper .slider {
	  margin-right: 7.5rem;
	  position: relative;
	}
	
	.slider-wrapper .slider-value {
	  width: 4rem;
	  position: absolute;
	  top: -0.75rem;
	  right: 0;
	  border: solid 1px #ddd;
	  line-height: 1.5rem;
	  padding: .75rem;
	  background:rgba($primary-color,0.05) !important;
	  border-radius:0.25rem;
	}
	
	
	.input-wrapper{position:relative;}
	input[type="text"].euro,input#roi_months{background:none;padding-left:1.5rem;}
	input[type="text"].euro + span{
  	  position: absolute;
  	  top: 0.875rem;left: 0.75rem;
	}
	input[type="text"].euro + span::after {
	  content: "€ ";
	  color: #ccc;
	}
	
	.noUi-connect {
	  background: $primary-color;
	}
	
	.fieldset.hidden{display:none;}
	.slide-submit {
	  box-sizing: border-box;
	  background: $white;
	  border: solid 1px $light-gray;
	  border-radius: .25em;
	  padding: .5rem;
	  font-size: 1rem;
	  position: relative;
	  overflow: hidden;
	  user-select: none;
	  transition: .2s;
	  margin-top:0.75rem;
	  width:50%;
	  @include breakpoint(small only){
		  width:100%;
	  }
	  
	}
	
	.slide-submit-text {
	  display: inline-block;
	  color: #444;
	  font-style: italic;
	}
	
	.slide-submit-thumb {
		position: absolute;
		top: 0;
		left: 0px;
		width: 50px;
		height: 100%;
		border-radius: .125em;
		text-align: center;
		font-family: serif;
		color: #fff;
		background-color: $primary-color;
		line-height: 1.5em;
		
		&::after {
			content: "";
			display: block;
			width: 100%;
			height: 100%;
			background: url(../images/arrow-right.png) no-repeat 50% 50%;
		}
	}
}




.footer{
	background-color:$primary-color;color:$white;line-height:1.5rem;
	.cell{padding:1rem;font-size:0.875rem;}
	p{margin:0.75rem;}
	a{color:$white;line-height:1.5rem;}
	a::after{content:"|";padding:0 0.375rem;}
	a:last-child::after{display:none;}
	
}
.ui-datepicker {
	background: #ddd;
	border: none !important;
	border-radius: 0;
	padding:0;
	box-shadow:0 0 0.5em rgba(0,0,0,0.25);
}
.ui-datepicker tr{background:none;}
.ui-widget *{border-radius:0 !important;}
.ui-datepicker .ui-datepicker-header{border:none;}
.ui-datepicker .ui-datepicker-header{background:#000 none;color:#fff;}
.ui-datepicker .ui-datepicker-header .ui-state-hover{background:none !important;border:none !important;}

.ui-datepicker table{margin-bottom:0;}

.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default,.ui-button,.ui-button.ui-state-disabled:hover,.ui-button.ui-state-disabled:active{
	border:none;
	background:#fff;
}
.ui-datepicker table{border:none !important;padding:0;}
.ui-datepicker td{padding:0;font-size:0.875em;border:solid 1px #ececec;height: 3em;width: 3em;text-align:center;}	
.ui-datepicker td.ui-datepicker-unselectable{background-color:#ececec;opacity:0.35 !important;}
.ui-datepicker td.ui-datepicker-unselectable *{background:none !important;}
.ui-datepicker td a{text-align:center !important;padding:0.75em;}
.ui-datepicker thead{background:none;}
thead, tbody, tfoot{border:none;background:#fff;}

.ui-datepicker .ui-state-hover {
	background: $primary-color !important;
	color:#fff;
}
.ui-datepicker-current-day a{
	background: $primary-color !important;
	color:#fff !important;
}
.ui-datepicker-today a{
	background: #ddd !important;
	color:#fff !important;
}

 .ui-datepicker .ui-datepicker-next span,
 .ui-datepicker .ui-datepicker-prev span {
	background-image: url(../images/ui-icons_ffffff_256x240.png);
	background-position: -32px 0;
	margin-top: 0;
	top: 0.5em;
	font-weight: normal;
}
 .ui-datepicker .ui-datepicker-prev span {
	background-position: -96px 0;
}


 
.ui-widget-content{position:absolute;background:#fff;border:1px solid #ddd;z-index:100;}
.ui-widget-content.fixed{position:fixed;padding-top:0.5em;}
.ui-helper-hidden-accessible{display:none;}
.ui-widget-content li{list-style:none;border-bottom:1px solid $light-gray;padding:0.5em 0.5em 0.5em 0.5em;cursor:pointer;}
.ui-widget-content li:last-child{border-bottom:none;}
.ui-widget-content li:hover{color:$primary-color;}



.ui-autocomplete{font-size:0.875em;}
.ui-autocomplete li:hover, .ui-autocomplete .ui-state-focus{background:none;border:solid 1px $light-gray;}