gicolek

/** this part of the code makes the background of our template yellow **/
.c-custom-template-wrap--yellow .wpcf7-form-control-wrap input, 
.c-custom-template-wrap--yellow .wpcf7-form-control-wrap textarea,
.c-custom-template-wrap--yellow .wpcf7-submit {
	background-color: #ffffd5;
    color: black;
}

/** this part of the code, divides the HTML elements into two groups **/
.c-custom-template-wrap .c-custom-template {

gicolek

/** this part of the code makes the background of our template blue **/
.c-custom-template-wrap--blue {
    background-color: #338cd0;
    padding: 20px;
    border-radius: 20px;
}

/** this part of the code, divides the HTML elements into two groups **/
.c-custom-template-wrap .c-custom-template {
    display: grid;

gicolek

<div class="c-custom-template-wrap c-custom-template-wrap--blue">
  <div class="c-custom-template">
    <div class="c-custom-template__col">
    <label> Your name
        [text* your-name akismet:author autocomplete:name] </label>

    <label> Your email
        [email* your-email akismet:author_email autocomplete:email] </label>
    </div>
    <div class="c-custom-template__col">

gicolek

<?php
add_action( 'gform_after_submission', 'gf_set_country_field_value', 10, 2 );

/**
* Set the field value of the user country field
*
* @hook gform_after_submission
**/
function gf_set_country_field_value( $entry, $form ) {
    $ip      = rgar( $entry, 'ip' );

gicolek

.c-grid {
	display: grid;
	grid-template-columns: 50% 50%;
	gap: 10px;
}
		
.c-grid--three {
	grid-template-columns: 33% 33% 33%;
}
		

gicolek

<div class="c-grid">
  <div>
  <label> Name*
      [text* your-name akismet:author autocomplete:name] </label>
  </div>
  <div>
  <label> Email*
      [email* your-email akismet:author_email autocomplete:email] </label>
  </div>
  </div>

gicolek

.wpcf7-styled {
	padding: 25px;
	background: #fafafa;
	border-radius: 25px;
}
		
.wpcf7-styled .wpcf7-radio input[type="radio"] {
	display: none;
	opacity: 0;
}

gicolek

.wpcf7-styled {
	padding: 25px;
	background: #fafafa;
	border-radius: 25px;
}

gicolek

<h4> About You </h4>
<label> Name*
    [text* your-name akismet:author autocomplete:name] </label>

gicolek

<!-- Contact Form 7 Markup -->
<h4> About You </h4>
<div class="c-grid">
<div>
<label> Name*
    [text* your-name akismet:author autocomplete:name] </label>
</div>
<div>
<label> Email*
    [email* your-email akismet:author_email autocomplete:email] </label>