@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

body {
	font-family: 'Roboto', sans-serif!important;
}
a {
	text-decoration:none;
	color:black !important;
}
a:hover {
	text-decoration:none;
}
a:hover .text-inherit {
  color: #752b6a !important;
}
.art-body a{
	color:#cd0074 !important;
}
div#added-margin h2,
div#added-margin h3,
div#added-margin h4,
div#added-margin h5 {
    margin-top: 50px !important;
}
a.section-link {
	padding:5px;
	color:#FFF!important;
}
a.section-link.active {
  padding: 5px;
  color: #FFF !important;
  border-style: none none solid;
  border-width:2px;
}
.dash-page-id {
	position:absolute;
	top:0;
	right:0;
	background-color: #752b6a;
	color:#FFF;
	border-radius:0 15px 0 15px;
	padding:5px 10px;
	border-style:solid;
	border-color:#752b6a;
	border-width:1px;
}

.pdf-download {
	padding:50px;
	border-style:solid;
	border-color:#752B6A;
	border-width:2px;
	border-radius:10px;
}
.form-check-input:checked {
  background-color: #752B6A !important;
}
.form-check-input:checked {
  border-color: #752B6A !important;
}

.btn:first-child:active, .btn.active, .btn.show {
  background-color: #752b6a!important;
  border-color: #752b6a!important;
}
div.branding-ltd.branding-ltd-b.tc {
	display:none!important;
}
.know-bg p {
	color:black;
	font-size:16px;
}
.know-bg li {
	color:black;
}
.index-img {
	position:relative;
	background-image: url("../img/knowledge/know-banner.png");
	background-color: #f7ebfc; /* Used if the image is unavailable */
	height: 188px; /* You must set a specified height */
	background-position: center; /* Center the image */
	background-repeat: no-repeat; /* Do not repeat the image */
	background-size: cover; /* Resize the background image to cover the entire container */
	width:100%;
}
.know-block {
	background-color:#F1EAF0;
	border-radius:15px;
	padding:20px;
}
.know-block p{
	color:black;
}
.know-block span{
	color:#10395d;
	text-decoration:underline;
}
.know-block:hover span{
	color:#FFF;
	text-decoration:underline;
}
.know-block:hover {
	background-color:#752b6a;
	border-radius:15px;
	padding:20px;
	color:#FFF;
}
.know-block:hover h4{
	color:#FFF;
}
.know-block:hover p{
	color:#FFF;
}
.know-nbar {
	width: 100%;
	padding-top:15px;
	background-color: #10395d;
	color: #FFF;
	height:68px;
}
.step-container {
  position: relative;
  text-align: center;
  transform: translateY(-43%);
}

.step-circle {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid #752b6a;
  line-height: 30px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  cursor: pointer; /* Added cursor pointer */
}

.step-line {
  position: absolute;
  top: 16px;
  left: 50px;
  width: calc(100% - 100px);
  height: 2px;
  background-color: #752b6a;
  z-index: -1;
}

#multi-step-form{
  overflow-x: hidden;
}

.message-frame {
  position: fixed;
  bottom: 40px;
  left: 10px;
  width: 300px;
  height: 200px;
  background-color: rgba(80, 149, 41, 0.83);
  color: white;
  text-align: center;
  padding: 20px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  z-index: 1000;
}
.message-frame .close-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	background: none;
	border: none;
	color: white;
	font-size: 20px;
	cursor: pointer;
}

.dash-info-meta {
	padding: 25px;
	border-style:solid;
	border-width:1px;
	text-align:center;
}

.accordion-body {
  padding-left:0!important;
  padding: 10px!important;
  
}

.wizard-dash {
	padding-top:20%;
	height:250px;
	text-align:center;
	border-radius:25px;
	box-shadow: 0px 3px 6px #00000029;
}

.wizard-dash-2 {
	padding:25px;
	height:100%;
	text-align:left;
	border-radius:25px;
	box-shadow: 0px 3px 6px #00000029;
}

.footer-clss {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
    height:33px;
	z-index:9999;
}
.style-footer {
	background-color:#752b6a!important;
    border-style:solid none none;
    border-width:2px;
    border-color:#cd0074;
	padding:5px;
	text-align:center;
	color:white;
}

.btn-sb {
	height:20px!important;
	color:#bec0c2!important;
	padding:0!important;
	text-align:left!important;
}

.counter-dash {
	padding:10px;
	text-align:center;
	border-radius:5px;
	box-shadow: 0px 3px 6px #00000029;
}

.dash-navbar {
	padding:20px 15px 0;
	background-color:#f1f3f5;
	box-shadow: 0px 3px 6px #00000029;
}

.dash-article {
  border-style: solid;
  border-width: 1px;
  padding: 25px;
  background-color: #fff;
  border-radius: 15px;
  border-color: #752b6a;
  box-shadow: 1px 1px 3px 2px #7575751f;
}

.dash-home-box {
	box-shadow: 0px 3px 6px #00000029;
	padding:25px;
}

.dash-image {
	position:relative;
	background-color:#f1f3f5;
	border-style:solid;
	border-width:1px;
}
.actual-image {
	height: 150px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.dash-sidebar {

}

.calendly-overlay .calendly-popup-close {
    width: 50px!important;
    height: 50px!important;
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
}
.video-container .video-js {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hs-menu-initialized.hs-menu-horizontal .hs-mega-menu.hs-position-center {
  right: 0!important;
  left: 0!important;
}

.card-home {
	padding:20px;
	border-radius:25px;
	text-align:center;
	background-color:#FFF;
	box-shadow: 0px 3px 6px #00000029;
}

.image-container {
    position: relative;
    display: inline-block;
}

.image-container img {
    height: auto;
    transition: transform 0.3s ease;
}

.image-container:hover img {
    transform: scale(1.05);
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 91%;
    width: 100%;
    opacity: 0;
    transition: opacity 0.5s ease;
    background-color: rgba(0, 0, 0, 0.5); /* Optional: Adds a semi-transparent black background */
    display: flex;
    align-items: center;
    justify-content: center;
	border-radius:10px;
}

.image-container:hover .overlay {
    opacity: 1;
}

.text {
    color: white;
    font-size: 18px;
    text-align: center;
}

.info-bar {
	position: sticky;
    top: 0;
    width: 100%;
	height:35px;
	background-color:#10395d;
	padding:5px;
	color:#FFF;
	z-index: 1030;
}
.info-bar a{
	color:#FFF!important;
	text-decoration:none;
}
.map-responsive {
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.map-responsive iframe {
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.art-body {
	margin-top:35px;
}

.art-body p{
	font-size: 1.3125rem;
}
.art-body ol{
	font-size: 1.3125rem;
	color: #2d374b!important;
}
.art-body ul{
	font-size: 1.3125rem;
}

.en-true {
	color:green;
}
.en-false {
	color:red;
}
.nl-true {
	color:green;
}
.nl-false {
	color:red;
}

.draft-section {
	margin:5px 0 0;
	border-style:none none dashed;
	border-width:2px;
}

.deco-logo-left {
	position:absolute;
	top:75px;
	left:-50px;
}
.deco-logo-left-under {
	position:absolute;
	bottom:-125px;
	left:0;
	z-index:0;
}
.deco-logo-right {
	position:absolute;
	top:-50px;
	right:-50px;
}
.deco-logo-navbar {
	position:absolute;
	top:0;
	right:0;
}
.deco-logo-right-blog {
	position:absolute;
	top:-50px;
	right:-150px;
}
.deco-logo-left-blog {
	position:absolute;
	top:0;
	left:-150px;
}

.style-pricing-calculator {
  background-color: #FFF;
  border-radius: 0 15px 15px 15px;
}
.table-striped > tbody > tr:nth-of-type(2n+1) > * {
  --bs-table-accent-bg: #f5f7fa!important;
}

#tabs.nav-pills {
  --bs-nav-pills-border-radius: 0.5rem 0.5rem 0 0!important;
}
#tabs.nav-pills .nav-item {
  margin: 0!important;
}
#tabs.nav-pills .nav-link.active {
  background-color:#FFF!important;
  box-shadow: none!important;
  border-color:#752b6a!important;
}
#tabs.nav-pills .nav-item a:hover {
	border-style:solid!important;
	background-color:#FFF!important;
}
#bg-home.bg-soft-primary {
	background-color:#F5F7FA!important;
}
#featuresTab.nav-pills .nav-item a:hover {
	background-color:#FFF!important;
}

h6.text-success {
    --bs-text-opacity: 1;
    color: black !important;
}

.flex-container {
    display: flex;
    justify-content: space-between; /* Adjusts the spacing between the divs */
}

.flex-container > div {
    flex-basis: 48%; /* Adjust the width of each child div */
    /* Other styles like margin, padding etc., as per your design */
}

.backg-home-old {
	background-image: url('../img/upload/login-achtergrond-groot – 1.svg') !important;
    background-size: cover;
    transform: scaleX(-1); /* Mirror horizontally */
    transform-origin: center; /* Ensure the transformation occurs from the center */
	height: 1000px;
}

.backg-home {
	background-image: url('../img/upload/login-achtergrond-groot – 1.svg') !important;
    background-size: cover;
    transform: scaleX(-1); /* Mirror horizontally */
    transform-origin: center; /* Ensure the transformation occurs from the center */
}

/* Larger mobile screens */
@media (min-width: 1px) {
    .backg-home {
        height: 600px;
    }
	.snippet-home {
		margin-top:-600px;
	}
}

/* Tablets */
@media (min-width: 768px) {
    .backg-home {
       height: 800px;
    }
	.snippet-home {
		margin-top:-800px;
	}
}

/* Small desktops */
@media (min-width: 1200px) {
    .backg-home {
        height: 1000px;
    }
	.snippet-home {
		margin-top:-1000px;
	}
}

/* Small desktops */
@media (min-width: 1800px) {
    .backg-home {
        height: 1700px;
    }
	.snippet-home {
		margin-top:-1700px;
	}
}

.backg-footer {
	background-color: #752b6a;
}
.backg-footer i{
	color:#FFF!important;
}
.backg-footer-end {
	background-color: #5f1c55;
	padding:25px 0;
}

::selection {
  color: #752b6a !important;

  background-color: rgba(10, 191, 83, 0.1);

}
a.dropdown-item {
	color:black!important;
}

.dropdown-item::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='#c10673' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/%3e%3c/svg%3e");
}

.btn-primary {
	background-color:#ff7c10 !important;
	border-style:none!important;
	color:white !important;
}
.btn-primary-dash {
	background-color:#ff7c10 !important;
	border-style:none!important;
	color:white !important;
	padding:0 5px!important;
}
.btn-language-en {
	background-image: url('/img/en.png'); /* Replace with your image path */
	background-size: contain; /* Or 'contain', depending on your needs */
    width: 16px; /* Set your desired width */
    height: 11px; /* Set your desired height */
    border: none; /* Optional: removes the border */
    color: transparent; /* Hides the text if you only want the image */
    -webkit-appearance: none!important; /* Remove native styling in Safari */
    -moz-appearance: none!important;    /* Remove native styling in Firefox, if needed */
    appearance: none;         /* Standard property */
    background-repeat: no-repeat; /* Ensure no repeating of the image */
    background-position: center;  /* Center the image */
    background-color: transparent;
}
.btn-language-nl {
	background-image: url('/img/nl.png'); /* Replace with your image path */
	background-size: contain; /* Or 'contain', depending on your needs */
    width: 16px; /* Set your desired width */
    height: 11px; /* Set your desired height */
    border: none; /* Optional: removes the border */
    color: transparent; /* Hides the text if you only want the image */
    -webkit-appearance: none!important; /* Remove native styling in Safari */
    -moz-appearance: none!important;    /* Remove native styling in Firefox, if needed */
    appearance: none;         /* Standard property */
    background-repeat: no-repeat; /* Ensure no repeating of the image */
    background-position: center;  /* Center the image */
    background-color: transparent;
}
span.text-primary {
	color:#c10673 !important;
}
h1.text-primary {
	color:#c10673 !important;
}
@media (max-width: 768px) {
	h1.text-primary {
		color:#c10673 !important;
		font-size:1.8rem!important;
	}
}
span.text-footer {
	color:#ff7c10 !important;
}
.text-navbar {
	color:black !important;
}

a.tool-tip {
	color:#2d374b!important;
}
.form-row {
    display: flex;
    justify-content: space-between; /* Adjusts the spacing between items */
}

.form-group {
    flex: 1; /* Makes each form group take equal width */
    margin-right: 0; /* Optional: Adds some space between the input fields */
}

/* Optional: Remove margin-right from the last form-group */
.form-group:last-child {
    margin-right: 0;
}


.btn-outline-footer {
	background-color:transparent!important;
	border-style:solid!important;
	border-width:1px!important;
	border-color:white !important;
	color:white !important;
}
.btn-outline-primary:hover {
	background-color:transparent!important;
	border-color:#ff7c10 !important;
}
.btn-outline-primary.active {
    background-color: transparent !important;
    border-color: #ff7c10 !important;
}
.header {
	border-style:solid;
	border-width:1px;
	padding:100px;
	text-align:center;
}

.style-edit {
	border-style:solid;
	border-width:1px;
	padding:50px
}

.article-home {
	margin:10px 0;
	padding:10px;
	border-style:solid;
	border-width:1px;
}

.page-header {
	text-align:center;
}

#comp_update {
	height:500px;
}

#body_text {
	height:500px;
}

.blog-cat {
	position:absolute;
	padding:5px;
	background-color:white;
	border-radius:5px;
	top:5px;
	right:5px;
	font-size:0.8rem;
}

.style-calc {
	padding:50px;
	border-style:solid;
	border-radius:10px;
	border-width:2px;
	border-color:#752b6a;
}
.style-calc-sum {
	padding:50px;
	border-style:solid;
	border-radius:10px;
	border-width:2px;
	border-color:#752b6a;
	height:100%;
}

@keyframes fromRight {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.fade-in {
	position:relative;
	animation-name: fromRight;
	animation-duration: 1s;
	z-index:1;
	animation-timing-function: ease-in-out;
}

#sidebar.hidden {
    display: none;
}

#closeSidebar {
    display: none;
}

#mainContent.page-wide {
    width: 100%;
}

.slider-container {
  position: relative;
  width: 100%; /* Adjust to your preferred width */
}

#num_user {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 100%;
  height: 10px; /* Adjust to your preferred height */
  background: #D3D3D3; /* Slider background */
  outline: none;
  opacity: 0.7; /* Adjust to your preferred opacity */
  -webkit-transition: .2s;
  transition: opacity .2s;
}

#num_user:hover {
  opacity: 1; /* Full opacity on hover */
}

#num_user::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}

#num_user::-moz-range-thumb {
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}



#num_course {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 100%;
  height: 10px; /* Adjust to your preferred height */
  background: #D3D3D3; /* Slider background */
  outline: none;
  opacity: 0.7; /* Adjust to your preferred opacity */
  -webkit-transition: .2s;
  transition: opacity .2s;
}

#num_course:hover {
  opacity: 1; /* Full opacity on hover */
}

#num_course::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}

#num_course::-moz-range-thumb {
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}



#num_user_credit {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 100%;
  height: 10px; /* Adjust to your preferred height */
  background: #D3D3D3; /* Slider background */
  outline: none;
  opacity: 0.7; /* Adjust to your preferred opacity */
  -webkit-transition: .2s;
  transition: opacity .2s;
}

#num_user_credit:hover {
  opacity: 1; /* Full opacity on hover */
}

#num_user_credit::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}

#num_user_credit::-moz-range-thumb {
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}



#num_course_credit {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 100%;
  height: 10px; /* Adjust to your preferred height */
  background: #D3D3D3; /* Slider background */
  outline: none;
  opacity: 0.7; /* Adjust to your preferred opacity */
  -webkit-transition: .2s;
  transition: opacity .2s;
}

#num_course_credit:hover {
  opacity: 1; /* Full opacity on hover */
}

#num_course_credit::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}

#num_course_credit::-moz-range-thumb {
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  cursor: pointer;
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
}

/* Style for the thumb icon */
.slider-thumb {
  position: absolute;
  top: -15px; /* Adjust to align with the slider thumb */
  left: 0;
  width: 30px; /* Adjust to your preferred width */
  height: 30px; /* Adjust to your preferred height */
  background: #752b6a; /* Thumb background */
  border-radius: 50%; /* Circular thumb */
  border: 2px solid white; /* White border */
  box-shadow: 0px 3px 6px #00000029; /* Shadow for thumb */
  display: none; /* Hide until JavaScript positions it */
}

.btn-pulse {
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.logos {
  overflow: hidden;
  padding: 25px 0;
  background: transparent;
  white-space: nowrap;
  position: relative;
}

.logos:before,
.logos:after {
  position: absolute;
  top: 0;
  width: 250px;
  height: 100%;
  content: "";
  z-index: 2;
}

.logos:before {
  left: 0;
  background: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
}

.logos:after {
  right: 0;
  background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
}

.logos:hover .logos-slide {
  animation-play-state: paused;
}

.logos-slide {
  display: inline-block;
  animation: 35s slide infinite linear;
}

.logos-slide img {
  height: 70px;
  margin: 0 40px;
}