body, html {margin:0;padding:0;font-family:'Myriad W01 Lt', tahoma;color:#1b1b1f;min-height: 100%;font-size:16px;line-height:24px;}
body.fixed {overflow:hidden;width:100%;}

* {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 6 Pro";font-weight:900;line-height: 100%;position: relative;font-size:22px;display:inline-block;box-sizing:border-box;}
*:hover {-webkit-transition:all 0.3s linear;-moz-transition:all 0.3s 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;}
th {text-align:left;}
p {margin:0 0 10px;padding:0;text-align: left;line-height:100%;}
img {border:none;}

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;
}

ul {margin:0;padding:0; list-style: none;}
h1  {font-family:'Myriad W01 Bd', tahoma;font-size:26px;line-height:100%;padding:0;margin:0 0 30px;text-transform:uppercase;position:relative;}
body.comment h1 {padding: 0 200px 0 0;}
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;}
.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;}



.fixed {position:fixed!important;}
nav#nav:before {content:' ';background:#fff;width:100%;height: 50px;position: fixed;top: 0;left: 0;z-index:100;box-shadow: 7px 3px 10px rgba(0,0,0,0.35);}
div.logo-container.mobileonly {  transform: skewX(8deg);  background: #fff;  border-radius: 0 0 20px;  display: block;  position: fixed;  top: 0px;  left: -10px;  width: 300px;  z-index: 100; box-shadow: 7px 3px 10px rgba(0,0,0,0.35);}
div.logo-container.mobileonly a.logo { padding: 15px 15px 15px 20px; display: block;}
div.logo-container.mobileonly a.logo img { width: 100%; height: auto; transform: skewX(-8deg); display: block;}
nav div.menucontainer {position: fixed;top: 50px;background: #73BCB4;height: 100%;display:none;width: 100%;z-index: 50;overflow: hidden;}

#nav .menumain {font-family:'Myriad W01 Regular';font-size:11pt;line-height:100%;margin:40px 0 0 0;}
#nav .menumain li  {position:relative;padding:0;margin:0 0 0 0;}
#nav .menumain li a {display:block;padding: 20px 30px; position: relative; margin: 0; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.2);}
#nav .menumain li a:hover {background:rgba(0, 134, 119, 0.95);}
div.mobilemenu:before {content:'\f141'; position: fixed;z-index: 100; top: 0; right: 25px; line-height: 50px; cursor: pointer; width: 50px; text-align: center;color: rgba(0, 134, 119, 1);}

div.marketing-container {width: 100%; max-width: 1280px; margin: 100px auto 0; padding: 20px;position:relative;}
div.marketing-container ul.mod-menu__sub {display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 30px;max-width:600px;margin:0 auto;}
div.marketing-container ul.mod-menu__sub li {background:rgba(0,129,105,0.2);border-radius:10px 0 5px;border: 1px solid #E0E2E3;cursor:pointer;text-align:center;aspect-ratio: 4 / 3;position: relative}
div.marketing-container ul.mod-menu__sub li:hover {background:rgba(0,129,105,1);box-shadow: 5px 5px 10px rgba(0,0,0,0.5);}
div.marketing-container ul.mod-menu__sub li:hover a {color:#fff;}
div.marketing-container ul.mod-menu__sub li a {height: 100%;position: absolute;width: 100%;top: 0;left: 0;}
div.marketing-container ul.mod-menu__sub li a span {position:absolute;top:50%;transform:translateY(-50%);width:100%;left:0;}
div.marketing-container ul.mod-menu__sub li a span:before {content:'\f573'; display: block;margin: 0 0 10px;font-size: 46px;}
div.marketing-container ul.mod-menu__sub li.faq a span:before {content:'\3f'; }
div.marketing-container ul.mod-menu__sub li.addcontact a span:before {content:'\f2bb'; font-weight: 400;}
div.marketing-container ul.mod-menu__sub li.password a span:before {content:'\f13e'; }
div.marketing-container ul.mod-menu__sub li.list a span:before {content:'\f03a'; }
div.marketing-container ul.mod-menu__sub li.shoutout a span:before {content:'\f4b0';font-weight: 300; }
div.marketing-container ul.mod-menu__sub li.add.shoutout a span:before {content:'\f7f5';font-weight: 300; }
div.marketing-container ul.mod-menu__sub li.my-account a span:before {content:'\f65c'; display: block;margin: 0 0 10px;font-size: 46px; font-weight:300;}
div.marketing-container ul.mod-menu__sub li.chatbot a span:before {content:'\e3b8'; display: block;margin: 0 0 10px;font-size: 46px; font-weight:300;}
div.marketing-container ul.mod-menu__sub li.stats a span:before {content:'\e0e3'; display: block;margin: 0 0 10px;font-size: 46px; font-weight:300;}


div.marketing-container ul.menumain li.item-1215 > a {display:none;}
div.marketing-container ul.menumain  li.item-1215 {background:none;}


nav ul.menumain li a span:before {content:'\f624';font-size:20px;margin: 0 10px 0 0;}
nav ul.menumain li.signature a span:before {content:'\f573'; }
nav ul.menumain li.faq a span:before {content:'\3f'; }
nav ul.menumain li.addcontact a span:before {content:'\f2bb'; font-weight: 400;}
nav ul.menumain li.password a span:before {content:'\f13e'; }
nav ul.menumain li.list a span:before {content:'\f03a'; }
nav ul.menumain li.shoutout a span:before {content:'\f4b0'; font-weight: 300;}
nav ul.menumain li.add.shoutout a span:before {content:'\f7f5'; font-weight: 300;}
nav ul.menumain li.my-account a span:before {content:'\f65c'; font-weight: 300;}
nav ul.menumain li.chatbot a span:before {content:'\e3b8'; font-weight: 300;}
nav ul.menumain li.stats a span:before {content:'\e0e3'; font-weight: 300;}

div#system-message-container {margin-top:-20px;}
div.system-message-container {margin-top:12px;}
joomla-alert {text-align:center;padding:40px 20px 20px}
div.alert-heading {font-weight:bold;}

body.reset div#system-message-container, body.login div#system-message-container, body.profile div#system-message-container { margin-top: 50px;}


div.faqform textarea {width:100%;padding:10px;border:1px solid #ddd;height:100px;font-family:'Myriad W01 Lt', tahoma;color:#1b1b1f;font-size:16px;line-height:24px;}
div.faqform textarea[readonly] {background:#f9f9f9;}
div.control-group {margin:0 0 30px;}


fieldset {margin: 0 0 10px; border: 1px solid #dddddd;}
label {display:block;margin:0 0 10px;max-width:480px;position:relative;}
select, input[type=password], input[type=text]:not(.choices__input), input[type=email] {border:2px solid #ddd;border-radius:3px;padding:10px;width:100%;margin:0 0 20px;display:block;}

.error, div.has-danger input {border-color:red!important;}
input[type=radio] {display:inline-block;}
label.radio {display:inline-block;}
button[type=submit], input[type=submit], .button.cancel, a.btn-danger {display: inline-block;font-family: 'Myriad W01 SmBd';color: #fff;border-radius: 10px 0 5px;padding: 20px 40px;font-size: 12px;line-height: 100%;cursor:pointer!important;text-align:center;text-transform: uppercase;}
label.interesse, label.marketing {font-size:22px;font-weight:bold;margin:0 0 20px}
label.marketing {margin:20px 0 ;}
label.descriptionLabel.werknemers:after {content: "\f0d7";font-family: "Font Awesome 6 Free";font-weight: 900;font-size: 28px;position:absolute;top: 50%;right: 10px;transform: translateY(-50%);z-index:-1;}
div.inner {width:45%;float:left;}
div.inner.right {float:right;}
label.checkall {padding:10px;background:rgba(121,172,43,.15);border-radius:10px 0 5px;border: 1px solid #E0E2E3;cursor:pointer;}
label.checkbox span {position: relative;padding: 3px 0 0 30px;display: block;margin: 0 0 15px;}
input[type=checkbox] + span:before, input[type=checkbox] + label:before  {content: ' ';width: 20px;height: 20px;border-radius: 3px;border: 2px solid #ddd;display: block;position: absolute;left: 0;top: 0;}
input[type=checkbox]:checked + span:before, input[type=checkbox]:checked + label:before {content: '\f00c';font-size: 17px;text-align: center;color: rgba(0,129,105,1);-webkit-transition:none;-moz-transition:none;}
input[type=checkbox] {display: none;}
label.checkall span:before {border:1px solid rgba(0,129,105,1);}
label.checkall span {margin:0;}
label.radio {display: inline-block;position: relative;margin:0 0 10px;}
label.radio.event {display:block;}
label.radio span {position: relative;padding: 5px 0 0 30px;display: block;margin: 0 10px 0 0;}
label.radio:before {content: ' ';width: 20px;height: 20px;border-radius: 100%;border: 2px solid #ddd;display: block;position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
input[type=radio] + span:before {}
input[type=radio]:checked + span:before {content: ' ';width:12px;height:12px;background: rgba(0,129,105,1);border-radius:100%;-webkit-transition:none;-moz-transition:none;position: absolute;left: 4px;top: 50%;
    transform: translateY(-50%);}
input[type=radio] {display: none;}
input:read-only {background:#ececec;cursor:default}
div.functie {padding:10px;background:rgb(236 236 236 / 60%); margin: 0 0 10px;}
input[type=text], select, label.descriptionLabel {width:100%;max-width:100%;}
form {margin:20px 0 ;}
{margin:0 0 10px;border:1px solid #dddddd}
select {background: transparent;}

div.marketing-container ::placeholder { color: #bbb!important; opacity: 1; }
.button, button[type=submit] {background: rgba(0,129,105,1)!important; border-radius: 10px 0 5px;border: 2px solid #fff;}
button[type=submit]:hover, a.btn-danger:hover {background:rgba(0,129,105,.5)!important;box-shadow: 5px 5px 10px rgba(0,0,0,0.5);}
a.btn-danger {background:#a39292;float:right;}

input[type=password], input#password {width:calc(100% - 50px);float:left;}
button.input-password-toggle {height: 39px;cursor:pointer;display: block;float: right;background: #f7eded;border: 2px solid #ddd;}
span.visually-hidden {display:none;}
button.input-password-toggle span.icon-eye:before {content:'\f06e';}
button.input-password-toggle span.icon-eye-slash:before {content:'\f070'}

.choices__list--dropdown {z-index:100!important;}
div.choices__inner {cursor: pointer!important;}
div.choices__item[aria-selected="true"]  {border-radius:5px;font-size:16px;border: 0 !important;color:#fff;padding: 10px;}
div.choices__item[data-value="algemeen"][aria-selected="true"] {background:rgba(0,129,105,1);}
div.choices__item[data-value="sensoren"][aria-selected="true"] {background:rgba(247,166,0,1)}
div.choices__item[data-value="signaal"][aria-selected="true"] {background:rgba(207,54,40,1)}
div.choices__item[data-value="relais"][aria-selected="true"] {background:rgba(79,110,167,1)}
div.choices__item[data-value="aandrijf"][aria-selected="true"] {background:rgba(121,172,43,1);}
div.choices__item[data-value="autoid"][aria-selected="true"] {background:rgba(72,83,88,1);}
div.choices__item[data-value="inputdevices"][aria-selected="true"] {background:rgba(32, 66, 147,1)}
.choices__button_joomla {text-indent: -9999px;background:rgba(255,255,255,0.5);border: 0;position:relative;color: #fff;margin-left:10px;width: 20px;height: 20px; border-radius: 100%;}
.choices__button_joomla:before {text-align: center;text-indent: 0;content: "×";display: block;  position: absolute;top:50%;transform:translateY(-50%);font-size:12px;right:5px;cursor:pointer;left:0;right:0;}
joomla-field-fancy-select select, .js-tiny-toggler-button  {display: none!important;}

div.marketing-container li.item-1215 {}
tr.comment span.user {color:#bbb;display:block;}
div.comments tr.comment td {vertical-align:top;}
div.comments tr.comment a {display:block;padding:10px 20px 10px 45px;position:relative;}
div.comments tr.comment a:hover {background: rgba(247, 166, 0, 1);}
div.comments tr.comment a:before {content:'\f06e';position:absolute;left:10px;}
div.quantity { width: 30px;height: 30px;border-radius: 100%;background: rgba(247, 166, 0, 1);text-align: center;line-height: 30px; font-weight: bold;font-size: 14px;margin:10px auto 0;}
div.comments tr.comment {background:rgba(0,129,105,0.1);}
div.comments tr.comment:nth-child(even) {background:rgba(0,129,105,0.05);}
div.faqs td, div.faqs th, div.comments td, div.comments th {padding:10px;}
div.faqs td {vertical-align: top;}
div.faqs td.id {color:#fff}
div.faqs tr.algemeen, ul.faqs li {background:rgba(0,129,105,0.2);}
div.faqs tr.algemeen td.id, ul.faqs li span.id {background:rgba(0,129,105,1);}
div.faqs tr.sensoren, ul.faqs li.sensoren {background:rgba(247,166,0, 0.2)}
div.faqs tr.sensoren td.id, ul.faqs li.sensoren span.id  {background:rgba(247,166,0, 1)}
div.faqs tr.signaal, ul.faqs li.signaal {background:rgba(207,54,40,0.2)}
div.faqs tr.signaal td.id, ul.faqs li.signaal span.id {background:rgba(207,54,40,1);}
div.faqs tr.relais, ul.faqs li.relais  {background:rgba(79,110,167,0.2)}
div.faqs tr.relais td.id, ul.faqs li.relais span.id {background:rgba(79,110,167,1)}
div.faqs tr.aandrijf, ul.faqs li.aandrijf {background:rgba(121,172,43,0.2)}
div.faqs tr.aandrijf td.id, ul.faqs li.aandrijf span.id  {background:rgba(121,172,43,1)}
div.faqs tr.autoid, ul.faqs li.autoid {background:rgba(72,83,88,0.2)}
div.faqs tr.autoid td.id, ul.faqs li.autoid span.id  {background:rgba(72,83,88,1)}
div.faqs tr.inputdevices, ul.faqs li.inputdevices {background:rgba(32, 66, 147,0.2)}
div.faqs tr.inputdevices td.id, ul.faqs li.inputdevices span.id  {background:rgba(32, 66, 147,1)}
div.faqs td.datum {width:150px;}
div.faqs div.answer {background:#fff;padding:10px;border-radius:10px;line-height:24px;display:none;margin: 20px 0 10px;-webkit-transition:all 0.3s linear;-moz-transition:all 0.3s linear;}
div.faqs div.answer p {line-height:24px;}
div.faqs div.answer.active {display:block;}
div.faqs div.answer div.button {display:inline-block;background: rgba(0,129,105,1)!important; border-radius: 5px;border: 2px solid #fff;color:#fff;margin:10px 0 0;padding:5px 10px 5px 40px;position:relative;cursor:pointer;}
div.faqs div.answer div.button:before {content:'\f8fa';font-weight: 300;font-size:18px;position:absolute;left:10px;top:50%;transform:translateY(-50%)}
div.faqs div.answer div.button.update:before {content:'\f044';}
div.faqs div.answer div.button:hover {background: rgba(247, 166, 0, 1) !important;  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.2);}
div.faqs div.vraag {cursor:pointer;position:relative;padding:0 0 0 30px;}
div.faqs div.vraag:before {content:'\f070';font-weight:300;font-size:18px;position:absolute;left:0px;top:3px;}
div.faqs div.vraag.active:before {content:'\f06e';}
div.faqs form {display:none;}
div.faqs form div.error {color:red;}
span.lamp:before {content:'\f8fa';font-weight: 300;font-size:18px;}

table {width:100%;border-spacing: 0;}
div.faqs table td.center, th.center {text-align:center;}
span.approved:before {content:'\f00c';font-family:'Font Awesome 6 Sharp';font-weight:300;}
span.approved.option0 {margin-right: 16px;}
span.approved.option0:before { content: "\f110";font-family:'Font Awesome 6 Pro';
  animation-name: fa-spin;
  animation-duration: var(--fa-animation-duration,2s);
  animation-iteration-count: var(--fa-animation-iteration-count,infinite);
  animation-timing-function: var(--fa-animation-timing,linear);
}
a.faq.external:before {content:'\f08e';float: right;font-size: 14px;opacity: .5;}
a.faq.external:hover:before {opacity:1;}
a.button {padding:10px 20px 10px 40px;border-radius:5px;color:#fff;position:relative;display: inline-block;}
a.button.add {position:absolute;top:10px;right:10px;}
a.button.add:before {content: "\2b";margin:0 5px 0 0;position:absolute;left:10px;}
a.button:hover {background:rgba(247,166,0,1)!important;box-shadow: 3px 3px 5px rgba(0,0,0,0.2);}
a.button.add.shoutout:before {content: "\f7f5";}
a.button.list.comments:before {content: '\f4b0';font-weight: 300;position: absolute;left: 10px;}
a.button.reply:before {content: "\f4ad";position: absolute;left: 10px;}


span.searchFaqs {margin-top: -10px;float: right;font-size: .9rem;background:rgba(247,166,0,1);color:#fff;padding:10px 10px 10px 30px;border-radius:5px;cursor:pointer;font-weight:100;font-family:'Myriad W01 Lt', tahoma;position:relative;}
span.searchFaqs:hover {background:rgba(0,129,105,1);}
span.searchFaqs:before {content:'\f002';margin:0 5px 0 0; font-size: 16px; font-weight: 100;left:10px;position: absolute;top: 50%;transform: translateY(-50%);}
span.searchFaqs.active:before {content:'\f00d';}
div.lookup.faq {display:none;}
ul.faqs li {position:relative;padding:10px 10px 10px 40px;}
ul.faqs span.id {position:absolute;left:0;height:100%;width:30px;top:0;padding: 10px 0;text-align: center;color:#fff;}

div.comment-container {padding:20px;border-radius: 10px;border: 2px solid #ddd;margin: 30px 0;}
div.quotes {position:relative;padding:10px 0 10px 30px; font-size: 16px;}
div.quotes p {line-height:26px;}
div.quotes:before {content: '\f10d';position:absolute;top:0;left:0;}
div.quotes:after {content: '\f10e';position:absolute;bottom:0;right:0;}
div.quotes span.user {color:#bbb;position: absolute; bottom: -15px;left: 0;}
div.add-respons {display:none;}
div.add-respons div.js-editor-tinymce, .editor {margin:0 0 20px;}
div.respons-container {margin:0 0 40px 40px;}
div.respons-item {position:relative;padding:20px;border: 1px solid #ddd;margin:0 0 30px;border-radius:10px;background:rgba(0,129,105,0.03)}
div.respons-container div.quotes:before, div.quotes:after {font-size:20px;color:#aaa;}
div.quotes img {max-width: 150px;height: auto;cursor: pointer;border: 1px solid #ddd;}

#installInstructions {display: none}
button#install, div.ios.install {line-height: 18px;position:fixed;right:0;top: 50px;z-index: 49;background: #008169;color: #fff;font-family: 'Myriad W01 Lt', tahoma; border: 0; padding: 10px 10px 10px 45px; text-transform: uppercase; border-radius: 0 0 0 10px;  cursor: pointer; box-shadow: 7px 3px 10px rgba(0,0,0,0.35);    font-size: 13px;}
button#install:hover {background:rgba(247,166,0,1)}
button#install:before, div.ios.install:before {content:'\f0ed';font-family: 'Font Awesome 6 Sharp';font-weight: 100;position: fixed;right: 108px;top: 58px ;font-size: 18px;}

.button.push {width:40px;height:40px;background:rgba(247,166,0,1)!important; position:absolute;top: -15px;right: -15px;padding: 0; text-align: center;line-height: 40px;border-radius:10px;}
.button.push:hover {background: #008169!important;}
.button.push:before {content: '\f1d8';font-weight:300;}

div#modalcontainer {display:none;}
div#modalcontainer.active {display:block;position:fixed;width:100%;height:100%;z-index:50;background:rgba(0,129,105,0.5);top:0;}
div.closemodal { width: 40px; height: 40px; background: rgba(247,166,0,1); position: fixed; top: 80px; right: 40px;border-radius: 100%;text-align: center;cursor:pointer;}
div.closemodal:before {content:'\f057';color:#fff;font-weight: 300; position: absolute; top: 50%; transform: translateY(-50%); margin: 0 auto;left: 0; right: 0;}
div#modalcontainer div.innermodal {width:100%;max-width:800px;margin:100px auto 0;padding:20px;}
div#modalcontainer div.innermodal img {width:100%;height:auto;}



div.marketing-container.profile dl {display: grid;grid-template: auto / 150px 1fr;}
a.edit.user {padding:10px 20px 10px 60px;margin:0  0 20px;}
a.edit.user:before {content:'\f4ff';font-weight:300;position: absolute;left: 20px;}

.wonderpush-bell .wonderpush-icon-container {background: rgba(247,166,0,1)!important;}
div.ios.install, div.ios.instructions {display:none;}
div.ios.instructions {position: fixed;margin: 0 auto;left: 0;right: 0;top: 50%;transform: translateY(-50%);width: 75%;max-width: 300px;    background: rgba(247,166,0,1); padding: 20px;color: #fff; border: 2px solid #ddd; border-radius: 10px;  font-size: 18px; line-height: 40px; font-weight: bold;}
div.ios.instructions span.share:before {content:'\e09c';font-weight:300;margin:0 10px;display:inline-block;}
div.ios.instructions span.start:before {content:'\f0fe';font-weight:300;margin:0 0 0 10px;display:inline-block;}

button.webauth {background: rgba(247,166,0,1);color:#fff; border-radius: 10px 0 5px;border: 2px solid #fff; padding: 0 20px; cursor: pointer;}
button.webauth:hover {    box-shadow: 5px 5px 10px rgba(0,0,0,0.5);}
button.webauth span {line-height:56px;vertical-align:top;display:inline-block;font-size: 12px;font-family: 'Myriad W01 SmBd';text-transform:uppercase;}
button.webauth span:before {content:'\e2ff    \f577     \f8e9';font-weight:300;font-size:24px;display: inline-block;line-height:56px;vertical-align:top;margin-right: 10px;}

div.com-users-login__remember {clear:both;}
label[for="remember"] {position: relative;padding: 0 0 0 30px;display: block;margin: 0 0 15px;}
div.plg_system_webauthn button {background: rgba(247,166,0,1);color:#fff; border-radius: 10px 0 5px;border: 2px solid #fff; cursor: pointer;padding: 10px 20px;margin:0 10px 0 0;}
div.plg_system_webauthn button:hover {box-shadow: 5px 5px 10px rgba(0,0,0,0.5);}
div.plg_system_webauthn button.plg_system_webauthn-manage-delete {background:rgba(207,54,40,1);}
td.webauthnManagementCell, th.webauthnManagementCell {padding: 0 0 10px;}

button.plg_system_webauthn-manage-edit:before {content:'\f044';font-weight:300;font-size:24px;}
button.plg_system_webauthn-manage-delete:before {content:'\f2ed';font-weight:300;font-size:24px;}
.visually-hidden, #jform_webauthn_webauthn-lbl {display:none;}


div.chatbox-container { border-radius: 6px; box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);  padding: 1.25rem;}
div.chatbox-container h1 {text-align:center;}
div.chatbox-container .inner {height:600px;overflow:auto;width:100%;margin:0 0 30px;}
div.chatbox-container input.input.message {width:calc(100% - 230px);display:inline-block;vertical-align:top;margin:0 20px 0 0;background:#f5f5f5}
div.chatbox-container button {font-family:"Myriad W01 SmBd";padding:10px;color:#fff;cursor:pointer;border-radius:6px;}
div.chatbox-container button:hover {box-shadow: 5px 5px 10px rgba(0,0,0,0.5);background: rgba(247,166,0,1)!important;}
div.chatbox-container div.respons {background:#3e8ed0;border-radius:4px;color:#fff;padding: 1.25rem 4rem 1.25rem 1.25rem;margin:0 25% 30px 0;position:relative;width: 75%; }
div.chatbox-container div.respons.answer {background:#48c78e;width: 75%;margin:0 0 30px 25%;}
div.chatbox-container span.tijd {position:absolute;right:10px;top:10px;}
div.chatbox-container div.respons.answer.waiting {padding-left:50px;}
div.chatbox-container div.respons.answer.waiting:before {content: '\e1d4';font-weight:300;font-family:'Font Awesome 6 Pro'; animation-name: fa-spin; animation-duration: var(--fa-animation-duration,2s);  animation-iteration-count: var(--fa-animation-iteration-count,infinite);  animation-timing-function: var(--fa-animation-timing,linear);position:absolute;left:1.25rem;}
div.chatbox-container span.closechat {cursor:pointer;font-family:"Myriad W01 SmBd";font-size:13px;display:inline-block;margin:0 0 0 20px;background:red;padding:10px;border:2px solid #fff;border-radius:6px;line-height:15px;color:#fff;vertical-align:top;}

div.stats.date {background: rgba(0,129,105,1)!important; margin: 0 0 10px;  border: 0; color: #fff;}
div.stats {background:#eee;border-radius:5px;border:1px solid #ddd;margin:0 0 30px;padding:20px;font-family: "Myriad W01 SmBd";}
div.stats:nth-child(even) {background:rgba(0,129,105,0.15);}
div.stats:nth-child(even) span.counter {background:rgba(247, 166, 0, .5);}
div.stats ul {display: grid; grid-template-columns: repeat(4, 1fr);grid-gap:30px;}
div.stats span.title, div.stats span.counter, span.last_done {display:block;text-align:center;position: relative;}
div.stats span.counter {margin: 0 auto 10px;background:#fff;border-radius:100%;width:30%;padding:15% 0;text-align:center;height: 0;line-height: 100%;box-shadow: 2px 2px 5px #02655236;}
div.stats span.last_done {margin: 0 auto 10px;padding:15% 0;text-align:center;height: 0;line-height: 100%;}
div.stats span.last_done span.data {font-size:16px;line-height:26px;font-family:"Myriad W01 SmBd";}
div.stats h3 {font-family:"Myriad W01 Bd";padding:0 0 0 30px;position:relative;margin: 0 0 20px;font-size: 16px;}
div.stats h3:before {content:'\f2f6';position:absolute;left:0;top:50%;transform:translateY(-50%); } 
div.stats.topics h3:before {content:'\f7f5'; }
div.stats.comments h3:before {content:'\f4ad'; }
div.stats.faqs h3:before {content:'\3f'; }
div.stats.mc h3:before {content:'\f2bb'; }
div.stats.signatures h3:before {content:'\f573'; }

div.stats span.data {position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%);animation: counter 2s alternate ease-in-out forwards; counter-reset: num var(--num);}
span.data::after {content: counter(num);font-family:"Myriad W01 Bd";font-size:26px;}
div.stats span.last_done span.data:after {content:none;}

div.explanation {display:none;background: rgb(0 129 105 / 50%);  position: fixed;  height: 100%;  width: 100%;  left: 0;  top: 0;  z-index: 10;}
div.explanation p {line-height:1.5rem;}
div.explanation div.inner {position:fixed;left:0;right:0;margin:0 auto;top:25%;transform: translateY(-25%);width:calc(100% - 40px);     max-width: 800px;  z-index: 10;  background: #fff;  padding: 40px;  border-radius: 10px;}
span.showinfo:before {content:'\f05a';font-weight: 300;margin-left:10px;cursor:pointer;}
span.closeinfo:before {content:'\f00d';font-weight: 300;cursor:pointer; position: fixed;  right: 10px;  top: 10px;}

@property --num {
  syntax: '<integer>';
  initial-value: 0;
  inherits: false;
}
@keyframes counter {
  from {
    --num: 0;
  }
  to {
    --num: var(--score);
  }
}



  @media (display-mode: browser) {
  #installInstructions {
    display: block
  }
}

@media screen and (max-width: 560px) {
  h1 {font-size:18px;}
  body.comment h1 {padding: 0 ;}
  div.logo-container.mobileonly { width: 200px;}
  div.logo-container.mobileonly a.logo {padding: 20px 15px 20px 20px;}
  div.marketing-container ul.menumain {grid-gap: 10px;font-size:12px;}
  div.faqs table {width:1200px;}
  div.x-scroll {overflow-x: auto;}
  div.inner.left, div.inner.right {float:none;width:100%;}
  div.inner.right img {max-height:initial!important;height:auto;width:100%;}
  a.btn-danger {float:none; width: 100%;}
  button[type=submit], button.cancel {width:100%;margin:0 0 20px;}
  a.button {display:block;margin:0 0 20px;text-align:center;}
  a.button.add {position:initial;top:initial;right:initial;}
  a.button:before {position: initial!important;margin:0 5px 0 0;}
  div.comment-container {padding:10px;}
  span.datum {display:block}
  div.quotes {padding:10px 35px 30px 30px;}
  div.quotes span.user {font-size:13px;line-height:18px; bottom: -5px; }
  div.quotes:after {bottom:20px;}
  .button.push {top:-5px;right:-5px;}
  div.respons-container {margin:0 0 40px 20px;}
  tr.comment span.user {font-size:13px;line-height:18px;}
  div.respons-item {padding:10px;}
  div.respons-item div.quotes { padding: 10px 25px 30px 25px;}
  div.closemodal {top: 60px;right: 20px;}
  div.marketing-container ul.mod-menu__sub li a span:before {margin:0 0 3px;}
  div.dashboard h1 {text-align:left!important;line-height:22px;margin:0 0 20px;}
  div.dashboard h1 span {display:block;}
  div.marketing-container ul.mod-menu__sub {grid-gap:15px;}
  td.webauthnManagementCell button  {text-indent:-9999px;position: relative;}
  button.plg_system_webauthn-manage-edit:before, button.plg_system_webauthn-manage-delete:before {text-indent:initial;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
}

@media screen and (max-width: 360px) {
  div.marketing-container ul.mod-menu__sub li a span:before {font-size: 32px;}
}

@supports (-webkit-touch-callout: none) {
  /* CSS specific to iOS devices */ 
  div.ios.install {display:block;}
  
}

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@font-face {
  font-family: 'Font Awesome 6 Brands';
  font-display: block;
  font-weight: 400;
  src: url("../webfonts/fa-brands-400.woff2") format("woff2"), url("../webfonts/fa-brands-400.ttf") format("truetype"); }

@font-face {
  font-family: 'Font Awesome 6 Free';
  font-display: block;
  font-weight: 900;
  src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); }


 @font-face {
    font-family: 'Font Awesome 6 Pro';
    font-style: normal;
    font-weight: 300;
    font-display: block;
    src: url("../webfonts/fa-light-300.woff2") format("woff2"), url("../webfonts/fa-light-300.ttf") format("truetype"); }
  
  
  @font-face {
    font-family: 'Font Awesome 6 Pro';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.ttf") format("truetype"); }
  
  
  @font-face {
    font-family: 'Font Awesome 6 Pro';
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.ttf") format("truetype"); }

  
  @font-face {
    font-family: 'Font Awesome 6 Pro';
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url("../webfonts/fa-thin-100.woff2") format("woff2"), url("../webfonts/fa-thin-100.ttf") format("truetype"); }
    
    @font-face {
      font-family: 'Font Awesome 6 Duotone';
      font-style: normal;
      font-weight: 900;
      font-display: block;
      src: url("../webfonts/fa-duotone-900.woff2") format("woff2"), url("../webfonts/fa-duotone-900.ttf") format("truetype"); }
      @font-face {
        font-family: 'Font Awesome 6 Sharp';
        font-style: normal;
        font-weight: 400;
        font-display: block;
        src: url("../webfonts/fa-sharp-regular-400.woff2") format("woff2"), url("../webfonts/fa-sharp-regular-400.ttf") format("truetype"); }
        @font-face {
          font-family: 'Font Awesome 6 Sharp';
          font-style: normal;
          font-weight: 300;
          font-display: block;
          src: url("../webfonts/fa-sharp-light-300.woff2") format("woff2"), url("../webfonts/fa-sharp-light-300.ttf") format("truetype"); }

          @font-face {
            font-family: 'Font Awesome 6 Sharp';
            font-style: normal;
            font-weight: 900;
            font-display: block;
            src: url("../webfonts/fa-sharp-solid-900.woff2") format("woff2"), url("../webfonts/fa-sharp-solid-900.ttf") format("truetype"); }
  @font-face{
    font-family:"Myriad W01 Lt";
    src:url("../font/e7e30ff2-3a95-49b0-bbf9-024f40ead426.woff2") format("woff2"),url("../font/b984f4e8-e37d-4502-bead-ffd991e64d1f.woff") format("woff");
}
@font-face{
    font-family:"Myriad W01 Regular";
    src:url("../font/3b0f1c67-c2e4-4df6-976f-49d52e45aba1.woff2") format("woff2"),url("../font/c5b1c170-d8f7-41f9-85c2-0ab670780c6b.woff") format("woff");
}
@font-face{
    font-family:"Myriad W01 SmBd";
    src:url("../font/0b6110f9-6072-46b9-98af-7d09f7c895b8.woff2") format("woff2"),url("../font/c22866d7-ca67-4170-a113-cae280eea669.woff") format("woff");
}
@font-face{
    font-family:"Myriad W01 Bd";
    src:url("../font/eba438b3-9ab9-48ba-b1c5-610f83b38303.woff2") format("woff2"),url("../font/acfb7490-30f6-4bf4-a1b8-70ff9172d209.woff") format("woff");
}
@font-face{
    font-family:"Myriad W01 SmBd Cnd";
    src:url("../font/d488558f-a9ea-4e8a-b318-f7ab5cd9357a.woff2") format("woff2"),url("../font/a2f2aae6-fded-4f03-897a-84e978797dfd.woff") format("woff");
}
@font-face{
    font-family:"Myriad W01 Bd Cnd";
    src:url("../font/f3750fd8-e60c-4354-9fd6-584d74d1d19e.woff2") format("woff2"),url("../font/4823eae2-791d-4382-8ef0-5916b5b1623f.woff") format("woff");
}