@font-face {
  font-family: "Serif72Beta Bold";
  src:  url("../fonts/serif72beta/serif72beta-bold-webfont.woff2") format("woff2"),
        url("../fonts/serif72beta/serif72beta-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Serif72Beta Regular";
  src:  url("../fonts/serif72beta/serif72beta-regular-webfont.woff2") format("woff2"),
        url("../fonts/serif72beta/serif72beta-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

body, html {
  height: 100%;
}

body {
  background: #fff;
  color: #000;
  font-family: 'Serif72Beta Regular', sans-serif;
  font-weight: normal;
}

/* Preloader */
.preloader {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999999999 !important;
  background-color: #fff;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.preloader .lds-ellipsis {
  display: inline-block;
  position: absolute;
  width: 80px;
  height: 80px;
  margin-top: -40px;
  margin-left: -40px;
  top: 50%;
  left: 50%;
}
.preloader .lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #000;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.preloader .lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}
.preloader .lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}
.preloader .lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}
.preloader .lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}

.preloader.preloader-dark {
  background-color: #000;
}
.preloader.preloader-dark .lds-ellipsis div {
  background-color: #fff;
}

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}
::selection {
  background: #000;
  color: #fff;
  text-shadow: none;
}

img {
  vertical-align: inherit;
}

a, a:focus {
  color: #000;
  text-decoration: none;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

a:hover, a:active {
  color: #000;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  text-decoration: underline;
}

a:focus, a:active,
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus,
button:focus,
button:active {
  outline: none;
}

p {
  line-height: 1.8;
}

blockquote {
  border-width: 0 0 0 5px;
  border-style: solid;
  border-color: #eee;
  padding: 10px 20px;
}

iframe {
  border: 0 !important;
}

h1, .h1 h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  color: #000;
  font-family: 'Serif72Beta Bold', sans-serif;
  font-weight: normal;
}

strong, .strong, bold {
  font-family: 'Serif72Beta Bold', sans-serif;
  font-weight: normal;
}

/* Helpers Classes */

.shadow {
  -webkit-box-shadow: 0px 0px 50px -35px rgba(0, 0, 0, 0.4) !important;
  box-shadow: 0px 0px 50px -35px rgba(0, 0, 0, 0.4) !important;
}

.text-spacing {
  letter-spacing: 0.2rem;
}

.text-0 {
  font-size: 11px !important;
  font-size: 0.6875rem !important;
}
.text-1 {
  font-size: 12px !important;
  font-size: 0.75rem !important;
}
.text-2 {
  font-size: 14px !important;
  font-size: 0.875rem !important;
}
.text-3 {
  font-size: 16px !important;
  font-size: 1rem !important;
}
.text-4 {
  font-size: 18px !important;
  font-size: 1.125rem !important;
}
.text-5 {
  font-size: 21px !important;
  font-size: 1.3125rem !important;
}
.text-6 {
  font-size: 24px !important;
  font-size: 1.50rem !important;
}
.text-7 {
  font-size: 28px !important;
  font-size: 1.75rem !important;
}
.text-8 {
  font-size: 32px !important;
  font-size: 2rem !important;
}
.text-9 {
  font-size: 36px !important;
  font-size: 2.25rem !important;
}
.text-10 {
  font-size: 40px !important;
  font-size: 2.50rem !important;
}
.text-11 { font-size: calc(1.4rem + 1.8vw) !important; }
.text-12 { font-size: calc(1.425rem + 2.1vw) !important; }
.text-13 { font-size: calc(1.45rem + 2.4vw) !important; }
.text-14 { font-size: calc(1.475rem + 2.7vw) !important; }
.text-15 { font-size: calc(1.5rem + 3vw) !important; }
.text-16 { font-size: calc(1.525rem + 3.3vw) !important; }
.text-17 { font-size: calc(1.575rem + 3.9vw) !important; }
.text-18 { font-size: calc(1.625rem + 4.5vw) !important; }
.text-19 { font-size: calc(1.65rem + 4.8vw) !important; }
.text-20 { font-size: calc(1.7rem + 5.4vw) !important; }
.text-21 { font-size: calc(1.775rem + 6.3vw) !important; }
.text-22 { font-size: calc(1.825rem + 6.9vw) !important; }
.text-23 { font-size: calc(1.9rem + 7.8vw) !important; }
.text-24 { font-size: calc(1.95rem + 8.4vw) !important; }
.text-25 { font-size: calc(2.025rem + 9.3vw) !important; }

@media (min-width: 1200px) {
  .text-11 { font-size: 2.75rem !important; }
  .text-12 { font-size: 3rem !important; }
  .text-13 { font-size: 3.25rem !important; }
  .text-14 { font-size: 3.5rem !important; }
  .text-15 { font-size: 3.75rem !important; }
  .text-16 { font-size: 4rem !important; }
  .text-17 { font-size: 4.5rem !important; }
  .text-18 { font-size: 5rem !important; }
  .text-19 { font-size: 5.25rem !important; }
  .text-20 { font-size: 5.75rem !important; }
  .text-21 { font-size: 6.5rem !important; }
  .text-22 { font-size: 7rem !important; }
  .text-23 { font-size: 7.75rem !important; }
  .text-24 { font-size: 8.25rem !important; }
  .text-25 { font-size: 9rem !important; }
}

.text-11, .text-12, .text-13, .text-14, .text-15, .text-16, .text-17, .text-18, .text-19, .text-20, .text-21, .text-22, .text-23, .text-24, .text-25 { line-height: 1.3; }

.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }
.fw-900 { font-weight: 900 !important; }

.opacity-0 { opacity: 0; }
.opacity-1 { opacity: 0.1; }
.opacity-2 { opacity: 0.2; }
.opacity-3 { opacity: 0.3; }
.opacity-4 { opacity: 0.4; }
.opacity-5 { opacity: 0.5; }
.opacity-6 { opacity: 0.6; }
.opacity-7 { opacity: 0.7; }
.opacity-8 { opacity: 0.8; }
.opacity-9 { opacity: 0.9; }
.opacity-10 { opacity: 1; }

hr { opacity: 0.1; }

.text-primary { background-color: #000; }
.text-secondary { background-color: #ec008b; }

.text-color-fade {
  animation: changeTextColor 20s infinite;
}
@keyframes changeTextColor {
  0% {
    color: #ec008b;
  }
  25% {
    color: #FFD84A;
  }
  50% {
    color: #2377FF;
  }
  75% {
    color: #38C776;
  }
  100% {
    color: #ec008b;
  }
}

.bg-primary { background-color: #000; }
.bg-secondary { background-color: #ec008b; }

.bg-color-fade {
  animation: changeBackgroundColor 20s infinite;
}
@keyframes changeBackgroundColor {
  0% {
    background-color: #ec008b;
  }
  25% {
    background-color: #FFD84A;
  }
  50% {
    background-color: #2377FF;
  }
  75% {
    background-color: #38C776;
  }
  100% {
    background-color: #ec008b;
  }
}

/* Layouts */

#main-wrapper {
  background: #fff;
}
.section {
  position: relative;
  padding: 104px 0;
  padding: 6.5rem 0;
  overflow: hidden;
}
@media (max-width: 575.98px) {
  .section {
    padding: 3.5rem 0;
  }
}
.fullscreen {
  min-height: 100vh !important;
}
.fullscreen-with-header {
  min-height: calc(100vh - 67px) !important;
}

#footer {
  background: #fff;
  padding: 4.125rem 0;
}

.branding {
  width: 340px;
}
@media (max-width: 480px) {
    .branding {
        width: 270px;
    }
}

/* Button */

.btn {
  padding: 0.8rem 2.6rem;
  border-width: 0px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-decoration: none;
  border: none;
}
.btn:hover, .btn:focus {
  text-decoration: none;
}

/* Hero Background */

.hero-wrap {
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.hero-wrap .hero-mask, .hero-wrap .hero-bg, .hero-wrap .hero-bg-slideshow {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.hero-wrap .hero-bg-slideshow {
  position: fixed;
}
.hero-wrap .hero-mask {
  z-index: 1;
}
.hero-wrap .hero-content {
  position: relative;
  z-index: 3;
}
.hero-wrap .hero-particles {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.hero-wrap .hero-bg-slideshow {
  z-index: 0;
}
.hero-wrap .hero-bg {
  z-index: 0;
  background-attachment: fixed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  transition: background-image 300ms ease-in 200ms;
}
.hero-wrap .hero-bg.hero-bg-scroll {
  background-attachment: scroll;
}
.hero-wrap .hero-bg-slideshow .hero-bg {
  background-attachment: inherit;
}
.hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .item {
  height: 100vh;
  width: 100%;
  min-height: 700px;
}

.hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-1, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-2, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-3, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-4, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-5, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-6, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-7, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-8, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-9, .hero-wrap .hero-bg-slideshow.owl-carousel .owl-item .intro-bg-10 {
  background-size: cover;
}