/* ************************************************************************** */
/* GENERAL */
/* ************************************************************************** */
body {
  background-color: #E5E7EB;
}

.p-17-user {
  padding: 17px;
  padding-left:18px;
  padding-right:18px;
}
.p-18-user {
  padding: 18px;
}
.p-19-user {
  padding: 19px;
  padding-left:18px;
  padding-right:18px;
}
.p-20-user {
  padding: 20px;
  padding-left:18px;
  padding-right:18px;
}
.p-21-user {
  padding: 21px;
  padding-left:18px;
  padding-right:18px;
}
.sub {
  background-color: red;
  border:1px solid black;
}
.active {
  background-color: rgba(209, 213, 219);
}
.menu-mega {
-webkit-animation: slide-in .8s ease-out forwards;
        animation: slide-in .8s ease-out forwards;
                          transition: opacity 5s;

}

.max-w-600 {
  width: 100%;
  max-width: 600px;
}
  
/* ************************************************************************** */
/* ANIMATIONS */
/* ************************************************************************** */
@-webkit-keyframes slide-in {
  0% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
  }
}
@keyframes slide-in {
  0% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
  }
}

/* chevron down */
.gg-chevron-down {
  width: 20px;
  height: 20px;
}
.gg-chevron-down::after {
  width: 7px;
  height: 7px;
  left: 4px;
  top: 3px
}

/* play stop */
.gg-play-stop {
  width: 6px;
  height: 6px;
}

/* ************************************************************************** */
/* RESPONSIVE */
/* ************************************************************************** */
@media (max-width: 767px) {
  body {
    background-color: #ffffff;
  }
}