/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/

::selection {
    background-color: var(--button_gradient_top_color) !important; /* verander naar de kleur die je wilt */
    color: #ffffff; /* kies een kleur voor de tekst */
  }
  
  ::-moz-selection {
    background-color: var(--button_gradient_top_color) !important; /* verander naar de kleur die je wilt voor Firefox */
    color: #ffffff; /* kies een kleur voor de tekst voor Firefox */
  }

@media screen and (max-width: 640px) {
	h1 {
		font-size: 60px !important;
		line-height: 1 !important;
	}
	
	h2 {
		font-size: 50px !important;
		line-height: 1 !important;
	}
}

.fusion-li-item .icon-wrapper .fusion-li-icon {
	background-image: url('/wp-content/uploads/2024/10/4hkzeu5lepdm1ypodpi.svg');
	background-repeat: no-repeat;
	background-size: contain;
	width: 24px; /* Pas de breedte aan zoals nodig */
	height: 24px; /* Pas de hoogte aan zoals nodig */
	display: inline-block;
	content: "";
	font-size: 0; /* Verbergt het standaard icoon */
}
.fusion-panel.fusion-toggle-no-divider.fusion-toggle-boxed-mode.panel-default.fusion-faq-post {border-radius: 20px;}

.blob {
    position: absolute;
    aspect-ratio: 1 / 1;
    background: #50CDD6;
    opacity: .4;
    filter: blur(136px);
    border-radius: 50%;
    z-index: -1;
}

.blob.blob1 {
	height: 90vh;
    left: -20%;
}

.blob.blob2 {
    height: 500px;
    right: 0;
}

.image-stack{
	max-width: 571px;
	position: relative;
}

.image-stack img{position: absolute;}
.image-stack .img1{right: 0;bottom: 20%;z-index: 1;}
.image-stack .img2{
	position: absolute;
    right: -1px;
    bottom: -1px;
    max-width: 100%;
    aspect-ratio: 571 / 628;
    height: auto;
}
.image-stack .background{
	width: 100%;
	aspect-ratio: 1 / 1;
	background-color: #a7c1b4;
	border-radius: 50%;
} 

/* Gravity Forms */
textarea#input_1_5 {
    border-radius: 15px;
}
body .gform_wrapper ::placeholder,
body .gform_wrapper ::-webkit-input-placeholder,
body .gform_wrapper input[placeholder] {
  font-size: 16px;
  font-weight:900;
  padding-left: 10px;
}
.gform_button {
    background: var(--button_gradient_top_color) !important;
    color: var(--button_accent_color) !important;
    border-color: var(--button_border_color) !important;
	padding-top: var(--button_padding-top, 13px) !important;
    padding-right: var(--button_padding-right, 29px) !important;
    padding-bottom: var(--button_padding-bottom, 13px) !important;
    padding-left: var(--button_padding-left, 29px) !important;
    line-height: var(--button_line_height, 1) !important;
    font-size: var(--button_font_size, 14px) !important;
	text-transform: var(--button_text_transform) !important;
    transition: all .2s !important;
	border-radius: var(--button-border-radius-top-left, 0) var(--button-border-radius-top-right, 0) var(--button-border-radius-bottom-right, 0) var(--button-border-radius-bottom-left, 0) !important;
	font-family: var(--button_typography-font-family) !important;
    font-weight: var(--button_typography-font-weight) !important;
}
.gform_button:hover {
	background: var(--button_gradient_top_color_hover) !important;
}
/* Stijlen voor de Volgende knop */
.gform_next_button.gform-theme-button.button {
    background: var(--button_gradient_top_color) !important;
    color: var(--button_accent_color) !important;
    border-color: var(--button_border_color) !important;
    padding-top: var(--button_padding-top, 13px) !important;
    padding-right: var(--button_padding-right, 29px) !important;
    padding-bottom: var(--button_padding-bottom, 13px) !important;
    padding-left: var(--button_padding-left, 29px) !important;
    line-height: var(--button_line_height, 1) !important;
    font-size: var(--button_font_size, 14px) !important;
    text-transform: var(--button_text_transform) !important;
    transition: all .2s !important;
    border-radius: var(--button-border-radius-top-left, 0) var(--button-border-radius-top-right, 0) var(--button-border-radius-bottom-right, 0) var(--button-border-radius-bottom-left, 0) !important;
    font-family: var(--button_typography-font-family) !important;
    font-weight: var(--button_typography-font-weight) !important;
}

.gform_next_button.gform-theme-button.button:hover {
    background: var(--button_gradient_top_color_hover) !important;
}

/* Stijlen voor de Vorige knop */
.gform_previous_button.gform-theme-button.gform-theme-button--secondary.button {
    background: #fff !important;
    color: var(--button_accent_color) !important;
    border-color: var(--button_border_color) !important;
    padding-top: var(--button_padding-top, 13px) !important;
    padding-right: var(--button_padding-right, 29px) !important;
    padding-bottom: var(--button_padding-bottom, 13px) !important;
    padding-left: var(--button_padding-left, 29px) !important;
    line-height: var(--button_line_height, 1) !important;
    font-size: var(--button_font_size, 14px) !important;
    text-transform: var(--button_text_transform) !important;
    transition: all .2s !important;
    border-radius: var(--button-border-radius-top-left, 0) var(--button-border-radius-top-right, 0) var(--button-border-radius-bottom-right, 0) var(--button-border-radius-bottom-left, 0) !important;
    font-family: var(--button_typography-font-family) !important;
    font-weight: var(--button_typography-font-weight) !important;
}

.gform_previous_button.gform-theme-button.gform-theme-button--secondary.button:hover {
    background: var(--button_gradient_top_color_hover) !important;
}


div#gform_1_validation_container {
    display: none;
}
.gfield_validation_message {
	background: none !important;
    border: none !important;
    text-align: left !important;
    font-size: 12px !important;
    margin-top: -15px !important;
    margin-left: 28px !important;
}

.track-record {
    box-sizing: border-box;
    background-color: black;
    color: white;
    font-family: Arial, sans-serif;
    padding: 10px;
    border-radius: 20px;
    display: block; /* Zorgt dat het de volledige ruimte van de '.slick-slide' inneemt */
    width: 100%; /* Zorgt dat het zich aanpast aan de parent container */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.6);
    margin-bottom: 20px; /* Ruimte onder elke record */
}

.slick-slide {
    display: inline-block; /* of 'block' afhankelijk van hoe je wilt dat ze verschijnen */
    width: auto; /* Belangrijk als 'inline-block' wordt gebruikt */
    height: auto; /* Zorg ervoor dat dit niet beperkt wordt als je dynamische hoogtes hebt */
    margin: 0 5px; /* Voeg ruimte toe tussen de slides */
}

.records-carousel .track-record {
    margin-right: 15px !important;
    margin-bottom: 20px !important;
}
.record-header {
    display: flex;
    align-items: center;
}

.record-icon {
    width: 70px; /* Pas aan op basis van je werkelijke icoon grootte */
    margin-right: 10px;
}

.record-info {
    display: flex;
    flex-direction: column;
}
span.cat-data {
    min-height: 70px;
}
.record-title {
    font-size: 18px;
    font-weight: bold;
    white-space: normal; /* Zorgt ervoor dat de tekst kan afbreken */
    word-wrap: break-word; /* Breekt lange woorden af om overloop te voorkomen */
}

.record-details {
    font-size: 14px;
    text-align: left;
    margin-top: 5px;
}

.record-details span {
    display: block;
}

@media (max-width: 1024px) {
    .track-record {
        width: 33.33%; /* 3 items per rij */
    }
}

@media (max-width: 600px) {
    .track-record {
        width: 50%; /* 2 items per rij */
    }
}

@media (max-width: 480px) {
    .track-record {
        width: 100%; /* 1 item per rij */
    }
}
/* Algemene stijl voor beide pijlen */
.slick-prev, .slick-next {
    background: transparent;
    color: black;
    border: none;
    width: 40px;
    height: 40px;
    z-index: 25;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

/* Specifieke stijl voor de vorige (links) pijl */
.slick-prev {
    left: -40px;
}

/* Specifieke stijl voor de volgende (rechts) pijl */
.slick-next {
    right: -40px;
}

/* Verander de pijliconen - Gebruik een eigen icoon */
.slick-prev:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url('/wp-content/uploads/2024/10/right-arrow.svg') no-repeat center center;
    background-size: contain;
    transform: scaleX(-1); /* Spiegel het icoon voor de vorige pijl */
    color: transparent !important;
}

.slick-next:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url('https://robert.conversie.partners/wp-content/uploads/2024/10/right-arrow.svg') no-repeat center center;
    background-size: contain;
    color: transparent !important;
}