:root {
  --color-primary: #191d2b;
  --color-secondary: #27AE60;
  --color-white: #FFFFFF;
  --color-black: #000;
  --color-grey0: #f8f8f8;
  --color-grey-1: #dbe1e8;
  --color-grey-2: #b2becd;
  --color-grey-3: #6c7983;
  --color-grey-4: #454e56;
  --color-grey-5: #2a2e35;
  --color-grey-6: #12181b;
  --br-sm-2: 14px;
  --box-shadow-1: 0 3px 15px rgb(0,0,0,.3);
}

.section {
  background-color: var(--color-primary);
}

.sec1 {
  display: none;
  transform: translateY(0) scale(1);
}

.sec2 {
  display: none;
  transform: translateY(0) scale(1);
}

.sec3 {
  display: none;
  transform: translateY(0) scale(1);
}

.active {
  display: block;
  -webkit-animation: scaleAnim 1s ease-in-out;
          animation: scaleAnim 1s ease-in-out;
}
@-webkit-keyframes scaleAnim {
  0% {
    transform: translateY(-100%) scale(0);
  }
  100% {
    transform: translateY(0%) scale(1);
  }
}
@keyframes scaleAnim {
  0% {
    transform: translateY(-100%) scale(0);
  }
  100% {
    transform: translateY(0%) scale(1);
  }
}/*# sourceMappingURL=mystyles.css.map */