@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
    :root {
        --gradient: linear-gradient(90deg, green, rgb(1, 30, 1));
    }
    .offline-message {
        display:none;
    }
    .online-message {
        display:none;
    }
    #preloader {
       position: fixed;
       top: 0px; left: 0px;
       right: 0px; 
       bottom: 0px; 
       z-index: 99999;
       transition: all 200ms ease;
       display:flex;
        justify-content:center;
        align-items:center;
         transform:translateY(-30px)
        height:100vh;
       } 
    .preload {
        width:80px;
        height:80px;
        border-radius:50%;
        background:green;
        display:flex;
        justify-content:center;
        align-items:center;
    }
   
    
    
    #preloader .spinner-border {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -15px;
    }
    .preloader-hide { 
        opacity: 0;
        pointer-events: none;
        transition: all 150ms ease !important;
    } 
    .theme-light #preloader {
            background-color: #FFF; 
    } 
    .theme-dark #preloader { 
            background-color: #0f1117;
    }
   
    body{
        background-color: rgb(228, 227, 227);
        color:rgb(37, 37, 37) !important;
        font-family:"League Spartan", sans-serif !important;
        
    }
    .form-control:focus {
        border:0px;
        box-shadow:0px;
    }
    h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: #1f1f1f;
    font-family: "Inter", sans-serif !important;
    margin-bottom: 5px;
    letter-spacing: -0.8px;
    }
    .card{
        background:white;
        padding:0 !important;
        width:570px;
        position:relative;
        font-family:"League Spartan", sans-serif !important;
        border-bottom-left-radius:15px !important;
        border-bottom-right-radius:0px !important;
        border-top-left-radius:15px !important;
        border-top-right-radius:15px !important;
        min-width:100px !important;
    }
    
    .dev, .user {
        text-decoration:none;
        color:rgb(37, 37, 37) !important;
    }
    

    input:hover, select:hover{ 
        box-shadow:0px 0px !important;
    }


    .input-style i{
        padding-left: 20px !important;
    }
    
    #phone, #fname, #lname, #email, #state, #password, #cpassword, #transpin, #referal {
        margin-bottom:5% !important;
        border:1px solid #0000001f !important;
        
    }
    input {
       padding:30px 10px 30px 10px !important;
      font-size:17px !important;
      position:relative;
      font-family:"League Spartan", sans-serif !important;
      height:30px !important;
      border-radius:15px !important;
      background:transparent !important;
      box-shadow: 0px 5px 15px -10px black !important;
      text-indent:35px;
    }
    
    .input-style {
        line-height:1 !important;
        position:relative;
    }
    
    select {
        height:60px !important;
        text-indent:35px;
        border-radius:15px !important;
        box-shadow: 0px 5px 15px -10px black !important;
        font-size:14px !important;
        font-family:"League Spartan", sans-serif !important;
    }
    
    .fa {
        transform:translateY(38px);
        font-size:15px;
        color:rgb(3,83,3);
    }
    
   
    a {
        text-decoration:none !important;
        color:rgb(3,83,3) !important;
    }
      #submit-btn {
         background:var(--gradient);
         color:white;
         font-weight:600;
         padding: 14px 26px !important;
         margin-top:40px !important;
         font-family:"League Spartan", sans-serif !important;
         border-radius:40px;
         transition:transform 1s linear;
      }
      #submit-btn:hover {
         transform:translateY(-10px);
         transition:transform 0.2s linear;
      }
       #submit-btn:focus {
          border:0px !important;
          box-shadow:0px 0px !important;
      }
      
    .user {
        color:rgb(37, 37, 37) !important;
        position:relative;
        left:30%;
    }
    .visibleone, .visibletwo {
        position:absolute;
        top:35px;
        cursor:pointer;
        z-index:99;
        right:20px;
        width:20px;
        height:20px;
    }
    
     .user, .label, .dev {
        font-weight:bold;
    }
    h1, .text, .dev {
        font-family:"League Spartan", sans-serif !important;
        
    }
    .text {
        margin-top: -3px !important;
        color:grey !important;
    }
    span {
        color:rgb(3, 83, 3);
        text-decoration:underline;
    }
    .label, .user, #submit-btn {
        font-family:"League Spartan", sans-serif !important;
        font-size:16px !important;
    }
    .flex {
        display:flex;
        justify-content:center;
        height:100vh;
        margin-bottom:40px;
        align-items:center;
        font-family:"League Spartan", sans-serif !important;
    }
    
     .content {
        font-family:"League Spartan", sans-serif;
        margin: 40px 40px 15px 40px !important;
    }
    .pass {
          margin-bottom:5px !important;
          
      }
      
      .mname, .curve, .curve-bottom {
        display:none;
    }
    .pass_forget {
        position:absolute; 
        color:var(--gradient);
        right:60px;
        font-weight:bold;
        transform: translateY(-5px);
        font-family:"League Spartan", sans-serif!important;
    }
    @media (max-width:500px) {
        .content {
        margin: 15px 10px 15px 10px !important;
    }
    body {
        background:white;
    }
     .fa {
        transform:translateY(37px);
        font-size:13px;
        color:rgb(3,83,3);
    }
    input {
        font-size:14px !important;
        text-indent:30px;
    }
    .card {
        width:99% !important;
        transform: translateY(-100px);
        border:0px !important;
    }
     .user, #submit-btn, .dev {
        font-size:13px !important;
    }
     .visibleone, .visibletwo {
        right:10px;
        top:37px;
        width:16px;
        height:16px;
    }
    .dname {
        display:none;
    }
    .text {
        font-size:23px;
        color:rgb(3,83,3) !important;
        font-weight:bold;
        letter-spacing:1px !important;
    }
    
      .curve {
        width:100%;
        display:block;
        height:40vh;
        position:relative;
        background:var(--gradient);
        border-radius:0px 0px 30px 30px;
    }
    .mname {
        display:block;
        margin-bottom:10px;
    }
    .flex {
        height:1130px;
    }
    
   
    .curve_links {
        position:absolute;
        bottom:-5px;
        width:100%;
        color:white;
        display:flex;
        font-size:17px;
        
        justify-content:center;
        font-family:"League Spartan", sans-serif;
    }
    .curve_links p {
        padding:0px 55px;
        color:white;
        text-decoration:none;
        transition:all 0.1s 0.2s linear;
    }
    .curve_links p:hover {
       text-decoration:underline;
       transform:translateY(-10px)
    }
    .pass_forget{
        right: 20px;
        font-size:13px !important;
        width:120px;
    }
    }