* {
       margin: 0;
       padding: 0;
       box-sizing: border-box;
       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   }

   body {
       margin: 0;
       padding: 0;
       background-image: url('../images/login_background.jpg');
       background-size: cover;
       background-position: center;
       background-repeat: no-repeat;
       background-attachment: fixed;
       height: 100vh;
       width: 100vw;
       font-family: var(--fontFamily) !important;
   }

   input,
   label,
   h1,
   h2,
   h3,
   h4,
   h5,
   p,
   span,
   button,
   a {
       font-family: var(--fontFamily) !important;
   }

   .login-container {
       padding: 0 30px;
       height: 100vh;
   }

   .login-container .main-container {
       height: 100vh;
       align-items: center;
   }

   .login-container .single-item {
       border: 2px solid #FFFFFF;
       height: 200px;
       border-radius: 10px;
       display: flex;
       justify-content: center;
       align-items: center;
       flex-direction: column;
       padding: 0px 15px;
       text-align: center;
       color: white;
       background: #5D5D5D59;
       width: 180px;
   }

   .login-container .single-item i {
       margin-bottom: 20px;
       transform: scale(1.2);
   }

   .login-container .header {
       text-align: center;
       margin-bottom: 45px;
   }

   .login-container .header h3 {
       font-size: 50px;
       color: #333;
       font-weight: bold;
       -webkit-text-stroke: 1.5px white;
       margin-bottom: 0px;
   }

   .login-container .header h6 {
       font-size: 25px;
       color: #333;
       -webkit-text-stroke: 1px white;
       font-weight: bold;
   }

   .login-form-container {
       background-color: transparent;
       padding: 10px 20px;
       display: flex;
       justify-content: center;
       align-items: normal;
       flex-direction: column;
   }

   .login-form-container .logo-img-head {
       display: flex;
       justify-content: center;
       align-items: center;
       margin-top: 15px;
   }

   .login-form-container .logo-img {
       width: 75%;
   }

   .login-form-container {
       width: 460px;
       min-height: 540px;
       border-radius: 10px;
   }

   .login-form-container .heading {
       margin-top: 30px;
   }

   .login-form-container form {
       margin-top: 35px;
   }

   .login-form-container .heading h3 {
       font-size: 18px;
       margin-bottom: 0px;
       color: #214f79;
       font-weight: bold;
   }

   .login-form-container .heading p {
       font-size: 14px;
       color: #969696;
       font-weight: normal;
   }

   .login-form-container .forgot-password {
       display: flex;
       justify-content: center;
       align-items: end;
   }

   .checkboxLabel .c-box {
       width: 18px;
       height: 18px;
       border-radius: 4px;
   }

   .checkboxLabel .text {
       font-size: 17px;
       margin-left: 6px;
   }

   .checkboxLabel .c-box {
       border-radius: 4px;
   }

   .login-btn {
       width: 100%;
       font-size: 16px;
       color: white;
       background: linear-gradient(45deg, #102E4A, #266DB0);
       padding: 8px;
       border-radius: 10px;
       border: none;
       outline: none;
   }

   .foot-param {
       text-align: center;
       justify-content: center;
       padding: 0 67px;
       font-size: 14px;
       color: #969696;
       margin-bottom: 30px;
   }

   /* Mobile */
   @media (max-width: 768px) {
       .login-container {
           padding-top: 50px !important;
           padding-left: 0 !important;
           padding-right: 0 !important;
       }

       .single-item {
           margin-bottom: 20px;
       }

       .login-container .login-form {
           padding-bottom: 50px;
           display: flex;
           justify-content: center;
       }

       .login-container .sm-content-center {
           display: flex;
           justify-content: center;
       }
   }

   /* Small Mobile */
   @media (max-width: 480px) {
       .login-container .sm-content-center {
           padding: 0 4px;
       }

       .pull-away {
           flex-direction: column;
       }

       .login-form-container .forgot-password {
           display: flex;
           justify-content: end;
           align-items: end;
       }

       .foot-param {
           padding: 0 20px;
       }
   }

   /* Sweeet Alert Styling */
   .swal2-show {
       animation: none !important;
       /* disables default fade */
   }

   .swal2-container .swal2-icon {
       margin: 0.5em auto 1em !important;
   }

   .swal2-container #swal2-content {
       font-size: 15px !important;
       color: #9D9D9D !important;
   }

   .swal2-container .swal2-popup {
       border-radius: 20px !important;
       width: 30em !important;
   }

   .swal2-container .swal2-title {
       color: var(--webMainColor) !important;
   }

   .swal2-container .swal2-styled.swal2-confirm {
       padding: 8px 35px !important;
       border-radius: 10px !important;
   }

   .swal2-container .swal2-styled.swal2-cancel {
       padding: 8px 35px !important;
       background: transparent !important;
       border: 1px solid var(--webMainColor) !important;
       color: var(--webMainColor) !important;
       box-shadow: unset !important;
       border-radius: 10px !important;
   }

   /* Sweeet Alert Styling */