body {
     margin: 0;
     padding: 0;
     background: #fff;
 }

 .form-sec {
     margin: 0;
     padding: 0;
 }

 .input-group {
     margin-bottom: 15px;
 }

 img.brand_logo {
     margin-bottom: 20px;
     width: 100px;
 }

 .form-control {
     font-size: 15px;
 }

 .custom-control-label {
     font-size: 14px;
 }

 .login_btn {
     width: 100%;
     background: #2a6da7 !important;
     color: white !important;
 }

 .login_btn:focus {
     box-shadow: none !important;
     outline: 0px !important;
 }

 .login_container {
     padding: 0 2rem;
 }

 .input-group-text {
     background: #2a6da7 !important;
     color: white !important;
     height: 40px;
     border: 0 !important;
     border-radius: 0.25rem 0 0 0.25rem !important;
     width: 40px;
 }

 .input_user,
 .form-control,
 .input_pass:focus {
     box-shadow: none !important;
     outline: 0px !important;
 }

 .custom-checkbox .custom-control-input:checked~.custom-control-label::before {
     background-color: #001b54 !important;
 }

 #forms {
     position: relative;
     top: 5%;
 }

 #register,
 #login {
     padding: 50px;
     margin: 0;
     position: absolute;
     top: 0;
     width: 100%;
 }

 #register {
     z-index: 21;
     opacity: 0;
 }

 #login {
     z-index: 22;
 }

 #toregister:target~#forms #register,
 #tologin:target~#forms #login {
     z-index: 22;
     -webkit-animation-name: fadeInLeft;
     -moz-animation-name: fadeInLeft;
     -ms-animation-name: fadeInLeft;
     -o-animation-name: fadeInLeft;
     animation-name: fadeInLeft;
     -webkit-animation-delay: .1s;
     -moz-animation-delay: .1s;
     -o-animation-delay: .1s;
     -ms-animation-delay: .1s;
     animation-delay: .1s;
 }

 #toregister:target~#forms #login,
 #tologin:target~#forms #register {
     -webkit-animation-name: fadeOutLeft;
     -moz-animation-name: fadeOutLeft;
     -ms-animation-name: fadeOutLeft;
     -o-animation-name: fadeOutLeft;
     animation-name: fadeOutLeft;
 }


 .animate {
     -webkit-animation-duration: 0.5s;
     -webkit-animation-timing-function: ease;
     -webkit-animation-fill-mode: both;

     -moz-animation-duration: 0.5s;
     -moz-animation-timing-function: ease;
     -moz-animation-fill-mode: both;

     -o-animation-duration: 0.5s;
     -o-animation-timing-function: ease;
     -o-animation-fill-mode: both;

     -ms-animation-duration: 0.5s;
     -ms-animation-timing-function: ease;
     -ms-animation-fill-mode: both;

     animation-duration: 0.5s;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }

 @media only screen and (max-width:576px) {

     #register,
     #login {
         padding: 15px;
     }
 }