@font-face {
    font-family: 'FlandersArtSans-Light';
    src: url(https://ui.vlaanderen.be/assets/fonts/sans/FlandersArtSans-Light.woff);
}

@keyframes bolding {
    0% {}
    50%  {background-color: #CCCCCC;}
    100% {}
}

@media print {
    .subheader, .printbutton, .footer, .formcontainer {display: none;}
    .resulttable {break-inside: avoid;}
    .printheader {display:flex; justify-content: space-between; align-items: center;}
    .newpage {page-break-before: always;}
    .badge {color: #444444;}
    .bg-salmon {border: 3px solid #F87666;}
    .bg-violet {border: 3px solid #413C58;}
    .bg-honey {border: 3px solid #FFAD05;}
    .bg-emerald {border: 3px solid #4E937A;}
    .questions-box {display: block};
}

:root {
    --main-grey: #444444;
    --main-green: #8BAE00;
    --main-blue: #15465B;
    --light-grey: #CCCCCC;
    --weak-grey: #f4f7f6;
}

html, body { /*v4*/
    color: #444444;
    height: 100%;
}

h1, h2, h3, h4, h5, h6 { /*v4*/
    color: #15465B;
}

body { /*v4*/
    overflow: -moz-scrollbars-vertical; 
    overflow-y: scroll;
    font-size: 1.25rem;
    display: flex;
    flex-direction: column;
    font-family: FlandersArtSans-Light;
}

.footer { /*v4*/
    flex-shrink: 0;
}

a { /*v4 */
    color: rgb(139,174,0);
}

a.privacy {
    color: #D5D5D5;
    text-decoration: underline;
}

a:hover { /*v4*/
    color: rgb(111,139,0);
}

a.privacy:hover{
    color: #989898
}

nav.navbar {
    padding: 0.5rem 0rem;
    justify-content: space-between;
}

body.modal-open {
    overflow: hidden;
}

.bg-ilvo-green { /*v4*/
    background-color: rgba(139, 174, 0, 1);
}

.bg-ilvo-green-125 { /*v4*/
    background-color: rgba(135, 169, 0, 1);
}

.bg-ilvo-gray { /*v4*/
    background-color: rgb(152, 152, 152);
}

.wideview { /*v4*/
    width: 100%;
    max-width: 950px;
    margin: auto;
}

.narrowview { /*v4*/
    width: 100%;
    max-width: 680px;
    margin: auto;
}

.sectorspan {
    display: inline;
}

.comma:before {
    content: "";
}
.comma~.comma:before {
    content: ", ";
}


.fitcontentview {
    width: auto;
    margin: auto;
}

.front-title { /*v4*/
    font-weight: bold;
    font-size: 3.5rem;
}

.bold { /*v4*/
    font-weight: bold;
}

.title-logo {
    outline: none; 
    position: absolute;
    margin-top: 0px;
       
    z-index: 2; 
    pointer-events: all;
    border-width: 0px;
    border-radius: 0.25rem;
    
    background-position: center;
    background-origin: content-box;
    background-repeat: no-repeat;
    cursor: default; 
}

.logo-100px {
    width: 100px; 
    height: 100px; 
    left: -135px;
    top: 10px; 
}

.logo-80px {
    width: 80px; 
    height: 80px; 
    left: -115px;
    top: 10px; 
}

.logo-20px {
    width: 60px;
    height: 60px;
    left: -75px;
    top: 0px; 
}

.img-cover {
    background-size: cover;
}

.img-contain {
    background-size: contain;
}

.img-block { /*v4*/
    display: block;
}

.pt-large { /*v4*/
    padding-top: 8rem;
}

.pt-medium { /*v4*/
    padding-top: 4rem;
}

.pt-small { /*v4*/
    padding-top: 20px;
}

.pl-medium { /*v4*/
    padding-left: 40px;
}

.pl-small { /*v4*/
    padding-left: 20px;
}

.mb-large { /*v4*/
    margin-bottom: 4rem;
}

.mb-medium { /*v4*/
    margin-bottom: 2rem;
}

.mb-small { /*v4*/
    margin-bottom: 1rem;
}

.mt-small {
    margin-top: 20px;
}

.btn-green, .btn-green2 { /*v4*/
    color: white;
    background-color: var(--main-green);
    border-color: var(--main-green);
}

.btn-green:hover {  /*v4*/
    color: white;
    background-color: rgb(111, 139, 0);
    border-color: rgb(111, 139, 0);
}

.btn-green2:hover {  /*v4*/
    color: white;
    background-color: rgb(163, 204, 0);
    border-color: rgb(163, 204, 0);
}

.btn-green:focus, .btn-green.focus, .btn-green2:focus, .btn-green2.focus { /*v4*/
    box-shadow: 0 0 0 .2rem rgba(139, 174, 0, 0.5)
}

.btn-outline-green { /*v4*/
    color: var(--main-green);
    background-color: transparent;
    background-image: none;
    border-color: var(--main-green);
}

.btn-outline-green:hover { /*v4*/
    color: white;
    background-color: var(--main-green);
    border-color: var(--main-green);
}

.btn-outline-green:focus, .btn-outline-green.focus { /*v4*/
    box-shadow: 0 0 0 .2rem rgba(139, 174, 0, 0.5);
}


.row-title {
    position: relative;
    padding-top: 60px;
    margin-bottom: 46px;
}

.row-title > h1,h2,h3 {
    font-weight: bold;
}

.content {
    flex: 1 0 auto;
}

.row-body {
    position: relative;
}

.no-padding {
    padding-left: 0px;
    padding-right: 0px;
}

.filter-label {
    display:block; 
    padding-left: 0px; 
    font-size: 0.9rem; 
    margin-bottom: 5px;
}

.filter-panel { /*v4*/
    padding: 0px;
    padding-right: 15px;
    margin-left: 45px;
    margin-bottom: 0px;
    margin-top: 30px;
    margin-right: 30px;
    min-width: 150px;
    display: inline-block;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #8CAE00;
    background-color: white;
    flex-shrink: 3;
}

.detail-panel, .text-panel {
    padding: 15px 0px;
}

.hidden {
    display: none;
}

.filter-panel-title {
    padding-left: 5px;
    padding-bottom: 10px;
    font-size: 0.9rem;
}

.filter-panel-item {
    padding-right: 15px;
    display: inline-block;
    min-width: 150px;
    font-size: 1rem;
    /*border-width: 1px; 
    border-style: solid; 
    border-radius: 0.25rem;*/
    /*background-color: #f4f7f6; */
    /*background-color: hsl(198,62.5%,98%);*/
}

.filter-select {
    min-width: 150px;
}

.quote-panel {
    padding-left: 30px;
    margin-top: 2.75rem;
    margin-bottom: 2.5rem;
}

.quote-panel > p {
    line-height: 2.5rem;
    font-size: 2rem;
    color: rgba(0, 0, 0, 0.54);
    font-weight: 400;
}

.row-border-top {
    border-top-color: #444444; 
    border-top-width: 1px; 
    border-top-style: solid;
}

.row-border-bottom {
    border-bottom-color: #444444; 
    border-bottom-width: 1px; 
    border-bottom-style: solid;
}

.row-border-no {
    border-width: 0px;
}

.extra-wide {
    padding: 0px 0px;
    width: 800px;
    /*max-width: 100%;*/
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    left: calc(-400px + 50%);
}

.btn-left, .btn-center, .btn-right, .btn-linkicon, .btn-linktext, .btn-bmfooter {
    padding: 4px 12px;
    text-decoration: none;
    border-style: solid;
    border-width: 1px;
    border-radius: 0.25rem;
    letter-spacing: 0px;
    line-height: 1.75rem;
    font-size: 1.25rem;
    display: inline-block;
    white-space: normal;
}

.btn-left, .btn-center, .btn-right {
    border-color:#8CAE00;
}

.btn-linkicon, .btn-linktext {
    font-size: 1rem;
}

.btn-linkicon, .btn-linktext {
    border-width: 0px;
    background-color: #f4f7f6;
}

.btn-linkicon {
    width: 50px;
    text-align: center;
}

.btn-left {
    background-color: #8CAE00;
    color: white;
    width: 50px;
    text-align: center;
}

.btn-center, .btn-right {
    background-color: transparent;
    color: #444444;
    width: 250px;
    text-align: left;
    font-weight: bold;
    padding-left: 15px;
}

.btn-right {
    font-weight: normal;
    width: 150px;
}

.btn-img {
    padding: 0px;
    border-width: 0px;
    border-radius: 0.25rem;
    border-color: var(--main-grey);
    letter-spacing: 0px;
    line-height: 1.75rem;
    font-size: 1.25rem;
    display: inline-block;
    width: 150px;
    height: 150px;
    background-size: cover; 
    background-position: center;
}

.btn-logo { /*v4*/
    padding: 10px;
    border-width: 0px;
    border-radius: 0.25rem;
    border-color: var(--main-grey);
    letter-spacing: 0px;
    line-height: 1.75rem;
    font-size: 1.25rem;
    display: inline-block;
    min-width: 110px;
    min-height: 110px;
    background-size: contain;
    background-position: center;
    background-origin: content-box;
    background-repeat: no-repeat;
}

.btn-logo-sm { /*v4*/
    padding: 10px;
    border-width: 0px;
    border-radius: 0.25rem;
    border-color: var(--main-grey);
    letter-spacing: 0px;
    line-height: 1.75rem;
    font-size: 1.25rem;
    display: inline-block;
    min-width: 60px;
    min-height: 60px;
    background-size: contain;
    background-position: center;
    background-origin: content-box;
    background-repeat: no-repeat;
}

.btn-imgtext, .btn-imgtext:hover { /*v4*/
    padding: 4px 12px;
    text-decoration: none;
    border-width: 0px;
    border-radius: 0rem;
    border-color: var(--main-grey);
    display: inline-block;
    background-color: var(--weak-grey);
    width: 100%;
    text-align: left;
    padding-left: 15px;
}

.btn-imgtext > h4 {
    letter-spacing: 0px;
    line-height: 1.75rem;
    font-size: 1.25rem;
    white-space: normal;
    font-weight: bold;
    color: var(--main-grey);
}

.btn-imgtext > h5 {
    letter-spacing: 0px;
    line-height: 1.25rem;
    font-size: 1rem;
    white-space: normal;
    font-weight: bold;
    color: var(--main-grey);
}

.btn-imgtext > p {
    font-size: 0.9rem;
    white-space: normal;
    font-weight: normal;
    color: var(--main-grey);
    width: 100%;
}

.btn-cat, .btn-cat:hover {
    padding: 0px;
    line-height: 30px;
    min-width: 30px;
    font-size: 0.8rem;
    border-width: 0px;
    display: inline-block;
    border-bottom-right-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.btn-cat-sm, .btn-cat-sm:hover {
    padding: 0px;
    min-width: 36px;
    font-size: 0.7rem;
    border-width: 0px;
    display: inline-block;
    border-bottom-right-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.btn-cat > .rotated {
    position: absolute;
    height: 30px;
    transform-origin: top left;
    transform: rotate(-90deg) translateX(-110px) translateY(-1px);
    width: 110px;
    text-align: center;
    font-weight: bold;
    color: white;
}

.btn-cat-sm > .rotated {
    position: absolute;
    height: 36px;
    transform-origin: top left;
    transform: rotate(-90deg) translateX(-60px) translateY(-1px);
    width: 60px;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    color: white;
    line-height: 36px;
}

.btn-cat-sm > .rotated > p {
    line-height: 1rem;
    vertical-align: middle;
    display: inline-block;
    padding: 0px;
    margin: 0px;
}

.btn-110 {
    height: 110px;
}

.btn-60 {
    height: 60px;
}

.value-group, .score-group, .tabs-group, .tips-group, .links-group {
    padding-left: 30px;
    margin-top: 2.75rem;
    margin-bottom: 2rem;
}

.content-group {
    display: block;
    padding-left: 30px;
    font-size: 1rem;
}

.content-group-full-width {
    display: block;
    padding-left: 0px;
    font-size: 1rem;
}

.content-group > div {
    display: block;
}

.content-group > div > a, .content-group > div > div {
    display: inline-block;
    width: 100%;
}

.content-group > div > p, .content-group > div > div > p {
    font-size: 0.9rem;
    padding-left: 65px;
}

.mt {
   margin-top: 2.75rem; 
}

.mb {
    margin-bottom: 2rem;
}

.btn-score {
    margin-bottom: 0.5rem;
    border-collapse: collapse;
    overflow: hidden;
    width: 100%;
    transition: all 0.2s;
}

.btn-cropped {
    margin-bottom: 0.5rem;
    border-collapse: collapse;
    overflow: hidden;
    width: 400px;
    transition: all 0.2s;
}

.btn-cropped-33 {
    margin-bottom: 0.5rem;
    border-collapse: collapse;
    overflow: hidden;
    width: 33%;
    transition: all 0.2s;
}

.btn-explainer {
    font-size: 0.9rem;
    padding-left: 65px;
    display: none;
}

.links-group > p {
    padding-left: 67px;
    font-size: 0.8rem;
}

.links-group > div {
    display: block;
}

.tabs-table > thead > tr > th, .tabs-table > tbody > tr > th {
    font-weight: normal;
    font-size: 1rem;
    vertical-align: top;
}

.tabs-table > tbody > tr > th > span {
    display: block;
    font-size: 0.8rem;
}

.tabs-table > tbody > tr > th.tabs-center {
    text-align: center;
    position: relative;
}

.tabs-table > tbody > tr > th.tabs-right {
    text-align: right;
    position: relative;
}

.tabs-table > tbody > tr > th.tabs-explainer, .tabs-table > tbody > tr > th >div.tabs-explainer {
    display: block;
    font-size: 0.8rem;
    padding-left: 2rem;
    text-align: justify;
}

.tabs-table > tbody > tr.tabs-dark {
    background-color: #f4f7f6;
    font-weight: bold;
}

.tabs-table > tbody > tr.tabs-dark {
    background-color: #f4f7f6;
    font-weight: bold;
}

.tabs-endnote {
    font-size: 0.9rem;
    padding-left: 44px;
    /*padding-top: 10px;*/
}

.tabs-endnote p, .tabs-endnote ol li p {
    margin-bottom: 0.5rem;
    text-align: justify;
}

.tabs-endnote ol li p a {
    font-weight: 500;
}

.btn-score{
    color: #444444;
    background-color: white;
}

.btn-score:hover {
    text-decoration: none;
}

.btn-score:hover > .btn-linkicon {
    background-color: #8CAE00;
    color: white;
    border-color: #8CAE00;
}

.btn-score:hover > .btn-linktext {
    border-color: #8CAE00;
    font-weight: bold;
}

.value-group > h4 {
    background-color: #f4f7f6;
    color: #444444;
}

.filter-menu {
    
    padding: 0px; 
}

.filter-select {
    border-radius: 0.25rem;
    font-size: 1.1rem;
}

.tooltip-inner {
    background-color: #15465B;
    max-width: 350px;
    text-align: left;
}

.bs-tooltip-right .arrow::before {
    border-right-color: #15465B;
}

.fa-green {
    color: #598B2C;
}

.fa-red {
    color: red;
}

.fa-orange {
    color: #FFC914;
}

.extra60 {
    padding-left: 60px;
}

.tabs-group > ul > li > a {
    font-size: 1.4rem;
}

.checkcontainer {
    display: inline-block;
    position: relative;
    padding-left: 20px;
    margin-bottom: 5px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.checkcontainer > .checkmark, input {
    vertical-align: middle;
}

.checkdiv {
    display: block; 
    line-height: 1.5rem;
}

.stripecontainer { /*v4*/
    background-image: linear-gradient(135deg, #dbdbdb 4.55%, #ffffff 4.55%, #ffffff 50%, #dbdbdb 50%, #dbdbdb 54.55%, #ffffff 54.55%, #ffffff 100%);
    background-size: 15.56px 15.56px;
    display: inline-block;
    border: 0px solid #CCCCCC
}

.flexcontainer { /*v4*/
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}

.flexitem { /*v4*/
    margin-right: 10px;
}

.bmcontainer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0px;
}

.bmpanel {
    display: inline-block;
    padding: 0px;
    text-align: center;
    vertical-align: top;
    margin-bottom: 40px;
    padding-left: 10px;
    padding-right: 10px;
}

.bmitem {
    height: 100px;
    position: relative;
    display: inline-block;
    padding: 0px;
    text-align: center;
    vertical-align: middle;
}

.bmborder {
    border-radius: 0.25rem;
    border-style: solid;
    border-width: 2px;}

.bmitem > p {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.bmpanel-content > .bmitem > p {
    font-size: 2rem;
}

.bmpanel-footer > .bmitem {
    display: block;
    font-size: 1rem;
}

.icontable > tbody > tr > th > img {
    width: 100%;
    max-width: 94px;
}

.btn-bmfooter {
    color: #444444;
    font-size: 0.9rem;
    background-color: transparent;
}


.btn-bmfooter:hover {
    color: #444444;
    text-decoration: none;
    font-weight: bold;
}

.pagebody {
    position: absolute;
    width: 100%;
    min-height: calc(100vh - 50px - 3.5rem);
}

.pagecontent {
    position: relative;
    padding-bottom: 2.5rem;
}

.pagefooter {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 2.5rem;
    padding-top: 2rem;
}

.pagereturn {
    position: absolute; 
    min-height: calc(100vh - 50px - 3.5rem);
}

.vertcenter > tbody > tr > th {
    vertical-align: middle;
}

.fs1 {
    font-size: 1rem;
}

.fs09 {
    font-size: 0.9rem;
}

.fs08 {
    font-size: 0.8rem;
}

.wd80 {
    max-width: 80%;
}

.wd70 {
    max-width: 70%;
}

.section {
    position: relative;
}

.section > h3 {
    cursor: pointer;
}

.section-plus {
    outline: none; 
    position: absolute; 
    width: 24px; 
    height: 24px; 
    padding: 4px; 
    z-index: 2; 
    pointer-events: all;
    background-color: transparent;
    border-radius: 0.125rem;
    border-style: none;
    border-width: 0px;
    top: 26px; 
    left: -30px; 
}

.section-plus:hover {
    cursor: pointer;
    background-color: #f4f7f6;
}

.section-panel {
    margin-bottom: 3rem;
}

.section-panel > p, .row > div > p {
    text-align: justify;
}

.explainer { /*v4*/
    font-weight: normal;
    font-size: 0.8rem;
}

.govshort {
    min-width: 80px; 
    font-size: 1.25rem; 
    font-weight: bold; 
    text-align: center;
}

.govfull {
    min-width: 100px; 
    font-weight: bold;
}

.calcinput, .calcresbox {
    height: 1.2rem;
    width: 60px;
    text-align: right;
}

.calcresbox {
    font-weight: bold;
}

.calcresult.glow {
    -webkit-animation: bolding .5s linear alternate;
    -moz-animation: bolding .5s linear alternate;
    animation: bolding .5s linear alternate;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}


.spaced-li > ul > li {
    margin-left: 15px;
}

.kadertjes {
    border-radius: 0.25rem; 
    border-style: solid; 
    border-width: 2px; 
    margin-bottom: 8px; 
    padding-left: 10px; 
    padding-right: 10px; 
    display:inline-block;
}

.kadertjes > h3 {
    margin: 0px;
}

.rood, .red {
    border-color: #EF476F;
}

.groen, .green {
    border-color: #8CAE00;
}

.geel, .yellow {
    border-color: #FFD166;
}

.explainer-link {
    position: absolute; 
    bottom: 0px; 
    right: 12px; 
    font-size: 0.9rem; 
    color: #aacc1e;
    text-decoration: none;
}

.explainer-link:hover {
    color: #8CAE00;
    text-decoration: underline;
}

.explainer-card {
    text-align: justify;
    font-size: 0.9rem;
    position: relative;
}

.explainer-card > div {
    padding-left: 195px;
    padding-right: 12px;
}

.explainer-card > div:before {
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 165px;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: "\f0c1";
}

.intro-img {
    border-radius: 0.25rem; 
    height: 200px; 
    max-width: 500px; 
    margin:auto; 
    background-size: cover; 
    background-position: center; 
    background-color: var(--light-grey);
}

.hover-border { /*v4*/
    border-width: 2px;
    border-style: solid;
    border-color: white;
    border-radius: 0.25rem;
}

.hover-border:hover {
    border-color: rgba(139, 174, 0, 1);
    cursor: pointer;
}

.tab-content { /*v4*/
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-radius: 0 4px 4px 4px;
}

.nav-tabs { /*v4*/
    border-bottom: 0px;
    margin-right: 4px;
}

.table-border { /*v4*/
    border: 1px solid #ddd;
    border-radius: 0.25rem;
}

.table-border th { /*v4*/
    border-top: 0px;
}

.table-border tr:not(:first-child) { /*v4*/
    border-top: 1px solid #ddd;
}

.table-border table { /*v4*/
    margin: 0px;
}

.table-border thead { /*v4*/
    text-align: right;
}

.currency { /*v4*/
    min-width: 85px;
}

.currency:before { /*v4*/
    font-size: 1rem;
    content: "€";
    margin-right: 0.25rem;
}

.btn-hidden {
    display: none;
}

.modal-hidden {
    display: none;
}

.btn-show {
    display: inline-flex;
}

.modal-show {
    display: inline-flex;
}

.btn-inactive, .btn-inactive:hover {
    border-color: var(--main-grey);
    opacity: 0.4;
    /*cursor: default;*/
}

.form-sector {
    background-color: var(--weak-grey);
    border-color: var(--main-green);
    border-width: 2px;
    border-radius: 0.25rem;
    border-style: solid;
    vertical-align: middle;
}

.form-large {
    padding: 0.5rem 1rem; 
    font-size: 1.25rem; 
    min-width: 120px;
    line-height: 1.5;
    border-radius: 0.3rem;
}

.form-small {
    margin-left: 45px; 
    margin-top: 20px; 
    margin-right: 20px;
    padding: 5px; 
    font-size: 1rem; 
    min-width: 120px; 
}

.badge-green { /*v4*/
    background-color: var(--main-green);
    color: white;
    margin-right: 10px;
}

.txt-white {
    color: white;
}

.txt-salmon {
    color: #F87666;
}

.bg-salmon {
    background-color: #F87666;
}

.bg-grey {
    background-color: var(--light-grey);
}

.bg-violet {
    background-color: #413C58;
}

.bg-slate {
    background-color: #829298;
}

.bg-tangerine {
    background-color: #F18805;
}

.bg-olive {
    background-color: #423B0B;
}

.bg-honey {
    background-color: #FFAD05;
}

.bg-emerald {
    background-color: #4E937A;
}

span.step {
    background: #8BAE00;
    border-radius: 0.6em;
    -moz-border-radius: 0.6em;
    -webkit-border-radius: 0.6em;
    display: inline-block;
    font-weight: normal;
    line-height: 1.2em;
    text-align: center;
    width: 0.7em; 
    vertical-align: top;
  }

.shoppingcart {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    font-size: 1.5rem;
    cursor: default;
  }

.shoppingcart:hover {
    cursor: pointer;
  }

.cartempty {
    color: rgba(255,255,255,.5);
}

.cartempty:hover {
    color: rgba(255,255,255,.75);
}

.cartfull {
    color: rgba(255,255,255,1);
}


.ml-45 {
    margin-left: 45px;
}

.mx-45 {
    margin-left: 45px;
    margin-right: 45px;
}

.pt-45 {
    padding-top: 45px;
  }

.pl-60 {
    padding-left: 60px;
  }

.wrapper1, .wrapper2 {
    border: none 0px RED;
    overflow-x: auto; 
    overflow-y: hidden;
}

.wrapper1 {
    height: 100%; 
}



.sidebar-box {
    max-height: 120px;
    position: relative;
    overflow: hidden;
}

.sidebar-box .read-more { 
    position: absolute; 
    bottom: 0; 
    left: 0;
    width: 100%; 
    text-align: right; 
    margin: 0; padding: 0; 
    /* "transparent" only works here because == rgba(0,0,0,0) */
    background-color: white;
}

.read-more-button {
    font-weight: 700;
    cursor: default;
}

.read-more-button:hover {
    cursor: pointer;
}
        
li.arrow-pointer {
    height: 50px;
    position: relative;
    padding: 5px;
    padding-left: 30px;
}
li.arrow-pointer:first-child {
    padding-left: 0px;
}
.arrow-pointer > a, .arrow-pointer > a:hover {
    z-index: 11;
}

.arrow-pointer.arrow-active {
    background: #f4f7f6;
    font-weight: bold;
}
.arrow-pointer.arrow-active > a, .arrow-pointer.arrow-active > a:hover {
    text-decoration: underline;
    cursor: default;
    color: rgb(139,174,0);
}

.arrow-pointer.arrow-finished {
    text-decoration: none;
    background: #f4f7f6;
    font-weight: normal;
}
.arrow-pointer.arrow-finished > a {
    text-decoration: none;
    cursor: default;
    color: rgb(139,174,0);
}
.arrow-pointer.arrow-finished > a:hover {
    text-decoration: underline;
    cursor: pointer;
    color: rgb(111,139,0);
}

.arrow-pointer.arrow-inactive {
    text-decoration: none;
    background: white;
    font-weight: normal;
}
.arrow-pointer.arrow-inactive > a, .arrow-pointer.arrow-inactive > a:hover {
    text-decoration: none;
    cursor: default;
    color: #444444;
}

.arrow-start {
    margin-left: 0px;
}

.arrow-end {
    margin-right: 25px;
}

.arrow-start:after {
    content: '';
    position: absolute;
    left: -25px; bottom: 0; width: 0; height: 0;
    border-left: 25px solid transparent;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    z-index: 8;
}

.arrow-start.arrow-active:after {
    background-color: #f4f7f6;
}
.arrow-start.arrow-finished:after {
    background-color: #f4f7f6;
}
.arrow-start.arrow-inactive:after {
    background-color: white;
}
  
.arrow-end:before {
    content: '';
    position: absolute;
    right: -25px;
    bottom: 0;
    width: 0;
    height: 0;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    z-index: 9;
}

.arrow-end.arrow-active:before {
    border-left: 25px solid #f4f7f6;
}
.arrow-end.arrow-finished:before {
    border-left: 25px solid #f4f7f6;
}
.arrow-end.arrow-inactive:before {
    border-left: 25px solid white;
}

.arrow-next {
    width: 35px;
    height: 35px;
    border: 1px solid #CCCCCC;
    border-left: 0;
    border-top: 0;
    transform: rotate(-45deg);
    position: absolute;
    right: -19px;
    z-index: 10;
    background-color: transparent;
  }

.vertical-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.form-message {
    color: red; 
    padding-left: 45px; 
    font-size: 0.9rem;
}

.printheader {display:none;}

.honeypot {
    position: absolute;
    left: -9999px;
}

.formcontainer {
    background-color: #6F8B00;
}

.subheader {
    border-bottom: solid 1px #CCCCCC; 
    background: linear-gradient(90deg, #f4f7f6 50%, #ffffff 0); 
    font-size: 1rem;
}

.subheader.complete {
    background:#f4f7f6; 
}

.vhfill {
    height: 90vh; max-height: 90vh;
}

.questions-box {
    display: none;
}

.carousel-control-prev {
    left: -15%;
}

.carousel-control-next {
    right: -15%;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2315465B' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
   }
   
.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2315465B' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

.questions-box {
    display: none;
}

.sectorspan {
    display: none;
}

.comma {
    display: inline;
}

.comma:before {
    content: "";
}
.comma~.comma:before {
    content: ", ";
}

@media print {
    .questions-box {display: block};
    .subheader, .printbutton, .footer, .formcontainer {display: none;}
    .resulttable {break-inside: avoid;}
    .printheader {display:flex; justify-content: space-between; align-items: center;}
    .newpage {page-break-before: always;}
    .badge {color: #444444;}
    .bg-salmon {border: 3px solid #F87666;}
    .bg-violet {border: 3px solid #413C58;}
    .bg-honey {border: 3px solid #FFAD05;}
    .bg-emerald {border: 3px solid #4E937A;}
}
