.profile-box .circle-progresbar {
    display: flex;
    gap: 15px;
}

.circle-progresbar {
    display: flex;
    justify-content: center;
    gap: 40px;
}

.responsive-back-arrow {
    display: none;
}

.header-title {
    color: #141053;
    font-size: 22px;
    font-family: 'museo-bold' !important;
}

.header-title a {
    color: #141053;
    font-size: 22px;
}

/* .header-profile-box {
    display: flex;
    align-items: center;
    justify-content: right;
    gap: 60px;
} */

.main-header {
    padding: 20px 0px;
    box-shadow: 0px 3px 6px #00000029;
}

.col-lg-2.mein-logo {
    align-items: center;
    display: flex;
}

.responsive-navigation {
    display: none;
}

li.vorige-btn button {
    width: 200px;
    padding: 6px;
    background: #6964BC;
    border-radius: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    margin-bottom: 30px;
    justify-content: center;
    font-weight: 500;
}

.line {
    width: 200px;
    height: 1px;
    background: #ddd;
}

.aside-bar {
    /* padding: 100px 0px 100px 50px; */
    height: 100vh;
    border-right: 1px solid #ddd;
    margin-top: 20px;
}

.col-lg-2.aside-bar-main-box {
    /* padding: 30px 15px; */
    border-right: 1px solid #ddd;
    margin-top: 30px;
    margin-bottom: 1200px;
}

.maatregel-content-main-box {
    padding: 120px;
}

.maatregel-content-title-box h2 {
    font-size: 45px;
    color: #141053;
    margin-bottom: 30px;
    line-height: 55px;
}

.maatregel-content-title-box p a {
    /* font-size: 22px; */
    color: #141053;
    /* line-height: 32px; */
}

.maatregel-content-title-box p {
    /* font-size: 22px; */
    color: #141053;
    font-weight: 300;
    /* line-height: 32px; */
    margin-bottom: 45px;
}


.bookmark-paregraph p {
    font-family: 'museo-medium';
    padding-right: 0;
    font-size: 20px;
    margin-bottom: 38px;
}


.noteice {
    position: relative;
}

.noteice p {
    color: #3F3D56;
    padding: 40px;
    background: #F2F2F2;
    border-radius: 20px;
    margin: 45px 0px;
    margin-top: 100px;
}

.noteice p::before {
    content: "";
    background: url(../image/girl-like.png);
    width: 120px;
    height: 100px;
    position: absolute;
    background-position: center;
    background-repeat: no-repeat;
    top: -60px;
    left: 0;
}

.title h4 {
    color: #141053;
    margin-bottom: 20px;
    font-size: 24px;
}

.tochtstrippen-discription p {
    margin-bottom: 45px;
}

.video-wrapper {
    margin-bottom: 45px;
}

.col-5.prodoct-img img {
    width: 100%;
}

.col-7.prodoct-details a {
    display: block;
    font-size: 22px;
    color: #000;
    text-decoration: underline;
    margin-bottom: 5px;
}


.col-7.prodoct-details span {
    color: red;
    font-size: 16px;
}

.col-7.prodoct-details p {
    font-size: 14px;
    line-height: 20px;
    color: green;
    margin-bottom: 5px;
}

.col-7.prodoct-details button {
    padding: 10px;
    background: #3d68c5;
    color: #fff;
    border-radius: 4px;
}


.binner-img-wrapper {
    background: url(../image/home-blob.svg);
    background-position: right;
    background-repeat: no-repeat;
    padding: 30px 0px;

}

.binner-title h3 {
    font-size: 45px;
    margin-bottom: 15px;
    font-family: 'Museo-Sans' !important;
    font-weight: 500;
}

.binner-title h3 span {
    color: #287CF8;
    display: block;
}

.binner-title p {
    font-size: 24px;
}

.binner-btn button a {
    color: #fff;
    font-family: 'museo-medium';
}

.binnen-description {
    width: 50%;
    margin: 82px auto;
    /* padding-right: 95px; */
}

.binner-btn button {
    background: transparent;
    margin-top: 35px;
}

rect#Rectangle_1100 {
    transition: all 0.6s;

}

rect#Rectangle_1100:hover {
    fill: #6964BC !important;
}

section.Binnen {
    background-color: #3eeaff14;
}

.maatregel-details-main-box {
    padding-top: 120px;
}

.maatregel-details-card {
    width: 360px;
    /* height: 475px; */
    height: auto;
    background: #141053 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 1;
    position: relative;
    padding: 30px;
    padding: 30px 45px;
}

.checkbox-round {
    width: 40px;
    height: 40px;
    /* background-color: transparent; */
    border-radius: 50%;
    vertical-align: middle;
    border: 2px solid #fff;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 20px;
    transition: all 0.6s;
    /* background-color: #FDC342; */
    z-index: 999;
    box-shadow: inset 3px 1px 1.5px rgba(0, 0, 0, 0.16);
}


/* checkboxes custom code */
.checkbox-round[switchstatus="todo"]::after {
    border: 2px solid #fff;
    border-top: none;
    border-right: none;
    content: "";
    height: 9px;
    opacity: 0;
    position: absolute;
    top: 12px;
    right: 8px;
    transform: rotate(-45deg);
    width: 20px;
    transition: all 0.6s;
}

.checkbox-round[switchstatus="done"]::after {
    border: none;
    border-top: none;
    border-right: none;
    content: "";
    height: 20px;
    width: 20px;
    opacity: 1;
    position: absolute;
    top: 8px;
    right: 8px;
    background: url(../image/thumbs-.png);
    transform: none;
    transition: all 0.6s;
}

.checkbox-round[switchstatus="todo"] {
    background-color: #FDC342;
}


.no-hover {
    pointer-events: none;
    /* Add other styles if needed to negate hover effects */
}

/*EMPTY ICON */
/* .checkbox-round[switchstatus=""] {
    
} */
.checkbox-round[switchstatus=""]::after {
    border: 2px solid #fff;
    border-top: none;
    border-right: none;
    content: "";
    height: 9px;
    opacity: 0;
    position: absolute;
    top: 12px;
    right: 8px;
    transform: rotate(-45deg);
    width: 20px;
    transition: all 0.6s;
}

/*TODO HOVER ICON */
.checkbox-round[switchstatus=""]:hover {
    background-color: #FDC342;
}


.checkbox-round[switchstatus="todo"]:hover::after {
    opacity: 1;
}

.checkbox-round[switchstatus=""]:hover::after {
    opacity: 1;
}

.checkbox-round[switchstatus="todo"]:hover {
    background-color: #69D19C;
}

.checkbox-round[switchstatus="done"] {
    background-color: #8B84FF;
}


.checkbox-round[switchstatus="todo"]:after,
.checkbox-round[switchstatus="done"]:after {
    opacity: 1;
}

.checkbox-round[switchstatus="todo"]:hover::after {
    opacity: 1;
}

.checkbox-round[switchstatus="done"]:hover::after {
    opacity: 1;
    transform: scaleY(-1);
}

/* end here */


.col-md-2 {
    padding: 0;
}


.checkbox-round:checked.heart {
    opacity: 1 !important;
}

.heart {
    content: "";
    background: url(../image/heart.png);
    position: absolute;
    top: -15px;
    right: 15px;
    width: 54px;
    height: 130px;
    background-position: top;
    background-repeat: no-repeat;
    Z-INDEX: 10;
    opacity: 00;
    transition: all 0.6s;
}

.shadow {
    position: relative;
    box-shadow: none !important;
}

.shadow:after {
    position: absolute;
    width: 75%;
    height: 3%;
    left: 10px;
    border-radius: 50%;
    z-index: -1;
    bottom: 64%;
    content: "";
    box-shadow: 0 53PX 6px 0PX rgba(0, 0, 0, 0.24);
}

.card-title h4 {
    font-size: 30px;
    line-height: 38px;
    color: #F7F6FB;

}


.triangle-right-box-opslaan span {
    padding: 2px 13px 0px 13px;
    background: #64BCFC;
    border-radius: 8px 0 0 8px;
    font-size: 15px;
}

.triangle-right-opslaan {
    border-left: 23px solid #64BCFC;
}

.triangle-right {
    border-left: 23px solid #8B84FF;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
}

.triangle-right-box {
    display: flex;
}

.triangle-right-box span {
    padding: 2px 13px 0px 13px;
    background: #8B84FF;
    border-radius: 8px 0 0 8px;
    font-size: 15px;
}

.categorie-status span {
    color: #fff;
}

.categorie-status p {
    color: #fff;
    margin-bottom: 10px;
    font-size: 18px;
}

.categorie-status span {
    color: #fff;
    font-size: 15px;
}

.categorie-status {
    display: flex;
    gap: 30px;
    padding-bottom: 30px;
    padding-top: 15px;
    border-bottom: 0.5px solid #eeeeee40;
}

video.video-stream.html5-main-video {
    width: 100% !important;
    left: 0 !important;
}

.circle-progresbar.header-progress-cls {
    /*   display: block;*/
    margin-right: 60px;
}

.circle-progresbar {
    display: flex;
    /* gap: 40px; */
    justify-content: space-evenly;
    margin-top: 15px;
}

.pie-title p {
    padding-top: 10px;
    font-size: 18px;
    padding: 10px 0px;
    color: #fff;
    line-height: 20px;
    text-align: center;
}

.profile-img::after {
    content: "2";
    background: url(../image/hexagon.png);
    width: 20px;
    height: 22px;
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    top: -1px;
    right: -3px;
    color: #fff;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;

}

.profile-img {
    position: relative;
}

.maatregel-content-title-box .checkbox-round {
    display: none;
}

.responsive-card-main-box {
    display: none;
}

text tspan {
    font-size: 18px !important;
}

text tspan.pie-percent-4 {
    /*   
 This is the impact pie... why hide??


 display: none !important;*/
}

text tspan.pie-symbol-4 {
    font-size: 10px !important;
}

.bol_sitebar_box .product-delivery {
    display: -webkit-box;
    max-width: 100%;
    margin: 0 auto;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 80px;
}

.page-body h4 {
    color: #141053;
}

.maatregel-content-title-box img {
    /* display: none; */
}

.vorige-btn {
    display: block;
}

.tochtstrippen-discription p {
    font-weight: 300;
}


/** new changes **/
@media (min-width: 991px) {


    .single-middle-column-width {
        width: 53.85% !important;
        /*from 100% */
    }

    .single-right-column-width {
        width: 46.15% !important;
        /*from 100% */


    }

    .maatregel-details-card {
        width: 360px !important;
    }
}


.single-middle-column-width h1 {
    font-size: 42px;
    font-family: 'Museo-medium' !important;
    color: #141053;
}

.single-middle-column-width h3 {
    font-weight: bolder;
    font-size: 24px;
    font-family: 'Museo-medium' !important;
    color: #141053;
    margin-bottom: 10px;
    margin-top: 20px;
}

.single-middle-column-width p {
    font-size: 20px;
    font-family: 'Museo-Sans' !important;
    line-height: 30px;
}

@media (min-width: 768px) and (max-width: 991px) {
    .single-right-column-width .display-percentage-cls .pie svg {
        width: 100px !important;
        height: 100px !important;
    }
}


@media (max-width: 991px) {
    .single-middle-column-width h1 {
        font-size: 38px;
    }

    .maatregel-content-title-box p {
        font-size: 16px;
    }

    .single-middle-column-width h3 {
        font-size: 20px;
    }

    .single-middle-column-width ul li {
        font-size: 16px;
    }

}

/** end **/