/* newmember */
.newmember{display:grid;grid-template-columns: 50% 50%;align-items: center;}
.newmember .headerleft *{color:white;}
.newmember .headerleft{display: flex;flex-direction: column;justify-content: space-between;background: var(--primary);padding: 100px;height: calc(100vh - 200px);}
.pointer-events-none{opacity: 0.15;width:100%;height:100%;top:0px;left:0px;position:absolute;pointer-events:none}
.pointer-events-none svg{display:block;vertical-align:middle}
.newmember .headerleft .logoo{position:relative;z-index:10}
.newmember .headerleft .logoo .cis{display:flex;align-items:center;margin-bottom:1.5rem;gap:15px}
.newmember .headerleft .logoo .tracking-wider{font-family:"Arimo",sans-serif;font-weight:700;font-size:20px;letter-spacing:0.05em}
.newmember .headerleft .logoo img{-webkit-filter:contrast(0) brightness(150%);filter:contrast(0) brightness(200%);width:55px;aspect-ratio:1/1;object-fit:contain}
.newmember .headerleft .logoo .pageh1{position:relative;font-weight:700;font-size:36px;margin-bottom:1rem;letter-spacing:2px}
.newmember .headerleft .logoo p{width:min(100%,500px);font-size:18px;letter-spacing:1px;opacity:.85}
.newmember #footerInfo #sitefooter{margin-bottom:15px}
.newmember #footerInfo #sitefooter *{font-size:15px}
.newmember #footerInfo #sitefooter >div{display: grid;gap:5px;align-items: start;grid-template-columns: 20px 1fr;}
.newmember #footerInfo #copyright *{font-size:13px;color:#ffd998}

.contentMain{padding:100px 150px;height:calc(100vh - 200px);display:flex;justify-content:center;align-items:center}
.contentMain .box{padding:50px;background:white;border-radius:25px;box-shadow:0 0 40px rgb(0 0 0 / 5%);width:100%}
.contentMain .box h2{font-size:24px;letter-spacing:1px;font-weight:600}
.contentMain .box >p{margin-top:2px;margin-bottom:25px;display:flex;align-items:baseline;font-size:14px;color:#6d6d6d}
.contentMain .box >p a{font-size:14px;font-weight:500;margin-left:10px;color:var(--primary)}
#form1.form_box{gap: 10px;display:grid;grid-template-columns: repeat(2, 1fr);}
#form1.form_box p{margin:0;display:block;width: calc(100% - 0px);}
#form1.form_box .forget_box{}
#form1.form_box .forget_box *{font-size:14px;color: #828282;}
#form1.form_box .forget_box a:hover font{
    color: var(--primary);
}
#form1.form_box p.check_box font{display:flex;align-items:center}
#form1.form_box p label{font-size:14px;color:#333}
#form1.form_box p input{border-radius:8px;padding:7px 15px}
#form1.form_box p input:focus{border:1px var(--primary) solid}
#form1.form_box p input::placeholder{color:#a3a3a3}
#form1.form_box p.send_box{margin-top:20px;width: 100%;grid-column: 1 / -1;}
#form1.form_box p.check_box{
    grid-column: 1 / -1;
}
#form1.form_box p.send_box a{background: var(--complement);display:block;padding: .6rem 0;border-radius: 10px;}
#form1.form_box p.send_box a font{color:white}


.form-footer {padding-top: .5rem;display: flex;flex-direction: column;align-items: center;gap: 1rem;grid-column: 1 / -1;}
.form-footer .footer-link { font-size: 0.875rem; color: var(--text-muted); text-decoration: none; font-weight: 500; transition: color 0.2s; }
.form-footer .footer-link:hover { color: var(--primary-color); }
.form-footer .divider { width: 100%; display: flex; align-items: center; gap: 1rem; padding: 0.5rem 0; }
.form-footer .divider::before,.form-footer .divider::after { content: ''; flex: 1; height: 1px; background-color: #f3f4f6; }
.form-footer .divider span { font-size: 0.75rem; color: #aaacaf; font-weight: 500; text-transform: uppercase; letter-spacing: 0.1em; }
.form-footer .register-btn { width: 100%; background-color: transparent; color: var(--primary); border: 1px solid var(--primary); font-size: 1rem; font-weight: 600; text-align: center; transition: all 0.2s; display: block; padding: .6rem 0; border-radius: 10px; }
.form-footer .register-btn:hover { background-color: #fff0db; }
.form-footer .page-footer { margin-top: 2rem; text-align: center; color: var(--text-light); font-size: 0.75rem; }
/* Animations */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.form-footer .login-container { animation: fadeInUp 0.5s ease-out; }


@media screen and (max-width: 1440px) {
    .newmember{grid-template-columns: 45% 55%;}
    .newmember .headerleft{padding:50px;height: calc(100vh - 100px);}
    .contentMain {padding: 100px;}
    .contentMain .box{padding: 30px 40px;}
    #form1.form_box{gap: 20px;display: grid;grid-template-columns: repeat(2, 1fr);}
    #form1.form_box .p{width:50%}
    #form1.form_box p.send_box, #form1.form_box p.check_box{grid-column: 1 / 3;}
}
@media screen and (max-width: 1024px) {
    .contentMain {padding: 50px;height: calc(100vh - 100px);}
}
@media screen and (min-width: 981px) {
    #mofooter{display:none;}
}
@media screen and (max-width: 980px) {
    #form1.form_box{
    display: flex;
    flex-direction: column;
}
    #mofooter{background: var(--primary);}
    #mofooter *{color:white;font-size: 15px;}
    #mofooter .rightBox{padding: 40px 7%;}
    #mofooter #sitefooter >div{display:grid;grid-template-columns: 20px 1fr;}
    #mofooter #copyright{margin-top:10px;}
    #mofooter #copyright *{font-size:13px;color:#ffd998}
    .newmember{grid-template-columns:1fr;}
    .newmember .headerleft{display:flex;align-items: center;height: auto;background: none;padding: 30px 50px 0;}
    .newmember .headerleft *{color:#333}
    .newmember .headerleft .footer{display:none;}
    .contentMain{height:auto;padding: 30px 50px 50px;}
    .newmember .headerleft .logoo .cis{display:flex;justify-content: center;}
    .newmember .headerleft .logoo img{filter:none}
    .newmember .headerleft .logoo .tracking-wider{display:none;}
    .newmember .headerleft .logoo .pageh1{text-align:center;font-size: 30px;margin: 0;}
    .newmember .headerleft .logoo .cis{margin-bottom:10px;}
    .newmember .headerleft .logoo p{display: none;}
}
@media screen and (max-width: 640px) {
    .contentMain .box{padding: 25px;}
    .contentMain{height:auto;padding: 30px 20px 50px;}
    .newmember .headerleft .logoo .pageh1{font-size: 24px;}
}