@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Poppins:400,600,700&display=swap");
* {
  margin: 0;
  padding: 0;
}

body {
  height: 100%;
  background-color: white;
  overflow-x: hidden;
  font-family: Poppins;
}

ul,
ol {
  list-style: none;
}

h1 {
  font-weight: 500;
}

h2 {
  font-weight: 400;
}

@keyframes slider {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -100vw 0;
  }
}
@keyframes typewriter {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
.bg-grey {
  background: #16181c;
}

.bg-white-smoke {
  background-color: #f5f5f5;
}

.bg-orange {
  background-color: #FF8A00;
}

@media (max-width: 1024px) {
  .hidden-md-down {
    display: none;
  }
}

color-primary {
  color: #ff8a00;
}

color-dark {
  color: #16181C;
}

color-white {
  color: white;
}

.text-weight-600 {
  font-weight: 600;
}

.text-weight-700 {
  font-weight: 700;
}

.text-weight-800 {
  font-weight: 800;
}

.text-weight-900 {
  font-weight: 900;
}

.text-wrap-400 {
  width: 100% !important;
  max-width: 400px !important;
}

.page-header {
  min-height: 70px;
  background-color: white;
}

.page-header .navbar-brand {
  cursor: pointer;
  font-size: 20px;
  color: black;
}

.page-header .navbar-toggler {
  outline: none;
  font-size: 1.5rem;
}

@media only screen and (max-width: 600px), (min-width: 768px) and (max-width: 992px) {
  .page-header .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu {
    border-color: transparent;
  }
}

.page-header .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item {
  font-size: 17px;
  color: #c1c6cb;
}
.page-header .navbar-collapse .navbar-nav .nav-item.dropdown .dropdown-menu .dropdown-item .dropdown-icon {
  margin: 10px;
}

.page-header .nav-item {
  cursor: pointer;
  font-size: 17px;
  font-weight: 400;
  text-decoration: none;
}

.page-header .nav-link {
  color: black;
}
.page-header .nav-link.dropdown-toggle:after {
  display: none;
}

.page-header.page-header--primary {
  background-color: #ff8a00;
}
.page-header.page-header--primary .navbar-brand, .page-header.page-header--primary .nav-link, .page-header.page-header--primary .navbar-toggler {
  color: white;
}

.page-content {
  position: relative;
  margin-bottom: 400px;
  background-color: white;
  z-index: 2;
}
@media (max-width: 767px) {
  .page-content {
    margin-bottom: 0;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .page-content {
    margin-bottom: 0;
  }
}

.page-footer {
  z-index: 1;
  width: 100%;
  position: fixed;
  bottom: 0;
  font-size: 16px;
  background-color: #ff8a00;
  color: white;
}
@media (max-width: 767px) {
  .page-footer {
    position: relative;
    text-align: center;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .page-footer {
    position: relative;
  }
}

.page-footer .page-footer-brand {
  padding-top: 5%;
  padding-bottom: 5%;
}

.page-footer .page-footer-brand .page-footer-brand__logo {
  color: white;
  text-align: center;
}

.page-footer .page-footer-brand .page-footer-brand__about {
  font-size: 16px;
  max-width: 400px;
  margin: auto;
}

.page-footer .page-footer-navigation {
  padding-top: 5%;
  padding-bottom: 5%;
  display: inline-flex;
  justify-content: space-evenly;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .page-footer .page-footer-navigation {
    justify-content: space-between;
  }
}

@media (max-width: 767px) {
  .page-footer .page-footer-navigation {
    flex-direction: column;
  }
}

.page-footer .page-footer-navigation .page-footer-navigation-list {
  list-style: none;
}

.page-footer .page-footer-navigation .page-footer-navigation-list li {
  padding-top: 2px;
  padding-bottom: 2px;
}

.page-footer .page-footer-navigation .page-footer-navigation-list .page-footer-navigation-list__title {
  font-weight: bold;
}

.page-footer .page-footer-social {
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-footer .page-footer-social .page-footer-social-list {
  text-align: center;
}

.page-footer .page-footer-social .page-footer-social-list__item {
  margin: 0 10px;
}

.page-footer .page-footer-social .page-footer-social-list__item a {
  font-size: 30px;
  color: white;
}

.page-footer .page-footer-social .page-footer-social-list__item a i {
  transition: all 0.3s ease-in;
}
.page-footer .page-footer-social .page-footer-social-list__item a i:hover {
  transform: scale(1.2);
}

.page-footer .page-footer-copyright {
  background-color: #F66C13;
  color: white;
  text-align: center;
  padding: 10px 0px 10px;
}

.form-control:focus {
  border-color: #ff8a00;
  box-shadow: none;
  -webkit-box-shadow: none;
}

.btn-large {
  font: 20px/1.35 "BrandonText", Helvetica, Arial, sans-serif;
  min-width: 270px;
  padding: 13px 30px 15px;
  border: 0;
  border-radius: 55px;
  text-align: center;
}
.btn-large--primary {
  background: #F66C13;
  color: white;
}
.btn-large--primary:hover {
  background: white;
  color: #ff8a00;
  text-decoration: none;
}
.btn-large--primary:focus {
  outline: 0;
}
.btn-large--dark {
  background: #16181C;
  color: white;
}
.btn-large--darkhover {
  background: white;
  color: #16181C;
  text-decoration: none;
}
.btn-large--dark:focus {
  outline: 0;
}

.btn-outline {
  font: 20px/1.35 "BrandonText", Helvetica, Arial, sans-serif;
  min-width: 270px;
  padding: 13px 20px 15px;
  outline: none;
  border: 2px solid #F66C13;
  border-radius: 50px;
  text-align: center;
  background: white;
  color: #F66C13;
}
.btn-outline:focus {
  outline: 0;
}

.alert h3 {
  color: #FF8A00;
}

.alert h6 {
  color: #363636;
}

.hero {
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  user-select: none;
}

.hero .hero-container {
  align-items: center;
  margin-top: auto;
  margin-bottom: auto;
  padding-right: 15px;
  padding-left: 15px;
}

.hero .hero-container .hero-container__title {
  text-align: center;
  font-size: 45px;
}
@media (max-width: 767px) {
  .hero .hero-container .hero-container__title {
    font-size: 25px;
    text-align: center;
  }
}

.hero .hero-container .hero-container__subtitle {
  font-size: 25px;
  text-align: center;
}
@media (max-width: 767px) {
  .hero .hero-container .hero-container__subtitle {
    font-size: 20px;
  }
}

.hero .hero-container .hero-container__intro {
  margin: 0 auto;
  max-width: 790px;
  font-size: 20px;
  text-align: center;
}
@media (max-width: 767px) {
  .hero .hero-container .hero-container__intro {
    text-align: center;
    max-width: 570px;
  }
}

.hero .hero-container .hero-container__title,
.hero-container__subtitle {
  font-weight: 500;
}

.hero .hero-container .hero-container__title {
  color: none;
}

.hero .hero-container .hero-container__subtitle {
  max-width: 900px;
  margin: auto;
}

.hero--bg-primary {
  background-color: #ff8a00;
}
.hero--bg-primary .hero-container__title,
.hero--bg-primary .hero-container__subtitle {
  color: white !important;
}

.description-list {
  list-style: none;
  margin: 0;
  padding: 0 15px 0;
}

.description-list .description-list-item {
  padding: 20px 0 20px;
  width: 100%;
  margin: 0;
}

.description-list .description-list-item .description-list-item__title {
  padding: 0 0 15px;
  font-size: 20px;
}
.description-list .description-list-item .description-list-item__text {
  padding: 0;
  text-align: justify;
  margin: auto;
}
@media (max-width: 767px) {
  .description-list .description-list-item .description-list-item__text {
    text-align: left;
  }
}
.description-list .description-list-item .description-list-item__list {
  list-style: none;
  display: flex;
  flex-direction: row;
}
.description-list .description-list-item .description-list-item__list li {
  font-weight: 600;
  padding-right: 15px;
}
@media (max-width: 767px) {
  .description-list .description-list-item .description-list-item__list {
    flex-direction: column;
  }
}
@media (max-width: 767px) {
  .description-list .description-list-item {
    text-align: left;
  }
}

.social-list {
  margin: 50px 0 0 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  font-size: 2.5em;
}
.social-list i {
  text-decoration: none;
}

.card-service {
  text-align: center;
}
.card-service:hover {
  background: #ffffff;
  box-shadow: 0 8px 24px 0 rgba(0, 0, 0, 0.1);
}

.card-service a {
  color: inherit;
}
.card-service a:hover {
  text-decoration: none;
}

.card-service .card-service__title {
  max-width: 300px;
  margin: auto;
  color: black;
}
.card-service .card-service__subtitle {
  color: black;
}
@media (max-width: 1028px) {
  .card-service .card-service__intro {
    display: none;
  }
}
.card-service .card-service__read-more {
  color: grey;
  font-size: 15px;
  text-decoration: underline;
}

.section {
  padding-top: 100px;
  padding-bottom: 100px;
}
@media (max-width: 767px) {
  .section {
    text-align: center;
  }
}

.section .section-info, .section .card-service {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 35px;
  padding-bottom: 35px;
}

.section .section-info .section-info__big-title, .section .card-service .section-info__big-title {
  text-align: left;
  font-size: 60px;
  padding-top: 25px;
  padding-bottom: 25px;
}
@media (max-width: 767px) {
  .section .section-info .section-info__big-title, .section .card-service .section-info__big-title {
    font-size: 2rem;
    text-align: center;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .section .section-info .section-info__big-title, .section .card-service .section-info__big-title {
    font-size: 2rem;
    text-align: center;
  }
}

.section .section-info .section-info__title, .section .card-service .section-info__title, .card-service .section .section-info .card-service__title, .section .card-service .card-service__title {
  padding-top: 25px;
  padding-bottom: 25px;
  text-align: center;
}

.section .section-info .section-info__subtitle, .section .card-service .section-info__subtitle {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}
@media (max-width: 767px) {
  .section .section-info .section-info__subtitle, .section .card-service .section-info__subtitle {
    text-align: center;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .section .section-info .section-info__subtitle, .section .card-service .section-info__subtitle {
    text-align: center;
  }
}

.section .section-info .section-info__intro, .section .card-service .section-info__intro {
  line-height: 1.5;
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .section .section-info .section-info__intro, .section .card-service .section-info__intro {
    text-align: center;
  }
}

.section .section-info .section-info__figure, .section .card-service .section-info__figure {
  text-align: center;
  font-size: 45px;
}

.section .section-image {
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
  padding-top: 35px;
  padding-bottom: 35px;
}

.section.section--bg-white-smoke {
  background-color: #f5f5f5;
}
.section.section--bg-primary {
  color: white;
  background-color: #ff8a00;
}
.section.section--bg-primary .section-info__title, .section.section--bg-primary .card-service .card-service__title, .card-service .section.section--bg-primary .card-service__title,
.section.section--bg-primary .section-info__subtitle,
.section.section--bg-primary .section-info__intro {
  color: white;
}
.section.section--bg-dark {
  background-color: #16181C;
}
.section.section--bg-dark .section-info__title, .section.section--bg-dark .card-service .card-service__title, .card-service .section.section--bg-dark .card-service__title,
.section.section--bg-dark .section-info__subtitle,
.section.section--bg-dark .section-info__intro {
  color: white;
}

.section-info--centered {
  display: flex;
  align-items: center;
  text-align: center;
}
.section-info--not-selectable {
  user-select: none;
}

.section-info__intro--mw-570 {
  max-width: 570px;
}

.concept-gallery {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
}

.concept-gallery .concept-gallery-item:nth-child(1) {
  position: absolute;
  z-index: 1;
  left: 15%;
  width: 15%;
  max-width: 240px;
}
.concept-gallery .concept-gallery-item:nth-child(1) .concept-gallery-item__img {
  max-width: 100%;
  height: auto;
  opacity: 1;
}
.concept-gallery .concept-gallery-item:nth-child(2) {
  position: absolute;
  z-index: 2;
  left: 25%;
  width: 17%;
  max-width: 320px;
}
.concept-gallery .concept-gallery-item:nth-child(2) .concept-gallery-item__img {
  max-width: 100%;
  height: auto;
  opacity: 1;
}
.concept-gallery .concept-gallery-item:nth-child(3) {
  position: relative;
  z-index: 3;
  right: 0;
  width: 30%;
  max-width: 350px;
}
.concept-gallery .concept-gallery-item:nth-child(3) .concept-gallery-item__img {
  max-width: 100%;
  height: auto;
}
.concept-gallery .concept-gallery-item:nth-child(3) .concept-gallery-item__gif {
  position: absolute;
  z-index: 4;
  width: 80%;
  max-width: 215px;
  top: 5%;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.concept-gallery .concept-gallery-item:nth-child(4) {
  position: absolute;
  z-index: 2;
  right: 25%;
  width: 17%;
  max-width: 320px;
}
.concept-gallery .concept-gallery-item:nth-child(4) .concept-gallery-item__img {
  max-width: 100%;
  height: auto;
  opacity: 1;
}
.concept-gallery .concept-gallery-item:nth-child(5) {
  position: absolute;
  z-index: 1;
  right: 15%;
  width: 15%;
  max-width: 240px;
}
.concept-gallery .concept-gallery-item:nth-child(5) .concept-gallery-item__img {
  max-width: 100%;
  height: auto;
  opacity: 1;
}

.code-editor {
  counter-reset: line-counter;
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 400px;
  min-height: 550px;
  background-color: #151718;
}
@media (max-width: 768px) {
  .code-editor {
    min-height: 450px;
  }
}

.code-editor .code-editor-header {
  height: 45px;
  text-align: left;
  padding: 15px;
}
.code-editor .code-editor-header span:nth-child(1) {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 15px;
  line-height: 45px;
  vertical-align: top;
  background-color: #ff5f56;
}
.code-editor .code-editor-header span:nth-child(2) {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 15px;
  line-height: 45px;
  vertical-align: top;
  background-color: #ffbd2e;
}
.code-editor .code-editor-header span:nth-child(3) {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 15px;
  line-height: 45px;
  vertical-align: top;
  background-color: #27c93f;
}

.code-editor .code-editor-body {
  text-align: left;
  padding: 15px 0;
  margin-left: 45px;
  color: #c9c9c9;
  font: 10px/1.5 monospace;
}
@media (max-width: 768px) {
  .code-editor .code-editor-body {
    font-size: 6px;
  }
}

.code-editor .code-editor-body .code-row {
  position: relative;
  display: block;
}
.code-editor .code-editor-body .code-row :before {
  counter-set: line-counter1;
  content: counter(line-counter);
  position: absolute;
  left: -32px;
  width: 15px;
  color: #75767a;
  text-align: right;
}

.code-editor .code-editor-body .code-row .white-space::after {
  content: " ";
}
.code-editor .code-editor-body .code-row .comment {
  color: grey;
}
.code-editor .code-editor-body .code-row .tab {
  margin-left: 1.5em;
}
.code-editor .code-editor-body .code-row .keyboard--lead {
  color: #97accd;
}
.code-editor .code-editor-body .code-row .keyboard--red {
  color: red;
}
.code-editor .code-editor-body .code-row .keyboard--orange {
  color: #e88c5f;
}
.code-editor .code-editor-body .code-row .keyboard--yellow {
  color: #ffbc41;
}
.code-editor .code-editor-body .code-row .keyboard--green {
  color: #c3e88d;
}
.code-editor .code-editor-body .code-row .keyboard--purple {
  color: #c792ea;
}
.code-editor .code-editor-body .code-row .keyboard--blue {
  color: #3eb6ff;
}

@media (max-width: 768px) {
  .dev-scheme {
    flex-wrap: wrap;
  }
}
.dev-scheme {
  display: flex;
  justify-content: space-evenly;
  text-align: center;
  align-items: center;
}

.dev-scheme .dev-scheme__item {
  margin: 10px;
}

.contact {
  color: white;
  background-color: #ff8a00;
  padding-top: 150px;
  padding-bottom: 150px;
}

.contact .contact-container {
  text-align: center;
  padding-right: 15px;
  padding-left: 15px;
}

.contact .contact-container .contact-container__title {
  padding-bottom: 20px;
  font-weight: 600;
}

.contact .contact-container .contact-container__text {
  padding-bottom: 20px;
  max-width: 780px;
  margin: 0 auto 0;
}

.contact .contact-container .contact-container__button {
  background: #F66C13;
  color: white;
  width: 270px;
  border: 0;
  border-radius: 55px;
  padding: 13px 30px 15px;
  font-size: 18px;
}
.contact .contact-container .contact-container__button:hover {
  background: white;
  color: #ff8a00;
  text-decoration: none;
}
.contact .contact-container .contact-container__button:focus {
  outline: 0;
}

.divider {
  height: 2px;
  width: 200px;
  max-width: 200px;
  margin: 30px auto 30px;
  background: #ff8a00;
}
.divider.divider--white {
  background: white;
}

.has-divider:after {
  content: "";
  position: relative;
  display: block;
  margin: 30px auto 30px;
  max-width: 200px;
  height: 2px;
  background: #ff8a00;
}
.has-divider.has-divider--white:after {
  position: relative;
  display: block;
  content: "";
  height: 2px;
  width: 200px;
  max-width: 200px;
  margin: 30px auto 30px;
  background: white;
}

.framework {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 45vh;
  overflow: hidden;
  background: #F7F7F7 url("https://ebit-software.com/assets/media/internal/frameworks.png") repeat;
  background-size: 80vw auto;
  background-position: 0 0;
  animation: slider 45s linear infinite;
}

.framework .framework-card {
  position: relative;
  text-align: center;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 2px 4px rgba(50, 50, 50, 0.1);
  opacity: 1;
  width: 80vw;
  padding-top: 25px;
  padding-bottom: 25px;
}
@media (max-width: 767px) {
  .framework .framework-card {
    width: 100vh;
  }
}

.framework .framework-card .framework-card__title {
  font-weight: 600;
}
@media (max-width: 767px) {
  .framework .framework-card .framework-card__title {
    max-width: 300px;
    margin: auto;
  }
}

.framework .framework-card .framework-card__button {
  background-color: #FF9D00;
  color: white;
  margin: 3vh;
  padding: 14px 24px;
  border: 0 none;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.ui-scheme .ui-scheme__device-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ui-scheme .ui-scheme__device-wrap .ui-scheme__device {
  position: relative;
  width: 100%;
  max-width: 300px;
}
.ui-scheme .ui-scheme__device-wrap .ui-scheme__device-gif {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-top: 4em;
  width: 100%;
  max-width: 250px;
}