@font-face {

  font-family: 'FontAwesome';

  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot');

  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),

    url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2') format('woff2'),

    url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.woff') format('woff'),

    url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.ttf') format('truetype'),

    url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.svg#fontawesomeregular') format('svg');

  font-weight: normal;

  font-style: normal;

  font-display: swap;

}


@font-face {

  font-family: 'Poppins';

  src: url('https://fonts.gstatic.com/s/poppins/v15/pxiByp8kv8JHgFVrLEj6Z1xlFQ.woff2') format('woff2'),

    url('https://fonts.gstatic.com/s/poppins/v15/pxiByp8kv8JHgFVrLEj6Z1xlFQ.woff') format('woff');

  font-weight: normal;

  font-style: normal;

  font-display: swap;


}


body {
  font-family: "source-sans-pro", sans-serif;
}


all {
  font-family: "source-sans-pro", sans-serif;
}

.containeer {
  font-family: "source-sans-pro", sans-serif;
}

@media (max-width:598px) {
  .containeer {
    margin: 35% auto 7%;
  }
}


.footer-mail-color{
  color: #ffffffcc !important;
}

.banner-informations-container {
  background: transparent url('../images/banner-bg-img.webp') center no-repeat padding-box;
  background-repeat: no-repeat;
  background-size: 102% 113%;
  padding-top: 0%;
  /* width: 83.33%; */
  padding-left: 11%;
  display: flex;
  flex-direction: row;
  color: white;
  justify-content: space-between;
  height: 17.56rem;
  margin: 6.25rem 5%;
}

.informations-container:hover {
  box-shadow: -0.0625rem 0.375rem 0.5rem #33475Bcc;
}

.info-icon-container {
  position: relative;
  left: 2%;
  top: 33%;
  height: 1.50rem;
  width: 1.50rem;
}

.banner-tooltiptext {
  visibility: hidden;
  width: 12.13vw;
  background-color: #ffffff;
  border-radius: 0.625rem;
  padding: 0.75rem 0.25rem;
  position: absolute;
  z-index: 1;
  top: 255%;
  font-style: normal;
  font-size: 0.875rem;
  font-weight: 600;
  font-family: Poppins;
  line-height: 1.31rem;
  letter-spacing: 0rem;
  color: #6A1DD3;
  text-align: center;
}

.info-icon-container .banner-tooltiptext::after {
  content: "";
  position: absolute;
  bottom: 97%;
  left: 45%;
  text-align: center;
  margin-left: 0rem;
  border-width: 0.75rem;
  border-style: solid;
  border-color: transparent transparent #ffffff transparent;
}

.banner-informations-container .banner-text-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-bottom: 0%;
  margin-left: 1.3%;
}

.inner-img-container-info img {
  margin-left: 0%;
  max-width: 80%;

}

.banner-heading {
  font-family: "source-sans-pro", sans-serif;
  color: #ffffff;
  font-size: 3.365rem;
  padding-top: 0%;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  padding-bottom: 0%;
  line-height: 4.81rem;
}

.banner-heading img {
  height: auto;
  width: 120%;
  margin-left: 91%;
  margin-top: 0%;
}

.banner-content {
  font-family: "source-sans-pro", sans-serif;
  color: #ffffff;
  font-size: 2.31rem;
  font-style: normal;
  font-weight: 400;
  margin-top: 1%;
  line-height: 3rem;
}

.banner-bottom-content {
  font-family: "source-sans-pro", sans-serif;
  color: #ffffff;
  font-size: 2.31rem;
  padding-top: 2%;
  padding-bottom: 1%;
  font-weight: 600;
  line-height: 3rem;
}

.inner-img-container-info {
  position: relative;
  bottom: 0% !important;
  top: 10%;
  right: 2.83%;
}

.info-icon-container .banner-tooltiptext {
  opacity: 0;
  transition: opacity 1s;
}

.info-icon-container:hover {
  cursor: pointer;
}
.info-icon-container:hover .banner-tooltiptext {
  visibility: visible;
  opacity: 1;
}

.about-container {
  font-family: "source-sans-pro", sans-serif;
  margin: 8% 5%;
  z-index: 1;

}

.about-container .titles {
  color: #33475B;
  font-size: 1.875rem;
  font-weight: 600;
  font-family: "source-sans-pro", sans-serif;
  letter-spacing: 0rem;
}

.about-container .content {
  color: #33475B;
  font-size: 0.875rem;
  font-family: "source-sans-pro", sans-serif;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0rem;

}


.headings {
  line-height: 1.6;
  font-size: 1.125rem;
  font-family: "source-sans-pro", sans-serif;

}

.content {
  font-family: "source-sans-pro", sans-serif;
  line-height: 1.875rem;
  font-size: 1rem;
}

.row {
  margin: 0;
}


@media (min-width:2559px) {

  .about-container .titles {
    font-size: 2.81rem;
    line-height: 4rem;
  }

  .about-container .content {
    font-size: 1.875rem;
    line-height: 2.69rem;
  }

  .banner-informations-container {
    height: 17.25rem;
    margin: 6.875rem 20%;
    padding-left: 8%;

  }

  .banner-heading {

    font-size: 3.25rem;
    line-height: 4.81rem;
  }

  .info-icon-container {
    position: relative;
    left: 3%;
    top: 0%;
    height: 2rem;
    width: 2rem;
  }

  .banner-tooltiptext {
    width: 13vw;
    border-radius: 0.375rem;
    padding: 0.75rem 0.25rem;
    top: 226%;
    margin-left: 0rem;
    left: -9rem;
    font-size: 0.875rem;
    line-height: 1.31rem;
  }

  .inner-img-container-info {
    top: 11%;
    right: 3.83%;
  }

  .inner-img-container-info img {
    max-width: 100%;
  }

  .about-container {
    margin-top: 4%;
    margin-left: 20%;
    margin-right: 20%;
  }
}

@media (min-width:1920px) and (max-width:2558px) {

  .banner-informations-container {
    margin: 10% 8%;
  }

  .inner-img-container-info {
    position: relative;
    bottom: 0% !important;
    top: 13%;
    right: 2.83%;
  }

  .info-icon-container {
    left: 2%;
    top: -4%;
    height: 1.68rem;
    width: 1.68rem;
  }

  .banner-tooltiptext {
    width: 14.5rem;
    border-radius: 0.375rem;
    padding: 0.75rem 0.25rem;
    top: 255%;
    margin-left: 0rem;
    left: -6.375rem;
    font-size: 0.875rem;
    line-height: 1.31rem;
  }

  .inner-img-container-info img {
    margin-left: 0%;
    max-width: 100%;
  }

  .info-icon-container .banner-tooltiptext::after {
    content: "";
    position: absolute;
    bottom: 95%;
    left: 50%;
    padding: 0rem 0rem;
    margin-left: -0.875rem;
    border-width: 0.8125rem;
    border-style: solid;
    border-color: transparent transparent #ffffff transparent;
  }

  .about-container {
    font-family: "source-sans-pro", sans-serif;
    margin: 8% 8% 8% 8%;
  }

  .about-container .titles {
    margin-top: 4rem;
    font-size: 2.81rem;
    line-height: 4rem;
  }

  .about-container .content {
    font-size: 1.875rem;
    line-height: 2.69rem;
  }


}

@media (min-width:1440px) and (max-width:1919px) {

  .banner-informations-container {
    height: 16.5rem;
    margin: 6.875rem 5%;
    padding-left: 12%;
  }

  .banner-informations-container .banner-text-container {
    margin-left: 2%;
  }

  .banner-heading {
    font-size: 2.38rem;
    padding-top: 0%;
    padding-bottom: 0%;
    line-height: 4rem;
  }

  .info-icon-container {
    position: relative;
    left: 4.5%;
    top: 0%;
  }

  .banner-tooltiptext {
    width: 13.13vw;
    padding: 0.65rem 0.1rem;
    top: 247%;
    left: -5.5rem;
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.31rem;
  }

  .banner-content {
    font-size: 1.625rem;
    margin-top: 1%;
    line-height: 2.625rem;
  }

  .banner-bottom-content svg {
    width: auto;
    height: 45%;
  }

  .banner-bottom-content {
    font-size: 1.625rem;
    padding-bottom: 1%;
    line-height: 3.31rem;
  }

  .inner-img-container-info {
    top: 16%;
    right: 0%;
  }

  .inner-img-container-info img {
    margin-left: 0%;
    width: 90%;
    max-width: 100%;
    height: auto;
  }

  .about-container {
    margin: 10% 5% 8% 5%;
  }

  .container {
    margin-left: 0rem;
  }

  .about-container .titles {
    margin-top: 2%;
    font-size: 2.25rem;
    font-weight: 600;
  }

  .about-container .content {
    font-size: 1.5rem;
  }

}

@media (min-width:1231px) and (max-width:1439px) {

 
  .about-container {
    margin: 10% 6% 8% 6.5%
  }

  .about-container .titles {
    font-size: 1.625rem;

  }

  .about-container .content {
    font-size: 1.125rem;

  }

  .banner-informations-container {
    height: 13rem;
    margin: 6.875rem 6%;
    padding-left: 7%;
  }

  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    left: 8%;
  }

  .banner-heading {
    font-size: 1.9rem;
    padding-top: 0%;
    padding-bottom: 0%;
    line-height: 3.125rem;
  }

  .info-icon {
    height: 75%;
    width: 75%;
  }

  .info-icon-container {
    left: 3%;
    top: 0%;
}

  .banner-tooltiptext {
    width: 13.13vw;
    border-radius: 0.5rem;
    padding: 0.45rem 0.45rem;
    top: 200%;
    left: -303%;
    font-size: 0.55rem;
    line-height: 1.1rem;
  }

  .info-icon-container .banner-tooltiptext::after {
    left: 45%;
    border-width: 0.56rem;
  }

  .banner-content {
    font-size: 1.3rem;
    line-height: 2.375rem;
  }

  .banner-bottom-content {
    font-size: 1.3rem;
    padding-top: 3%;
    padding-bottom: 1%;
    line-height: 2rem;
  }

  .banner-bottom-content svg {
    width: auto;
    height: 45%;
  }

  .inner-img-container-info {
    bottom: 0% !important;
    top: 13.8%;
    left: 6%;
  }

  .inner-img-container-info img {
    width: 73%;
    height: auto;
  }

}

@media (min-width:1024px) and (max-width:1230px) {


  .about-container {

    margin: 14% 5% 7%;
  }

  .about-container .titles {
    font-size: 1.625rem;

  }

  .about-container .content {
    font-size: 1.0625rem;

  }

  .banner-informations-container {
    height: 11rem;
    margin: 6.875rem 5%;
    padding-left: 2%;
  }

  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    left: 14%;
  }

  .banner-heading {
    font-size: 1.75rem;
    padding-top: 0%;
    padding-bottom: 0%;
    line-height: 3rem;
  }

  .info-icon {
    height: 85%;
    width: 85%;
  }

  .info-icon-container {
    left: 5.5%;
    top: 0%;
  }

  .banner-tooltiptext {
    width: 14.13vw;
    border-radius: 0.5rem;
    padding: 0.45rem 0.45rem;
    top: 200%;
    left: -240%;
    font-size: 0.55rem;
    line-height: 1.1rem;
  }

  .info-icon-container .banner-tooltiptext::after {
    left: 45%;
    border-width: 0.56rem;
  }

  .banner-content {
    font-size: 1.125rem;
    line-height: 2rem;
  }

  .banner-bottom-content {
    font-size: 1.125rem;
    padding-top: 2%;
    padding-bottom: 1%;
    line-height: 2rem;
  }

  .banner-bottom-content svg {
    width: auto;
    height: 28%;
  }

  .inner-img-container-info {
    bottom: 0% !important;
    top: 14%;
    right: 4%;
  }

  .inner-img-container-info img {
    width: 63%;
    height: auto;
    float: right;
  }

}

@media (min-width:767px) and (max-width:1023px) {
  .about-container {
    margin-top: 12%;
  }

  .about-container .titles {
    font-size: 1.625rem;
  }

  .about-container .content {
    font-size: 0.9375rem;

  }

  .banner-informations-container {
    height: 9rem;
    margin: 6.875rem 5%;
    padding-left: 0%;
    justify-content: space-evenly;
  }

  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    left: 14%;
  }

  .banner-heading {
    font-size: 1.5rem;
    padding-top: 0%;
    padding-bottom: 0%;
    line-height: 3rem;
  }

  .info-icon {
    height: 65%;
    width: 65%;
  }

  .info-icon-container {
    left: 2.5%;
    top: 1%;
  }

  .banner-tooltiptext {
    width: 14.13vw;
    border-radius: 0.5rem;
    padding: 0.45rem 0.45rem;
    top: 166%;
    left: -265%;
    font-size: 0.41rem;
    line-height: 1.1rem;
  }

  .info-icon-container .banner-tooltiptext::after {
    left: 45%;
    border-width: 0.56rem;
  }

  .banner-content {
    font-size: 1rem;
    line-height: 2rem;
  }

  .banner-bottom-content {
    font-size: 1rem;
    padding-top: 2%;
    padding-bottom: 1%;
    line-height: 2rem;
  }

  .banner-bottom-content svg {
    width: auto;
    height: 28%;
  }

  .inner-img-container-info {
    bottom: 0% !important;
    top: 14%;
    right: 4%;
    width: 50%;
  }

  .inner-img-container-info img {
    width: 16.25rem;
    height: auto;
    float: right;
  }

}

@media (min-width:425px) and (max-width:766px) {

  .bar_icon {
    display: block;
    position: absolute;
    right: 3.68rem;
    top: 0.9375rem;
    cursor: pointer;
  }

  .patch-container {
    padding: 0.2rem 0rem;
    margin-top: 0.75rem;
    z-index: -1;
    background-size: cover;
    margin-left: 3%;
    margin-right: 3%;
    border-radius: 0.5rem;
  }

  .patch-container:hover {
    padding: 0.2rem 0rem;
    margin-top: 0.75rem;
    z-index: -1;
    background-size: cover;
    margin-left: 3%;
    margin-right: 3%;
    border-radius: 0.5rem;
}

.patch-text h3 {
  font-size: 0.75rem;
  line-height: 1.25rem;
}
  .patch-button {
    font-size: 0.625rem;
    line-height: 1rem;
    border-radius: 0.25rem;
    margin: 0rem 0.5rem;
    padding: 0.1rem 0.5rem;
}

  .nav-section {
    margin-top: 3.5rem;
  }

  .about-container {
    margin: 19% 5% 10% 5%;
    position: relative;
    z-index: 0;
    margin-top: 7rem;
}

  .about-container .titles {
    font-size: 1.5rem;
  }

  .about-container .content {
    font-size: 0.875rem;
  }

  .banner-informations-container {
    height: 8.5rem;
    margin: 6.875rem 5%;
    padding-left: 0%;
    justify-content: space-evenly;
  }

  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    left: 14%;
    width: 70%;
  }

  .banner-heading {
    font-size: 1.35rem;
    padding-top: 0%;
    padding-bottom: 0%;
    line-height: 3rem;
  }

  .info-icon {
    height: 65%;
    width: 65%;
  }

  .info-icon-container {
    left: 2.5%;
    top: 0%;
  }

  .banner-tooltiptext {
    width: 16vw;
    border-radius: 0.5rem;
    padding: 0.45rem 0.45rem;
    top: 166%;
    left: -190%;
    font-size: 0.41rem;
    line-height: 1.1rem;
  }

  .info-icon-container .banner-tooltiptext::after {
    left: 45%;
    border-width: 0.56rem;
  }

  .banner-content {
    font-size: 0.875rem;
    line-height: 2rem;
  }

  .banner-bottom-content {
    font-size: 0.875rem;
    padding-top: 2%;
    padding-bottom: 1%;
    line-height: 2rem;
  }

  .banner-bottom-content svg {
    width: auto;
    height: 28%;
  }

  .inner-img-container-info {
    bottom: 0% !important;
    top: 19%;
    right: 2%;
    width: 50%;
  }

  .inner-img-container-info img {
    width: 80%;
    height: auto;
    float: right;
  }
}


@media(max-width:600px) {

  .inner-img-container-info {
    display: none;
  }

  .banner-informations-container {

    justify-content: center;
  }


  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    width: auto;
    left: 0%;
    justify-content: center;
    padding: 5%;
  }
}

@media(max-width:424px) {

  
  .containeer {
    margin: 20% 6% 10%;
    margin-top: 7rem;
  }

  .about-container .titles {
    font-size: 1.5rem;
  }

  .about-container .content {
    font-size: 0.875rem;
  }

  .banner-informations-container {
    height: 9rem;
    margin: 4.375rem 5%;
    padding-left: 0%;
  }


  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    width: 100%;
    left: 0%;
    justify-content: center;
    padding: 5%;
  }

  .banner-heading {
    font-size: 1.125rem;
    padding-top: 5%;
    padding-bottom: 0%;
    line-height: 1.875rem;
  }

  .info-icon-container {
    left: 2%;
    top: 0%;
  }

  .info-icon {
    height: 65%;
    width: 65%;
  }

  .banner-tooltiptext {
    width: 30.13vw;
    border-radius: 0.5rem;
    padding: 0.35rem 0.3rem;
    top: 127%;
    left: -235%;
    text-align: center;
    font-size: 0.5rem;
  }

  .info-icon-container .banner-tooltiptext::after {
    left: 45%;
    border-width: 0.56rem;
  }

  .banner-content {
    font-size: 0.75rem;
    margin-top: 0%;
    line-height: 2rem;
  }

  .banner-bottom-content {
    font-size: 0.875rem;
    padding-top: 0%;

    line-height: 1.5rem;
  }

  .banner-bottom-content svg {
    width: 7%;
    height: 40%;
  }

  .inner-img-container-info {
    display: none;
  }

  .inner-img-container-info img {
    width: 100%;
    height: 100%;
  }


}

@media (max-width:374px) {

  .about-container .content {
    font-size: 0.75rem;
  }
  .banner-informations-container .banner-text-container {
    margin-left: 0%;
    position: relative;
    width: auto;
    left: 0%;
    justify-content: center;
    padding: 0%;
  }

  .banner-heading {
    font-size: 1.rem;
    padding-top: 5%;
    padding-bottom: 0%;
    line-height: 1.5rem;
  }

  .banner-tooltiptext {
    width: 30.13vw;
    border-radius: 0.5rem;
    padding: 0.35rem 0.3rem;
    top: 127%;
    left: -235%;
    text-align: center;
    font-size: 0.35rem;
  }

  .info-icon-container .banner-tooltiptext::after {
    left: 45%;
    border-width: 0.56rem;
  }

  .banner-content {
    font-size: 0.625rem;
    margin-top: 0%;
    line-height: 1.5rem;
  }

  .banner-bottom-content {
    font-size: 0.6255rem;
    padding-top: 0%;

    line-height: 1.5rem;
  }

  .banner-bottom-content svg {
    width: 7%;
    height: 40%;
  }

  .inner-img-container-info {
    display: none;
  }

  .inner-img-container-info img {
    width: 100%;
    height: 100%;
  }
}