/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */



body .gform_wrapper .gfield_radio li {
  display: inline-block;   /* Zet de lijstitems naast elkaar */
  margin-right: 20px;      /* Ruimte tussen de opties */
}

body .gform_wrapper .gfield_radio {
  display: flex;           /* Houdt alles netjes in een rij */
  flex-wrap: wrap;         /* Laat de opties doorlopen op de volgende regel als er weinig ruimte is */
}
body .gform_wrapper .gfield_radio li label {
  display: inline-block;
  margin-left: 5px; /* ruimte tussen bolletje en tekst */
}


.ginput_container_radio .gfield_radio .gchoice{
	float:left;
	width:auto;
	padding-right:15px;
	height:auto;
	}
.gform-theme--framework .gfield--type-choice .gfield_checkbox, .gform-theme--framework .gfield--type-choice .gfield_radio {
    display: flex;
    flex-direction: inherit;
    gap: var(--gf-field-choice-gap);
    text-align:center;
}

.gform-theme--framework .gfield--type-choice .gfield_checkbox, .gform-theme--framework .gfield--type-choice .gfield_radio img{
	height:50px;
	width:100%;
	text-align:center;
	}


.repeater-field-item{
	background:#F0F8FF;
	padding:2%;
	border-radius:12px;
	}
.gform-theme--foundation .gfield textarea.large {
    min-block-size: 8rem;
    border-radius: 10px;
}
.gform-theme--foundation .gfield .ginput_password, .gform-theme--foundation .gfield input, .gform-theme--foundation .gfield select {
    border-radius: 10px;
}
#gform_fields_1.gform_page .gform-theme--api, #gform_fields_1.gform_page .gform-theme--framework {
    --gf-ctrl-choice-check-color: var(--gf-color-in-ctrl-primary);
    --gf-ctrl-choice-check-color-disabled: rgba(var(--gf-color-in-ctrl-contrast-rgb), 0.2);
    --gf-ctrl-choice-size-sm: 0px;
    --gf-ctrl-choice-size-md: 0px;
    --gf-ctrl-choice-size-lg: 0px;
    --gf-ctrl-choice-size-xl: 0px;
    --gf-ctrl-choice-size: var(--gf-ctrl-choice-size-md);
    --gf-ctrl-checkbox-check-radius: var(--gf-ctrl-radius-max-sm);
    --gf-ctrl-checkbox-check-size-sm: 12px;
    --gf-ctrl-checkbox-check-size-md: initial;
    --gf-ctrl-checkbox-check-size-lg: 15px;
    --gf-ctrl-checkbox-check-size-xl: 19px;
    --gf-ctrl-checkbox-check-size: var(--gf-ctrl-checkbox-check-size-md);
    --gf-ctrl-radio-check-radius: 0%;
    --gf-ctrl-radio-check-content: "";
    --gf-ctrl-radio-check-size-sm: 0px;
    --gf-ctrl-radio-check-size-md: 0px;
    --gf-ctrl-radio-check-size-lg: 0px;
    --gf-ctrl-radio-check-size-xl: px;
    --gf-ctrl-radio-check-size: var(--gf-ctrl-radio-check-size-md);
}

body .gform_wrapper #field_1_1{
	float:left;
	width:100%;
	height:auto;
	margin-top:25px;
	padding-bottom:25px;
	border-bottom:dotted 1px #ccc;
	
	}
	




body .gform_wrapper #field_1_1 input[type="radio"] {
  display: none !important;
}

/* Labels stylen alleen binnen #field_1_1 */
body .gform_wrapper #field_1_1 .gfield_radio li label {
  cursor: pointer;
  display: inline-block;
  text-align: center;
  border: 2px solid #ddd;
  border-radius: 8px;
  padding: 10px;
  transition: all 0.2s ease;
}

/* Hover effect */
body .gform_wrapper #field_1_1 .gfield_radio li label:hover {
  border-color: #666;
}

/* Geselecteerde optie highlighten */
body .gform_wrapper #field_1_1 input[type="radio"]:checked + label {
  border-color: #0073aa;
  background-color: #f0f8ff;
}

.gform-theme--foundation {
    --gf-form-gap-y: 20px;
   }


.gfield_label.gform-field-label{
	font-size:20px;
	font-weight:600;
	}

.gfield_description.instruction{
	display:none;
	}


.ic-theme--simple .image-choices-choice-image-wrap, .ic-theme--simple .image-choices-choice-image-wrap:after {
    display: block;
    width: 40%;
    height: var(--ic-height);
    border-radius: 8px;
}

	
.vierkant{
	height:25px;
	width:25px;
	background:red;
}






/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {

.vierkant{
	background:pink;
}

}




/* #Desktop - Large
================================================== */
@media only screen and (min-width: 1140px) {

.vierkant{
	background:blue;
}
}


/* #Desktop - Extra Large
================================================== */
@media only screen and (min-width: 1340px) {

.vierkant{
	background:orange;
}
}


/* #Desktop - Mega Large
================================================== */
@media only screen and (min-width: 1600px) {

.vierkant{
	background:purple;
}
}

/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px, Gutter: 30px, Unit: 32px */
@media only screen and (min-width: 768px) and (max-width: 989px) {


.vierkant{
	background:aqua;
}
}


/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {


}


/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {


}