 body {
     background-color: var(--main-color);
 }
  .login-all-forms .form-control{
     border: none;
 }
 .logo-head img{
     width:300px;
 }
 .login-section-left img{
     width:100%;
     height:100%;
     object-fit: cover;
     object-position: top;
 }
 .end h3{
     font-size:28px;
     font-weight:600;
     color:#fff;
 }
 .form-control label{
    font-size: 14px;
 }
 .end p{
     font-size:16px;
     color:#fff;
     font-weight: 500;
     font-family: 'OpenSans_nd33';
 }
 .login-all-forms input{
     border: 1px solid #4a8fc5;
 }
 .end{
     margin-top:0;
 }
 .login-card-button{
     margin-top:10px;
 }
 .login-section .radio-control{
     margin-top:16px!important;
 }
.login-section .login-all-forms p{
        margin-top: 35px!important;
}
 .login-section {
     height: calc(46vw - 150px);
     display: flex;
     align-items: center;
     padding: 0 35px 0;


         & .one {
             display: flex;

             & img {
                 width: 160px;
                 height: 100%;
                 object-fit: contain;
             }
         }

         & .center {
             display: flex;
             height: 26vw;
             & .login-img {
                 height: 100px;
                 width: 100%;
                     object-fit: contain;
             }
         }

         & .end {
             margin-top: 4rem;
         }
     }

     & .login-section-right {
         width: 100%;
         display: flex;
         justify-content: center;
         align-items: center;

         & .login-forms {
             width: 100%;
             padding: 18px 24px;
             border-radius: 10px;
             background-color: var(--white-clr);
             -webkit-border-radius: 10px;
             -moz-border-radius: 10px;
             -ms-border-radius: 10px;
             -o-border-radius: 10px;
             height: 34vw;
            display: flex;
            align-items: center;
            justify-content: center;

             & .login-container {
                 & .login-container-headng {
                     & h1 {
                         margin-bottom: 20px;
                         font-weight: 600;
                        
                            text-align: center;
                     }
                 }

                 & .login-all-forms {
                     & form {
                        
          & .form-control{
                     margin-top:.8rem;
                     padding:0;
                 }
                         & .radio-control {
                             display: flex;
                             gap: 1rem;
                             margin-top: 1rem;

                             & a {
                                 font-size: 1.4rem;
                                 text-decoration: underline;

                                 &:hover {
                                     color: var(--main-color);
                                 }
                             }

                             & input {
                                 width: 15px;
                                 height: 20px;
                                 box-shadow: none;
                             }

                             & label {
                                 font-size: 1.3rem;
                                 font-weight: 400;
                             }
                         }

                         & .form-control span {
                             position: absolute;
                             left: 1.5rem;
                             top: 50%;
                             translate: 0 -50%;
                             padding: 0.2rem;
                             pointer-events: none;
                             font-size: 1.5rem;
                             color: var(--secondary-text-clr);
                             transition: 0.3s;
                             -webkit-transition: 0.3s;
                             -moz-transition: 0.3s;
                             -ms-transition: 0.3s;
                             -o-transition: 0.3s;
                         }

                         & .form-control input:valid~span,
                         & .form-control input:focus~span {
                             font-size: 1rem;
                         }

                         & .login-card-button {
                             display: flex;
                             justify-content: center;

                             & .login-btn {
                                 margin-top: 1rem;
                                 padding: 1.2rem 8rem;
                                 font-size: 1.5rem;
                                 transition: all 0.2s linear;
                                 -webkit-transition: all 0.2s linear;
                                 -moz-transition: all 0.2s linear;
                                 -ms-transition: all 0.2s linear;
                                 -o-transition: all 0.2s linear;
                             }
                         }

                         & p {
                             display: flex;
                             justify-content: center;
                             font-size: 1.6rem;
                             margin-top: 1rem;

                             & a {
                                 font-size: 1.6rem;
                                 text-decoration: underline;
                                 color: var(--main-color);

                             }
                         }
                     }

                 }
             }
         }
     }
 }

 @media (width<=1180px) {
     .login-section {
         height: 100%;
         flex-direction: column;
         gap: 2rem;

         & .login-section-left {
             width: 100%;
         }

         & .login-section-right {
             width: 100%;

             & .login-forms {
                 width: 98%;
                 margin-top: 1rem;
             }
         }
     }
 }

 @media (width<600px) {
     .login-section{
         height: 100vh;
             justify-content: center;
     }
     .login-section {
         gap: 0rem;

         & .login-section-left {
             & .one {
                 margin-top: -7.6rem;
                 justify-content: center;

             }

             & .center {
                 display: none;
             }
         }

         & .login-section-right {
             
             & .login-forms {
                 padding: 1.6rem;
                
                 & .login-container {
                     & .login-all-forms {
                         & form {
                             & input {
                                 padding: 1.8rem;
                             }
                         }
                     }

                 }
             }

         }
     }
 }
 
 
 .login-logo{
     padding: 0 35px;
 }
 .login-logo a{
     width:160px;
     height:77px;
 }
 .login-logo img{
     max-width:100%;
     max-height:100%;
 }
 /*responsive*/
 @media only screen and (max-width: 900px){
     .login-section{
         height:100%;
         padding:15px;
     }
     .login-section-left .end{
         margin-top:0;
         margin-bottom: 18px;
     }
     .login-section-left .end h3{
         font-size:22px;
     }
     .end p{
         font-size:14px;
     }
     .login-section-right .login-forms{
        width:100%;
     }
     .main-heading{
        font-size: 22px;
        line-height: 22px;
        margin-bottom: 0;
     }
     .login-section-right .form-control input{
         padding: 10px 12px!important;
     }
     .login-section-right .login-forms{
         height:100vw;
     }
     .login-logo{
         padding:0 15px;
     }
 }
 
 
 
 
 