/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 .button-container {
			background: rgb(16, 71, 135);
			border-radius : 10px;
			padding: 80px 90px;
			margin-bottom:30px;
		}
		@media (max-width: 767px) {
			.button-container {
				padding: 30px;
			}
		}
		.button-wrapper-custom h2 {
			text-align: center;
			color: #fff;
			font-size: 32px;
			max-width: 550px;
            margin: 0 auto 30px;
		}

		.button-wrapper-custom #calculator-description{
			font-size: 16px;
			margin: 0 auto 30px;
		}
		
		.button-wrapper-custom .row {
			margin: 0 -28px;
			display: flex;
            flex-wrap: wrap;
            align-items: flex-end!important;
		}

		.button-wrapper-custom .row .col {
			padding: 0 10px;
			flex: 0 0 33.3333333333%;
            max-width: 33.3333333333%;
            box-sizing: border-box;
		}

		@media (max-width: 767px) {
			.button-wrapper-custom .row .col {
				flex: 0 0 100%;
	            max-width: 100%; 
			}
			.button-wrapper-custom .row .col + .col {
				margin-top: 40px;
			}
		}

		.button-wrapper-custom input {
			display: block;
		}

		.button-wrapper-custom .custom-slider {
			  -webkit-appearance: none;
			  width: 100%;
			  height: 7px;
			  background: #fff;
			  outline: none;
			  opacity: 1;
			  -webkit-transition: .2s;
			  transition: opacity .2s;
			  border-radius: 10px;
		}
		.button-wrapper-custom .custom-slider::-webkit-slider-thumb {
		  -webkit-appearance: none;
		  appearance: none;
		  width: 25px;
		  height: 25px;
		  background: #8049A5;
		  cursor: pointer;
		  border-radius: 50%;
		  border: 5px solid #63B3D6;
		}

		.button-wrapper-custom .custom-slider::-moz-range-thumb {
		  width: 25px;
		  height: 25px;
		  background: #8049A5;
		  cursor: pointer;
		  border: 5px solid #63B3D6;
		}

		.button-wrapper-custom p {
			font-size: 20px;
			color: #fff;
			margin-bottom: 30px;
			margin-top: 0;
		}

		.button-wrapper-custom button {
			width: 100%;
			max-width: 220px;
			height: 60px;
			border: 1px solid #878D93;
			border-radius: 4px;
			color: #414141;
			font-size: 18px;
			background: #fff;
			margin-top: 30px;
			margin-bottom:0;
			font-weight: bold;
			cursor:text!important;
		}



		.button-wrapper-custom .col.last p{
			margin-bottom: 0;
		}
		.button-wrapper-custom .col.last button{
			margin-top: 24px;
		}


		#fordon{font-weight:bold;}
		#showresultformcontainer{display:none;margin-top:20px;text-align: center;}
			#showresultform{max-width:300px;margin: 0 auto;}
			.contact-result-form{margin-top:25px;}

		.contact-result-form p{
			text-align: center;
		}

		.contact-result-form p, .contact-result-form label{
			color:#fff;
		}

		.contact-result-form .col {
			width: 100%;
		}

		.contact-result-form .wpcf7-submit {
			border-radius: 20px !important;
			background: #794EA0;
		}
		
		#showresultform {
			border: 1px solid #fff;
			color: #fff;
			padding: 5px 20px;
		}

		.contact-result-form .wpcf7 .wpcf7-not-valid-tip {
		    display: block!important;
		    font-size: 0.7rem;
		    margin-bottom: 1rem;
		    text-align: left;
		}	
		
		
		/* ie fix */
		
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     /* IE10+ CSS styles go here */

     .button-container {
     	border-radius: 0;
     }
     input[type=range] {
			width: 100% !important;
			padding: 0;
			background: transparent !important;
     	height: auto !important;
		}


input[type=range]::-ms-track {
    width: 100%;
    height:7px;
    
    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    background: transparent;
    
    /*leave room for the larger thumb to overflow with a transparent border */
    border-color: transparent;
    border-width: 14px 0;

    /*remove default tick marks*/
    color: transparent;
}

input[type=range]::-ms-fill-lower {
    background: #fff;
    border-radius: 10px;
}
input[type=range]::-ms-fill-upper {
    background: #fff;
    border-radius: 10px;
}

input[type=range]::-ms-thumb {
    width: 15px !important;
		  height: 15px !important;
		  background: #8049A5;
		  cursor: pointer;
		  border: 5px solid #63B3D6;
		  border-radius: 50%;
}
.button-wrapper-custom p {
			margin-bottom: 10px !important;
		}

		.button-wrapper-custom button {
			margin-top: 10px !important;
		}
}