@import url("./header.css");
@import url("./footer.css");

/* *********** Template ************* */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --background: #b08ead;
  --basic-color: #fff;
  --basic-invert-color: #000;
  --web-color: #4b3049;
}

html{
  font-size: 1vw;
  scroll-behavior: smooth;
  overflow-x: hidden !important;
}

body {
  /* overflow-x: hidden; */
  font-family: "Poppins", sans-serif;
  background-color: #d9d9d9;
  font-size: 1rem;
  overflow-x: hidden;
}

ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

a {
  color: var(--basic-invert-color);
  text-decoration: none;
}

/* img {
  width: 100% !important;
  height: 100% !important;
  vertical-align: middle;
} */
main{
  background-color: #fff;
}

img{
  width: 100%;
  height: auto;
  object-fit: contain;
}

.container{
  max-width: 1250px;
}

section{
  padding: 50px 0;
}

p{
  margin: 0;
}

/* *********** Template ************* */




.menu-icon {
  display: flex;
  flex-direction: column;
  cursor: pointer;
}

.bar {
  width: 25px;
  height: 3px;
  background-color: #333;
  margin: 3px 0;
}

/* *********** Banner ************* */

.innerBanner{
  min-height: 300px;
  background: url("../Images/aboutBanner.jpg") no-repeat;
  background-size: cover;
  margin: auto;
  display: flex;
  align-items: center;
}
.innerBanner ul{
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}
.innerBanner ul li {
  font-size: 17px;
  color: #fff;
}

.innerBanner ul li a{
  color: #073f63;
  font-weight: bold;
}
.innerBanner h2{
  color: #fff;
  font-weight: bold;
  font-size: 40px;
  animation: 1s leftToright forwards;
}
.innerBanner p {
  color: #fff;
  animation: 3s leftToright forwards;
}

@keyframes leftToright {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }

  to {
    transform: translateX(0%);
    opacity: 1;
  }
}


#shadow-host-companion{
  padding:  0 !important;
}

@media only screen and (max-width: 800px) {
  html {
    font-size: 62.5%;
    scroll-behavior: smooth;
  }
}

@media only screen and (max-width: 500px) {
  .innerBanner p {
    color: #fff;
    font-size: 16px;
  }
}