:root {
    --md-linear-progress-track-height: 4px;
    --md-linear-progress-track-shape: 4px;
    --md-linear-progress-active-indicator-height: 4px;
    --md-linear-progress-track-color:white;
    --md-linear-progress-active-indicator-color:#002d62;
    --md-sys-color-surface-container-highest: white;
    --md-outlined-button-container-shape: 0px;
    --md-outlined-button-label-text-font: system-ui;
    --md-sys-color-primary: #00FFFF;
    --md-sys-color-secondary: #e3e3e3;
    --md-sys-color-outline: #002d62;
    --md-sys-shape-corner-full:0 px;
    --md-filled-button-label-text-font:system-ui;
    --md-sys-color-outline-variant: #BEC9C8;
    --md-divider-thickness: 2px;
    --md-filled-button-container-color:#002d62;
    --md-radio-selected-icon-color:#002d62;
    --md-radio-icon-color:#002d62;
    --md-filled-select-text-field-container-shape: 0px;
    --md-filled-select-text-field-container-color: white;
    --md-filled-select-text-field-input-text-color: #002d62;
    --md-filled-select-text-field-input-text-font: system-ui;
      }

      md-filled-select::part(menu) {
      --md-menu-container-color: #f4fbfa;
      --md-menu-container-shape: 0px;
    }

    body{
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    /**font-family: "Poppins", sans-serif;*/
    }

    html{
      font-size: 18px;
    }

    h1{
      font-size: 2rem;
      color: #002d62;
    }

    h5{
      font-size: 0.7rem;
    }

    .vsaas_btn{
      margin: 3px;
      --md-text-button-label-text-color:#002d62;
      font-size: smaller;
      width: fit-content;
      height: fit-content;
    }
  /*Base html**/
  .blog-bar{
    color: black;
  }
  .imgh
  {
    width: 12vw;
  }
  .content{
    margin: 0;
    padding: 0;
    margin-bottom: 100px;
    visibility: hidden;
  }
  .topmenu{
    float: inline-end;
    font-size: 0.75rem;
    display: block;
  }
  .header{
      background-color: #002d62;
      margin-top: 0px;
      display: flex;
      margin-bottom: 0px;
      padding-bottom: 20px;
      margin-inline: 0px;
      visibility: hidden;
    }
  .line_space{
    line-height: 1.5rem;
  }
  
  .demo_div{
      width: 100%;
    }
    .demo
    {
      padding-left: 15%;
      padding-right: 15%;
      padding-top: 25px;
      color: #002d62;
      font-size: 0.9rem;
      line-height: 1.25rem;
      /*font-weight: 300;
      font-style: normal;*/
      text-align: center;
    }
    .bar-vsaas{
      background: #002d62;
      padding-left: 2%;
      padding-right: 2%;
      display: flex;
    }
    img{
      display: block;
    }
   .bar{
    display: flex;
    border: 0px solid red;
    /*min-height: 300px;*/
    max-height: max-content;
    padding-bottom: 20px;
   }
   .third{
    flex: 1;
    /*min-height: 100px;*/
    max-height: max-content;
    padding: 20px;
    text-align: center;
    color: white;
    border: 0px solid green;
    font-size: small;
    font-weight: 100;
    font-style: normal;
   }
   .customization_bar
   {
    height: fit-content;
    display: flex;
    padding-bottom: 0;
   }
   .customize-child
   {
    height: fit-content;
    flex: 1;
    padding-left: 2%;
    padding-right: 2%; 
   }
   .more_customizations
   {
    text-align: center;
    color: #002d62;
    font-weight: 500;
   }
   .half{
    flex: 1;
    /*min-height: 100px;*/
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 20px;
    text-align: justify;
    font-weight: 200;
    font-style: normal;
    max-height: fit-content;
    border: 0px solid yellow;
   }
   .fifth{
    height: fit-content;
    flex: 1;
    padding-left: 18px;
    padding-right: 18px;
    font-size: 0.7rem;
    text-align: justify;
    color: #e3e3e3;
    border: 0px solid yellow;
    text-decoration-color: white;
    font-weight: 100;
    font-style: normal;
   }
  .CTA{
    background-color: #002d62;
    color: white;
    text-align: center;
    align-content: center;
    padding-top: 50px;
    padding-bottom: 50px;
    font-family: "Poppins", sans-serif;;
    }
    .CTA-primary{
        font-size: 1.8rem;
        font-weight: 500;
        font-style: normal;
    }
    .CTA-secondary{
        font-size: 1.4rem;
        font-weight: 200;
        font-style: normal;
    }
    a{
        color: #00FFFF;
    }
    .fifth-child{
      color: #e3e3e3;
      text-decoration: none;
    }
    .contact-icon
    {
      font-size:18px; 
      width: 12px; 
      height:12px; 
      vertical-align: middle;
      padding-right: 5px;
      padding-left: 5px;
    }
   .footer{
    display: flex;
    min-height:300px;
    line-height: 1.2rem;
    border: 0px solid grey;
    padding-bottom: 0;
    margin-bottom: 0;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 30px;
    text-align: center;
    background: #b0b0b0;
   }
   .bar-portal{
    display: flex;
   }
   .third-portal{
    flex: 1;
    height: 450px;
    border: 0px solid green;
   }
   .third-portal1{
    flex: 1;
    height: 225px;
    border: 0px solid green;
   }
   .sixth{
    flex: 1;
    height: fit-content;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 1px;
    padding-right: 1px;
    margin: 1px;
    font-size: small;
    text-align: center;
   }
   .termsconditions
   {
    font-size: xx-small;
    font-weight: 20;
    color: #B0B0B0;
   }
   /* HTML marker styles */
.price-tag, .price-tag1 {
  background-color: #002d62;
  border-radius: 8px;
  color: #FFFFFF;
  font-size: 14px;
  padding: 10px 15px;
  position: relative;
}

.price-tag::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 0);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #002d62;
}
.fleetitem
{
  text-align: center;
}
.videoframe{
  height: auto;
  width: 100%;
  border: 0;
}

table{
  border-collapse: collapse;
  width: 100%;
  border-spacing: 0;
  border: 1px solid #ddd;
}

th,td{
  text-align: left;
  padding: 8px;
  font-size: 0.8rem;
  color: #b0b0b0;
}
th{color: #002d62;}

tr:nth-child(even){
  background-color: teal;
}

.butn-options{
  height: fit-content;
  width: fit-content;
  padding: 0;
  margin: 0;
  position: absolute;
  background: transparent;
  background-color: white;
  opacity: 0.35;
  border: none;
  padding: 0;
  top:75%;
  
}
   @media only screen and (max-width:900px) {
        .bar,.bar-portal,.parent-third,.customization_bar,.third{
          height: max-content;
          display: block;
          flex: none;
        
        }
        html{
          font-size: 16px;
        }
        .bar-vsaas{
          display: block;
          padding: 0;
        }
        .half,.fifth{
          width: fit-content;
          display: block;
        }
        .footer{
            height: fit-content;
            display: block;
            
        }
        .demo{
          padding-left: 10%;
          padding-right: 10%;
          font-size: 0.75rem;
        }
        .imgh{
          width: 20vw;
        }
        h1{
         font-size: 1.6rem;
        }
        h3{
          font-size: 1.2rem;
          color: #002d62;
        }
        h4{
          font-size: 1rem;
          color: #002d62;
        }
        .CTA-primary{
        font-size: 1.4rem;
        }
        .CTA-secondary{
        font-size: 1.2rem;
        }
        .topmenu{
          display: none;
        }

      }

/***********************Fonts*************************************/
.poppins-thin {
  font-family: "Poppins", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.poppins-extralight {
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.poppins-light {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.poppins-regular {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.poppins-medium {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.poppins-semibold {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.poppins-bold {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.poppins-extrabold {
  font-family: "Poppins", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.poppins-black {
  font-family: "Poppins", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.poppins-thin-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.poppins-extralight-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  font-style: italic;
}

.poppins-light-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.poppins-regular-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.poppins-medium-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.poppins-semibold-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-style: italic;
}

.poppins-bold-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.poppins-extrabold-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 800;
  font-style: italic;
}

.poppins-black-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 900;
  font-style: italic;
}
.roboto-trans {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}