/******************************************************************

Stylesheet: Mixins & Constants Stylesheet

This is where you can take advantage of Sass' great features:
Mixins & Constants.

******************************************************************/
/*********************
COLORS
*********************/
/*********************
CSS3 GRADIENTS.
*********************/
/* @include css-gradient(#dfdfdf,#f8f8f8); */
/*********************
ANIMATION MIXIN 
*********************/
/*********************
TRANSITIONS 
*********************/
/*********************
OPACITY
*********************/
/******************************************************************
  - MIXINS -
******************************************************************/
.page-template-template-landing-page .landing-grid-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media screen and (min-width: 768px) {
  .page-template-template-landing-page .landing-grid-container {
    padding: 0 1rem;
  }
}
.page-template-template-landing-page h1 {
  font-size: 72px;
}
.page-template-template-landing-page h2 {
  font-size: 48px;
}
.page-template-template-landing-page h3 {
  font-size: 20px;
  font-weight: 500;
}
.page-template-template-landing-page .slick-dots li button:before {
  font-size: 50px;
}

.page-template-template-landing-page .btn {
  text-decoration: none;
  padding: 0.75rem 1.25rem;
  cursor: pointer;
  -webkit-transition: 0.25s;
  transition: 0.25s;
  border-radius: 0.5rem;
}
.page-template-template-landing-page .btn.primary {
  color: #f5f5f5;
  background-color: #000;
}
.page-template-template-landing-page .btn.primary:hover {
  opacity: 0.7;
}
.page-template-template-landing-page .btn.secondary {
  background-color: #f5f5f5;
}
.page-template-template-landing-page .btn.secondary:hover {
  opacity: 0.7;
}