body {
  color: var(--fontcol);
  background: var(--bgcol);
  background-image: none;
  font-family: var(--fontfam);
  background-image: var(--bggrad);
}

.shadedarea {
  background-color: var(--altbgcol);
  color: var(--altfontcol);
border-radius: 40px;
  border: 3px solid var(--altbordercol);
  box-shadow:var(--altshadow);
margin-top: 20px !important;


}
.shadedarea2{
  background-color: rgba(255,255,255,0.5);
  color: var(--altfontcol);
  border-radius: 0px;
  border: 3px solid var(--altbordercol);
  box-shadow:var(--altshadow);

}

.fill {
  background-image: var(--bgimage);
  background-size: var(--bgsize);
    background-attachment: var(--bgattach);
    background-repeat: var(--bgrep) ;
      background-position: top;
      overflow-x: hidden;
      position: relative;
}
.link {

  color:   var(--linkcol);
}

input[type="submit"],
input[type="reset"]  {

  background-color: var(--buttoncol);
  color: var(--buttonfont);
  border-radius: 32px;
  border: 3px solid var(--buttonbordercol);
  cursor: pointer;
  font-family: var(--fontfam);
    box-shadow:var(--buttonshadow);
    font-weight: 400;
}


.logoimg {
  position: relative !IMPORTANT;
  margin-left: auto;
  margin-right: auto;
  width: 90%;
  max-width: 500px;
  display: block;
  max-height: unset !important;
  padding-right: 0px !important;

}
.checkarea2 {

  text-align: left;
}
strong {

  color:cornflowerblue;
}


.logo {
    width: 50%;
    max-width: 300px;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0px;
    z-index: 2;
    content: var(--logo);

}
.footerimg {
    max-width: 450px;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    z-index: 0;
    content: var(--footer);
    
display: inline-block;
    width:3vw;

}
.leftbotimg {
    max-width: 33%;
    height: auto;
    display: block;
    margin-left: 0;
    z-index: 0;
    content: var(--footer1);
display: inline-block;
float: left;
  object-fit: contain;
  object-position: bottom;

  pointer-events: none;
  position: absolute;
  bottom: 0;
  left: 0;

}
.rightbotimg {
    max-width: 33%;
    height: auto;
    display: block;
    margin-right: 0 ;
    z-index: 0;
    content: var(--footer2);
    
display: inline-block;
float: right;
  object-fit: contain;
  object-position: bottom;
}
.righttopimg {
    max-width: 33%;
    height: auto;
    display: block;
    margin-left: 0;
    z-index: 0;
    content: url("/images/topr.png");
position: absolute;
top:0;
right:0;

}

.pagefooterimg {
    max-width: 450px;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    z-index: 0;
    content: var(--pagefooter);
    margin-top: -1px;
    width:90%;
}
.formfooter {

height:auto;
display: flex;
  pointer-events: none;
}
.footerimgarea {
width: 100vw;
}

.pagefooter {

  background-color: var(--footerbgcol);
  
  color: var(--footerfontcol);
height:auto;

}
.footercontainer {

  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}


.btn {
  background-color: var(--buttoncol);
  color: var(--buttonfont);
  border: 1px solid var(--buttonbordercol);
  cursor: pointer;
}

.link {
  color: var(--linkcol);
  text-decoration: none;
}


/* terms start*/
.termsx {

  overflow-y: scroll;
height: 80vh;
padding: 10px;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
padding-top: 10px;
padding-top: 1em;
padding-left: 20px;
padding-right: 20px;
/* -ms-overflow-style: none;
scrollbar-width: none; */
font-weight: 300;
}
  
strong {
  font-weight: 800;
}

  
  .bottompad{
    height:140px;
    
  }
  .termsx::-webkit-scrollbar {
    display: none;
  }
  .bottomscroll {
    
    background: linear-gradient(0deg, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
    margin-top: -100px;
    width: 100%;
    height: 130px;
    z-index: 3;
    left: 0;
    position: absolute;
  
  }
  
  
  
  .middleterms {
    
    max-width: 700px;
    margin: auto;
    height: 95vh;
  }
  .closelink {
    
    text-align: right;
  
      color: white !important;
      position: absolute;
      top: 12px;
      right: 12px;
    text-decoration: none;
    
      content: "\00d7"; /* This will render the 'X' */
        width: 32px;
    height: 32px;
  }
  
  .closelink:before, .closelink:after {
    position: absolute;
    left: 20px;
    content: ' ';
    height: 25px;
    width: 3px;
    background-color: white;
  }
  .closelink:before {
    transform: rotate(45deg);
  }
  .closelink:after {
    transform: rotate(-45deg);
  }
  
  
  .close-icon {
    position: sticky;
    right: 32px;
    top: 32px;
    width: 32px;
    height: 32px;
    margin-top: 10px;
  }
  .close-icon:before, .close-icon:after {
    position: absolute;
    left: 20px;
    content: ' ';
    height: 25px;
    width: 3px;
    background-color: white;
  }
  .close-icon:before {
    transform: rotate(45deg);
  }
  .close-icon:after {
    transform: rotate(-45deg);
  }
  
  
      .modal-container {
          position:fixed;
          left:50%;
          transform:translate(-50%, calc(var(--vh, 1vh) * 100));
  
          background-color:#1e1d1d;
   
      width: 100%;
      height: 100vh; /* Use vh as a fallback for browsers that do not support Custom Properties */
      height: calc(var(--vh, 1vh) * 100);
          border-radius:2px;
          font-size: 25px;
          text-align: center;
          transition: transform 800ms; 
  animation-timing-function: ease-in;
      z-index: 2;
      color: white;
      text-align: left;
      top: calc(var(--vh, 1vh) * 100);
  
      }
          
      .modal2:before {
          content:"";
          display: none;
          position: fixed;
          background-color: rgba(0,0,0,0);
          top:0;
          left:0;
          height: 100vh; /* Use vh as a fallback for browsers that do not support Custom Properties */
          height: calc(var(--vh, 1vh) * 100);
          width:100%;
      z-index: 2;
      }
          
      .modal2:target .modal-container {
          transform:translate(-50%,  calc(var(--vh, 1vh) * -100));
  
  
  
      }
          
      .modal2:target:before {
          display:block;
      }  

      .center-img {

        margin-left: auto;
        margin-right: auto;
      }

/*terms end */