
body {
    font-family: Poppins;
    margin: 0;
    padding: 0;

  }
  .main {
      height: 100vh;

      display: grid;
      grid-template-rows: 120px 1fr 100px;
  }


  .main .header{
      display: grid;

      grid-auto-flow:column;
      grid-template-columns: 180px 1fr;

    background-color: #246641;
  }



  /* DASHBOARD CSS */
  .main .content{

}

  .main .contents .area1{
    height: 100vh;
    width: 100%;
    /* background-color: #246641; */

  }
  .main .contents .area2-A{
    height: 100vh;
    width: 100%;
    /* background-color: #e0eb10; */
    
  }
  .main .contents .area2-B{
    height: 100vh;
    width: 100%;
    /* background-color: #245266; */
    
  }
  .main .contents .area3{
    height: 100vh;
    width: 100%;
    /* background-color: #666524; */
    
  }
  .main .contents .area4{
    height: 100vh;
    width: 100%;
    /* background-color: #ac0707; */
    
  }
  .main .contents .area5-A{
    height: 100vh;
    width: 100%;
    /* background-color: #662462; */
    
  }
  .main .contents .area5-B{
    height: 100vh;
    width: 100%;
    /* background-color: #243e66; */
    
  }



  .main .header .logo-container{

    padding: 10px 30px 10px 30px;
    display: grid;
    grid-auto-flow: row;

    align-items: center;
  }
  .main .header .title-container{
      display: grid;
      grid-auto-flow: row;

      align-items: center;
  }
  .main .header .title-container .title {
      font-family: Poppins;
      color: white;
      font-size: 1.6rem;
      font-weight:900;
  }
  .main .tracking{

      display: grid;
      grid-auto-flow: row;
      grid-template-rows: 20px 1fr 100px;

      padding: 10px 100px 10px 100px;
      background-color: #fbf9f9;
  }
  .main .tracking .header-tracking{
     font-family: Poppins;
     font-size: 1rem;
     font-weight:800;
  }
  .main .login-container{
    margin: 0px 100px;
  }
  .main .login-container .login{
    display: grid;
    grid-auto-flow: row;
    /* grid-template-rows: 60px 1fr; */

    background-color: rgb(248, 246, 246);
    border-radius: 8px;
    box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
    /* padding: 20px; */
    /* margin: 10px 0px; */
    width: 100%;
    height: 100%;
  }
  .main .login-container .login .forms{
    display: grid;
    place-items: center;
    /* display: flex;
    flex-direction: column;
    justify-content: center; */
  }
  .main .login .title h4 {
    margin:0;
    padding: 0;
    font-family: Poppins;
    font-weight: 900;
    font-size: 1.5rem;

  }
  .main .tracking .tracking-container .tracking-elements{
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 1fr 100px;
  }
  .main .login-container .login .forms .login-coltainer-input form{
    display: flex;
    flex-direction: column;
    gap: .4rem;
  }
  .main .login-container .login .forms .login-coltainer-input form h5{
    padding: 0;
    margin: 0;
  }
  .main .login-container .login .forms .login-coltainer-input .login-input{
    font-family: Poppins;
    font-weight: 700;
    /* width: 100%; */
    padding: 5px;
    border: 1px solid #246641;
    border-radius: 4px;
    font-size: 1rem;
  }
  .main .login-container .login .forms .login-container-button .login-button{
    font-family: Poppins;
    font-size: 1.5rem;
    font-weight: 700;
    background-color: #246641;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 8px 50px;
    cursor: pointer;
    /* width: 100%; */
    font-size: 14px;
  }

  .main .tracking .tracking-container .document-details .steps .step{
    font-family: Poppins;
    font-weight: 600;
    font-size: 1.1rem;
  }
  .main .tracking .tracking-container .document-details .steps{
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin: 10px 0px;
    /* width: 100%; */
  }
  .main .tracking .description-title {
      font-family: Poppins;
      font-size: 1rem;
      font-weight:800;
  }
  .main .tracking .description-body {
    font-family: Poppins;
    font-size: 1rem;
    font-weight:500;
  }
  .main .footer{

    padding: 10px 0;

    display: flex;
    justify-content: center;
    gap: 2rem;
      background-color: white;
  }
  .main .footer .address p{
    font-size: .7rem;
    margin: 0;
    padding: 1.4px;
    font-family: Arial, Helvetica, sans-serif;
  }






