body, html {margin:0;padding:0;font-family:'Myriad W01 Lt', tahoma;color:#1b1b1f;height: 100%;/*font-size:15px;line-height:20px;*/font-size:16px;line-height:24px;}
body.fix {overflow:hidden;}
.groen {color:rgba(0,129,105,1);}
* {box-sizing:border-box; -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box;
 -o-box-sizing:border-box;
 -webkit-overflow-scrolling: touch;}
*:after, *:before {font-family: "Font Awesome 5 Free";font-weight:900;line-height: 100%;position: relative;font-size:22px;display:inline-block;-webkit-transition:all 0.5s linear;-moz-transition:all 0.5s linear;box-sizing:border-box;}
*:hover {-webkit-transition:all 0.2s linear;-moz-transition:all 0.2s linear;}
:focus {outline: 0;}
#outer-wrapper {position:relative;max-width:1280px;margin:0px auto;display:block;padding:0 0 40px;}

a {color:#1b1b1f;text-decoration:none;}
a.c2a, .c2a {display: inline-block;border-radius:10px 0 5px 0;padding:10px 40px 10px 10px;font-family:'Myriad W01 smBd';color:#fff;background:rgba(247,168,35,1);font-size:16px;position:relative;}
a.c2a:hover, .c2a:hover {background:rgba(0,129,105,1);}
a.c2a:after {content: '\f0da';color: #fff;  position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 18px;}
th {text-align:left;}
p {margin:0 0 20px 0;padding:0;text-align: left;}
img {border:none;}
.nomargin {margin:0;}
select {-webkit-appearance: none;-moz-appearance: none; appearance: none;cursor:pointer;border:0;border-radius:0;}
select::-ms-expand {display: none;outline: none;}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #1b1b1f!important;font-family:'Myriad W01 Regular'!important;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #1b1b1f!important;font-family:'Myriad W01 Regular'!important;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #1b1b1f!important;font-family:'Myriad W01 Regular'!important;
}
:-moz-placeholder { /* Firefox 18- */
  color: #1b1b1f!important;font-family:'Myriad W01 Regular'!important;
}

div.img-full-left, div.img-intro-left {float:left;margin:0 20px 0 0;}
div.img-full-right, div.img-intro-right {float:right;margin:0 0 0 20px;}
div.img-full-right img, div.img-intro-right img {margin:0 0 20px 0;}
ul {margin:0;padding:0; list-style: none;}
.item-page ul {padding:0 0 0 20px;overflow:hidden;list-style: disc !important;margin:0 0 10px;}
.content-ul {margin:0 0 10px 0;padding:0 0 0 15px;}
h1, .h1 {font-family:'Myriad W01 Bd', tahoma;font-size:26px;line-height:100%;padding:0;margin:0 0 60px;text-transform:uppercase;position:relative;}
h1.lowercase {text-transform:none;}
h1 span {position:absolute;left:705px;}
h1 span.actueel {right: 243px;left:initial;}
span.h1.actueel {display:none;}
h2 {font-size:16px;margin:0 0 10px 0;text-transform:uppercase;}
h3 {margin:0 0 10px 0;font-size: 18px;}
h4 {font-family:'Myriad W01 SmBd';font-size:15px;line-height: 16px;margin:0 0 10px;}
.clear {clear: both}]
.boxshadow {-webkit-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);-moz-box-shadow: 3px 3px 5px rgba(0,0,0,0.2);box-shadow: 3px 3px 5px rgba(0,0,0,0.2);}
.heading {font-family:'Myriad W01 smBd';font-size:20px;text-transform:uppercase;margin:0 0 10px;position: relative;}
input[type=text], input[type=url], input[type=email], textarea {-webkit-border-radius:0;border-radius:0;-webkit-appearance: none;}
input[type=checkbox] {border:1px solid rgba(0,129,105,1)!important;border-radius:0!important;}
img {border:0;}
nav#nav {position: absolute;top: 0;z-index: 20;width: 100%;background: #fff;}
.fixed {position:fixed!important;}
nav#nav:before {content:' ';background:#fff;max-width: 20%;width: 100%;height: 75px;position: absolute;top: 0;left: 0;z-index:21;box-shadow: 7px 3px 5px rgba(0,0,0,0.1);}
div.menucontainer {max-width:1280px;width:100%;margin:0 auto;position:relative;}
.menumain {float:left;list-style:none;padding:0 0 0 250px;font-family:'Myriad W01 Regular';font-size:11pt;line-height:100%;max-width:1280px;background: #fff;min-height: 38px;}
.menumain li  {float:left;position:relative;padding:0;margin:0 0 0 40px;}
.menumain li.item-101 {width:325px;position:absolute;left:20px;top:0;z-index:22;margin: 0;}
.menumain li.item-101 a {background: #fff;padding: 15px 15px 15px 0;height: 75px;transform: skewX(8deg);border-radius: 0 0 20px;box-shadow: 7px 3px 5px rgba(0,0,0,0.1);}
.menumain li.item-101 img {width:100%;transform: skewX(-8deg);}
.menumain li.item-112 {margin-left:150px;}
.menumain li a {height:100%;display:block;padding:30px 0 15px;text-transform:uppercase;}
.menumain li ul {display:none;position: absolute;margin: 0;padding: 0;color:#fff;width:225px;background:#73BCB4;z-index:1;}
.menumain li ul li {background: transparent;float:none;border-bottom: 1px solid rgba(255,255,255,0.2);margin: 0;}
.menumain li ul li a {color:#fff;padding: 20px;}
.menumain li ul li a:hover, .menumainsubmenu ul.menusitemap a:hover, .menumainsubmenu li a:hover {background:rgba(0, 134, 119, 0.95);}
.menumain li.parent.active > a {color:rgba(0,129,105,1);}
.menumain li ul li.active > a {color:#fff;}


div.logo-container.mobileonly {display: none;}

div.column {float:left;width:70%;}
div.column.right {float:right;width:calc(30% - 40px)}
div.datalogic {background:#008677;color:#fff;font-size: 2rem;line-height:2rem;  overflow: hidden;}
div.datalogic p {margin:60px auto 70px;text-align:center;}
div.datalogic img {max-width:300px;margin:20px auto 0;display: block;}
button.ui.button {background:#153d8b!important;}
button.ui.button:hover {background:rgba(21,61,139,0.5)!important;}
div.column img {width:50%;}
div.ui.message.g2-message.error {display:none;}

#banner {position: relative;padding-top:30%;margin:0;}
.id-3 #banner {padding-top:56.25%;}

div.down {height:30px;position: absolute; left: 0; right: 0; bottom: 150px; margin: 0 auto;text-align: center;cursor:pointer;color:#fff;}
div.down:after {display:block;content: "\f0d7";width: 30px; margin: 0 auto; animation: crescendo .5s alternate infinite ease-in;  }
@keyframes crescendo {
  0%   {transform: scale(1);}
  50% {transform: scale(1.5);}
  100% {transform: scale(2);}
}

.headerbg { position: absolute;top: 0; width: 100%;height: 100%;filter: blur(5px);}
.flex-viewport, ul.slides, ul.slides li {height:100%;margin:0;padding:0;z-index:10;overflow: hidden;}
.slides_container {position:  absolute;top: 0;left: 0;bottom: 0;right: 0;}
.slides_container:after {content: ' ';width:100%;height:108px;position: absolute;bottom:0;background:rgba(238, 240, 242, 0)}
ul.slides li {position:relative;}
div.slides_container.vacature {background-position:bottom center!important;}
ul.slides li .contentcontainer {height: 100%;max-width: 100%;margin: 0 auto;  position: absolute;  left: 0;  right: 0;  top: 50%;  transform: translateY(-50%);}
ul.slides li .textcontainer {display:none;overflow: hidden;padding: 20px 60px 10px 60px;overflow:hidden;float:right; background: rgba(247,166,0,1); border-radius: 40px 0 0 40px;border: 5px solid #fff; transform: skew(-15deg, 0deg) translateY(-50%);
  position: absolute;  right: -3px; top: 50%;}
div.image-container {width: 250px;position: absolute;left: 25%;top: 50%;transform: translateY(-50%);}
div.image-container img {max-width:100%;margin:0 auto;display: block;}
.flex-direction-nav li {font-size: 0;position:absolute;top:45%;left:5%;z-index:10;}
.flex-direction-nav li.flex-nav-next {right:5%;left: auto;}
.flex-direction-nav li a:before {content: '\f0d9';color: rgba(255,255,255,0.5);font-size:40px;}
.flex-direction-nav li.flex-nav-next a:before {content: '\f0da';}
.flex-direction-nav li a.flex-disabled {display:none;}
ul.slides li .text {max-width:1000px;font-size:32px;line-height:36px;margin:0 0 20px;transform: skew(15deg, 0deg);}
ul.slides li .text h3 {color:#fff;font-size:48px;margin:0 0 10px;}
ul.slides li .text div {color:#fff;font-size:26px;}
ul.slides li .textcontainer a {display: inline-block;}


article { margin: -59px 0 0;position: relative;}
div.item-page {background:#fff;position:relative;padding:30px 0 0;}
body.form div.item-page {padding:0;}
article:after, div.slidenav:after {content:' ';background:#fff;position:absolute;top:-10px;width:calc((100% - 1280px) / 2);height:70px;right:0;}
div.item-page:before, div.slidenav .inner:before, div.submessage .inner:before {content:' ';height:70px;border-radius:20px 0 0;position:absolute;left:-40px;top:-10px;width:calc(100% + 60px);transform: skewX(-10deg);background:#fff;}

#subcontent {margin:90px 0 0;width:100%;position: relative;clear:both;}
#subcontent .heading:before,  #contact .heading:before {position:absolute;transform: skewX(-10deg);border-radius:10px;content:' ';height:50px;width:100%;right:0;top:-10px;background:#008169;}
#subcontent .heading a, #subcontent .heading span, #contact .heading span {z-index: 10;position: absolute;color:#fff;}
#subcontent div.innercontainer, div#nieuws, footer {padding: 0 20px;}


#slidehome {    background: #777777;color: #fff;width: 35px;height: 30px;position: fixed;right: 0;bottom: 5%;cursor: pointer;text-align: center;display: none;z-index: 100;border-radius: 5px 0 0 5px;}
#slidehome:after {content: "\f0d8";font-size:26px;line-height: 30px;display: inline-flex;vertical-align: middle;}

div.cookie {background: rgba(0,0,0,0.85);color: #fff;position: fixed;width: 100%;z-index: 1000;bottom:0;}
div.cookieinner {max-width:1170px;margin:0 auto;padding:20px;}
div.cookieinner .heading {font-size:16px;font-weight:bold;}
div.cookie input{cursor:pointer;background:rgba(0,129,105,1);border:2px solid #fff;padding:10px;border-radius:10px;color:#fff;font-weight:bold; -webkit-appearance: none;}
div.cookie input:hover{background:#fbb03b;}
div.cookieinner p {width:730px;float:left; margin: 0 20px 0 0;}

#contact {width:100%;}
#contact .heading:before {background: rgba(205, 205, 205,1);}
div.contact-container {max-width:1280px;margin:0 auto;display: table;width:100%;}
#contact .heading  {padding: 5px 20px;margin:0;position: relative;margin: 0 0 60px;}
#studio16 { text-align: right; display: block; padding: 20px; font-size: 10px;}
#contact ul li a:after{content: '\f35d';position:absolute;top:50%;right:0;transform:translateY(-50%);font-size:10px;}
#contact ul li a {position:relative; padding:0 20px 0 0;}
#contact ul {margin:10px 0 0;list-style-type: disc!important;padding: 0 0 0 30px;}

ul.json {list-style: none!important;padding:0;margin:0;display: grid;grid-template-columns: repeat(3, 1fr); column-gap: 20px;}

ul.json li {margin:0 10px 30px 0;position:relative;padding: 15px 15px 60px;border-radius: 20px 0 10px;border: 1px solid #E0E2E3;display: block;}

ul.json li:hover, ul.json li:hover span.leesverder {box-shadow: 3px 3px 5px rgba(0,0,0,0.2);}
ul.json li a:before {content:' ';overflow: hidden;display: block;height: 100%;position: absolute;width: 100%;left: 0;top: 0;z-index: 100;}
ul.json img {width:100%;height:auto;float:left;}
ul.json div.img-container {height: 100%;float: left;max-width:30%;margin-right: 10px;}
ul.json div.text-container {overflow:hidden;}
ul.json .title {font-family:'Myriad W01 Bd', tahoma;font-size: 15px;line-height: 16px;margin:0 0 10px;}

span.leesverder {cursor: pointer;font-family: 'Myriad W01 SmBd';position: absolute; bottom: 15px;right: 15px;background: rgba(0,129,105,1);color: #fff;border-radius: 10px 0 5px;padding: 7px 30px 7px 20px;font-size: 12px;line-height: 100%;text-transform: uppercase;}
span.leesverder:after {content: '\f0da';color: #fff;position: absolute;right: 15px;top: 50%;transform: translateY(-50%);font-size: 18px;}
span.leesverder.download {padding: 7px 40px 7px 20px;}
span.leesverder.download:after {content: '\f56d';}
span.leesverder.product {padding: 7px 45px 7px 20px;}
span.leesverder.product:after {content: '\f07a';}
span.pubdate {z-index: 10;color: rgba(166, 172, 175,1);position: absolute;bottom: 15px;left: 15px;text-transform: uppercase;font-family: 'Myriad W01 SmBd';font-size: 12px;line-height: 26px;}
.sensoren span.leesverder {background:rgba(247,166,0,1);}
.signaalconditionering span.leesverder {background: rgba(207,54,40,1);}
.schakelcomponenten span.leesverder {background:rgba(79,110,167,1);}
.mobiele.automatisering  span.leesverder {background:rgba(121,172,43,1);}
.autoid span.leesverder {background:rgba(72,83,88,1);}

div.filter {}
div.filter span.title, span.reset  {position:relative;padding:0 0 0 20px;display:block;margin:0 0 20px;cursor: pointer;}
div.filtercontainer {visibility: hidden;opacity:0;height:0;transition: all 0.1s ease 0s; }
div.filtercontainer.active {margin-bottom:60px;opacity:1;visibility: visible;height:auto;transition: all 0.2s ease 0.2s;}
div.filter span.title:before, span.reset:before {content: '\f0b0';position:absolute;top:50%;transform:translateY(-50%);left:0;font-size:16px;}
span.reset {cursor:pointer;}
span.reset:before {content: '\f00d';}
div.filter label {position: relative;padding-left:30px;line-height: 25px;display: block;}
div.filter ul {list-style: none!important;padding:0;margin:0;column-count:3;} 
div.filter li {margin:0 20px 10px 0;}
div.filter input {display:none;}
label input[type=checkbox] + .checkmark {position: absolute;top: 0;left: 0;height: 25px;width: 25px;border-radius: 3px;border: 2px solid #ddd;cursor:pointer;}
label input:checked ~ .checkmark {background-color: rgba(0,129,105,1);border-radius: 3px;}  
label input:disabled ~ .checkmark {background:#efefef;cursor: default;border-color:#ddd!important;}
.checkmark:after {content: "";position: absolute;display: none;}
label input:checked ~ .checkmark:after {display: block;}
label .checkmark:after {left: 9px;top: 5px;width: 5px;height: 10px;border: solid white;border-width: 0 3px 3px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}
label input[data-cat*=sensoren] + .checkmark, label[class*=sensoren] input + .checkmark {border-color:rgba(247,166,0,1)}
label input[data-cat*=sensoren]:checked + .checkmark, label[class*=sensoren] input:checked + .checkmark {background:rgba(247,166,0,0.6);}
label input[data-cat*=signaalconditionering] + .checkmark, label[class*=signaalconditionering] input + .checkmark {border-color:rgba(207,54,40,1);}
label input[data-cat*=signaalconditionering]:checked + .checkmark, label[class*=signaalconditionering] input:checked + .checkmark {background:rgba(207,54,40,0.6);}
label input[data-cat*=schakelcomponenten] + .checkmark, label[class*=schakelcomponenten] input + .checkmark {border-color:rgba(79,110,167,1);}
label input[data-cat*=schakelcomponenten]:checked + .checkmark, label[class*=schakelcomponenten] input:checked + .checkmark {background:rgba(79,110,167,0.6);}
label input[data-cat*=automatisering] + .checkmark, label[class*=automatisering] input + .checkmark {border-color:rgba(121,172,43,1);}
label input[data-cat*=automatisering]:checked + .checkmark, label[class*=automatisering] input:checked + .checkmark {background:rgba(121,172,43,0.6);}
label input[data-cat*=autoid] + .checkmark, label[class*=autoid] input + .checkmark {border-color:rgba(72,83,88,1);}
label input[data-cat*=autoid]:checked + .checkmark, label[class*=autoid] input:checked + .checkmark {background:rgba(72,83,88,0.6);}
label input[data-cat*=input] + .checkmark, label[class*=input] input + .checkmark {border-color:rgba(32, 66, 147,1);}
label input[data-cat*=input]:checked + .checkmark, label[class*=input] input:checked + .checkmark {background:rgba(32, 66, 147,0.6);}


div.entrydata {margin:0 0 40px;background:#f9f9f9;padding: 20px;border-radius: 10px 5px;border: 1px solid #E0E2E3;}
div.entrydata td {vertical-align:top;padding:0 20px 20px 0;}
div.entrydata td:nth-child(even) {padding-right:0;}
div.item-page .ui.form p {font-size:16px;line-height:24px;margin:0 0 20px;}
div.phone { opacity: 0;position: absolute; top: 0;left: 0;height: 0;width: 0;z-index: -1;}


div.videohome video {position:absolute;top:0;width:100%;height:auto;}


.print-only {display:none;}
@media print{ 
.print-only {display:block;width:200px;height:auto;margin:0 0 10px;}
}