#gsm-enter-banner{display: none; position: fixed; width: 80%; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #1A2529; padding: 100px; text-align: center; z-index: 9999; color: white; font-size: 20px; font-weight: 200; border-radius: 10px;}
#gsm-enter-banner .gsm-enter-banner-close{ position: absolute; top: 10px; right: 10px; font-size: 30px; color: white; cursor: pointer;}
#gsm-enter-banner-bg{display: none;  content:""; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.8); z-index: 9998; backdrop-filter: blur(10px);}
.a-gsm-enter{background-color: #1A2529; text-align: center; box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
    border-radius: 10px; padding: 20px; color: white;}
#gsm-enter-banner h3, .a-gsm-enter h3{font-size: 40px; color: white; margin: 0 0 50px 0; padding: 0;  }
#gsm-enter-banner .gsm-input-form input[type=text],
#gsm-enter-banner .gsm-validate-number input[type=text],
.a-gsm-enter .gsm-input-form input[type=text],
.a-gsm-enter .gsm-validate-number input[type=text]
{appearance: none; width: 400px; background: transparent; color: white; border: none; border-bottom: 1px solid white; text-align: center; font-size: 24px; padding: 10px;}
.gsm-input-form .interests{margin: 50px 0; }
.gsm-input-form .interests span{}
.gsm-input-form .interests label{margin: 0 10px;}
.gsm-enter-banner-button button,
.gsm-validate-number button{appearance: none; background: #DB1D07; border: none; color: white; font-size: 18px; padding: 8px; text-align: center; width: 200px; border-radius: 3px; }
.gsm-validate-number{text-align: center; display: none; }
.gsm-validate-number button{display: block;  margin: 50px auto 0 auto;}
.gsm-thank-you{display: none; text-align: center; margin-top: 50px; font-size: 24px; font-weight: bold;  }

.a-gsm-enter .gsm-input-form input[type=text]::placeholder{color: white;}

#gsm-enter-banner .control,
.a-gsm-enter .control{
    font-family: arial;
    display: inline-block;
    position: relative;
    padding-left: 40px;
    margin-bottom: 5px;
    padding-top: 5px;
    cursor: pointer;
    font-size: 16px;
}
#gsm-enter-banner .control input,
.a-gsm-enter .control input{
    position: absolute;
    z-index: -1;
    opacity: 0;
}
#gsm-enter-banner .control_indicator,
.a-gsm-enter .control_indicator{
    position: absolute;
    top: 2px;
    left: 0;
    height: 30px;
    width: 30px;
    background: #1a2529;
    border: 1px solid #ffffff;
    border-radius: 0px;
}
#gsm-enter-banner .control:hover input ~ .control_indicator,
#gsm-enter-banner .control input:focus ~ .control_indicator,
.a-gsm-enter .control:hover input ~ .control_indicator,
.a-gsm-enter .control input:focus ~ .control_indicator{
    background: #1a2529;
}

#gsm-enter-banner .control input:checked ~ .control_indicator,
.a-gsm-enter .control input:checked ~ .control_indicator{
    background: #ffffff;
}
#gsm-enter-banner .control:hover input:not([disabled]):checked ~ .control_indicator,
#gsm-enter-banner .control input:checked:focus ~ .control_indicator,
.a-gsm-enter .control:hover input:not([disabled]):checked ~ .control_indicator,
.a-gsm-enter .control input:checked:focus ~ .control_indicator{
    background: #ffffff;
}
#gsm-enter-banner .control input:disabled ~ .control_indicator,
.a-gsm-enter .control input:disabled ~ .control_indicator{
    background: #e6e6e6;
    opacity: 0.6;
    pointer-events: none;
}
#gsm-enter-banner .control_indicator:after,
.a-gsm-enter .control_indicator:after{
    box-sizing: unset;
    content: '';
    position: absolute;
    display: none;
}
#gsm-enter-banner .control input:checked ~ .control_indicator:after,
.a-gsm-enter .control input:checked ~ .control_indicator:after{
    display: block;
}
#gsm-enter-banner .control-checkbox .control_indicator:after,
.a-gsm-enter .control-checkbox .control_indicator:after{
    left: 9px;
    top: 4px;
    width: 9px;
    height: 14px;
    border: solid #1a2529;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
#gsm-enter-banner .control-checkbox input:disabled ~ .control_indicator:after,
.a-gsm-enter .control-checkbox input:disabled ~ .control_indicator:after{
    border-color: #7b7b7b;
}


@media (max-width:800px) {
    #gsm-enter-banner{width: 90%; padding: 50px 30px;}
    #gsm-enter-banner h3{font-size: 30px;}
    #gsm-enter-banner .gsm-input-form input[type=text], #gsm-enter-banner .gsm-validate-number input[type=text],
    .a-gsm-enter .gsm-input-form input[type=text], .a-gsm-enter .gsm-validate-number input[type=text] {width: 100%; font-size: 20px;}
    #gsm-enter-banner .gsm-input-form .interests{display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto;
        gap: 10px;
        font-size: 15px;
    }
    #gsm-enter-banner .gsm-input-form .interests span{grid-column: 1 / 2; grid-row: 1 / 2;}
    #gsm-enter-banner .gsm-input-form .interests label:first-of-type{grid-column: 2 / 3; grid-row: 1 / 2;}
    #gsm-enter-banner .gsm-input-form .interests label:last-of-type{grid-column: 2 / 3; grid-row: 2 / 3;}
    #gsm-enter-banner .control{font-size: 15px;}


}

@media (max-width:450px) {
    #gsm-enter-banner h3{font-size: 26px;}
}