@import url("https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@200;300;400;500;600;700;800&family=:Ralewaywght@200;300;400;500;600;700;800&display=swap");
* {
  -webkit-font-smoothing: subpixel-antialiased; }

::-moz-selection {
  color: #061523;
  background: #061523; }

::selection {
  color: #FEFEFE;
  background: #061523; }

::-webkit-scrollbar {
  width: 15px; }

::-webkit-scrollbar-track {
  background: #f8f8f8;
  border: none; }

::-webkit-scrollbar-thumb {
  background: #061523;
  opacity: 0.8; }

::-webkit-scrollbar-thumb:hover {
  opacity: 1; }

.mobile-break {
  display: none; }

.mobile-hide {
  display: inline; }

a {
  text-decoration: none; }

ul {
  list-style: none;
  margin: 0; }

li {
  list-style: none;
  margin: 0; }

h1, h2, h3, h4, h5, h6, p {
  text-transform: none;
  margin: 0; }

.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6, .entry-content p {
  text-transform: none;
  margin: 0; }

h1, h2 {
  font-family: "Montserrat Alternates", "Arial", sans-serif;
  font-size: 4.8vw;
  line-height: 5.28vw;
  font-weight: 600;
  letter-spacing: 0.05rem; }

body {
  overflow: hidden;
  margin: 0;
  padding: 0; }

.preloader {
  z-index: 100;
  position: absolute;
  height: 100vh;
  width: 100vw;
  background: #061523;
  transform: translateY(-500vh);
  opacity: 0;
  animation: preload 2.5s linear 1; }

h6 {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  padding: 0;
  transform: translate(-50%, -50%);
  font: 0.7vw "Raleway", "Arial", sans-serif;
  font-weight: 600;
  letter-spacing: 0.15rem;
  text-transform: uppercase;
  color: #FEFEFE; }

h6:before {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #eac435;
  overflow: hidden;
  animation: animateText 2s linear 1; }

@keyframes animateText {
  0% {
    width: 0; }
  100% {
    width: 99%; } }
@keyframes preload {
  0% {
    transform: none;
    opacity: 1; }
  90% {
    transform: none;
    opacity: 1; }
  100% {
    transform: translateY(-500vh);
    opacity: 0; } }
header {
  z-index: 2;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  padding: 0 15vw;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center; }
  header .logo-wrapper {
    height: 100%;
    min-width: 250px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center; }
    header .logo-wrapper .logo {
      height: 25px;
      width: 25px;
      margin-right: 2vw;
      opacity: 0.85; }
      header .logo-wrapper .logo svg {
        width: 100%;
        height: 100%;
        fill: #FEFEFE; }
  header .name, header .contact {
    font: 0.7vw "Raleway", "Arial", sans-serif;
    font-weight: 300;
    letter-spacing: 0.1rem;
    color: #FEFEFE;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }
  header a {
    opacity: 1;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }
  header a:hover {
    opacity: 0.85; }
  header a:hover .name, header a:hover .contact {
    letter-spacing: 0.15rem; }

#site-content {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  background: url(https://assets.codepen.io/1682163/BG.jpg) no-repeat center center;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }

.slider {
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: default;
  -webkit-transition: 0.8s;
  -moz-transition: 0.8s;
  -o-transition: 0.8s;
  transition: 0.8s; }

.slider-left {
  z-index: 1;
  margin-top: 4.8vw;
  height: 90%;
  width: 100%; }

@keyframes preloadNavbar {
  0% {
    transform: scale(0);
    opacity: 0; }
  80% {
    transform: scale(0);
    opacity: 0; }
  90% {
    opacity: 0; }
  100% {
    transform: scale(1);
    opacity: 1; } }
.navbar-indicator {
  display: none; }

.navbar {
  z-index: 10;
  width: 100%;
  height: 100px;
  position: absolute;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: preloadNavbar 3s 1s ease-in-out 1; }

.navbar-perso {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }
  .navbar-perso .navbar-dot {
    margin-bottom: -5px;
    height: 14px;
    width: 14px;
    border-radius: 100%;
    background-color: #FEFEFE;
    opacity: 0.5;
    animation: 5s dotAnimate infinite;
    transform: scale(0.15); }
  .navbar-perso .navbar-dot:nth-child(1) {
    animation-delay: 0s; }
  .navbar-perso .navbar-dot:nth-child(2) {
    animation-delay: 0.4s; }
  .navbar-perso .navbar-dot:nth-child(3) {
    animation-delay: 0.8s; }
  .navbar-perso .navbar-dot:nth-child(4) {
    animation-delay: 1.2s; }
  .navbar-perso .navbar-dot:nth-child(5) {
    animation-delay: 1.6s; }
  .navbar-perso .navbar-dot:nth-child(6) {
    animation-delay: 2s; }
  .navbar-perso .navbar-dot:nth-child(7) {
    animation-delay: 2.4s; }
  .navbar-perso .navbar-dot:nth-child(8) {
    animation-delay: 2.8s; }
  .navbar-perso .navbar-dot.activedot {
    transform: scale(1);
    opacity: 1;
    transition: all 0.3s ease; }

@keyframes dotAnimate {
  0% {
    transform: scale(0.15);
    opacity: 0.5; }
  90% {
    transform: scale(0.15);
    opacity: 0.5; }
  100% {
    transform: scale(1);
    opacity: 1; } }
.slide {
  position: absolute;
  left: 0;
  height: 100%;
  width: 100%;
  margin: 0 auto;
  cursor: default;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: left; }
  .slide h1.title-text, .slide h2.title-text {
    position: relative;
    margin: 0 0 2vw 15vw;
    color: #FEFEFE; }
    .slide h1.title-text span, .slide h2.title-text span {
      opacity: 1; }
  .slide h1.title-text::before, .slide h2.title-text::before {
    content: "";
    position: absolute;
    left: 0;
    top: -6vw;
    height: 4.08vw;
    width: 4.08vw;
    border-radius: 0.8vw;
    background-image: url(https://notitia.brenus.co/assets/icon-white.png);
    /* fallback */
    background-image: url(https://notitia.brenus.co/assets/icon-white.png), linear-gradient(155deg, #1da1f2, #00487c 75%);
    /* W3C */
    background-size: cover;
    background-color: #027BCE; }
  .slide .body-text {
    margin: 0 0 0 15vw;
    font: 2vw "Raleway", "Arial", sans-serif;
    line-height: 2.6vw;
    font-weight: 200;
    letter-spacing: 0.05rem;
    color: #FEFEFE; }
  .slide .colored {
    color: #eac435;
    font-weight: 400; }
  .slide .modal-stores {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start; }
    .slide .modal-stores > a {
      opacity: 0.9;
      transition: 0.3s all ease;
      height: 50px;
      width: 160px;
      margin: 20px;
      background: transparent;
      border-radius: 5px;
      border: 1px solid rgba(255, 255, 255, 0.15);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; }
    .slide .modal-stores > a:hover {
      opacity: 1;
      background: rgba(10, 41, 64, 0.5);
      transition: 0.3s all ease; }
  .slide .modal-stores img {
    height: 100%;
    width: 100%; }

.bounce {
  transition: all 0.8s ease-in-out; }

.slide:first-child.bounce {
  transform: translate3d(0, 0, 0); }

.slide:last-child.bounce {
  transform: translate3d(0, 0, 0); }

.queue {
  transform: translate3d(0, 100%, 0) scale(1); }

.active h1:before, .active h2:before {
  -webkit-animation: 0.8s fadeInLine 1 ease-out both;
  -moz-animation: 0.8s fadeInLine 1 ease-out both;
  -o-animation: 0.8s fadeInLine 1 ease-out both;
  animation: 0.8s fadeInLine 1 ease-out both;
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  -o-animation-delay: 0.1s;
  animation-delay: 0.1s; }
.active h1 {
  -webkit-animation: 0.3s fadeInTitle 1 ease-out both;
  -moz-animation: 0.3s fadeInTitle 1 ease-out both;
  -o-animation: 0.3s fadeInTitle 1 ease-out both;
  animation: 6.5s preloadTitle ease-in-out 1, 0.3s fadeInTitle 1 ease-out both; }
.active h2 {
  -webkit-animation: 0.3s fadeInTitle 1 ease-out both;
  -moz-animation: 0.3s fadeInTitle 1 ease-out both;
  -o-animation: 0.3s fadeInTitle 1 ease-out both;
  animation: 0.3s fadeInTitle 1 ease-out both;
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  -o-animation-delay: 0.1s;
  animation-delay: 0.1s; }
.active .body-text {
  -webkit-animation: 0.3s fadeInText 1 ease-out both;
  -moz-animation: 0.3s fadeInText 1 ease-out both;
  -o-animation: 0.3s fadeInText 1 ease-out both;
  animation: 0.3s fadeInText 1 ease-out both; }
.active .text-line-1 {
  -moz-animation-delay: 0.4s;
  -o-animation-delay: 0.4s;
  animation-delay: 0.4s; }
.active .text-line-2 {
  -moz-animation-delay: 0.5s;
  -o-animation-delay: 0.5s;
  animation-delay: 0.5s; }
.active .text-line-3 {
  -moz-animation-delay: 0.6s;
  -o-animation-delay: 0.6s;
  animation-delay: 0.6s; }

.prev h1, .prev h2, .prev .body-text, .queue h1, .queue h2, .queue .body-text {
  -webkit-animation: 0.1s fadeOutTitle 1 ease-in-out both;
  -moz-animation: 0.1s fadeOutTitle 1 ease-in-out both;
  -o-animation: 0.1s fadeOutTitle 1 ease-in-out both;
  animation: 0.1s fadeOutTitle 1 ease-in-out both; }

@keyframes preloadTitle {
  0% {
    transform: translateX(-50);
    opacity: 0; }
  80% {
    transform: translateX(-50);
    opacity: 0; }
  100% {
    transform: translateX(0);
    opacity: 1; } }
@keyframes fadeInLine {
  0% {
    transform: scale(0);
    opacity: 0; }
  60% {
    transform: scale(1.1);
    opacity: 1; }
  85% {
    transform: scale(0.95);
    opacity: 1; }
  100% {
    transform: scale(1);
    opacity: 1; } }
@keyframes fadeInTitle {
  0% {
    transform: translateX(-50px);
    opacity: 0; }
  100% {
    transform: translateX(0);
    opacity: 1; } }
@keyframes fadeInText {
  0% {
    transform: translateY(25px);
    opacity: 0; }
  100% {
    transform: translateY(0);
    opacity: 0.85; } }
@keyframes fadeOutTitle {
  0% {
    transform: translateX(0);
    opacity: 1; }
  100% {
    transform: translateX(50px);
    opacity: 0; } }
@keyframes preloadPhone {
  0% {
    transform: scale(0.8);
    opacity: 0; }
  80% {
    transform: scale(0.8);
    opacity: 0; }
  100% {
    transform: scale(1);
    opacity: 1; } }
@keyframes preloadBorder {
  0% {
    transform: perspective(1000px) rotateY(4deg) scale(0.5) translate3d(-100px, 0px, 0);
    opacity: 0; }
  80% {
    transform: perspective(1000px) rotateY(4deg) scale(0.76) translate3d(-70px, 0px, 0);
    opacity: 0; }
  100% {
    transform: perspective(1000px) rotateY(14deg) scale(0.852) translate3d(-34px, 0px, 0);
    opacity: 1; } }
.mobile-wrapper {
  position: absolute;
  width: 400px;
  right: 15vw;
  animation: preloadPhone 3s ease-in-out 1;
  -webkit-transition: 0.8s;
  -moz-transition: 0.8s;
  -o-transition: 0.8s;
  transition: 0.8s; }
  .mobile-wrapper:after {
    content: '';
    width: 14%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 25px;
    display: block;
    background: linear-gradient(90deg, #FEFEFE 90%, rgba(255, 255, 255, 0.25));
    z-index: -1;
    animation: preloadBorder 3.5s ease-in-out 1;
    -webkit-transition: 0.8s;
    -moz-transition: 0.8s;
    -o-transition: 0.8s;
    transition: 0.8s; }
  .mobile-wrapper:before {
    width: 100%;
    height: 5%;
    background: black;
    position: absolute;
    bottom: -2%;
    left: 4%;
    content: '';
    border-radius: 50%;
    filter: blur(9px);
    opacity: .2;
    transform: perspective(100px) rotate3d(1, 0, 0.5, 25deg) scale3d(0.8, 0.8, 0.8);
    -webkit-transition: 0.8s;
    -moz-transition: 0.8s;
    -o-transition: 0.8s;
    transition: 0.8s; }
@keyframes preloadRotate {
  0% {
    transform: perspective(1000px) rotateY(4deg) scale(0.78) translate3d(-26px, 0px, 0); }
  80% {
    transform: perspective(1000px) rotateY(4deg) scale(0.78) translate3d(-26px, 0px, 0); }
  100% {
    transform: perspective(1000px) rotateY(-30deg) scale3d(0.8, 0.8, 0.8); } }
  .mobile-wrapper .mobile {
    width: 100%;
    padding-bottom: 216%;
    background: #FEFEFE;
    border-radius: 25px;
    animation: preloadRotate 3.5s ease-in-out 1;
    transform: perspective(1000px) rotateY(-30deg) scale3d(0.8, 0.8, 0.8);
    -webkit-transition: 0.8s;
    -moz-transition: 0.8s;
    -o-transition: 0.8s;
    transition: 0.8s; }
    .mobile-wrapper .mobile .photo {
      border-radius: 0 0 15px 15px;
      background: #FEFEFE;
      width: 50%;
      padding-bottom: 13%;
      position: absolute;
      left: 50%;
      top: 0%;
      transform: translateX(-50%);
      z-index: 1; }
      .mobile-wrapper .mobile .photo:after {
        content: '';
        width: 40%;
        padding-bottom: 5%;
        border-radius: 20px;
        background: #191919;
        border: 2px solid #191919;
        position: absolute;
        right: 30%;
        top: 50%;
        transform: translateY(-50%); }
      .mobile-wrapper .mobile .photo:before {
        content: '';
        width: 8%;
        padding-bottom: 8%;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.3);
        border: 2px solid #212121;
        position: absolute;
        right: 10%;
        top: 50%;
        transform: translateY(-50%); }
    .mobile-wrapper .mobile .screen {
      border-radius: 20px;
      width: 95%;
      height: 98%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      background: url(https://notitia.brenus.co/assets/screens/MACRON_Dashboard.jpg) no-repeat center;
      background-size: cover; }

/*
$transfo1: rotateZ(0deg);
$transfo2: rotateZ(0deg);
$transfo3: rotateZ(0deg);
$transfo4: rotateZ(0deg);
$transfo5: rotateZ(0deg);
$transfo6: rotateZ(0deg);
$transfo7: rotateZ(0deg);
*/
.mobileView1 {
  background-color: rgba(6, 21, 35, 0.5); }

.mobileView2 {
  background-color: rgba(10, 41, 64, 0.5); }

.mobileView3 {
  background-color: rgba(0, 72, 124, 0.5); }

.mobileView4 {
  background-color: rgba(2, 123, 206, 0.5); }

.mobileView5 {
  background-color: rgba(29, 161, 242, 0.5); }

.mobileView6 {
  background-color: rgba(2, 123, 206, 0.5); }

.mobileView7 {
  background-color: rgba(0, 72, 124, 0.5); }

.mobileView8 {
  background-color: rgba(10, 41, 64, 0.5); }

.mobileView1 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(14deg) scale(0.852) translate3d(-34px, 0px, 0); }

.mobileView2 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(12deg) scale(0.842) translate3d(-34px, 0px, 0); }

.mobileView3 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(10deg) scale(0.832) translate3d(-35px, 0px, 0); }

.mobileView4 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(8deg) scale(0.822) translate3d(-35px, 0px, 0); }

.mobileView5 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(6deg) scale(0.812) translate3d(-36px, 0px, 0); }

.mobileView6 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(4deg) scale(0.802) translate3d(-36px, 0px, 0); }

.mobileView7 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(2deg) scale(0.792) translate3d(-37px, 0px, 0); }

.mobileView8 .mobile-wrapper:after {
  transform: perspective(1000px) rotateY(0deg) scale(0.782) translate3d(-40px, 0px, 0); }

.mobileView1 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 24deg) scale3d(0.8, 0.8, 0.8); }

.mobileView2 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 20deg) scale3d(0.8, 0.8, 0.8); }

.mobileView3 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 16deg) scale3d(0.8, 0.8, 0.8); }

.mobileView4 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 12deg) scale3d(0.8, 0.8, 0.8); }

.mobileView5 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 8deg) scale3d(0.8, 0.8, 0.8); }

.mobileView6 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 4deg) scale3d(0.8, 0.8, 0.8); }

.mobileView7 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 0deg) scale3d(0.8, 0.8, 0.8); }

.mobileView8 .mobile-wrapper:before {
  transform: perspective(100px) rotate3d(1, 0, 0.5, 0deg) scale3d(0.8, 0.8, 0.8); }

.mobileView1 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-30deg) scale3d(0.8, 0.8, 0.8); }

.mobileView2 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-26deg) scale3d(0.8, 0.8, 0.8); }

.mobileView3 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-22deg) scale3d(0.8, 0.8, 0.8); }

.mobileView4 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-18deg) scale3d(0.8, 0.8, 0.8); }

.mobileView5 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-14deg) scale3d(0.8, 0.8, 0.8); }

.mobileView6 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-10deg) scale3d(0.8, 0.8, 0.8); }

.mobileView7 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-6deg) scale3d(0.8, 0.8, 0.8); }

.mobileView8 .mobile-wrapper .mobile {
  transform: perspective(1000px) rotateY(-2deg) scale3d(0.8, 0.8, 0.8); }

.mobileView1 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/MACRON_Dashboard.jpg) no-repeat center;
  background-size: cover; }

.mobileView2 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/MACRON_Monitoring_Verified.jpg) no-repeat center;
  background-size: cover; }

.mobileView3 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/MACRON_Radar_Viral.jpg) no-repeat center;
  background-size: cover; }

.mobileView4 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/MACRON_Push.jpg) no-repeat center;
  background-size: cover; }

.mobileView5 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/MACRON_Settings_Keywords.jpg) no-repeat center;
  background-size: cover; }

.mobileView6 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/ARTE_Community_Influencers.jpg) no-repeat center;
  background-size: cover; }

.mobileView7 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/MACRON_Influence_LastHour_Segments.jpg) no-repeat center;
  background-size: cover; }

.mobileView8 .mobile-wrapper .screen {
  background: url(https://notitia.brenus.co/assets/screens/FREE_Drawer_Macron.jpg) no-repeat center;
  background-size: cover; }

@media all and (max-width: 1000px) {
  header {
    padding: 0 10vw; }
    header .name, header .contact {
      font: 12px "Raleway", "Arial", sans-serif; }

  .slider-left {
    height: 75%; }

  .navbar {
    bottom: auto; }

  .navbar-perso {
    transform: translateX(120px) translateY(-5vh); }

  .navbar-indicator {
    position: absolute;
    display: block;
    width: 200px;
    font: 12px "Raleway", "Arial", sans-serif;
    letter-spacing: 0.05rem;
    color: #FEFEFE;
    text-align: center;
    transform-origin: 50% 50%;
    transform: rotate(-90deg) translateY(-120px) translateX(5vh); }

  .slide {
    justify-content: flex-end; }
    .slide h1.title-text, .slide h2.title-text {
      margin: 0 0 3vw 10vw;
      font-size: 6vw;
      line-height: 6.6vw; }
    .slide h1.title-text::before, .slide h2.title-text::before {
      top: -3.3vw;
      height: 2px; }
    .slide .body-text {
      margin: 0 0 0 10vw;
      font: 2.2vw "Raleway", "Arial", sans-serif;
      line-height: 3.52vw; }

  @keyframes preloadPhone {
    0% {
      transform: scale(0.8);
      opacity: 0; }
    80% {
      transform: scale(0.8);
      opacity: 0; }
    100% {
      transform: scale(1);
      opacity: 1; } }
  @keyframes preloadBorder {
    0% {
      transform: perspective(1000px) rotateY(4deg) scale(0.76) translate3d(-35px, 0px, 0);
      opacity: 0; }
    80% {
      transform: perspective(1000px) rotateY(4deg) scale(0.76) translate3d(-35px, 0px, 0);
      opacity: 0; }
    100% {
      transform: perspective(1000px) rotateY(14deg) scale(0.82) translate3d(-18px, 0px, 0);
      opacity: 1; } }
  .mobile-wrapper {
    margin-top: -15vh;
    right: auto;
    width: 200px;
    animation: preloadPhone 3s ease-in-out 1; }
    .mobile-wrapper:after {
      animation: preloadBorder 3.5s ease-in-out 1;
      width: 19%; }

  .mobileView1 {
    background-color: rgba(6, 21, 35, 0.5); }

  .mobileView2 {
    background-color: rgba(10, 41, 64, 0.5); }

  .mobileView3 {
    background-color: rgba(0, 72, 124, 0.5); }

  .mobileView4 {
    background-color: rgba(2, 123, 206, 0.5); }

  .mobileView5 {
    background-color: rgba(29, 161, 242, 0.5); }

  .mobileView6 {
    background-color: rgba(2, 123, 206, 0.5); }

  .mobileView7 {
    background-color: rgba(0, 72, 124, 0.5); }

  .mobileView8 {
    background-color: rgba(10, 41, 64, 0.5); }

  .mobileView1 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(14deg) scale(0.82) translate3d(-18px, 0px, 0); }

  .mobileView2 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(12deg) scale(0.81) translate3d(-18px, 0px, 0); }

  .mobileView3 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(10deg) scale(0.8) translate3d(-18px, 0px, 0); }

  .mobileView4 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(8deg) scale(0.79) translate3d(-18px, 0px, 0); }

  .mobileView5 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(6deg) scale(0.78) translate3d(-18px, 0px, 0); }

  .mobileView6 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(4deg) scale(0.77) translate3d(-18px, 0px, 0); }

  .mobileView7 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(4deg) scale(0.76) translate3d(-18px, 0px, 0); }

  .mobileView8 .mobile-wrapper:after {
    transform: perspective(1000px) rotateY(4deg) scale(0.76) translate3d(-18px, 0px, 0); }

  .mobileView1 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 24deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView2 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 20deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView3 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 16deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView4 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 12deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView5 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 8deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView6 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 4deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView7 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 0deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView8 .mobile-wrapper:before {
    transform: perspective(100px) rotate3d(1, 0, 0.5, 0deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView1 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(-30deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView2 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(-25deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView3 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(-20deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView4 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(-15deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView5 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(-10deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView6 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(-5deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView7 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(0deg) scale3d(0.8, 0.8, 0.8); }

  .mobileView8 .mobile-wrapper .mobile {
    transform: perspective(1000px) rotateY(0deg) scale3d(0.8, 0.8, 0.8); } }
@media all and (max-width: 725px) {
  h6 {
    font: 2.9vw "Raleway", "Arial", sans-serif;
    letter-spacing: 0.15rem; }

  header {
    height: 75px;
    padding: 0 5vw; }

  .slide h1.title-text, .slide h2.title-text {
    margin: 0 0 3vw 5vw;
    font-size: 7vw;
    line-height: 7.7vw; }
  .slide .body-text {
    margin: 0 0 0 5vw;
    font: 2.9vw "Raleway", "Arial", sans-serif;
    line-height: 4.64vw; }

  .slide .modal-stores > a {
    height: 25px;
    width: 80px;
    margin: 10px 20px 10px 0;
    border-radius: 5px; } }

/*# sourceMappingURL=style.css.map */