body {
  font-family: 'Poppins', sans-serif;
  font-size:   16px;
  font-weight: 500;
  background:  #000;
  color:       #CCC;
}

a {
  outline: none;
  color:   #000;
}

a:hover {
  text-decoration: none;
  color:           #FFF;
}

a:active {
  text-decoration: none;
  color:           #FFF;
}

h1, h2 {
  color:          #FC0000;
  font-weight:    700;
  margin:         30px 0 80px;
  display:        block;
  letter-spacing: 7px;
}

hr {
  border:        2px solid #222;
  border-radius: 5px;
}

.navbar-dark .navbar-nav .nav-link {
  color:          #666;
  font-size:      18px;
  font-weight:    600;
  letter-spacing: 4px;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
  color: rgba(255, 255, 255, 1);
}

.body {
  min-height: 600px;
}

.owl-carousel .owl-dots {
  width:       100%;
  position:    absolute;
  text-align:  center;
  padding-top: 40px;
}

.owl-carousel .owl-dot {
  display:       inline-block;
  background:    #CCC;
  width:         16px;
  height:        16px;
  margin:        0 5px;
  border-radius: 8px;
}

.owl-carousel .owl-dots .active {
  background: rgba(227, 6, 19, 0.9);
}

.owl-carousel .owl-prev {
  font-size: 48px;
  display:   inline-block;
  position:  absolute;
  left:      5%;
  top:       46%;
  padding:   10px;
  color:     #FFF;
}

.owl-carousel .owl-next {
  font-size: 48px;
  display:   inline-block;
  position:  absolute;
  right:     5%;
  top:       46%;
  padding:   10px;
  color:     #FFF;
}

.owl-carousel .owl-prev:hover, .owl-next:hover {
  color: #CCC;
}

.owl-carousel .item {
  width:           100vw;
  height:          calc(100vh - 130px);
  display:         flex;
  justify-content: center;
  align-items:     center;
}

.owl-carousel .item .quote {
  font-size:   60px;
  text-align:  center;
  width:       100%;
  color:       #FFF;
  font-weight: 800;
  text-shadow: 0 0 10px #000;
}

.owl-carousel .item .author {
  font-size:   30px;
  text-align:  center;
  width:       100%;
  color:       #FC0000;
  font-weight: 600;
  text-shadow: 0 0 10px #000;
}

.director {
  font-size: 20px;
}

.director a {
  position:        relative;
  display:         flex;
  justify-content: center;
  align-items:     center;
}

.director i {
  position:    absolute;
  margin:      0 auto;
  z-index:     20;
  font-size:   72px;
  text-align:  center;
  color:       rgb(252, 0, 0);
  text-shadow: 0 0 5px #000;
}

.director img {
  -webkit-filter: grayscale(100%);
  filter:         grayscale(100%);
  transition:     all 1000ms;
  margin-bottom:  10px;
  margin-top:     30px;
  border:         2px solid #FFF;
}

.director img:hover {
  -webkit-filter: grayscale(0);
  filter:         grayscale(0);
  cursor:         pointer;
}


@media (max-width: 990px) {


  .director i {
    position:    absolute;
    margin:      0 auto;
    z-index:     20;
    font-size:   48px;
    text-align:  center;
    color:       rgb(252, 0, 0);
    text-shadow: 0 0 5px #000;
  }

  h1, h2 {
    color:          #FC0000;
    font-weight:    700;
    margin:         30px 0 80px;
    display:        block;
    letter-spacing: 2px;
    font-size:      24px;
  }

  .director {
    font-size: 14px;
  }

  .owl-carousel .item {
    width:           100vw;
    height:          calc(100vh - 130px);
    display:         flex;
    justify-content: center;
    align-items:     center;
  }

  .owl-carousel .item .quote {
    font-size:   24px;
    text-align:  center;
    width:       100%;
    color:       #FFF;
    font-weight: 800;
    text-shadow: 0 0 10px #000;
  }

  .owl-carousel .item .author {
    font-size:   16px;
    text-align:  center;
    width:       100%;
    color:       #FC0000;
    font-weight: 600;
    text-shadow: 0 0 10px #000;
  }

}