html {
  scroll-behavior: smooth;
}

body { font-family: 'Open Sans Condensed', sans-serif; }

h1, h2, h3, h4 { color: #fff; font-family: 'Oswald', sans-serif; font-weight: bold; text-align: center; margin: 0px auto; max-width: 80%; padding: 0px; width: auto; }
h1, h2 {  font-size: 98px; line-height: 118px; }
h3 { font-size: 62px; }
h4 { font-size: 42px; margin: 10px auto 0 auto; }
p { color: #111; font-family: 'Open Sans Condensed', sans-serif; font-size: 18px; font-weight: normal; line-height: 22px; margin: 20px 8pc 20px 8pc; text-align: left; }

a, a:hover, a:focus, a.active { color: #3300ff; text-decoration: underline; }

.black { color: #111; }
.img-centered { margin: 0 auto; }

div.item { background-size: cover; background-repeat: no-repeat; color: #fff; height: 100%; margin: 0 auto; position: relative; padding: 30% 0; width: 100%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
section .row-fluid, footer { padding: 40px 0; }

/* Carousel Control */
.carousel, .carousel-inner { transform: translate3d(0px, 0px, 0px); }
.carousel .carousel-control { background: none; border: none; font-size: 120px; line-height: 120px; text-decoration: none; top: 35%; }
.carousel .carousel-text { margin: auto auto; position: absolute; top: 30%; width: 100%; }

/* Footer */
footer { background-color: #000; padding-bottom: 80px; }
footer p { color: #fff; }

@media (max-width:1050px) {
  h1, h2 { font-size: 68px; line-height: 98px; }
  h3 { font-size: 40px; }
  h4 { font-size: 26px; }
}

@media (max-width:773px) {
  h1, h2 { font-size: 58px; line-height: 76px; }
  h3 { font-size: 32px; }
  h4 { font-size: 28px; }
  .carousel .carousel-text { top: 30%; }
  div.item { padding: 27% 0; }
}

@media (max-width:700px) {
  div.item { background-size: cover; padding: 34% }
}

@media (max-width: 620px) {
  h1, h2 { font-size: 48px; line-height: 66px; }
  h3 { font-size: 28px; }
  h4 { font-size: 24px; }
  p { margin: 15px 4pc 15px 4pc; }
}

@media (max-width: 530px) {
  h1, h2 { font-size: 42px; line-height: 48px; }
  h3 { font-size: 24px; }
  h4 { font-size: 22px; }
  p { margin: 15px 2pc 15px 2pc; }
  .carousel .carousel-control { font-size: 80px; line-height: 80px; top: 35%; }
}

@media (max-width: 460px) {
  h1, h2 { font-size: 36px; line-height: 36px; }
  h3 { font-size: 28px; }
  h4 { font-size: 22px; }
  .carousel .carousel-control { font-size: 60px; line-height: 60px; top: 35%; }
}

@media (max-width: 366px) {
  h1, h2 { font-size: 26px; line-height: 32px; }
  h3 { font-size: 18px; }
  h4 { font-size: 14px; }
}