*{
    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: new-hero, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-display:swap;
}

html {
    margin: 0!important;
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-family: new-hero, sans-serif;
    font-weight: 400;
    font-style: normal;
    background:#e9e9e9;
    font-display:swap;
}

.button_red{background:red; color:#fff;}
.button_red:hover{background:darkred !important;}
.response_cont{width:100%; margin-top:1rem;  display:flex; justify-content:flex-start; align-items:center; color:#fff; font-size:16px; padding:0px 1rem; border-radius:5px;}
.response_cont_green{background:green; height:44px; margin-bottom:1rem;}
.response_cont_red{background:red; height:44px; margin-bottom:1rem;}
header{z-index:9999999;}
input[disabled="true"]{background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));}
.gdrp_cont{border:solid thin #999; width:100%; height:200px; overflow-y:auto; padding:1rem;}
.gdrp_check{width:100%; display:flex; justify-content:flex-start; align-items:center; gap:5px;}
input[name="gdrp"]{width:18px; height:18px;}

.hide_button{display:none !important;}
.buttons_cont{display:flex; justify-content:flex-start; align-items:center; gap:1rem; flex-wrap:Wrap;}
@media screen and (min-width: 1280px) {
    body{margin:0; padding:0; overflow-x: hidden;}

    .top_bar{background:#2e2c7f; height:30px; width:100%;}
    .top_bar .container{width:1240px; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:center;}

    header{position:fixed; top:0px; left:0px; background:#fff; width:100%; display:flex; justify-content:center; align-items:center; flex-direction:column;}
    header .container{width:1240px; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:center;}
    h2{width:100%; text-align:left; font-weight:bold;}
    p{font-size:16px; line-height:20px; margin-bottom:1rem;}
    .wrapper{width:100%; padding-top:150px; display:flex; justify-content:center; align-items:Center; margin:2rem 0px;}
    .wrapper .container{width:1000px; min-height:calc(100vh - 450px); margin-bottom:4rem; display:flex; justify-content:center; align-items:Center; flex-direction:column;}
    .form_cont{width:100%; gap:1rem; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;}
    .form_item{width:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; margin-bottom:1rem;}
    .form_item_half{width:calc(50% - .5rem);}
    .form_item_third{width:calc((100% / 3) - .67rem);}
    .form_item label{margin-bottom:.5rem;}
    .form_item label span{color:red;}
    input{width:100%; height:44px; border:solid thin #999; border-radius:0px; outline:none; padding:0px 1rem;}
    select{width:100%; height:44px; border:solid thin #999; border-radius:0px; outline:none; padding:0px 1rem;}
    select[disabled="true"]{background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));}
    input:focus{border:solid 2px #2e2c7f;}
    select:focus{border:solid 2px #2e2c7f;}
    .error{font-size:12px; margin-top:.5rem; color:red;}
    .button{cursor:pointer; width:max-content; font-weight:300; height:33px; display:flex; justify-content:center; align-items:center; font-size:14px; padding:0px 1rem; border-radius:5px;}
    .button_green{background:green; color:#fff;}
    .button_green:hover{background:darkgreen;}
    .button_big{height:44px; padding:0px 2rem;}

    .members{width:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap; gap:1rem;}
    .member{width:100%; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:1rem;}
    .member_inner{width:calc(100% - 80px); gap:1rem; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;}
    .member:before{content:attr(data-item); width:44px; height:44px; border:solid 4px #999; border-radius:100px; display:flex; justify-content:center; align-items:center; font-size:22px; font-weight:bold; color:#999;}

    .gdrp_form{width:500px; border-radius:15px; padding:2rem;}
    .login_form{width:500px; background:rgba(255,255,255,.7); border-radius:15px; padding:2rem;}
    footer{background:#999; width:100%; min-height:200px; display:flex; justify-content:center; align-items:center;}
    footer .container{width:1240px; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:flex-start; gap:1rem;}
    footer h2{color:#fff; font-size:18px;}
}

@media screen and (max-width: 1279px) and (min-width: 768px) {
    body{margin:0; padding:0; overflow-x: hidden;}

    .top_bar{background:#2e2c7f; height:30px; width:100%;}
    .top_bar .container{width:720px; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:center;}

    header{position:fixed; top:0px; left:0px; background:#fff; width:100%; display:flex; justify-content:center; align-items:center; flex-direction:column;}
    header .container{width:720px; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:center;}
    h2{width:100%; text-align:left; font-weight:bold;}
    p{font-size:16px; line-height:20px; margin-bottom:1rem;}
    .wrapper{width:100%; padding-top:150px; display:flex; justify-content:center; align-items:Center; margin:2rem 0px;}
    .wrapper .container{width:720px; min-height:calc(100vh - 450px); margin-bottom:4rem; display:flex; justify-content:center; align-items:Center; flex-direction:column;}
    .form_cont{width:100%; gap:1rem; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;}
    .form_item{width:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; margin-bottom:1rem;}
    .form_item_half{width:calc(50% - .5rem);}
    .form_item_third{width:calc((100% / 3) - .67rem);}
    .form_item label{margin-bottom:.5rem;}
    .form_item label span{color:red;}
    input{width:100%; height:44px; border:solid thin #999; border-radius:0px; outline:none; padding:0px 1rem;}
    select{width:100%; height:44px; border:solid thin #999; border-radius:0px; outline:none; padding:0px 1rem;}
    select[disabled="true"]{background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));}
    input:focus{border:solid 2px #2e2c7f;}
    select:focus{border:solid 2px #2e2c7f;}
    .error{font-size:12px; margin-top:.5rem; color:red;}
    .button{cursor:pointer; width:max-content; font-weight:300; height:33px; display:flex; justify-content:center; align-items:center; font-size:14px; padding:0px 1rem; border-radius:5px;}
    .button_green{background:green; color:#fff;}
    .button:hover{background:darkgreen;}
    .button_big{height:44px; padding:0px 2rem;}

    .members{width:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap; gap:1rem;}
    .member{width:100%; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:1rem;}
    .member_inner{width:calc(100% - 80px); gap:1rem; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;}
    .member:before{content:attr(data-item); width:44px; height:44px; border:solid 4px #999; border-radius:100px; display:flex; justify-content:center; align-items:center; font-size:22px; font-weight:bold; color:#999;}

    .gdrp_form{width:500px; border-radius:15px; padding:2rem;}
    .login_form{width:500px; background:rgba(255,255,255,.7); border-radius:15px; padding:2rem;}
    footer{background:#999; width:100%; min-height:200px; display:flex; justify-content:center; align-items:center;}
    footer .container{width:720px; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:flex-start; gap:1rem;}
    footer h2{color:#fff; font-size:18px;}
}

@media screen and (max-width: 767px){
    body{margin:0; padding:0; overflow-x: hidden;}

    .button_red{width:100% !important; margin-bottom:2rem !important;}
    .top_bar{background:#2e2c7f; height:30px; width:100%;}
    .top_bar .container{width:90%; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:center;}

    header{position:fixed; top:0px; left:0px; background:#fff; width:100%; display:flex; justify-content:center; align-items:center; flex-direction:column;}
    header .container{width:90%; padding:1rem 0px;  display:flex; justify-content:space-between; align-items:center;}
    h2{width:100%; text-align:left; font-weight:bold;}
    p{font-size:16px; line-height:20px; margin-bottom:1rem;}
    .wrapper{width:100%; padding-top:150px; display:flex; justify-content:center; align-items:Center; margin:2rem 0px;}
    .wrapper .container{width:90%; min-height:calc(100vh - 450px); margin-bottom:4rem; display:flex; justify-content:center; align-items:Center; flex-direction:column;}
    .form_cont{width:100%; gap:1rem; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;}
    .form_item{width:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; margin-bottom:1rem;}
    .form_item_half{width:100%;}
    .form_item_third{width:100%;}
    .form_item label{margin-bottom:.5rem;}
    .form_item label span{color:red;}
    input{width:100%; height:44px; border:solid thin #999; border-radius:0px; outline:none; padding:0px 1rem;}
    select{width:100%; height:44px; border:solid thin #999; border-radius:0px; outline:none; padding:0px 1rem;}
    select[disabled="true"]{background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));}
    input:focus{border:solid 2px #2e2c7f;}
    select:focus{border:solid 2px #2e2c7f;}
    .error{font-size:12px; margin-top:.5rem; color:red;}
    .button{cursor:pointer; width:max-content; font-weight:300; height:33px; display:flex; justify-content:center; align-items:center; font-size:14px; padding:0px 1rem; border-radius:5px;}
    .button_green{background:green; color:#fff;}
    .button:hover{background:darkgreen;}
    .button_big{height:44px; padding:0px 2rem;}

    .members{width:100%; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap; gap:1rem;}
    .member{width:100%; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:1rem;}
    .member_inner{width:calc(100% - 80px); gap:1rem; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap;}
    .member:before{content:attr(data-item); width:44px; height:44px; border:solid 4px #999; border-radius:100px; display:flex; justify-content:center; align-items:center; font-size:22px; font-weight:bold; color:#999;}

    .gdrp_form{width:90%; border-radius:15px; padding:2rem;}
    .login_form{width:90%; background:rgba(255,255,255,.7); border-radius:15px; padding:2rem;}
    footer{background:#999; width:100%; min-height:200px; display:flex; justify-content:center; align-items:center;}
    footer .container{width:90%; padding:1rem 0px;  display:flex; justify-content:center; align-items:center; flex-direction:column; gap:2rem;}
    footer h2{color:#fff; font-size:18px; text-align:Center;}
}