/* 1) Import fonts */
@import url('https://fonts.googleapis.com/css?family=Asul:700|Asul:400');

/* 2) Base resets & fonts */
body {
  transition: all 0.6s ease;
  font-family: 'Asul', sans-serif;
  font-weight: 400;
}
.content-wrapper {
  width: 100%;
}
h1,h2,h3,h4,h5 {
  font-family: 'Asul', sans-serif;
  font-weight: 700;
}
html { font-size: 100%; } /* 16px */

/* 3) Heading sizes */
h1 { font-size: 4.210rem; }  /* 67.36px */
h2 { font-size: 3.158rem; }  /* 50.56px */
h3 { font-size: 2.369rem; }  /* 37.92px */
h4 { font-size: 1.777rem; }  /* 28.48px */
h5 { font-size: 1.333rem; }  /* 21.28px */
small { font-size: 0.750rem; } /* 12px */

/* Disable dragging inside carousels */
.carousel img {
  -webkit-user-drag: none;
  user-drag: none;
  user-select: none;
}

/* Modal animation */
#modal-wrapper {
  transform: scale(0.1);
  opacity: 0;
  transition:
    transform 0.6s cubic-bezier(0.2, 0, 0, 1),
    opacity 0.4s ease-out 0.1s;
}
#modal-wrapper.open {
  transform: scale(1);
  opacity: 1;
}

/* Active tab scaling */
.tab-button.tab-active {
  transform: scale(1.35) !important;
}