body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat' !important;
}
p, a {
    font-family: 'Roboto' !important;
}
.material-symbols-outlined {
    vertical-align: middle;
    line-height: 1px;
}
.navbar-brand > .material-symbols-outlined {
    font-size: 40px;
    user-select: none;
}
.about > .material-symbols-outlined {
    font-size: 50px;
    user-select: none;
}

.card > img {
    height: 250px;
    object-fit: contain;
}


/* Javascript Slide in animation */ 

.slide-in {
    transition: transform 0.8s ease, opacity 0.8s ease;
    opacity: 0;
    transform: translateY(50px);
}
.active-slides {
    transform: translateY(0);
    opacity: 1;
}
.hover-a {
    transition: 0.5s;
}
.hover-a:hover{
    transform: scale(1.1);
}

/* Flip Card */

.flip-card {
  perspective: 1000px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  min-height: 420px;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flipped .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  top: 0;
  left: 0;
}

.flip-card-back {
  transform: rotateY(180deg);
}

/* Badge scroller */

.scroll-container {
    scroll-behavior: smooth;
    overflow-x: auto;
    display: flex;
    scroll-snap-type:mandatory;

}
.scroll-item{
    min-width: 180px;
    flex: 0 0 100%;
    scroll-snap-align: start;
}
.scroll-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}
.left {
    left: 1.5em;
}
.right {
    right: 1.5em;
}