/*
Theme Name: Visma Child Theme WP6 (netvisorkyc.fi)
Template: vismaparent-6
Theme URI:
Description:
Author:
Version: 1
*/

/* utm grabber fix */

div.myModal, div.modal, div.modal-content {
 display:none!important;     
} 

/* gravity forms - start */


.ginput_recaptcha > div {
	margin-left: auto;
	margin-right: auto;
}



body .gform_wrapper.gravity-theme .gfield_label {
    font-weight: 400;

}

body .gform_wrapper.gravity-theme .gfield  input, .gform_wrapper.gravity-theme .gfield textarea, .gform_wrapper.gravity-theme .gfield select  {
/* width: 70%!important; */
/* max-width: 500px; */
height: 45px;
max-width: 100%;
background: #FBFCFD;
border: 1px solid #C7D8EF;
border-radius: 4px;
color: #003254;
font-size: 18px; 
letter-spacing: 1px;
margin: 0px 15px 15px 0;
padding: 10px;
}

body .gform_wrapper.gravity-theme .gfield_label {
font-size: 17px;
}


.gform_wrapper.gravity-theme .gfield select  {
color: #007ACA;  
}

body .gform_wrapper.gravity-theme .gfield input {
vertical-align:top!important;
}

.gform_wrapper.gravity-theme .gfield-choice-input + label {
vertical-align:top!important;
padding: 6px !important;
width: 90%;
}

.gform_wrapper.gravity-theme .gfield.consent .gfield_checkbox input[type="checkbox"]:checked + label {         
color:#48aa48;
}

body .gform_wrapper input[type=checkbox]:focus, body .gform_wrapper input[type=radio]:focus {
box-shadow: 0px 0px 0px #FFFFFF;
outline: 0px solid #ffffff;
}

div.gform_footer {
  display:inherit!important;
  text-align: center!important;
}

body .gform_wrapper .gform_footer input[type=submit] {
background-color: #59bb38!important;
}

body .gform_wrapper .gform_footer input[type=submit]:hover {
background-color: #4D9D31!important;
text-decoration:underline;
outline: 0px solid #ffffff;
border: 0px solid #ffffff!important;
}

body .gform_wrapper .gform_footer input[type=submit]:focus {
}


body .gform_wrapper textarea:focus, body .gform_wrapper input:focus {
box-shadow: 0px 2px 4px #ECE8FB;
outline: 1px solid #007ACA;
background: #EEF3F8!important;
}


body .gform_wrapper input[type=checkbox] {
outline: 10;
    }

body .gform_wrapper input[type=checkbox], body .gform_wrapper input[type=radio] {
  margin-right: 6px!important;
  margin-bottom:0px!important; 
height:33px!important;
   }


body .gform_wrapper input:hover, body .gform_wrapper textarea:hover, body .gform_wrapper select:hover
{
border: 1px solid #b5ceed!important;
background: #edf5fd!important;
}




/* gravity forms - end */



:root {
  --header-logo-margin-top: 0rem;
  --header-logo-margin-bottom: 0rem; 
  --header-logo-width: 9rem; 
  --header-logo-margin-right: calc(0.5 * var(--spacing));

  --footer--logo-width: 8rem;


--nav-toggle-bg-color: var(--color--secondary); /* mobiili ja padi menu ympyra */
--nav-toggle-color: var(--color--primary);  /* mobiili ja padi menu ympyran viivat */

--color--netvisorkyc1:                 #015F9E; 	/* primary 1, 95, 158 */
--color--netvisorkyc2:                 #FEDB00; 	/* secondary 254, 219, 0 */
--color--netvisorkyc5:                 #EDF2F8; 	/* tertiary  */

--color--netvisorkyc3:                 #007ACA; 	/* primary gradientin oikea paaty */
--color--netvisorkyc4:                 #FFBF3F;		/* secondary gradientin oikea paaty */
--color--netvisorkyc6:                 #C48000; 	/* tertiary gradientin oikea paaty */

--color--netvisorkyc7:                 #E0E9F0;		/* tertiary buttonin gradientin vaalee tumma */
--color--netvisorkyc8:                 #001E33;		/* primary buttonin gradientin tumma */

--color--black:                  #001E33;   /* normi oli #003254  */


/* --color--sign1:                  rgb(223, 0, 147); */ 	/* malli RGB asettamisesta*/

  --color--primary:            var(--color--netvisorkyc1);
  --color--primary--alt:       var(--color--netvisorkyc3);

  --color--primary--alt2:       var(--color--netvisorkyc8);  


  --color--secondary:          var(--color--netvisorkyc2);
  --color--secondary--alt:     var(--color--netvisorkyc4);

  --color--tertiary:           var(--color--netvisorkyc5);
  --color--tertiary--alt:      var(--color--netvisorkyc6);

  --color--tertiary--alt2:      var(--color--netvisorkyc7);


  --text--gradient--primary-1:        var(--color--primary);
  --text--gradient--primary-2:        var(--color--primary--alt);

  --text--gradient--secondary-1:       var(--color--secondary);
  --text--gradient--secondary-2:       var(--color--secondary--alt);

/*
  --text--gradient--secondary-1:       var(--color--french-blue);
  --text--gradient--secondary-2:       var(--color--dodger-blue);
*/
  --text--gradient--tertiary-1:       var(--color--tertiary);
  --text--gradient--tertiary-2:       var(--color--tertiary--alt);

  
  --button--color--primary:             var(--color--primary);
  --button--color--primary--active:     var(--color--primary--alt);
  --button--color--primary--shadow:     rgba(1, 95, 158, 0.20); /* varjo 20% opa */

  --button--color--secondary:             var(--color--secondary);
  --button--color--secondary--active:     var(--color--secondary--alt);
  --button--color--secondary--shadow:     rgba(254, 219, 0, 0.20); /* varjo 20% opa */


  --button--color--tertiary:             var(--color--tertiary);
  --button--color--tertiary--active:     var(--color--tertiary--alt);
  --button--color--tertiary--shadow:     rgba(255, 248, 204, 0.20); /* varjo 20% opa */

/* blue buttoni muuttaminen */
 --button--color--blue:             #0095F8; 
 --button--color--blue--active:     #007ACA; 
 --button--color--blue--shadow:     rgba(0, 122, 202, 0.20); /* varjo 20% opa default: --color--french-blue--a15*/



/* customim graidentti ei ole primary vareil */
  --bg--gradient--primary-1:        var(--color--dodger-blue);
  --bg--gradient--primary-2:        var(--color--french-blue);
  
  --bg--gradient--secondary-1:       var(--color--secondary);
  --bg--gradient--secondary-2:       var(--color--secondary--alt);

  --bg--gradient--tertiary-1:       var(--color--tertiary);
  --bg--gradient--tertiary-2:       var(--color--tertiary);
/*  --bg--gradient--tertiary-2:       var(--color--tertiary--alt); */


  /*
  --header-logo-width: 7.5rem;
  --header-logo-margin-right: calc(0.5 * var(--spacing));
  */
  
  /* variable overrides
  --color--primary:            var(--color--purple-heart);
  --color--primary--active:    var(--color--purple-heart--active);
  --color--primary--alt:       var(--color--medium-purple);
  --color--primary--a15:       var(--color--purple-heart--a15);

  --color--secondary:          var(--color--orange-peel);
  --color--secondary--active:  var(--color--orange-peel--active);
  --color--secondary--alt:     var(--color--radical-red);
  --color--secondary--a15:     var(--color--orange-peel--a-15);
  
  --color-heading: var(--color--black);
  --color-body: var(--color--black);

  --color-link: var(--color--french-blue);
  --color-link--hover: var(--color--dodger-blue);
  
  */


  --color-link: #0095F8;
  --color-link--hover: var(--color--primary--alt);



  --post--categories--bg-color: var(--color--soy-neutral-30); /* topic vari */


--pricing-item--1--color: #FFDD00;
--pricing-item--2--color: #FFBE3D;
--pricing-item--3--color: #0096FA;
--pricing-item--4--color: var(--color--black); /* #003253  */

--pricing-input--button-color: #007ACA; /* pricing +-  napit */

/* span */
--text--span-bg-color-light: #FEDB00;
--text--span-bg-color-dark: var(--color--black);
--text--span-color-light: var(--color--black);
--text--span-color-dark: #FEDB00;



}

/* pricing slider vali markkerit */
.pricing-grid__input .noUi-marker-horizontal.noUi-marker {
  background-color: #AAA;
}


.pricing-block.pricing-clento {
  --pricing-item--1--color:	hsl(52, 100%, 50%);
  --pricing-item--1--color-hover: hsl(185, 81%, 57%);

  --pricing-item--2--color: hsl(40, 100%, 62%);
  --pricing-item--2--color-hover: hsl(204, 100%, 39%);

  --pricing-item--3--color: hsl(204, 100%, 49%);
  --pricing-item--3--color-hover: hsl(320, 100%, 34%);
  
  --pricing-item--4--color:	hsl(204, 100%, 31%);   
  --pricing-item--4--colo-hoverr: hsl(204, 100%, 6%);   

   --pricing-item--recommended-color: var(--color--black);
}


.pricing-block.pricing-sign .pricing-card h3 {
padding-bottom: 0.75rem;
margin-bottom: 0.75rem;
border-bottom: 0px solid var(--pricing-item--color);
}

.pricing-block.pricing-sign .pricing-card hr.viiva {
margin-top: 0xp;
margin-bottom: 2rem;
border-bottom: 4px solid var(--pricing-item--color);
}

.pricing-block.pricing-sign .pricing-card p.mh {
margin-top: 0px;
margin-bottom: 1rem;
}



.ubermenu {
  --uber-header-color: #7592A6;
  --uber-divider-color: #7592A6;
}
.nav--light .ubermenu,
.ubermenu .menu-light {
  --uber-header-color: #7592A6;
  --uber-divider-color: #7592A6;
}

/* mobile login bg gradient */
body > .login-button {
  background: -webkit-gradient(linear,right top,left top,from(#007aca),to(var(--color--black)));
  background: -webkit-linear-gradient(right,#007aca,var(--color--black));
  background: -o-linear-gradient(right,#007aca,var(--color--black));
  background: linear-gradient(270deg,#007aca,var(--color--black));
}
body > .nav--light ~ .login-button {
  background: -webkit-gradient(linear,right top,left top,from(#007aca),to(var(--color--black)));
  background: -webkit-linear-gradient(right,#007aca,var(--color--black));
  background: -o-linear-gradient(right,#007aca,var(--color--black));
  background: linear-gradient(90deg,#007aca,var(--color--black));
}






/* :root { */

/* TEXT GRADIENT for SPAN */

.gradient-fill--primary, .gradient-fill-primary {
  color: var(--text--gradient--primary-2);
  background-image: linear-gradient(to bottom right, var(--text--gradient--primary-1), var(--text--gradient--primary-2));
}

.gradient-fill--secondary, .gradient-fill-secondary {
  color: var(--text--gradient--secondary-2);
  background-image: linear-gradient(to bottom right, var(--text--gradient--secondary-1), var(--text--gradient--secondary-2))!important;
}

.gradient-fill--tertiary, .gradient-fill-tertiary {
  color: var(--text--gradient--tertiary-2);
  background-image: linear-gradient(to bottom right, var(--text--gradient--tertiary-1), var(--text--gradient--tertiary-2))!important;
}


span.bg {
display: inline;
/* padding: 0.25em 0 0.1em 0; */
padding: 0.1em 0 0.1em 0;
padding-left: 0;
padding-right: 0;
color: var(--text--span-color-light)!important;
box-decoration-break: clone;
background-color: var(--text--span-bg-color-light, var(--color--white));
box-shadow:
0.125em 0 0 var(--text--span-bg-color-light, var(--color--white)),
-0.125em 0 0 var(--text--span-bg-color-light, var(--color--white));
}

span.bg--dark {
display: inline;
/* padding: 0.25em 0 0.1em 0; */
padding: 0.1em 0 0.1em 0;
padding-left: 0;
padding-right: 0;
color: var(--text--span-color-dark)!important;
box-decoration-break: clone;
background-color: var(--text--span-bg-color-dark, var(--color--white));
box-shadow:
0.125em 0 0 var(--text--span-bg-color-dark, var(--color--white)),
-0.125em 0 0 var(--text--span-bg-color-dark, var(--color--white));
}

span.bg-dark {
display: inline;
/* padding: 0.25em 0 0.1em 0; */
padding: 0.1em 0 0.1em 0;
padding-left: 0;
padding-right: 0;
color: var(--text--span-color-dark)!important;
box-decoration-break: clone;
background-color: var(--text--span-bg-color-dark, var(--color--white));
box-shadow:
0.125em 0 0 var(--text--span-bg-color-dark, var(--color--white)),
-0.125em 0 0 var(--text--span-bg-color-dark, var(--color--white));
}




.tag--blogi { 
  --tag-color: var(--color--black);
  --tag-bg-color: var(--color--secondary--alt); /* orange yellow */
}
.tag--asiakastarina, .tag--asiakastarinat {
  --tag-color: var(--color--black);
  --tag-bg-color: var(--color--secondary); /* saffron yellow */
}

.tag--oppaat {
  --tag-color: var(--color--white);
  --tag-bg-color: var(--color--dodger-blue);
}

.tag--webinaarit {
  --tag-color: var(--color--white);
  --tag-bg-color: #005F9E;
}



/*@media (min-width: 75em) {
  :root {
    --header-logo-width: 8.5rem;
  }
}*/


/*
.menu-netvisor {
  --main-nav--custom--bg-color: var(--color--primary);

}*/

/*
BUTTON STYLES

*/

/* ei ole maaritelty normaalisti tertiary butttonia */
/* noyton
 .button--tertiary {
  --button--color: var(--color--black);
  --button--bg-color: var(--button--color--tertiary);
  --button--bg-gradient: linear-gradient(103deg, var(--button--color--tertiary) 0%, var(--button--color--tertiary--active) 100%);
  --button--border-color: transparent;
  --button--shadow-color: var(--button--color--tertiary--shadow);
  
  --button--color--hover: var(--color--black);
  --button--bg-color--hover: transparent;
  --button--border-color--hover: transparent;
}

/* blue buttoni muuttaminen ylhaalla muuttujat 
.button--blue {
  --button--bg-color: var(--button--color--blue);
  --button--bg-gradient: linear-gradient(103deg, var(--button--color--blue) 0%, var(--button--color--blue--active) 100%);
  --button--shadow-color: var(--button--color--blue--shadow);
}
*/


.button--blue {
  --button--bg-color: var(--button--color--blue);
  --button--bg-gradient: linear-gradient(103deg, var(--button--color--blue) 0%, var(--button--color--blue--active) 100%);
  --button--shadow-color: var(--button--color--blue--shadow);
}



.button--primary {
/* gradientin kaanto toispain ja tumman lisays */
  --button--bg-color: var(--color--primary--alt2);
  --button--bg-gradient: linear-gradient(283deg, var(--color--soy-neutral-80) 0%, var(--color--primary--alt2) 100%);

  --button--color: var(--color--secondary);    
  --button--color--hover: var(--color--secondary);
}

.button--secondary {
/* gradientin kaanto toispain */
  --button--bg-gradient: linear-gradient(283deg, var(--color--secondary--alt) 0%, var(--color--secondary) 100%);

  --button--color: var(--color--black);    
  --button--color--hover: var(--color--black);
}

.button--tertiary {
/* 2 ekaa extrat napin taustaan */
  --button--bg-color: var(--color--tertiary);
  --button--bg-gradient: linear-gradient(103deg, var(--color--tertiary) 0%, var(--color--tertiary--alt2) 100%);

  --button--color:  var(--color--black);
  --button--color--hover:  var(--color--black);
}



.button--link--blue {
  --button--color var(--color--primary--alt);
  --button--color--hover: #005F9E;
}

/*
.button--link--primary {
  --button--color: var(--color--primary);
  --button--color--hover: var(--color--primary--alt);
}
*/
.button--link--primary {
  --button--color: var(--color-link);
  --button--color--hover: var(--color--primary--alt);
}

.button--link--secondary {
  --button--color: var(--color--secondary);
  --button--color--hover: var(--color--secondary--alt);
}


.button--link--tertiary  {
  --button--color: var(--color--tertiary);
  --button--color--hover: var(--color--tertiary--alt2);
}


.button--download.button--primary {
  --button--color: var(--color--primary);   
  --button--color--hover: var(--color--primary--alt);
}



/*



.button--primary {
  --button--color: var(--color--white);    
  --button--bg-color: var(--color--primary);
  --button--bg-gradient: linear-gradient(103deg, var(--color--primary) 0%, var(--color--primary--alt) 100%);
  --button--border-color: transparent;
  --button--shadow-color: var(--color--primary--a15);

  --button--color--hover: var(--color--white);
  --button--bg-color--hover: transparent;
  --button--border-color--hover: transparent;
}

.button--secondary {
  --button--color: var(--color--black);
  --button--bg-color: var(--color--secondary);
  --button--bg-gradient: linear-gradient(103deg, var(--color--secondary) 0%, var(--color--secondary--alt) 100%);
  --button--border-color: transparent;
  --button--shadow-color: var(--color--primary--a15);

  --button--color--hover: var(--color--black);
  --button--bg-color--hover: transparent;
  --button--border-color--hover: transparent;
}

.button--link--primary {
  --button--color: var(--color--maventa1);
  --button--color--hover: var(--color--maventa3);
}

.button--link--secondary {
  --button--color: #007ACA;
  --button--color--hover: #0095F8;
}

.button--link--tertiary  {
  --button--color: var(--color--maventa2);
  --button--color--hover: var(--color--maventa4);
}

*/

/*
TEXT GRADIENT

.gradient-fill--primary,
.gradient-fill-primary {
  color: var(--color--maventa1);
  background-image: linear-gradient(to bottom right, var(--color--maventa1), var(--color--maventa3));
}
.gradient-fill--secondary,
.gradient-fill-secondary {
  color: var(--color--maventa2);
  background-image: linear-gradient(to bottom right, var(--color--maventa2), var(--color--maventa4));
}
*/


@media (min-width: 75em) {
  :root {
    --header-logo-width: 10rem;
    --header-logo-margin-right: calc(3.5 * var(--spacing));
    --header-logo-margin-top: 0rem;
    --main-nav-height:6.5rem;
  }
}

@media (min-width: 75em) {
    .login-button, .support-button {
        height: var(--nav-item-height);
    }
}


:root {
  --section--first--padding-top: 4.5;
}
@media (min-width: 48em) {
  :root {
    --section--first--padding-top: 4.5;
  }
}
@media (min-width: 66em) {
  :root {
    --section--first--padding-top: 5;
  }
}



/* solution grey palette */
:root {
--color--soy-neutral-100: #001E33; /* Oxford Blue */
--color--soy-neutral-90: #003254; /* Prussian Blue */
--color--soy-neutral-80: #234F6D; /* Indigo Dye */
--color--soy-neutral-70: #466B84; /* Payne's Gray */
--color--soy-neutral-60: #7592A6; /* Bermuda Gray */
--color--soy-neutral-50: #AEC1CE; /* Bermuda Gray */
--color--soy-neutral-40: #C7D5DF; /* Columbia Blue */
--color--soy-neutral-30: #E0E9F0; /* Alice Blue */
--color--soy-neutral-20: #EDF2F8; /* Alice Light Blue */
--color--soy-neutral-10: #F7F9FC; /* White Lilac */

--integrations--ribbon--shadow-color: var(--integrations--color--blue-650);
--integrations--ribbon--color: var(--integrations--color--primary);
--img-border-bold-color: var(--color--soy-neutral-90);  /* image borderi vari */

}


.color--soy-neutral-100 {
  color: var(--color--soy-neutral-100);
}
.color--soy-neutral-90 {
  color: var(--color--soy-neutral-90);
}
.color--soy-neutral-80 {
  color: var(--color--soy-neutral-80);
}
.color--soy-neutral-70 {
  color: var(--color--soy-neutral-70);
}
.color--soy-neutral-60 {
  color: var(--color--soy-neutral-60);
}
.color--soy-neutral-50 {
  color: var(--color--soy-neutral-50);
}
.color--soy-neutral-40 {
  color: var(--color--soy-neutral-40);
}
.color--soy-neutral-30 {
  color: var(--color--soy-neutral-30);
}
.color--soy-neutral-20 {
  color: var(--color--soy-neutral-20);
}
.color--soy-neutral-10 {
  color: var(--color--soy-neutral-10);
}


.color--primary {
  color: var(--color--primary);
}

.color--secondary {
  color: var(--color--secondary);
}

.color--tertiary {
  color: var(--color--tertiary);
}

@media (min-width: 75em) {
    :root {
        --single-post--padding-top: 12rem;
    }
}


/* 375px */
@media (max-width: 23.4375em) {
  :root {
    --fontsize-body: 1rem;

    --fontsize-h1: 2.0rem;
    --fontsize-h2: 1.75rem;
    --fontsize-h3: 1.5rem;
    --fontsize-h4: 1.375rem;
    --fontsize-h5: 1.25rem;
    --fontsize-h6: 1.125rem;

    --fontsize-display-1: 2.5rem;
    --fontsize-display-1-calc: 2.5rem;

    --fontsize-display-2: 2.25rem;
    --fontsize-display-2-calc: 2.25rem;

    --fontsize-display-3: 2rem;
    --fontsize-display-3-calc: 2rem;

    --fontsize-display-4: 2rem;
    --fontsize-display-4-calc: 2rem;

    --fontsize-lead: 1.125rem;
    --fontsize-section-hero-lead: 1.125rem;
    --fontsize-page-hero-lead: 1.125rem;

 --header-logo-margin-right: calc(0.1 * var(--spacing));
  --header-logo-width: 7rem;

  }
}

/* 352px */
/*
@media (max-width: 22em) {
  :root {
    --header-logo-width: 6rem;
    --header-logo-margin-right: calc(0 * var(--spacing));
  }
}
*/

.gform_confirmation_message {
background-color: #E7FCED; text-align: center; padding: 3rem; width: 100%; color: #008D4C; border-radius: 20px; 
}



/* blogin kirjottajan bg */
.single__author img {
        background: var(--color--soy-neutral-20);
}


/* SF kalenterin korjaukset */

/* alku boxin kavennus */
	.slds-visual-picker_vertical .slds-visual-picker__figure {
            height: inherit !important;
        }

        .runtime_appointmentbookingFlowLocation .slds-visual-picker_vertical {
            display: inline-flex !important;
        }


/* Napeista teeman tyylejä pois päältä */
.slds-scope .slds-button {
  min-height: 0;
  min-width: 0 !important;
}
.slds-scope .slds-button:before,
.slds-scope .slds-button:after {
  content: none;
}
/* poistaa välilehdistä aktiivisen linkin alleviivauksen */
.slds-scope a:active,
.slds-scope a:focus {
  text-decoration: none;
}
/* Korjaa yli vuotavat text gradient -määritykset otsikon sisäiselle spanille */
.slds-scope .slds-page-header__title {
  background-image: none;
  background-clip: unset;
  color: inherit;
  -webkit-text-fill-color: unset;
}
/* Poistaa tekstin sisäiselle spanille määritetyn värin */
.slds-scope p span {
  color: inherit;
}

/* korjataan neutral buttonin hover, Tänään-nappi */
.section-content .slds-scope .slds-button_neutral:hover, .section-content .slds-scope .slds-button_neutral:focus, .section-content .slds-scope .slds-button--neutral:hover, .section-content .slds-scope .slds-button--neutral:focus {
  --slds-c-button-color-background-hover: rgb(255,255,255);
  --slds-c-button-color-border-hover: rgb(255,255,255);
}


/* popup-kalenterin kuukauden nimet */
.runtime_appointmentbookingFlowTimeslot th {
  font-size: 13px;
}
/* popup-kalenterin päivien numerot */
.runtime_appointmentbookingFlowTimeslot td {
  font-size: 13px;
}

/* ajan pituuden ruksin koko */
.slds-scope .slds-visual-picker input:checked ~ label .slds-visual-picker__text::after {
border-width: 1.2rem!important;
}



#data-lightning-out, #data-lightning-out:empty {           
  position: relative;
  min-height: 350px;    
}
#data-lightning-out:empty:before {
  position: absolute;                    
  display: inline-flex;                      
  left: 50%;
  top: 50%;             
  transform: translateX(-50%) translateY(-50%);
  font-size: 1.25rem;
  text-align: center;   
  letter-spacing: 0.01em;             
  font-weight: 700;
  animation: loader-text-anim 3000ms ease-in-out infinite;
}
[lang="fi"] #data-lightning-out:empty:before {
  content: "Ladataan kalenteria...";
}                         

@keyframes loader-text-anim {
        0% {                  
    opacity: 0;
        }                
        50% {
    opacity: 1;
        }
        100% {
    opacity: 0;
        }
}        


/* Koko radio-ryhmä flexiksi */
.gform_wrapper.gravity-theme .gchoise--large .gfield_radio,
.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
}

/* Yksittäinen vaihtoehto */
.gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice,
.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice {
  position: relative;
  display: flex;
	flex-basis: auto;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid #c7d8ef;
  border-radius: 6px;
  background-color: #fbfcfd;
  flex: 1 1 205px;           /* venyy, mutta minimi noin 260px */
  min-height: 120px;
  box-sizing: border-box;
  padding: 20px 20px 20px 45px;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* Hover-tila */
.gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice:hover,
.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice:hover {
  background-color: #f0f6ff;
  border-color: #8ab5e1;
}

/* Radio näkyviin */
.gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice input[type="radio"],
.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice input[type="checkbox"] {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
  accent-color: #3376cc;
}

/* Valittu tila */
@supports(selector(:has(*))) {
  .gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice:has(input[type="radio"]:checked),
	.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice:has(input[type="checkbox"]:checked) {
    background-color: #d8e8ff;
    border-color: #4a90e2;
  }
}

/* Label koko laatikolle */
.gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice label,
.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice label {
  display: block;
  width: 100%;
  cursor: pointer;
  color: #002d4f;
  line-height: 1.4;
}

/* --- RESPONSIVISET SÄÄNNÖT --- */

/* 2 saraketta tableteilla ja pienillä näytöillä */
@media (max-width: 900px) {
  .gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice,
	.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice {
    flex: 1 1 calc(50% - 10px); /* kaksi rinnakkain */
  }
}

/* 1 sarake mobiilissa (täysleveä) */
@media (max-width: 600px) {
  .gform_wrapper.gravity-theme .gchoise--large .gfield_radio > .gchoice,
	.gform_wrapper.gravity-theme .gchoise--large .gfield_checkbox > .gchoice {
    flex: 1 1 100%;
  }
}