* {
   margin: 0px;
   padding: 0px;
   box-sizing: border-box;
   font-size: 16px;
   color: #5a5a5a;
   font-family: system-ui, -apple-system, BlinkMacSystemFont;
   letter-spacing: 0.5px;
   scroll-behavior: smooth;
}

body {
   min-height: 100dvh;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

@keyframes bounse {
   0% {
      transform: scale(90%);
   }

   50% {
      transform: scale(100%);
   }

   100% {
      transform: scale(90%);
   }
}

@keyframes blink {
   0% {
      opacity: 100%;
   }

   50% {
      opacity: 0%;
   }

   100% {
      opacity: 100%;
   }
}

.blink {
   animation: 1s blink infinite ease-in;
}

.bounse {
   animation: 1.4s bounse infinite ease-in;
}

img {
   max-width: 100%;
}

a {
   text-decoration: none;
   color: inherit;
   font-size: inherit;
}

h1 {
   font-size: 2rem;
   font-weight: 600;
   text-transform: capitalize;
}

h2 {
   font-size: 1.4rem;
   font-weight: 500;
   color: #4a4a4a;
   text-transform: uppercase;
}

h3 {
   font-size: 1.2rem;
   font-weight: 500;
}

h4 {
   font-size: 1.1rem;
   font-weight: 400;
}

form > div {
   gap: 0px 20px;
}

input[type='text'],
input[type='file'],
input[type='date'],
input[type='number'],
input[type='email'],
textarea {
   padding: 6px 10px;
   border-radius: 4px;
   outline: 1px solid #c3c3c3;
   border: none;
   width: 100%;
   min-width: 100px;
   height: 35px;
   margin-bottom: 10px;
}

input[type='radio'],
input[type='checkbox'] {
   margin-right: 10px;
}

input:focus,
textarea:focus {
   outline: 2px solid #004aad;
}

label {
   font-size: 0.9rem;
   padding-right: 20px;
   font-weight: 500;
}

main {
   padding: 20px 10vw;
   display: flex;
   flex-direction: column;
   gap: 20px;
   flex: 1;
   background-color: #bfd7ff;
}

section {
   background-color: #ffffff;
   border-radius: 0.2rem;
   width: 100%;
}

#contact-sec {
   padding: 20px 5vw;
}

#project-div {
   padding: 20px 20px 50px 20px;
}

#project-div p {
   font-size: 0.9rem;
}

#project-info-div {
   padding: 20px 3vw;
   justify-content: space-between;
   box-shadow: 2px 2px 5px 0px #a3a3a3;
   border-radius: 6px;
   margin-top: 20px;
}

#project-info-div span {
   font-weight: 500;
   font-size: 0.9rem;
}

#project-about-sec {
   display: flex;
   flex-direction: column;
   gap: 50px;
   padding: 20px 20px 50px 20px;
}

#project-about-sec > div {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

.grid,
.grid p {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 20px 5px;
}

.grid2 p {
   display: grid;
   grid-template-columns: 0.99fr 3fr;
   gap: 20px 5px;
}

.grid p > span,
.grid2 p > span {
   font-weight: 500;
}

.grid p > span::after,
.grid2 p > span::after {
   content: ':';
   float: right;
   padding-right: 10px;
   padding-left: 5px;
}

#links-div {
   gap: 5px;
   color: blue;
   font-weight: 400;
   font-size: 0.9rem;
   min-width: 200px;
}

#links-div > a > button {
   padding: 5px 30px;
   align-self: start;
   font-size: 0.9rem;
   border: none;
   margin: 10px 0px;
}

table {
   border-collapse: collapse;
   text-align: center;
   width: 100%;
}

thead {
   background-color: transparent;
}

td {
   font-size: 0.9rem;
   padding: 2px 10px;
   border: 1px solid #c1c1c1;
}

thead > tr > th {
   color: inherit;
   font-weight: 500;
   font-size: 0.9rem;
   padding: 5px 2px;
   border: 1px solid #c1c1c1;
}

tbody > tr > td:last-child {
   color: #004aad;
   font-weight: 500;
   font-style: italic;
   font-size: 0.8rem;
   background-color: #004aad14;
}

marquee {
   color: #004aad;
   font-size: 0.85rem;
   font-weight: 500;
   padding: 6px 0px;
}

ol,
ul {
   padding-left: 20px;
}

li {
   margin-bottom: 10px;
}

i {
   margin-right: 10px;
   color: inherit;
   font-size: 1em;
}

footer {
   background-color: #303030;
   text-align: center;
   padding: 20px 10vw;
   color: #a1a1a1;
   display: flex;
   flex-direction: column;
   gap: 20px;
}

footer p,
footer nav > a {
   color: inherit;
   font-size: 0.9rem;
}

.flex {
   display: flex;
}

.flex-col {
   display: flex;
   flex-direction: column;
}

.grow {
   flex-grow: 1;
}

.g1 {
   gap: 10px;
}
.g2 {
   gap: 20px;
}
.g3 {
   gap: 30px;
}
.g4 {
   gap: 40px;
}
.g5 {
   gap: 50px;
}

.mb1 {
   margin-bottom: 10px;
}
.mb2 {
   margin-bottom: 20px;
}
.mb3 {
   margin-bottom: 30px;
}
.mb5 {
   margin-bottom: 50px;
}

.pad1 {
   padding: 10px;
}
.pad2 {
   padding: 20px;
}
.pad5 {
   padding: 50px;
}

.txt-ctr {
   text-align: center;
}
.just-ctr {
   justify-content: center;
   justify-items: center;
}

.spc-btwn {
   justify-content: space-between;
}

.self-ctr {
   align-self: center;
}

.ali-ctr {
   align-items: center;
}

.wrap {
   flex-wrap: wrap;
}

.w5 {
   width: 50%;
}
.w10 {
   width: 100%;
}

.error {
   color: red;
   font-size: 0.8rem;
}

header {
   padding: 0px 10vw;
   box-shadow: 2px 2px 5px #bbb6b6;
}

.btn1,
button {
   background-color: #004aad;
   color: #ffffff;
   padding: 0.5em 1.6em;
   border-radius: 0.3rem;
   align-self: center;
   line-height: 1.2em;
   cursor: pointer;
   text-align: center;
   min-width: 160px;
}

.logo-img {
   width: max(250px, 15vw);
}

header nav > a {
   padding: 0.5rem 1rem;
   font-size: 1rem;
   font-weight: 600;
   color: #004aad;
}

footer nav > a {
   font-size: 1rem;
   color: #a1a1a1;
}

footer nav > a:not(:last-child)::after {
   content: '|';
   color: #a1a1a1;
   padding: 0px 10px;
}

/*registration Css*/
.sel-area {
   background-color: #ffd100;
   width: fit-content;
   padding: 8px 10px;
   border-radius: 6px;
   border: 1px solid #6f6f6f;
}

.sel-area > label {
   font-weight: 500;
   color: #000000;
}

.form-left {
   padding: 5px 0px;
   width: 35%;
}

.form-right {
   flex: 1;
   flex-shrink: 0;
}

.flex-input {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}

#regForm {
   display: flex;
   gap: 10px;
   flex-direction: column;
}

.inline-input {
   width: 49%;
}

#kyc-form {
   border: 1px solid;
   border-color: #c3c3c3;
   border-radius: 6px;
   padding: 20px;
   max-width: 700px;
   width: 100%;
}

#kyc-form input {
   margin-top: 5px;
   margin-bottom: 0px;
}

#kyc-form div {
   width: 100%;
   margin-bottom: 4px;
}

@media screen and (max-width: 650px) {
   .flex,
   .flex-col {
      flex-wrap: wrap;
   }

   main,
   header,
   footer {
      padding-left: 10px;
      padding-right: 10px;
      padding-bottom: 10px;
   }

   nav {
      width: 100%;
      justify-content: space-evenly;
   }

   .spc-btwn {
      justify-content: center;
   }

   .grid p > span::after,
   .grid2 p > span::after {
      float: none;
   }

   .grid,
   .grid2 {
      display: flex;
      flex-direction: column;
      gap: 20px 5px;
   }

   .grid > p,
   .grid2 > p {
      display: block;
   }

   .form-left {
      width: 100%;
   }
}

#fixed-btn {
   padding: 10px;
   position: sticky;
   bottom: 0;
}

#fixed-btn button {
   width: 100%;
}

#popUp-div {
   display: none;
   height: 100dvh;
   width: 100vw;
   position: fixed;
   background-color: #00000099;
   align-items: center;
   justify-content: center;
   z-index: 10;
   padding: 20px;
   transition: all 0.3s ease-in;
}

#popUp-content-div {
   padding: 20px;
   border-radius: 6px;
   background-color: #ffffff;
   width: min(500px, 100%);
}

#close-btn {
   display: flex;
   color: #000000;
   float: right;
   font-size: 1.4rem;
   line-height: 1.8rem;
   cursor: pointer;
}

p#thnks-text {
   font-size: 2rem;
   font-weight: 700;
}

#count-down {
   color: #004aad;
   font-weight: 500;
   font-size: 1.1rem;
}