@font-face {
  font-family: "Outfit";
  src: url("/assets/fonts/Outfit-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 100 900; /* Full variable range */
  font-display: swap;
  font-style: normal;
}

html, body {
  height: 100%;
  margin: 0;
  background-color: #F6F7F8;
  font-family: 'Outfit', sans-serif;
}
h1 {
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  color: #444;
}
p {
  font-family: 'Outfit', sans-serif;
  font-weight: 400;
  font-size: 1.4rem;
}

.btn-lg {
  padding: 10px 32px 10px 32px;
}

.heading-kicker {
  display: block;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 32px;
  margin-bottom: 25px;
}
.heading-kicker--red {
  color: #de5656;
}
.heading-kicker--white {
  color: #fff;
}

/* header */
.header {
  color: #fff;
  background: rgb(9, 5, 69);
  background: linear-gradient(344deg, rgb(0 193 255) 0%, rgb(3 6 89) 100%);
}

.header__page--blue {
  background: rgb(77,181,217);
  background: linear-gradient(344deg, rgb(0 193 255) 0%, rgb(3 6 89) 100%);
}

.header__page--green {
  background: rgb(88,193,176);
  background: linear-gradient(90deg, rgba(88,193,176,1) 0%, rgba(99,215,185,1) 100%);
}

/* navigation */
.navbar {
  /* background-color: #353537;
  border-bottom: 4px solid #f25656; */
}

.navbar-brand {
  width: 25%;
}

.navbar-dark .navbar-toggler {
  color: #f25656;
  border: none;
}

.mmd-navbar-logo {
  width: 70%;
}

/* intro text */
.header__intro {}

.header__intro h1 {
  color: #fff;
  font-size: 2.5rem;
  padding: 0;
  margin-bottom: 32px;
}

@media (min-width: 768px) {
  .header__intro {
    padding-top: 30px;
    padding-bottom: 125px;
  }
  .header__intro h1 {
    color: #fff;
    font-size: 4.0rem;
    padding: 0;
    margin-bottom: 32px;
  }
  .header__intro p {
    margin-bottom: 50px;
  }
}

.header__intro__cdemo {}

/* main */
.main {}

/*  content section right aligned   */
.main__about {
  background-color: #ffe451;
  padding-top: 90%;
  padding-bottom: 50px;
  background-position: 0% 0%;
  background-repeat:no-repeat;
  background-size: 30%;
  background-image: url(/assets/img/product-design-devleopment-hero.svg);
}

.main__about h2 {
  color: #484848;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 32px;
}

.main__about h3 {
  color: #de5656;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 32px;
  margin-bottom: 18px;
}

@media (min-width: 768px) {
  .main__about {
    padding-top: 140px;
    padding-bottom: 140px;
    background-position: left;
    background-repeat:no-repeat;
    background-size: 40%;
  }
  .main__about--last {
    padding-bottom: 100px;
  }
  .main__about h2 {
    font-size: 3.5rem;
  }
  .main__about p {
    margin-bottom: 32px;
  }
}



/*  content section left aligned   */
.main__about-alt {
  padding-top: 90%;
  padding-bottom: 50px;
  background-position: 50% 0%;
  background-repeat:no-repeat;
  background-size: 100%;
  background-image: url(/assets/img/prototype-concept-app-development.svg);
}

.main__about-alt h2 {
  text-transform: uppercase;
  color: #091647;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 32px;
}

.main__about-alt h3 {
  color: #de5656;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 32px;
  margin-bottom: 18px;
}

@media (min-width: 768px) {
  .main__about-alt {
    background-color: #fd4069;
    padding-top: 140px;
    padding-bottom: 140px;
    background-position: right;
    background-repeat:no-repeat;
    background-size: 40%;
  }
  .main__about--last-alt {
    padding-bottom: 100px;
  }
  .main__about-alt h2 {
    font-size: 3.8rem;
    color: #091647;
  }
  .main__about-alt p {
    margin-bottom: 32px;
  }
}

/*  content section alt secondary right aligned   */
.main__about-alt-sec {
  padding-top: 90%;
  padding-bottom: 50px;
  background-position: 0% 0%;
  background-repeat:no-repeat;
  background-size: 100%;
  background-image: url(/assets/img/launch-and-content-support-hero.svg);
}

.main__about-alt-sec  h2 {
  color: #66C7D0;
  font-size: 2.5rem;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 32px;
}

.main__about-alt-sec  h3 {
  color: #de5656;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 32px;
  margin-bottom: 18px;
}

@media (min-width: 768px) {
  .main__about-alt-sec  {
    background-color: #091647;
    padding-top: 140px;
    padding-bottom: 140px;
    background-position: left;
    background-repeat:no-repeat;
    background-size: 40%;
  }
  .main__about--last-alt-sec  {
    padding-bottom: 100px;
  }
  .main__about-alt-sec  h2 {
    font-size: 3.8rem;
  }
  .main__about-alt-sec  p {
    color: #66C7D0;
    margin-bottom: 32px;
  }
}



/* MAIN CLIENTLIST */
.main__clientlist {
  background: #58B9F6;
  /* background: linear-gradient(90deg, rgba(255,110,89,1) 0%, rgba(255,150,85,1) 100%); */
}
.main__clientlist h2 {
  color: #fff;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 32px;
}
.main__clientlist h3 {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 32px;
  margin-bottom: 18px;
}
.main__clientlist p {
  color: #fff;
  margin-bottom: 32px;
}

@media (min-width: 768px) {
  .main__clientlist {
    padding-top: 100px;
    padding-bottom: 100px;
    background: #58B9F6;
  }
  .main__clientlist--last {
    padding-bottom: 100px;
  }
  .main__clientlist h2 {
    font-size: 3.8rem;
  }
  .main__clientlist p {
    color: #fff;
    margin-bottom: 32px;
  }
}


/* main page */
.main__page {}

.main__page--feature {
  padding-top: 65%;
  margin-top: 40px;
}

.main__page--feature h2 {
  color: #484848;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 32px;
}

.main__page--feature h3 {
  color: #de5656;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 32px;
  margin-bottom: 18px;
}

@media (min-width: 768px){
  .main__page--feature {
    margin-top: 0px;
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .main__page--feature h2 {
    font-size: 3.8rem;
  }
  .main__page--feature p {
    margin-bottom: 32px;
  }
}

/* FEATURE IMAGE CLASSES */
.feature-img__left {
  background-position: 0% 0%;
  background-repeat:no-repeat;
  background-size: 100%;
}

.feature-img__right {
  background-position: 100% 0%;
  background-repeat:no-repeat;
  background-size: 100%;
}

@media (min-width: 768px){
  .feature-img__left {
    background-position: left;
    background-repeat:no-repeat;
    background-size: 50%;
  }
  .feature-img__right {
    background-position: right;
    background-repeat:no-repeat;
    background-size: 50%;
  }
}




/* FOOTER */
.footer {
  background-color: #1b1b1b;
  color: #ccc;
  font-size: 0.9rem;
}

.footer a {
 text-decoration: none;
 color: #ccc;;
}

.footer a:hover {
  color: #EB4940;
}

.footer ul {
  list-style-type: none;
  padding-left: 0;
}

.footer__details {
  padding-top: 80px;
  padding-bottom: 80px;
}

.footer__details h3 {
  color: #de5656;
  font-size: 1.1rem;
  font-weight: 200;
  text-transform: uppercase;
}

.gomo-lead {
  text-transform: uppercase;
}
.gomo-yellow {
  color: #f1de09;
}