.elementor-3680 .elementor-element.elementor-element-rohqaqu:not(.elementor-motion-effects-element-type-background), .elementor-3680 .elementor-element.elementor-element-rohqaqu > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#01065F;}.elementor-3680 .elementor-element.elementor-element-rohqaqu > .elementor-container{max-width:1200px;}.elementor-3680 .elementor-element.elementor-element-rohqaqu{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:-62px;margin-bottom:-62px;padding:220px 0px 50px 0px;}.elementor-3680 .elementor-element.elementor-element-rohqaqu > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-3680 .elementor-element.elementor-element-71be480:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-3680 .elementor-element.elementor-element-71be480 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5F5F5;}.elementor-bc-flex-widget .elementor-3680 .elementor-element.elementor-element-71be480.elementor-column .elementor-widget-wrap{align-items:flex-end;}.elementor-3680 .elementor-element.elementor-element-71be480.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-end;align-items:flex-end;}.elementor-3680 .elementor-element.elementor-element-71be480 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-71be480 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-3680 .elementor-element.elementor-element-de70433 > .elementor-widget-container{margin:-160px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-e4862c9 > .elementor-element-populated{margin:0px 0px 0px 50px;--e-column-margin-right:0px;--e-column-margin-left:50px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3680 .elementor-element.elementor-element-bec8b90{text-align:start;}.elementor-3680 .elementor-element.elementor-element-bec8b90 .elementor-heading-title{color:#F5F5F5;}.elementor-3680 .elementor-element.elementor-element-89e371a > .elementor-widget-container{margin:0px 0px 10px 0px;}.elementor-3680 .elementor-element.elementor-element-89e371a{text-align:start;}.elementor-3680 .elementor-element.elementor-element-89e371a .elementor-heading-title{color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-3680 .elementor-element.elementor-element-df8d79d > .elementor-widget-container{margin:0px 0px 10px 0px;}.elementor-3680 .elementor-element.elementor-element-df8d79d{color:#F5F5F5;}.elementor-3680 .elementor-element.elementor-element-50ddf20{text-align:start;}.elementor-3680 .elementor-element.elementor-element-50ddf20 img{width:200px;filter:brightness( 200% ) contrast( 0% ) saturate( 93% ) blur( 0px ) hue-rotate( 0deg );}.elementor-3680 .elementor-element.elementor-element-49f0d18{--grid-template-columns:repeat(0, auto);--icon-size:14px;--grid-column-gap:12px;--grid-row-gap:0px;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-widget-container{text-align:left;}.elementor-3680 .elementor-element.elementor-element-49f0d18 > .elementor-widget-container{margin:20px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon{background-color:#BDBDBD;--icon-padding:0.6em;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon i{color:#424242;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon svg{fill:#424242;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon:hover{background-color:#FFFFFF;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon:hover i{color:#2D2D2D;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon:hover svg{fill:#2D2D2D;}.elementor-3680 .elementor-element.elementor-element-df6991b{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:61px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3680 .elementor-element.elementor-element-9582075{--display:flex;--min-height:25px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-3680 .elementor-element.elementor-element-9582075.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3680 .elementor-element.elementor-element-8ccc096{width:var( --container-widget-width, 129.907% );max-width:129.907%;--container-widget-width:129.907%;--container-widget-flex-grow:0;}.elementor-3680 .elementor-element.elementor-element-8ccc096.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-3680 .elementor-element.elementor-element-afb5f17{--display:flex;--min-height:25px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:-160px;--margin-right:0px;}.elementor-widget-media-carousel .elementor-carousel-image-overlay{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-3680 .elementor-element.elementor-element-d049ce6.elementor-skin-slideshow .elementor-main-swiper:not(.elementor-thumbnails-swiper){margin-bottom:10px;}.elementor-3680 .elementor-element.elementor-element-d049ce6 > .elementor-widget-container{margin:15px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-d049ce6 .elementor-main-swiper{height:131px;width:65%;}.elementor-3680 .elementor-element.elementor-element-d049ce6 .elementor-swiper-button{font-size:20px;}.elementor-3680 .elementor-element.elementor-element-d049ce6 .elementor-main-swiper:not(.elementor-thumbnails-swiper) .elementor-carousel-image{background-size:contain;}.elementor-3680 .elementor-element.elementor-element-ae71b58{--display:flex;--justify-content:space-evenly;--align-items:stretch;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:65px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3680 .elementor-element.elementor-element-ae71b58.e-con{--align-self:flex-start;--flex-grow:1;--flex-shrink:0;}.elementor-3680 .elementor-element.elementor-element-367671f{--display:flex;--justify-content:space-between;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-3680 .elementor-element.elementor-element-389557e .elementor-heading-title{color:#FF0000;}.elementor-widget-form .elementor-field-group > label, .elementor-widget-form .elementor-field-subgroup label{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group > label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-type-html{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-group .elementor-field{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group .elementor-field, .elementor-widget-form .elementor-field-subgroup label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-form .e-form__buttons__wrapper__button-next{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-button[type="submit"]{background-color:var( --e-global-color-accent );}.elementor-widget-form .e-form__buttons__wrapper__button-previous{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-message{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .e-form__indicators__indicator, .elementor-widget-form .e-form__indicators__indicator__label{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-form{--e-form-steps-indicator-inactive-primary-color:var( --e-global-color-text );--e-form-steps-indicator-active-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-completed-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-background-color:var( --e-global-color-text );--e-form-steps-indicator-progress-meter-color:var( --e-global-color-text );}.elementor-widget-form .e-form__indicators__indicator__progress__meter{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-3680 .elementor-element.elementor-element-25b365c > .elementor-widget-container{margin:20px 20px 20px 20px;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-25b365c.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:1;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group{padding-right:calc( 5px/2 );padding-left:calc( 5px/2 );margin-bottom:10px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-form-fields-wrapper{margin-left:calc( -5px/2 );margin-right:calc( -5px/2 );margin-bottom:-10px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group.recaptcha_v3-bottomleft, .elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-3680 .elementor-element.elementor-element-25b365c .elementor-labels-inline .elementor-field-group > label{padding-left:10px;}body:not(.rtl) .elementor-3680 .elementor-element.elementor-element-25b365c .elementor-labels-inline .elementor-field-group > label{padding-right:10px;}body .elementor-3680 .elementor-element.elementor-element-25b365c .elementor-labels-above .elementor-field-group > label{padding-bottom:10px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group > label{font-family:"Roboto", Sans-serif;font-size:20px;font-weight:bold;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-type-html{padding-bottom:0px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group .elementor-field, .elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-subgroup label{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:600;word-spacing:10px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;border-width:1px 1px 1px 1px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;border-width:1px 1px 1px 1px;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-button span{justify-content:center;}.elementor-3680 .elementor-element.elementor-element-25b365c .e-form__buttons__wrapper__button-next{background-color:#FF0000;color:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-button[type="submit"]{background-color:#FF0000;color:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .e-form__buttons__wrapper__button-previous{background-color:#FFD7D7;color:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-3680 .elementor-element.elementor-element-25b365c .elementor-button{border-radius:25px 25px 25px 25px;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-25b365c{--e-form-steps-indicators-spacing:24px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}.elementor-3680 .elementor-element.elementor-element-62aa86f{--display:flex;}.elementor-3680 .elementor-element.elementor-element-cb2c6ca .elementor-repeater-item-17d0ffa{flex-basis:80%;}.elementor-3680 .elementor-element.elementor-element-cb2c6ca .elementor-repeater-item-a9bb921{flex-basis:20%;}.elementor-3680 .elementor-element.elementor-element-cb2c6ca .elementor-repeater-item-268e8d3{flex-basis:100%;}.elementor-3680 .elementor-element.elementor-element-cb2c6ca .elementor-repeater-item-420e135{flex-basis:100%;}@media(max-width:1024px){.elementor-3680 .elementor-element.elementor-element-rohqaqu{padding:180px 60px 80px 60px;}.elementor-bc-flex-widget .elementor-3680 .elementor-element.elementor-element-71be480.elementor-column .elementor-widget-wrap{align-items:flex-start;}.elementor-3680 .elementor-element.elementor-element-71be480.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-start;align-items:flex-start;}.elementor-3680 .elementor-element.elementor-element-71be480 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-de70433 > .elementor-widget-container{margin:-150px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-de70433 img{width:40%;}.elementor-3680 .elementor-element.elementor-element-e4862c9 > .elementor-element-populated{margin:50px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-bec8b90{text-align:center;}.elementor-3680 .elementor-element.elementor-element-89e371a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-89e371a{text-align:center;}.elementor-3680 .elementor-element.elementor-element-df8d79d{text-align:center;}.elementor-3680 .elementor-element.elementor-element-50ddf20{text-align:center;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-widget-container{text-align:center;}.elementor-3680 .elementor-element.elementor-element-d049ce6.elementor-skin-slideshow .elementor-main-swiper:not(.elementor-thumbnails-swiper){margin-bottom:10px;}}@media(max-width:767px){.elementor-3680 .elementor-element.elementor-element-rohqaqu{padding:120px 35px 60px 35px;}.elementor-3680 .elementor-element.elementor-element-71be480 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-de70433 > .elementor-widget-container{margin:-100px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-de70433 img{width:80%;}.elementor-3680 .elementor-element.elementor-element-e4862c9 > .elementor-element-populated{margin:40px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-3680 .elementor-element.elementor-element-49f0d18 .elementor-social-icon{--icon-padding:0.8em;}.elementor-3680 .elementor-element.elementor-element-df6991b{--content-width:500px;--min-height:0px;}.elementor-3680 .elementor-element.elementor-element-d049ce6.elementor-skin-slideshow .elementor-main-swiper:not(.elementor-thumbnails-swiper){margin-bottom:10px;}}@media(min-width:768px){.elementor-3680 .elementor-element.elementor-element-71be480{width:35%;}.elementor-3680 .elementor-element.elementor-element-e4862c9{width:65%;}.elementor-3680 .elementor-element.elementor-element-df6991b{--content-width:1140px;}.elementor-3680 .elementor-element.elementor-element-9582075{--width:13.893%;}}@media(max-width:1024px) and (min-width:768px){.elementor-3680 .elementor-element.elementor-element-71be480{width:100%;}.elementor-3680 .elementor-element.elementor-element-e4862c9{width:100%;}}/* Start custom CSS for form, class: .elementor-element-25b365c */<

<h2>Soccer Team Selection (Choose 11 players)</h2>

<form id="teamForm">
  <ul>
    <!-- List of players with checkboxes -->
    <li>
      <input type="checkbox" name="players" value="Player 1" id="player1" onchange="updateSubstitutes()">
      <label for="player1">Player 1</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 2" id="player2" onchange="updateSubstitutes()">
      <label for="player2">Player 2</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 3" id="player3" onchange="updateSubstitutes()">
      <label for="player3">Player 3</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 4" id="player4" onchange="updateSubstitutes()">
      <label for="player4">Player 4</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 5" id="player5" onchange="updateSubstitutes()">
      <label for="player5">Player 5</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 6" id="player6" onchange="updateSubstitutes()">
      <label for="player6">Player 6</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 7" id="player7" onchange="updateSubstitutes()">
      <label for="player7">Player 7</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 8" id="player8" onchange="updateSubstitutes()">
      <label for="player8">Player 8</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 9" id="player9" onchange="updateSubstitutes()">
      <label for="player9">Player 9</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 10" id="player10" onchange="updateSubstitutes()">
      <label for="player10">Player 10</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 11" id="player11" onchange="updateSubstitutes()">
      <label for="player11">Player 11</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 12" id="player12" onchange="updateSubstitutes()">
      <label for="player12">Player 12</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 13" id="player13" onchange="updateSubstitutes()">
      <label for="player13">Player 13</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 14" id="player14" onchange="updateSubstitutes()">
      <label for="player14">Player 14</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 15" id="player15" onchange="updateSubstitutes()">
      <label for="player15">Player 15</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 16" id="player16" onchange="updateSubstitutes()">
      <label for="player16">Player 16</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 17" id="player17" onchange="updateSubstitutes()">
      <label for="player17">Player 17</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 18" id="player18" onchange="updateSubstitutes()">
      <label for="player18">Player 18</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 19" id="player19" onchange="updateSubstitutes()">
      <label for="player19">Player 19</label>
    </li>
    <li>
      <input type="checkbox" name="players" value="Player 20" id="player20" onchange="updateSubstitutes()">
      <label for="player20">Player 20</label>
    </li>
  </ul>

  <h3>Substitutes:</h3>
  <div id="substitutes">
    <!-- Remaining players will be shown here -->
  </div>

  <button type="submit">Send</button>
</form>

<script>
function updateSubstitutes() {
  const checkboxes = document.querySelectorAll('input[type="checkbox"][name="players"]');
  const selected = Array.from(checkboxes).filter(cb => cb.checked);
  const substitutesDiv = document.getElementById('substitutes');

  // Show all players first
  checkboxes.forEach(cb => {
    cb.parentElement.style.display = 'list-item';
 
    alert('You can only select up to 11 players.');
    // Uncheck the last checked checkbox
    selected[selected.length - 1].checked = false;
    return;
  }/* End custom CSS */