@charset "utf-8";
/* CSS Document */
@media all{

     .login-bg{float: left; width: 100%; height: 100vh; background: url('../images/login-bg.jpg') no-repeat left top; background-size: 100% 100%;}

     .login-bg .container{max-width:100%; max-width: 80%; height: 100%;}
     .login-main{float: left;width: 100%;display: flex;height: 100%;align-items: center;justify-content: center;}

     .l-align{float: left;width: 100%;background: #ffffff;box-shadow: 0px 5px 53.1px 5.9px rgba(2, 2, 2, 0.26);border-radius: 5px;align-items: center;}

     .login-left{float: left;width: 45%;height: 100%;display: flex;align-items: center; padding: 20px;}
     .login-photos{ float: left; width: 55%; background: #033b84; position: relative;}

     .l-cnt{width: 100%; max-width: 452px; margin: 0 auto; font-family: 'Poppins', sans-serif;}
     .l-logo{float: left; width:100%; max-width:280px; margin-bottom:30px;}

     .l-cnt h1{float: left; width:100%; margin-bottom:20px; color: #454545; font-family: 'Poppins', sans-serif; font-weight: 700; font-size:28px;}

     .login-field{float: left; width: 100%;}
     .login-field .form-group{float: left; width: 100%; margin-bottom: 10px; position: relative;}
     .login-field .form-group .form-control{border: solid 1px #e7e7e7; border-radius: 3px; font-size:15px; font-family: 'Poppins', sans-serif;  font-weight: 400; color: rgb(69 69 69 / 80%); height: 60px; padding-left: 60px;}

     .field-icon{position: absolute;top: 0;left: 0;height: 60px;width: 60px;display: flex;align-items: center;justify-content: center;}

     .forgot-link{padding: 5px 0px;}
     .forgot-link a{font-size: 15px; color: #3176fe;}
     .forgot-link a:hover,
     .acnt-link a:hover{color: #323232;}        
     
     .form-group .submit-btn{float: left;width: 100%;text-align: center;background: #0c4da2;color: #ffffff;font-size: 18px;border-radius: 30px;height: 50px;}
     .form-group .submit-btn:hover{background:#0071c7;}
     .acnt-link{float: left; width: 100%; font-size: 16px; color: #454545; margin-top: 15px;}
     .acnt-link a{color: #3176fe;}

     .red-owal{position: absolute;top: -7%;left: 30px;z-index: 99;max-width: 20%;}
     .wl-txt{position: absolute;bottom: 8%;z-index: 99;left: 20%;}
     .wl-txt h2{color: #f0f0f0;font-weight: 700;font-size: 1.8vw;}
     .wl-txt h6{color: #f0f0f0;font-weight: 400;font-size: 1.15vw;}


     .animation-photo-shape {
          position: absolute;
     }
     .animation-photo-shape .photos-gallery {
          background-position: center center;
          background-repeat: no-repeat;
          background-size: cover;
          overflow: hidden;
     }
     .animation-photo-shape .photos-gallery:first-child {
          display: block;
     }
     .photo-shape-1 {
          top: 0;
          right: 19%;    
          width: 21.747%;
          height: 21.747%;     
     }
     .photo-shape-1 .photos-gallery {         
          border-radius: 200px 0 200px 200px;
     }
     .photo-shape-2 {
          width: 19.8%;
          height: 19.8%; 
          top: 20.3%;
          left: 0;
     }
     .photo-shape-2 .photos-gallery {         
          border-radius: 200px 0 200px 200px;
     }
     .photo-shape-3 {        
          top: 0.4%;
          left: 19.8%;  
          width: 19.8%;
          height: 19.8%; 
     }
     .photo-shape-3 .photos-gallery {         
          border-radius: 200px 200px 200px 0;
     }
     .photo-shape-4 {
          width: 39.81%;
          height: 39.72%;
          left: 40%;
          top: 40%;
     }
     .photo-shape-4 .photos-gallery {         
          border-radius: 400px;
     }
     .photo-shape-5 {
          left: 0;         
          bottom: 4.5%;
          width: 16.748%;
          height: 16.748%;
     }
     .photo-shape-5 .photos-gallery {         
          border-radius: 100%;
     }
     .photo-shape-6 {          
          bottom: 21%;
          right: 0;
          width: 20%;
          height: 20%;  
     }
     .photo-shape-6 .photos-gallery {         
          border-radius: 0 200px 200px 200px;
     }
     .photo-shape-7 {          
          bottom: 0;
          right: 21%;
          width: 20.3%;
          height: 20.3%;    
     }
     .photo-shape-7 .photos-gallery {         
          border-radius: 0 0 200px 0;
     }
     .photo-shape-8 {      
          top: 40%;
          left: 19.7%;
          width: 20.1%;
          height: 19.8%;      
     }
     .photo-shape-8 .photos-gallery {         
          border-radius: 0 200px 0 0;
     }
     .photo-shape-9 {          
          border-radius: 0 200px 0 200px;
          top: 30%;
          right: 19.8%;
          width: 20%;
          height: 10%;        
     }
     .photo-shape-9 .photos-gallery {         
          border-radius: 0 200px 0 200px;
     }
     .slick-slider {
          display: none;
     }
     .slick-initialized {
          display: block;
     }
     .login-photos {
          padding-top: 55%;
          position: relative;
     }
     .photos-inner {
          opacity: 0;
          visibility: hidden;
     }
     .photos-inner .loginMainImg {
          position: absolute;
     }

     /* ###### 4.6 Parsley ###### */
     input.parsley-error, input.parsley-error:focus,
     textarea.parsley-error,
     textarea.parsley-error:focus {
     box-shadow: none !important;
     border-color: #dc3545 !important; }

     input.parsley-success, input.parsley-success:focus,
     textarea.parsley-success,
     textarea.parsley-success:focus {
     box-shadow: none !important;
     border-color: #10b759; }

     .parsley-checkbox.parsley-error, .parsley-checkbox.parsley-success {
     display: inline-block;
     padding: 10px;
     border-radius: 0.25rem; }

     .parsley-checkbox.parsley-error {
     border: 1px solid #dc3545; }

     .parsley-checkbox.parsley-success {
     border: 1px solid #10b759; }

     .custom-select.parsley-error, .custom-select.parsley-success {
     box-shadow: none !important; }

     .custom-select.parsley-error {
     border-color: #dc3545; }

     .custom-select.parsley-success {
     border-color: #10b759; }

     .parsley-errors-list {
     color: #dc3545;
     list-style: none;
     font-size: 12px;
     padding: 0;
     margin-bottom: 0; }
     .parsley-errors-list li {
     margin: 5px 0 0; }

     /***** CUSTOM STYLED ERROR MESSAGE *****/
     .parsley-style-1 .parsley-input.parsley-error .form-control {
     background-color: #fef9f9;
     border-color: #dc3545;
     border-bottom-width: 0;
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0; }

     .parsley-style-1 .parsley-input.parsley-success .form-control {
     border-color: #10b759; }

     .parsley-style-1 .parsley-checkbox.parsley-error {
     padding-bottom: 35px;
     border: 1px solid #dc3545;
     background-color: #fef9f9;
     border-top-left-radius: 2px;
     border-top-right-radius: 2px; }

     .parsley-style-1 .parsley-checkbox .parsley-errors-list.filled {
     border-bottom-right-radius: 1px;
     border-bottom-left-radius: 1px; }

     .parsley-style-1 .custom-select.parsley-error {
     border-bottom-width: 0;
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0; }

     .parsley-style-1 .parsley-errors-list.filled {
     background-color: #dc3545;
     color: #fff;
     padding: 3px 10px;
     font-size: 11px;
     border-bottom-right-radius: 2px;
     border-bottom-left-radius: 2px; 
     }
     .parsley-style-1 .parsley-errors-list.filled li:first-child {
          margin-top: 0; 
     }


    
    .page-loader {
          display: flex;
          position: fixed;
          left: 0;
          right: 0;
          top: 0;
          bottom: 0;
          z-index: 9991;
          background: rgba(255,255,255, 0.9);
     }
     .sk-circle {
          margin: auto;
          width: 60px;
          height: 60px;
          position: relative;
     }
     .sk-circle .sk-child {
          width: 100%;
          height: 100%;
          position: absolute;
          left: 0;
          top: 0;
     }
     .sk-circle .sk-child:before {
          content: '';
          display: block;
          margin: 0 auto;
          width: 15%;
          height: 15%;
          background-color: #333;
          border-radius: 100%;
          -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
                    animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
     }
     .sk-circle .sk-circle2::before {
          background-color: #0D5DA1;
     }
     .sk-circle .sk-circle3::before {
          background-color: #D2AB67;
     }
     .sk-circle .sk-circle4::before {
          background-color: #8D302C;
     }
     .sk-circle .sk-circle5::before {
          background-color: #F3A04D;
     }
     .sk-circle .sk-circle6::before {
          background-color: #A3238E;
     }
     .sk-circle .sk-circle7::before {
          background-color: #FFCB05;
     }
     .sk-circle .sk-circle8::before {
          background-color: #54A275;
     }
     .sk-circle .sk-circle9::before {
          background-color: #A5C3D2;
     }
     .sk-circle .sk-circle10::before {
          background-color: #F6ADCD;
     }
     .sk-circle .sk-circle11::before {
          background-color: #D6CC70;
     }
     .sk-circle .sk-circle12::before {
          background-color: #ED1C24;
     }
     .sk-circle .sk-circle2 {
     -webkit-transform: rotate(30deg);
          -ms-transform: rotate(30deg);
               transform: rotate(30deg); }
     .sk-circle .sk-circle3 {
     -webkit-transform: rotate(60deg);
          -ms-transform: rotate(60deg);
               transform: rotate(60deg); }
     .sk-circle .sk-circle4 {
     -webkit-transform: rotate(90deg);
          -ms-transform: rotate(90deg);
               transform: rotate(90deg); }
     .sk-circle .sk-circle5 {
     -webkit-transform: rotate(120deg);
          -ms-transform: rotate(120deg);
               transform: rotate(120deg); }
     .sk-circle .sk-circle6 {
     -webkit-transform: rotate(150deg);
          -ms-transform: rotate(150deg);
               transform: rotate(150deg); }
     .sk-circle .sk-circle7 {
     -webkit-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
               transform: rotate(180deg); }
     .sk-circle .sk-circle8 {
     -webkit-transform: rotate(210deg);
          -ms-transform: rotate(210deg);
               transform: rotate(210deg); }
     .sk-circle .sk-circle9 {
     -webkit-transform: rotate(240deg);
          -ms-transform: rotate(240deg);
               transform: rotate(240deg); }
     .sk-circle .sk-circle10 {
     -webkit-transform: rotate(270deg);
          -ms-transform: rotate(270deg);
               transform: rotate(270deg); }
     .sk-circle .sk-circle11 {
     -webkit-transform: rotate(300deg);
          -ms-transform: rotate(300deg);
               transform: rotate(300deg); }
     .sk-circle .sk-circle12 {
     -webkit-transform: rotate(330deg);
          -ms-transform: rotate(330deg);
               transform: rotate(330deg); }
     .sk-circle .sk-circle2:before {
     -webkit-animation-delay: -1.1s;
               animation-delay: -1.1s; }
     .sk-circle .sk-circle3:before {
     -webkit-animation-delay: -1s;
               animation-delay: -1s; }
     .sk-circle .sk-circle4:before {
     -webkit-animation-delay: -0.9s;
               animation-delay: -0.9s; }
     .sk-circle .sk-circle5:before {
     -webkit-animation-delay: -0.8s;
               animation-delay: -0.8s; }
     .sk-circle .sk-circle6:before {
     -webkit-animation-delay: -0.7s;
               animation-delay: -0.7s; }
     .sk-circle .sk-circle7:before {
     -webkit-animation-delay: -0.6s;
               animation-delay: -0.6s; }
     .sk-circle .sk-circle8:before {
     -webkit-animation-delay: -0.5s;
               animation-delay: -0.5s; }
     .sk-circle .sk-circle9:before {
     -webkit-animation-delay: -0.4s;
               animation-delay: -0.4s; }
     .sk-circle .sk-circle10:before {
     -webkit-animation-delay: -0.3s;
               animation-delay: -0.3s; }
     .sk-circle .sk-circle11:before {
     -webkit-animation-delay: -0.2s;
               animation-delay: -0.2s; }
     .sk-circle .sk-circle12:before {
     -webkit-animation-delay: -0.1s;
               animation-delay: -0.1s; }

     @-webkit-keyframes sk-circleBounceDelay {
     0%, 80%, 100% {
          -webkit-transform: scale(0);
               transform: scale(0);
     } 40% {
          -webkit-transform: scale(1);
               transform: scale(1);
     }
     }

     @keyframes sk-circleBounceDelay {
     0%, 80%, 100% {
          -webkit-transform: scale(0);
               transform: scale(0);
     } 40% {
          -webkit-transform: scale(1);
               transform: scale(1);
     }
     }

     .alert { font-size: 13px; letter-spacing: 0.3px; }
     .disable-link {
          cursor: wait !important;
          color: gray !important;
     }

     .form-group .cancel-btn-new{float: left;width: 100%;text-align: center;background: #ed1c24;color: #ffffff;font-size: 18px;border-radius: 30px;height: 50px;}
     .form-group .cancel-btn-new:hover{background:#ea5b62;}
     .w-48{ width: 48% !important; }
}

@media all and (max-width:1600px){
     .login-bg{background-size: contain 100%;}
}

@media all and (max-width:767px){
     .login-left{width: 100%;    padding-bottom: 50px;}
     .l-cnt h1{font-size: 22px; font-weight: 600;}
     .login-field .form-group .form-control {font-size: 14px; height: 50px;}
     .form-group .submit-btn{font-size: 16px; height: 45px;}
     .form-group .cancel-btn-new{font-size: 16px; height: 45px;}
     .acnt-link, .forgot-link a{font-size: 14px;}
     .login-photos{width: 100%;}
     .login-bg {height: auto;background-size: cover;padding: 20px 0px;}

     .login-bg .container {max-width: 96%;}

     .wl-txt{bottom: 4%;}
     .wl-txt h2{font-size: 3.8vw;}
     .wl-txt h6{font-size: 2.5vw;}
     .field-icon{height:50px}
}