@import url('https://fonts.googleapis.com/css?family=Montserrat:100,400,500,600,700|Open+Sans&display=swap');
	@font-head: 'Montserrat', sans-serif;
	@main-color: #d2001b;
	@sec-color: #a90000;
	@background: #f5f5f5;
	@wit:#fff;
	
	/* Algemene Styling */
	h1, h2, h3{margin:0; padding:0; font-family:@font-head;}
	body{    line-height: 24px;     font-size: 16px;color: #797979;font-family: Open Sans, sans-serif;}
	
	
	/* Topbar */
	.topbar{
	background-color:@main-color; position: absolute; width: 65%;  z-index: 1; display: block;  top: 0px; height: 40px;}
	.topbar:after {content: ""; position: absolute; top: 0; right: -3%; background: @main-color; width: 60px; height: 40px; -webkit-transform: skew(-40deg); 
	-moz-transform: skew(-40deg); -o-transform: skew(-40deg);  z-index: 0;}
	
	/* rowzero - Header top CTA */
	.rowzero{background-color:@background;padding:0px;}
	.rowzero #column-1-0{z-index:10;  padding-top: 11px; padding-bottom: 11px;}
	.rowzero h3, .rowzero a{margin:0px;font-weight:600;font-size: 13px;line-height: 18px;}
	.rowzero h3{z-index: 999;  color: #fff;}
	.rowzero #column-1-1{text-align:right; padding-top: 8px; padding-bottom: 8px;}
	.rowzero a {color: #003180;}
	.rowzero a:hover {text-decoration:underline;}
	
	/* rowone - Header */
	.rowone{box-shadow: none; padding: 10px 0px 20px; height: 125px; left: 0; position: relative; top: 0; width: 100%; z-index: 99;}
	.rowone #column-2-0{;height:90px; display: table;  -webkit-transition: all 400ms ease; transition: all 400ms ease; margin: 0;}
	.rowone .logo {max-height: 75px;}
	.rowone .feature-box-holder .fa{float: left; color:@main-color; display: block;  background: none;  line-height: 1;  font-size: 24px;  
	margin-right: 10px; margin-left: 10px;  -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease;  -o-transition: all 0.3s ease;  
	transition: all 0.3s ease; height: 50px; width: 50px; border: 2px solid @main-color; border-radius: 50%; text-align: center; padding-top: 10px; padding-left: 2px;}
	.rowone #column-2-1, .rowone #column-2-2, .rowone #column-2-3{padding-top: 20px; color: #393f46;}
	.rowone .feature-box-holder h4{font-size: 13px; line-height: 10px; padding-top: 8px; margin-top: 0px; font-weight: 600; color:@sec-color;}
	.rowone .feature-box-holder h4 a{color:@sec-color;}
	.rowone .feature-box-holder p{font-size: 12.2px; line-height: 11px;  font-weight: 400;  margin: 0 0 10px;}
	
	/* rowtwo - CTA Bottom header */
	.rowtwo{background: linear-gradient(90deg, transparent 50%, #d2001b 50%);  height: 50px;  z-index: 99999;  position: absolute;  width: 100%;  margin-top: -20px;}
	.rowtwo #column-3-1{ background-color: #d2001b;  height: 50px;   text-align: center; color:#fff;}
	.rowtwo #column-3-1:before { content: "";   position: absolute;  top: 0;  left: -2%;  background: #d2001b;  width: 120px;  height: 50px;
	 -webkit-transform: skew(-40deg); -moz-transform: skew(-40deg);  -o-transform: skew(-40deg);  z-index: 0;}
	.rowtwo h3{font-size: 22px; font-weight: 500;   text-transform: none;  line-height: 50px;}
	
	/* rowthree CTA Banner */
	.rowthree{background: url("https://www.metselbedrijf-haarlem.nl/lp/resources/images/metselbedrijf-haarlem.nl/metselbedrijf-goebel-metselwerk-muur-tuin-border.png");
	padding: 200px 0px; margin:0px;  background-repeat: no-repeat;  background-size: cover; background-attachment: fixed;  background-position: 50% 50%;
	}
	.rowthree #column-4-0 .rowthree-cta{padding:40px;  background-color: rgba(50,55,60,0.85);  margin-right: 0px;  margin-bottom: 10px;  margin-left: 0px;    border-left: 3px solid #d2001b;}
	.rowthree #column-4-0 .rowthree-cta h4{font-family: 'Montserrat', sans-serif;  font-size: 24px ; font-weight: 800; color: #fff; line-height: 24px;  
	text-transform: uppercase; letter-spacing: 0px;  margin: 0px 0px 10px;}
	.rowthree #column-4-0 .rowthree-cta h1{font-family: 'Montserrat', sans-serif; font-size: 60px;  font-weight: 600; color: #fff; line-height: 60px; text-transform: uppercase;
	letter-spacing: 0px; margin: 0px 0px 10px;  padding: 0px;}
	.rowthree #column-4-0 .rowthree-cta h1 span{color:@main-color;}
	.rowthree #column-4-0 .rowthree-cta p{ font-size: 16px;  color: #fff;  line-height: 24px;  text-transform: none;  max-width: 90%;}
	.rowthree #column-4-0 .btn{ transition: all 0.3s ease 0s;  min-height: 0px; min-width: 0px;  line-height: 17px;  border-width: 0px; margin: 10px 0px;
	padding: 15px 24px 14px; letter-spacing: 2px; font-size: 12px; color: #fff; background-color: @main-color;  text-transform: uppercase; font-weight: 700;}
	.rowthree #column-4-0 .btn:hover{background-color: #393f46;    color: #fff;}
	
	/* rowfour - Feature items */
	.rowfour{color:#fff;}
	.rowfour .col-md-4{padding: 50px 50px 70px;}
	.rowfour #column-5-0{background-color:@sec-color;}
	.rowfour #column-5-1{background-color:darken(@sec-color, 5%);}
	.rowfour #column-5-2{background-color:darken(@sec-color, 10%);}
	.rowfour .feature-box-holder .fb-icon{display:inline-block; float:left; padding: 0px 15px; margin-bottom: 140px;}
	.rowfour .feature-box-holder .fb-icon i{line-height: 50px; font-size: 50px;}
	.rowfour .feature-box-holder .fb-title h3{font-size: 36px; line-height: 44px; font-family: @font-head; margin: 0px; margin-top: 0px;  margin-bottom: 7px;}
	.rowfour .feature-box-holder .fb-title:after{position: absolute;  content: ""; height: 2px; width: 35px; margin-left: 0px; background: #fff;}
	.rowfour .feature-box-holder .fb-text{margin-top:25px;width:70%;}
	.rowfour .feature-box-holder .fb-text{}
	
	/* rowfive - CTA form */
	.rowfive{background-color:#393f46; color:#fff; }
	.rowfive #column-6-0{padding-top:20px; padding-bottom:20px;}
	.rowfive #column-6-0 h3 {font-family:@font-head; padding-bottom:12px; line-height:30px;}
	.rowfive #column-6-0 h3 span{font-weight:700;}
	.rowfive #column-6-0 p, .rowfive #column-6-2 p{font-size: 16px;  line-height: 14px; font-weight: 100;}
	.rowfive #column-6-1{background-color:@main-color; padding-top:43px; padding-bottom:43px;}
	.rowfive #column-6-2{background-color:@main-color; padding-top:45px; padding-bottom:45px;}
	.rowfive #column-6-1 .feature-box i{font-size: 36px; line-height:50px;}
	.rowfive #column-6-1 .feature-box .fb-icon.hidden-xs{display:block!important}
	.rowfive #column-6-1 .feature-box{border-right:1px solid #fff;}
	.rowfive #column-6-2 h3{font-size:20px; font-weight: 500;}
	
	/* Rowsix - Form */
	.rowsix #column-7-0, .rowsix .contact-formulier{padding-top:40px; padding-bottom:40px;}
	.rowsix #column-7-0 h3{font-weight: 600!important;  font-size: 28px!important;  line-height: 28px!important;  color: #4A4A4A;margin-bottom:20px;}
	.rowsix #column-7-0 .small-width{       font-family:@font-head; margin-top: 0px; font-size: 20px; line-height: 25px; font-weight: 400; width:80%; margin-bottom:30px;}
	.rowsix #column-7-1{background-color:#f4f6f8; padding-left:0px; padding-right:0px;}
	.rowsix .formheader{display:none;}
	.rowsix .contact-formulier{padding-left:15px; padding-right:15px;}
	.rowsix .contact-formulier .col-xs-3, .rowsix .contact-formulier h3{display:none;}
	.rowsix .contact-formulier .col-xs-9{width:100%}
	.rowsix .contact-formulier input, .rowsix .contact-formulier textarea{
	    display: block;
	    height: 34px;
	    width: 100%;
	    border-radius: 0px;
	    background: transparent;
	    border: 0px;
	    border-bottom: 1px solid #e1e3e5!important;
	    padding: 25px 10px!important;
	    font-size: 14px;
	    line-height: 1.428571429;
	    color: #555555;
	    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	}
	.rowsix .contact-formulier textarea{ height: 160px; margin-bottom: 20px;}
	.rowsix .contact-formulier .btn{    width: 100%;
	    background: #32373c;padding: 14px 24px 14px;
	color:@wit;
	    height: 50px;
	    border: none;
	    margin-top: 15px;
	    font-size: 16px;
	    line-height: 1px;
	    text-transform: uppercase;
	    letter-spacing: 1px;
	    font-weight: 400;}
	.rowsix .contact-formulier .btn:hover{background-color:@main-color;}
	
	/* Rowseven CTA */
	.rowseven{padding-top:50px; padding-bottom:50px;background-image: -webkit-linear-gradient(-40deg, @main-color 60%, @sec-color 35%); color:#fff;}
	.rowseven .btn{    transition: all 0.3s ease 0s;
	    min-height: 0px;
	    min-width: 0px;
	    line-height: 17px;
	    border-width: 0px;
	    margin: 10px 0px;
	    padding: 14px 24px 14px;
	    letter-spacing: 2px;
	    font-size: 12px;
	    color: #fff;
	    background-color: @main-color;
	    text-transform: uppercase;
	    font-weight: 700;    border-radius: 0px;}
	.rowseven .btn:hover{background-color:#393f46;}
	
	/* Roweight Header */
	.roweight{text-align:center; padding-top:100px;}
	.roweight h3{width:60%;margin-left:auto; margin-right:auto; color: #393f46; font-weight: 700; font-size: 34px; line-height: 36px;  margin-bottom: 10px;}
	.roweight h3:after{    content: "";
	    position: absolute;
	    width: 60px;
	    height: 1px;
	    bottom: 0;
	    left: calc(50% - 30px);
	    border-bottom: 2px solid #d2001b;
	    bottom: 0px;}
	
	/* Rownine Tekst */
	.rownine{margin-top:60px;padding-bottom:100px;}
	.rownine h3{color: #393f46;margin-bottom:10px;}
	
	/* Rowten Tekst */
	.rowten{padding-top:100px; padding-bottom:100px; background:@background;}
	.rowten h3{color: #393f46;margin-bottom:10px;}
	
	/* Roweleven Footer */
	.roweleven{background-color:#393f46; color:#fff;padding-top: 60px;padding-bottom:60px; }
	.roweleven h4{    text-transform: uppercase;
	    font-size: 16px;
	    letter-spacing: 1px;
	    line-height: 20px;
	    font-weight: 600!important;}
	.roweleven .feature-box-holder .fa{float: left; color:#fff; display: block;  background: none;  line-height: 1;  font-size: 24px;  
	margin-right: 10px; margin-left: 10px;  -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease;  -o-transition: all 0.3s ease;  
	transition: all 0.3s ease; height: 50px; width: 50px; border: 2px solid #fff; border-radius: 50%; text-align: center; padding-top: 10px; padding-left: 2px;}
	.roweleven #column-2-1, .rowone #column-2-2, .rowone #column-2-3{padding-top: 20px; color: #393f46;}
	.roweleven .feature-box-holder h5{font-size: 13px; line-height: 10px; padding-top: 8px; margin-top: 0px; font-weight: 600; color:#fff;}
	.roweleven .feature-box-holder h5 a{color:#fff;}
	.roweleven .feature-box-holder h5 a:hover{text-decoration:underline;}
	.roweleven .feature-box-holder h6{font-size: 12.2px; line-height: 11px;  font-weight: 400;  margin: 0 0 10px;}
	.roweleven .feature-box-holder {
	    margin-bottom: 25px;
	}
	
	/* Rowtwelve Copyright */
	.rowtwelve{text-align:center; background:@main-color;    padding: 20px 0;}
	.rowtwelve a, footer{color:#fff;}
	.rowtwelve a:hover{text-decoration:#fff;}
	
	@media(max-width:1200px){
	.rowone .feature-box-holder .fa{display:none;}
	.rowfive #column-6-1 { padding-top: 54px; padding-bottom: 54px;}
	.rowfour .col-md-4 {width: 100%;}
	.rowfour .feature-box-holder .fb-icon {  margin-bottom: 50px;}
	.rowseven{background-image:none; background-color:@sec-color;}
	.rowseven .col-md-10{width:70%;}
	.rowseven .col-md-2{width:30%;}
	}
	
	@media(max-width:992px){
	.rowzero #column-1-0{width:70%}
	.rowzero #column-1-1{width:30%;}
	.rowone{height:100px;}
	.rowone #column-2-0{width: 33.33333333%;}
	.rowone #column-2-1{width: 16.66666667%;padding-top:10px;}
	.rowone #column-2-2{width: 25%;padding-top:10px;}
	.rowone #column-2-3{width: 25%;padding-top:10px;}
	.rowtwo #column-3-0, .rowfive #column-6-1, .rowfive #column-6-2{display:none;}
	.rowsix .formheader{display:block; background-color:@main-color; color:#fff;padding:45px 15px; }
	.rowsix{    padding-bottom: 40px;}
	.roweight{padding-top: 80px;}
	.rownine{padding-bottom: 80px;}
	.rowten{padding-top:80px; padding-bottom:80px;}
	.rowten #column-12-0{margin-bottom:40px;}
	}
	@media(max-width:721px){
	.rowzero,.topbar{display:none;}
	.rowone{height:170px;}
	.rowone #column-2-0 {width:100%}
	.rowone #column-2-1{width: 29%;}
	.rowone #column-2-2{width: 39%;}
	.rowone #column-2-3{width: 32%;}
	.hidden-xs, .rowone .feature-box-holder .fa {display: block!important;}
	.rowtwo{display:none;}
	.rowseven .col-md-10, .rowseven .col-md-2, .roweight h3{width:100%;}
	}
	@media(max-width:642px){
	.rowfour .feature-box-holder .fb-title h3{}
	.rowone #column-2-1, .rowone #column-2-2, .rowone #column-2-3{display:none;}
	.rowone { height: 100px;}
	.rowthree #column-4-0 .rowthree-cta h1{font-size:32px; line-height:32px;}
	.rowthree #column-4-0 .rowthree-cta h4{font-size:20px; line-height:20px;}
	.rowfour .feature-box-holder .fb-text{width:100%;}
	.rowfour .feature-box-holder .fb-icon {margin-bottom: 75px;}
	}
	
	@media(max-width:450px){
	.rowfour .feature-box-holder .fb-title h3 {
	    font-size: 30px;
	    line-height: 26px;}
	.rowsix #column-7-0 .small-width{width:100%;}
	}