/*
 Theme Name:   Technicarro
 Theme URI:    http://www.technicarro.be
 Description:  Your partner in hard & soft flooring
 Author:       Bert Cornelis
 Author URI:   http://www.facebook.com/BertCornelis
 Version:      3.0.0
 Tags:         Technicaro, Philippe Van Vaerenbergh, floors, tegelbedrijf, vloerbedrijf, vloeren, Puregraphics, Bert Cornelis, Aalst
 Text Domain:  technicarro
*/
/* reset */

html {
	/*flex*/
	width:100%;
	margin: 0;
	padding: 0;
	display:flex;
	min-width: 350px;
	}

body {
	margin: 0;
	padding: 0;
	font-family: "Mulish", "Segoe UI", system-ui, -apple-system, sans-serif;
	font-weight: 300;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
	line-height: 1.7;
	font-variant: normal;
	font-style: normal;
	font-size: 100%;

	position: relative;
	color: rgba(40,47,57,1);
	
	/*flex*/
	width:100%;
	min-height:100vh;
	display:-webkit-flex;
	display:flex;
	-webkit-flex-direction:column;
	flex-direction:column;
}

p { 
	margin-top: 12px;
	margin-bottom: 22px;
}

strong {
	font-weight: 600;
}

*, *:before, *:after {
  box-sizing: border-box;
}

form {
	float: left;
	width: 100%;
	clear: left;
}

.control-group {
    margin-bottom: 8px;
}

form label.label-mobile {
    text-align: left;
    display: inline-block;
    vertical-align: middle;
    width: 200px;
	height: 100%;
    margin: 0 15px 0 0;
}

form span.textfield {
	text-align: left;
    width: 340px;
}

input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="date"], input[type="month"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="week"], input[type="number"], input[type="search"]
input[type="tel"], input[type="color"], textarea {
	font-family: "Mulish", "Segoe UI", system-ui, -apple-system, sans-serif;
	font-weight: 300;
    color: rgba(0,0,0,1.00);
    text-align: left;
    white-space: nowrap;
    padding: 7px 10px 7px 10px;
    font-size: 13.5px;
    word-spacing: 0px;
    letter-spacing: 0.5px;
    line-height: 1.4286;
    display: inline-block;
    border: 1px solid rgba(48,48,48,1.00);
	transition: border-color .5s ease-out;
    border-radius: 1px;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -ms-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #FFF;
}

select {
	font-family: "Mulish", "Segoe UI", system-ui, -apple-system, sans-serif;
	font-weight: 300;
    color: rgba(0,0,0,1.00);
    text-align: left;
    white-space: nowrap;
	padding: 7px 10px 7px 10px;
    font-size: 13.5px;
    word-spacing: 0px;
    letter-spacing: 0.5px;
    line-height: 1.4286;
    display: inline-block;
    border: 1px solid rgba(48,48,48,1.00);
	transition: border-color .5s ease-out;
    border-radius: 0px;
	-webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='#444' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>");
    background-position: 99% 50%;
    background-repeat: no-repeat;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 0px;
	background-color: #FFF;
	cursor: pointer;
}

.control-group button {
    width: 360px;
	font-weight: 300;
    font-size: 13.5px;
    word-spacing: 0px;
    letter-spacing: 0.5px;
    display: inline-block;
	text-align: left;
	position: relative;
    background: transparent;
    border: 0px dotted #000;
    border-radius: 1px;
	cursor: pointer;
	color: #000;
}

input[type="file"] {
    position: absolute;
	background-color: aquamarine;
    left: 0;
    opacity: 0;
    top: 0;
    bottom: 0;
    width: 100%;
	cursor: pointer;	
}
	
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #b4b4b4;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #b4b4b4;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #b4b4b4;
}
	
abbr {
    color: #b4b4b4;
}

select.extrasmall, input.extrasmall  {
    width: 120px;
	margin-right: 10px;
}

select.small, input.small  {
    width: 175px;
	margin-right: 10px;
}

select.medium, input.medium  {
    width: 230px;
	margin-right: 10px;
}

select.large, input.large  {
    width: 360px;
	margin-right: 10px;
}

textarea.small  {
    width: 360px;
	margin-right: 10px;
    height: 60px;
}

textarea.large {
    height: 260px;
}

.grecaptcha-badge {display: none;}

#desktop, #tablet_desktop {
	display: inline;
}

#mobile_tablet, #mobile, #tablet {
	display: none;
}

#center {
	width: 1000px;
	box-sizing: border-box;
	position: relative;
	margin-left: auto;
	margin-right: auto;
}

#middle {
	display: table-cell;
	vertical-align: middle;
}

.wrapper{
    overflow:hidden;
		/*flex*/
	width:100%;
	min-height:100vh;
	display:-webkit-flex;
	display:flex;
	-webkit-flex-direction:column;
	flex-direction:column;
}

input[type="checkbox"]#navigation, input[type="checkbox"]#language {
    display:none;
}

nav.desktop {
	padding: 0px;
}

nav.desktop ul {
	/* min-height: 70px; /* height menu line */
	padding: 0px;
	margin: 0px;
	list-style: none;
	position: relative;
	font-size:0px;
    display: flex; 
}

nav.desktop li {
	flex-shrink: 2; 
    flex-grow: 3;
    flex-basis: auto;
	vertical-align: middle;
    text-align: center;
    position: relative;
	padding-top: 6px;
	padding-bottom: 6px;
	margin-top: 8px;
	margin-bottom: 8px;
	display: inline-block;
	text-transform: uppercase;
	border-right: 0.4px solid rgba(0,0,0,0.4);
	font-size:13px;
	}

nav.desktop ul li a {
	background-color: transparent;
	color: black;
    text-decoration:none;
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
	}

nav.desktop li:last-child {
	border-right: none;
	}

nav.desktop ul li svg {
	display: none;
}

nav.desktop ul li:nth-of-type(6) svg {
	display: inline-block;
    margin-right: 5px;
}

nav.desktop ul li a:hover, nav.desktop ul li.current_page_item a, nav.desktop ul li.current-page-ancestor a {
	border-bottom: 3px solid #000;
	text-decoration: none; 
	}

nav.desktop ul li.current_page_item a {
	font-weight: 600;
	}

nav.mobile {
  	display: none;
}

header {
    width: 100%;
    position: relative; /**fixed header*/
	clear: left;
    z-index: 499;
    top: 0px;
    left: 0px;
}

header #top #center, header #logo #center, header #baseline #center, header #baseline {
	display: flex;
	align-items: center;
	justify-content: center;
}

header #top #center {
	background-color: #000;
	height: 8px;
}

header .left {
	width: 0px;
	display: none;
	text-align: center;
}

header .middle {
	width: 250px;
	height: 100%;
	display: block;
	position: relative;
}

header #logo .left {
	font-size: 26px;
}

header #logo .middle {
	height: 130px; /**height logo*/
}

header #logo .middle img.technicarro-CAP {
	position: absolute;
	top: 30px;
	left: -50px;
	right: -70px;
	margin:auto;
    height: 105px !important;
	width: auto;
}

header #logo .language {
	position: absolute;
	top: 0px;
	right: 0px;
	margin:auto;
	background-color: #000;
	font-size: 13px;
	color: #FFF;
    height: 25px !important;
	width: 54px !important;
}

/* Dropdown Content (Hidden by Default) */
header #logo .language-content {
    display: none;
    position: absolute;
    background-color: #000;
    width: 54px;
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
header #logo .language-content a {
	color: #FFF;
    padding: 6px 4px 5px 14px;
    text-decoration: none;
    display: block;
	text-align: left;
}

/* Change color of dropdown links on hover */
header #logo .language-content a:hover {
	background-color: rgba(31,31,31,1.00);
}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
input[type="checkbox"]#language:checked ~ header #logo .language-content {
    display: block;
}

header #logo .fa-angle-up, input[type="checkbox"]#language:checked ~ header label .fa-angle-down {
    display: none;
}

header #logo .fa-angle-down, input[type="checkbox"]#language:checked ~ header label .fa-angle-up {
    display: inline-block;
	cursor: pointer;
	transition: all 1000ms ease-in-out;
}

header .right {
	flex: 1;
	text-align: center;
}

header #baseline #center {
    /* [disabled]background-color: rgba(255,255,255,0.94); */
    height: 44px; /**height baseline*/
    color: rgba(0,0,0,1);
    font-family: "Mulish", "Segoe UI", system-ui, -apple-system, sans-serif;
    font-weight: 500;
	padding-right: 20px;
	padding-left: 20px;
    font-style: normal;
    text-transform: uppercase;
    word-spacing: 2px;
    letter-spacing: 4px;
    font-size: 16px;
    background-image: -webkit-linear-gradient(0deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.03) 100%);
    background-image: -moz-linear-gradient(0deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.03) 100%);
    background-image: -o-linear-gradient(0deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.03) 100%);
    background-image: linear-gradient(90deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.03) 100%);
}

header #baseline #center .right {
	text-align: right;
}

header .line {
    float: left;
	bottom: 0px;
	left: 0px;
    width: 100%;
	height: 1px;
}

#introphoto {
	margin-bottom: 0px;
	width: 100%;
	float: left;
	height: 560px;
	overflow: hidden;
	position: relative;
}

#introphoto .shadow {
    height     : 100%;
    width      : 120%;
    box-shadow : inset 0px 1px 10px 1px rgba(0,0,0,0.5);
    position   : relative;
    left       : -10%;
    -webkit-box-shadow : inset 0px 1px 10px 1px rgba(0,0,0,0.5);
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

#introphoto img {
  position: relative;
  z-index: -1;
	object-position: center center;
}

#reference {
	background-color: rgba(54,54,54,0.9);
	color: #FFF;
	text-shadow: 1px 1px 3px rgba(0,0,0,1);
	position:absolute;
	padding: 18px 25px 15px 20px;
	top: 430px;
	width: 400px;
	right: -25px;
	text-align: left;
}

#reference h1 {
	font-weight: 300;
	font-size: 13px;
	margin: 0px;
	padding: 0px;
    text-transform: uppercase;
	line-height: 13px;
}

#reference h2 {
	font-weight: 700;
	font-size: 24px;
	margin: 5px 0px 0px 0px;
	padding: 0px;
	line-height: 24px;
}

#reference img.triangle {
	position: absolute;
	top: -11px;
	right: 0px;
	width: 25px !important;
}

#summary {
    background-color: rgba(0,0,0,0.88);
    color: #FFF;
    text-shadow: 1px 1px 3px rgba(0,0,0,1);
    position:absolute;
    padding: 25px 40px 30px 70px;
    top: 300px;
    width: 420px;
    left: -35px;
    text-align: left;
    font-size: 13px;
    line-height: 26px;
    z-index: 2000;
}

#summary .text {
	float: left;
	position: relative;
}

#summary .line {
    position:absolute;
	top: -12px;
	left: -70px;
    width: 120px;
	height: 1px;
}	

#summary h1 {
	font-weight: 500;
	font-size: 20px;
	margin: 0px;
	padding: 0px 0px 30px 0px;
    text-transform: uppercase;
	line-height: 23px;
}

#summary img.triangle {
	position: absolute;
	top: -13px;
	left: 0px;
	width: 36px !important;
}

main{
    width: 100%;
    /*flex*/
    -webkit-flex-grow: 1;
    flex-grow: 1;
    min-height: 400px;
    position: relative;
	margin-top: 0px; 
    clear: left;
    padding: 0px;
    -moz-transition: all 200ms ease-in;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    transition: all 200ms ease-in;
    overflow: hidden;
}

main .page_title {
    font-weight: 700;
	float: left;
	text-align: center;
	width: 100%;
	text-transform: uppercase;
	letter-spacing: 5px;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 8%;
	padding-right: 8%;
}

main .line {
    float: left;
	bottom: 0px;
	left: 0px;
    width: 100%;
	height: 1px;
}

section {
	float: left;
	width: 100%;
    font-size: 13.5px;
    word-spacing: 0px;
    letter-spacing: 0.5px;
	padding-bottom: 30px;
	padding-top: 30px;
	position: relative;
	text-align: center;
	line-height: 26px;
}

section a {
	color: rgba(76,76,76,1.00);
	text-decoration: underline;
}

section a:hover {
	color: rgba(45,45,45,1.00);
	text-decoration: none;
}

section #error {
    color: rgba(76,76,76,1.00);
	font-weight: 700;
}

section.top {
	padding-top: 60px;
}

article {
    float: left;
    text-align: left;
    position: relative;
}

article.left {
    width: 60%;
    padding-right: 50px;
    padding-bottom: 10px;
}

article.center, article.no-padding {
    width: 100%;
    padding-right: 0px;
    padding-bottom: 10px;
    text-align: center;
}

article .line {
	border-bottom: 0.5px solid rgba(0,0,0,0.2);
	margin-top: 40px;
	margin-bottom: 20px;
	position: relative;
}

article h1 {
	font-weight: 500;
	float: left;
	width: 100%;
	text-transform: uppercase;
	word-spacing: 0px;
	letter-spacing: 1px;
	font-size: 20px;
	line-height: 22px;
	margin: 5px 0px 10px 0px;
	padding: 0px;
}

article h2 {
	font-weight: 500;
	width: 100%;
	text-transform: uppercase;
	word-spacing: 0px;
	letter-spacing: 1px;
	font-size: 15px;
	margin: 5px 0px 0px 0px;
	padding: 0px;
}

aside {
    float: right;
    overflow: hidden;
    text-align: left;
    width: 40%;
    padding: 0px 0px 25px 0px;
    margin-top: 0px;
    position: relative;
}


figure {
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}


figure iframe {
	margin: auto;
	width: 100%;
}

aside img {
	margin: auto;
    height: 100%;
	width: 100%;
}

aside p { 
	margin-top: 0px;
	margin-bottom: 0px;
}

footer {
	color: #FFF;
	float: left;
	position: relative;
	padding: 20px 0px 0px 0px;
	width: 100%;
	font-size: 11.5px;
	line-height: 19px;
	background: radial-gradient(rgba(0,0,0,0.86), rgba(0,0,0,1));
	background-repeat: no-repeat;
} 

footer h1 {
	font-weight: 700;
	float: left;
	width: 100%;
	text-transform: uppercase;
	word-spacing: 0px;
	letter-spacing: 1px;
	font-size: 12.5px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

footer a {
	color: rgba(255,255,255,0.60);
	text-decoration: none;
} 

footer a:hover {
	color: #FFF;
	text-decoration: none;
} 

footer ul.list {
    float: left;
	margin-top: 0px;
	margin-left: 0px;
    padding: 0px;
    text-align: left;
    list-style-type: none;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    -webkit-column-rule: 0px solid #ddd;
    -moz-column-rule: 0px solid #ddd;
    column-rule: 0px solid #ddd;
}

footer ul.list li {
	padding: 0px 0px 0px 30px;
	margin: 0px 0px 0px 0px;
}

footer ul.list li .fa-li {
	padding-left: 33px;
}

footer #address, footer #copyright {
	float: left;
	width: 100%;
}

footer #address .left {
    float: left;
	width: 40%;
	display: block;
	padding-top: 10px;
	padding-left: 180px;
	padding-right: 20px;
	padding-bottom: 10px;
	position: relative;
	box-sizing: border-box;
	background-color: transparent;
}

footer #address .left .logo {
	position: absolute;
	left: 20px;
	top: 12px;
}

footer #address .left img.technicarro-CAP  {
    height: 70px !important;
	width: auto;
}

footer #address .middle {
    float: left;
	width: 35%;
	padding-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 10px;
	display: block;
	background-color: transparent;
}

footer #address .right {
    float: left;
	width: 25%;
	padding-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 10px;
	display: block;
	background-color: transparent;
}

footer #line {
	float: left;
	width: 100%;
	display: table; 
	margin-top: 20px;
	position: relative;
}

footer #line .left, footer #line .right  {
	display: table-cell; 
	border-bottom: 0.5px solid rgba(255,255,255,0.4);
	position: relative;
	top: -.5em;
}
footer #line .middle { 
	display: table-cell; 
	white-space: nowrap;
	width: 50px;
	padding: 0 0px;
	position: relative;
}

footer #line a.scroll-up {
	color: #FFF;
	background-color: transparent;
	bottom: -10px;
}

footer #copyright {
	font-size: 10px;
	margin-top: 5px;
	margin-bottom: 10px;
}

footer #copyright .left {
    float: left;
	width: 75%;
	display: block;
	text-align: left;
}

footer #copyright .right {
    float: left;
	width: 25%;
	display: block;
	text-align: right;
}



#case, #case2 {
    width: 30%;
    background-color: rgba(255,255,255,1.00); /*rgba(0,100,162,1);*/
    margin-top: 5px;
    margin-left: 1.5%;
    margin-right: 1.5%;
	margin-bottom: 15px;
    display: inline-block;
    text-align: left;
    box-sizing: border-box;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    padding-left: 0px;
    position: relative;
    line-height: 18px;
    z-index: 0;
    font-size: 13px;
    vertical-align: top;
    border-bottom: 3px solid rgba(0,0,0,0);
}

#case2 {
    height: 200px;
    background-color: rgba(54,54,54,0.9);
    color: white;
    font-weight: 700;
    font-variant: normal;
    font-size: 1.7em;
    line-height: 1.25em;
    padding-bottom: 0px;
    letter-spacing: 0px;
    text-align: center;
    position: relative;
}

#case:hover {
	border-bottom: 3px solid rgba(0,0,0,1);
	transition: .5s ease;
}

#case .overlay, #case2 .overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: .8s ease;
	z-index: 4;
	background-color: rgba(0,0,0,0.7);
}

#case:hover .overlay, #case2:hover .overlay {
	opacity: 1;
}

#case2 .title-link {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    -webkit-transform: translate(-50%, -50%);
    color: white;
    text-shadow: rgb(0, 0, 0) 1px 1px 3px;
}

.fa-search {
  color: white;
  font-size: 70px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.fa-search:hover {
  color: #eee;
}

#case .image {
  width: 100%;
  height: 220px;
	position: relative;
}

#case .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wp-caption {
    position: relative;
	width: 100% !important;
	line-height: 0px;
	font-size: 0px;
}

#case .sector, .wp-caption-text {
    position: absolute;
	bottom: 0px;
	right: 0px;
	padding: 5px 10px;
	background-color: rgba(54, 54, 54, 0.89);
	margin: 0px;
	z-index: 2;
	color: #FFF;
	text-transform: uppercase;
	text-align: center;
	font-weight: 300;
	font-size: 12px;
	line-height: 18px;
}

#case .title  {
	padding: 6px 2px 1px 2px;
	display: block;
	float: left;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;	
	text-overflow: ellipsis;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 16px;
	color: #000;
}

#case a .location {
	padding: 1px 2px 14px 2px;
	display: block;
	float: left;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;	
	text-overflow: ellipsis;
	font-weight: 300;
	font-size: 13px;
	color: rgba(0,0,0,0.47);
}


section ul.list2 {
	margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    text-align: left;
    list-style-type: none;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    -webkit-column-rule: 0px solid #ddd;
    -moz-column-rule: 0px solid #ddd;
    column-rule: 0px solid #ddd;
	position: relative;
	line-height: 30px;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    padding: 0px 0px 20px 0px;}

ul.list2 li {
	padding: 0px 0px 0px 30px;
	position: relative;
	-webkit-column-break-inside: avoid;
	/* Chrome, Safari, Opera */
	page-break-inside: avoid;
	/* Firefox */
	break-inside: avoid;
	/* IE 10+ */
}

ul.list2 li .fa-li, ul.list2 li .fa-li {
	padding-left: 38px;
}


section ul.list {
	margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 20px;
    padding: 30px 40px 30px 40px;
    text-align: left;
    list-style-type: none;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    -webkit-column-rule: 0px solid #ddd;
    -moz-column-rule: 0px solid #ddd;
    column-rule: 0px solid #ddd;
	border: 0.5px solid rgba(0,0,0,0.2);
	position: relative;
	line-height: 35px;
}

section ul.col2 {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}

section ul.col3 {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
}

section ul.col4 {
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
}

section ul.list li {
	padding: 0px 0px 0px 30px;
	position: relative;
	-webkit-column-break-inside: avoid;
	/* Chrome, Safari, Opera */
	page-break-inside: avoid;
	/* Firefox */
	break-inside: avoid;
	/* IE 10+ */
}

section ul.fa-ul li::after {
	content: "";
    width: 100%;
    height: 1px;
    background-color: rgba(0,0,0,0.05);
    left: 0;
    position: absolute;
    display: block;
    bottom: 0px;
}

section ul.list li .fa-li {
	padding-left: 33px;
}

section ul.data li {
	padding: 10px 0px 10px 0px;
	border-bottom: none;
	overflow: visible;
	text-align: center;
}

section ul.data li .data1 {
	font-size: 98px;
	line-height: 80px;
	font-weight: 700;
	width: 100%;
	letter-spacing: -8px;
	color: rgba(53,53,53,1);
}

section ul.data li .data2 {
	font-size: 14px;
	line-height: 17px;
	width: 100%;
	padding: 0px;
	margin: 0px;
	text-transform: uppercase;
}

section ul.data li .data3 {
	font-size: 13px;
	line-height: 17px;
	width: 100%;
	    color: rgba(0,0,0,0.47);
}

blockquote {
	font-size: 17px;
	width: 100%;
	margin: 0px;
	padding: 40px 25px 65px 40px;
	line-height: 24px;
	position: relative;
	color: #FFF;
	background-color: #000;
}

blockquote h1 {
	font-size: 9px;
	text-transform: uppercase;
	width: 100%;
	text-align: right be!important;
	margin: 0px;
	padding: 12px 15px 0px 0px;
	font-weight: 300;
	line-height: 9px;
	color: #FFF;
	float: left;
}

blockquote::after {
	content: "";
	display: block;
	left: 0px;
	bottom: 10px;
	width: 100%;
	position: absolute;
	height: 1px;
	background-color: rgba(255,255,255,0.30);
}

#googlemaps {
	width: 100%;
	height: 250px;
	float: right;
	margin-bottom: 20px;
	display: inline-block;
}

a.scroll-up {
    position: absolute;
	left: 0px;
	right: 0px;
	margin: auto;
	bottom: -16px;
	width: 50px;
	height: 30px;
	background-color: #FFF;
	color: #000;
	font-size: 30px;
	line-height: 26px;
}

a.scroll-up span {
	margin: 0 auto;
	text-align: center;
	width: 50px;
    -webkit-transition: all .22s ease-in-out;
    transition: all .22s ease-in-out;
    cursor: pointer;
	display: inline-block;
}

a.scroll-up:hover span, a.scroll-up:focus span {
    margin-top: -4px;
    cursor: pointer;
}

.btn {
	font-family: "Mulish", "Segoe UI", system-ui, -apple-system, sans-serif;
	font-weight: 700;
	display: inline-block;
	margin-bottom: 0;
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 1px;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 0.5px solid #FFF;
	border-radius: 1px;
	padding: 10px 22px;
	text-decoration: none;
	
	color: rgba(0,0,0,1.00);
	background-color: transparent;
	border-color: rgba(0,0,0,1.00);
	text-shadow: none;
}

.btn {
	color: rgba(0,0,0,1.00);
	background-color: transparent;
	border-color: rgba(0,0,0,1.00);
	text-shadow: none;
}

.btn:hover, .btn:focus  {
	color: #FFF;
	background-color: rgba(0,0,0,1.00);
	border-color: rgba(0,0,0,1);
}

.contacteer_ons_vrijblijvend {
	margin-top: 15px;
	clear: left;
	float: left;
	color: #fff;
	background-color: transparent;
	border-color:  rgba(255,255,255,1.00);
	text-shadow: none;
}

.contacteer_ons_vrijblijvend:hover, .contacteer_ons_vrijblijvend:focus  {
	color: #000;
	background-color: rgba(255,255,255,1.00);
	border-color:  rgba(255,255,255,1);
}

@media all and (max-width : 1000px) {
#tablet, #tablet_desktop, #mobile_tablet {
	display: inline;
}

#mobile, #desktop {
	display: none;
}
	
form label.label-mobile {
    text-align: left;
	font-weight: 700;
    width: 100%;
}
	
input.extrasmall, input.small, input.medium, input.large, select.extrasmall, select.small, select.large, textarea.small {
    width: 100%;
	margin-right: 0px;
	margin-bottom: 5px;
}
	
#center {
	width: 100%;
}
	
main{
	margin-top: 0px; /*fixed header height */
}

header #baseline {
	height: 40px; /**height top*/
    font-size: 15px;
    letter-spacing: 3px;
}
	
header .left {
    flex: 0.5;
	display: block;
}
	
header #top .left {
	padding-left: 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

header .middle {
		width: 150px;
		display: block;
}
	
header #logo .middle {
	height: 155px; /**height top*/
}
	
header #logo .middle img.technicarro-CAP {
	top: 25px;
    height: 94px !important;
	width: auto;
}

header .right {
    flex: 0.5;
	display: block;
}
	
header #top .right {
	padding-right: 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

header #baseline .left, header #baseline .middle {
	display: none;
	width: 0px;
}
	
header #baseline .right {
    flex: 1;
	white-space: nowrap;
	overflow: hidden;	
	text-overflow: ellipsis;
}
	
header #baseline #center .right {
	text-align: center;
    word-spacing: 2px;
    letter-spacing: 3px;
}
	
nav.desktop {
	display: none;
	}
	
nav.mobile {
    font-size: 0;
    padding: 0 45px;
}
	
input[type="checkbox"]#navigation:checked ~ nav.mobile  {
	display: block;
}
	
nav.mobile ul {
    padding-left: 0;
    list-style: none;
    margin-top: 0px;
	margin-bottom: 0px;
}
	
nav.mobile li {
    font-size: 1rem;
    padding: 14px 0;
    border-bottom: 0.5px solid #cbcbcb;
    text-align: center;
    position: relative;
}
	
nav.mobile li:last-child {
	border-bottom: none;
	}

nav.mobile li a, nav.mobile li a:hover {
    color: #000;
    text-decoration: none;
}
nav.mobile li a {
    line-height: 1.235rem;
    font-size: 12px;
    letter-spacing: 3px;
    padding: 0;
    border: none;
    display: inline-block;
    text-transform: uppercase;
}
    
nav.mobile ul li svg {
	display: none;
}

nav.mobile ul li:nth-of-type(6) svg {
	display: inline-block;
    margin-right: 5px;
}
	
#introphoto {
	height: 400px;
}

#reference {
	background-color: rgba(54,54,54,1);
	float: left;
	position: relative;
	top: 0px;
	width: 100%;
	right: 0px;
    padding-left: 8%;
    padding-right: 8%;
	text-align: left;
}
	
#reference img.triangle, #summary img.triangle {
	display: none;
}

#summary {
	float: left;
	clear: left;
	position: relative;
	top: 0px;
	width: 100%;
	left: 0px;
    padding-left: 8%;
    padding-right: 8%;
	text-align: left;
	border-top: 0.4px solid rgba(255,255,255,0.7);
}
	
#summary .line {
	left: -10%;
    width: 110px;
}
	
section {
	padding-top: 30px;
}
	
article, article.left, article.center {
    width: 100%;
    padding-left: 8%;
    padding-right: 8%;
}
	
article.no-padding {
    width: 100%;
    padding-left: 0%;
    padding-right: 0%;
}
	
section ul.col4 {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
}

section ul.data li:last-of-type {
	display: none;
}
	
#case, #case2  {
	width: 45%;
	margin-top: 15px;
	margin-left: 2%;
	margin-right: 2%;
	margin-bottom: 15px;
	box-sizing: border-box;
}	
	
aside {
    width: 84%;
    float: left;
    margin-left: 8%;
    margin-right: 8%;
    box-sizing: border-box;
}
	
footer ul.list {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}

footer #address .left, footer #address .middle, footer #address .right {
	float: left;
	width: 88%;
	text-align: left;
	padding-top: 15px;
	padding-bottom: 18px;
	margin-right: 6%;
	margin-left: 6%;
}
	
footer #address .left {
	padding-left: 175px;
}

footer #address .right {
	padding-bottom: 5px;
}
	
footer #address .left .logo {
	left: 20px;
	top: 20px;
}
	
footer #line {
	width: 88%;
	margin-right: 6%;
	margin-left: 6%;
}

footer #copyright {
	font-size: 10px;
	line-height: 17px;
	margin-top: 12px;
	margin-bottom: 15px;
}

footer #copyright .left, footer #copyright .right {
	float: left;
	width: 88%;
	text-align: left;
	margin-right: 6%;
	margin-left: 6%;
}
	
}

@media all and (max-width : 650px) {
#mobile, #mobile_tablet {
	display: inline;
}
	
#introphoto {
	height: 300px;
}
	
section ul.list {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
}
	
section ul.col4 {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}
	
section ul.data li {
	padding-bottom: 15px;
}

section ul.data li:last-of-type {
	display: block;
}
	
section ul.data li .data1 {
	font-size: 92px;
	line-height: 73px;
}

section ul.data li .data2 {
	font-size: 13px;
	line-height: 16px;
}

section ul.data li .data3 {
	font-size: 12px;
	line-height: 16px;
}
	
#case, #case2 {
	width: 90%;
	min-width: 280px;
	margin-top: 15px;
	margin-left: 5%;
	margin-right: 5%;
	margin-bottom: 15px;
	box-sizing: border-box;
}
}

@media all and (max-width : 450px) {
section ul.col4 {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
}
}
.mySlides {
	display:none;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mySlides-arrow:hover{color:rgba(0,128,255,1.00);}

.mySlides-bullet{
	border-radius:50%;
	background-color: rgba(255,255,255,1.00);
	display:inline-block;
	margin: 0px 1px;
	padding-left:7px;
	padding-right:7px;
	text-align:center;
	cursor:pointer;
	height:11px;width:11px;padding:0;
	
    -webkit-box-shadow: 0px 0px 7px 3px rgba(0,0,0,0.10);
    -moz-box-shadow: 0px 0px 7px 3px rgba(0,0,0,0.10);
    box-shadow: 0px 0px 7px 3px rgba(0,0,0,0.10);
}

.mySlides-bullet-change, .mySlides-bullet:hover{
	background-color: rgba(0,0,0,1.00);
}

.mySlides-bullets{
	position:absolute;
	left:50%;
	bottom:0;transform:translate(-50%,0%);
	-ms-transform:translate(-50%,0%);
	text-align:center;
	padding:0.01em 16px;
	margin-top:16px!important;margin-bottom:16px!important
}

.mySlides-arrow-left{
	position:absolute;
	top:50%;
	left:2%;
	font-size: 35px;
	text-align: center;
	width: 35px;
	height: 35px;
	line-height: 35px;
	transform:translate(0%,-50%);
	-ms-transform:translate(-0%,-50%);
	cursor:pointer;
	background-color: rgba(255,255,255,0.90);
	color: #000;
}

.mySlides-arrow-right{
	position:absolute;
	top:50%;
	right:2%;
	font-size: 35px;
	text-align: center;
	width: 35px;
	height: 35px;
	line-height: 35px;
	transform:translate(0%,-50%);
	-ms-transform:translate(-0%,-50%);
	cursor:pointer;
	background-color: rgba(255,255,255,0.90);
	color: #000;
}

header label .fa-times, input[type="checkbox"]#navigation:checked ~ header label .fa-bars {
    display: none;
}

header label .fa-bars, input[type="checkbox"]#navigation:checked ~ header label .fa-times {
    display: inline-block;
	cursor: pointer;
	transition: all 1000ms ease-in-out;
}

#cookies-popup {
    color: rgb(107, 107, 107);
    background-color: rgb(244, 244, 244);
    max-width: 24em;
    -ms-flex-direction: column;
    flex-direction: column;
    bottom: 1.2em;
    left: 1.2em;
    position: fixed;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 13.5px;
    line-height: 1.5em;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    z-index: 9999;
    opacity: 0.94;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.14), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
}

@media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape){
#cookies-popup {
    left: 0;
    right: 0;
    max-width: none;
    bottom: 0;
}
 }

#cookies-popup span {
    margin: 2em 2em 1.5em;
}

#cookies-popup span a {
    color: rgba(0,0,0,0.88);
    text-decoration: underline;
}

#cookies-popup span a:hover {
    color: rgba(0,0,0,0.88);
    text-decoration: none;
}

#cookies-popup div a {
    color: rgb(255, 255, 255);
    background-color: rgba(0,0,0,0.88);
    -ms-flex: 1;
    flex: 1;
    display: block;
    padding: .7em .8em;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    border-top: 0.5px transparent solid;
}

#cookies-popup div a:hover {
    background-color: rgba(255, 255, 255, 0.5);
    color: rgb(107, 107, 107);
    border-top-color: rgba(46,46,46,0.50);
}

.puregraphics img {
	vertical-align: middle;
	width: auto;
	height: 16px;
}
.puregraphics img:last-child{
	display:none;
}
.puregraphics:hover img:first-child{
	display:none;
}
.puregraphics:hover img:last-child{
	display:inline-block;
}

.puregraphics-print {
	display: none;
}

.logo-print, #logo-print {
	display: none;
}