/*
Theme Name: Immobilien Marketing Lab
Theme URI: https://immo-marketing-lab.de/
Author: SIGN+DESIGN Werbeagentur
Author URI: https://www.signunddesign.com/
Description: Wozu lange um den „heißen Brei“ reden: Unser Ziel ist Ihr Erfolg! Denn nur erfolgreiche Kunden sind auf Dauer glückliche Kunden. Und um Sie glücklich zu machen, richten wir unsere Energie auf Ihren stimmigen Auftritt und die Entwicklung zielführender Kommunikationsmaßnahmen. Werbung darf bei uns Spaß machen und ist trotzdem niemals Selbstzweck. Was zählt ist Ihr Erfolg! Die Früchte unserer Bemühungen: treue, langjährige Kunden und zahlreiche Weiterempfehlungen – mit ein Grund dafür, dass viele unserer Kunden aus dem Bereich Immobilien stammen. Und hier liegt auch seit über 20 Jahren ein Schwerpunkt unserer Arbeit.
Version: 2.1
*/@charset "UTF-8";

/*Global Reset*/

body,html,h1,h2,h3,h4,h5,h6,p,ul,ol,li{padding:0;margin:0;}
body,html{overflow: unset!important;width:100%;-webkit-font-smoothing:antialiased;-webkit-overflow-scrolling:touch;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}

/* ########## Fonts ++ WICHTIG font-display: swap; ++ ########## */

/* plus-jakarta-sans-300 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 300;
    src: url('assets/fonts/plus-jakarta-sans-v7-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* plus-jakarta-sans-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    src: url('assets/fonts/plus-jakarta-sans-v7-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* plus-jakarta-sans-500 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 500;
    src: url('assets/fonts/plus-jakarta-sans-v7-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* plus-jakarta-sans-600 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 600;
    src: url('assets/fonts/plus-jakarta-sans-v7-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* plus-jakarta-sans-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 700;
    src: url('assets/fonts/plus-jakarta-sans-v7-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* ########## Variables ########## */

* {
    --font-family: "Plus Jakarta Sans", sans-serif;
    --transition: .38s ease;
    --wrp-width: 1500px;
    --font-size: 16px;
    --line-height: calc(var(--font-size) * 1.8);
    --box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.3);
    --border-radius: 15px;
    --primary-color: #368D8F;
    --background-color: #212426;
    --text-color: #FFFFFF;
}

/* ########## Globals ########## */

html {scroll-behavior: smooth; background: var(--background-color);}
body {font-size: var(--font-size); font-family: var(--font-family); line-height: var(--line-height); color: var(--text-color); height: 100%; cursor: none;}
img {-ms-interpolation-mode:bicubic; vertical-align: bottom;}
svg {width: 100%; height: 100%;}
hr {border:none;height:1px;background:#ddd; margin:0;}

.wrp {max-width: var(--wrp-width); width: 90%; margin: 0 auto; position:relative; box-sizing:border-box;}

/* Margins */

.mb {margin-bottom: 150px;}
.mb50 {margin-bottom: 50px;}

@media (max-width: 500px) {
  .mb {margin-bottom: 50px;}
  .mb50 {margin-bottom: 25px;}
}

/* Lenis Smooth Scroll */

html.lenis {height: auto;}
.lenis.lenis-smooth {scroll-behavior: auto !important;}
.lenis.lenis-smooth [data-lenis-prevent] {overscroll-behavior: contain;}
.lenis.lenis-stopped {overflow: hidden;}
.lenis.lenis-scrolling iframe {pointer-events: none;}

/* Cursor */

.cursor-follower {position: fixed;top: 0;left: 0;width: 20px;height: 20px;border-radius: 100%;background-color: rgba(54, 141, 143, 0.6);opacity: 0;z-index: 100;user-select: none;pointer-events: none; mix-blend-mode: difference;}

/* Page Build */

main.withsidebar .page-build {display: grid; grid-template-columns: 70% 25%; align-items: flex-start; justify-content: space-between; max-width: var(--wrp-width); width: 90%; margin: 0 auto;}
main.withsidebar .content .wrp {width: 100%;}
main.withsidebar .sidebar {width: 100%; position: sticky; top: 150px; background: #f5f5f5; padding: 25px; box-sizing: border-box;}

@media (max-width: 1024px) {
    main.withsidebar .page-build {grid-template-columns: 100%;}
    main.withsidebar .page-build .sidebar {display: none;}
}

/* Typo Styles */

h1, h2, h3, h4, h5, h6 {margin:0; font-size: 35px; line-height: 45px; font-weight: 600;}
h2 {margin:0; font-size: 32px; font-weight: 300; margin-bottom: 30px;}
h2 strong {font-weight: 700;}
h3 {font-size: 24px; font-weight: 700; margin-bottom: 30px; line-height: 35px;}
h6 {font-size: 14px; font-weight: 700; margin-bottom: 0; line-height: 35px; text-transform: uppercase;}

a {text-decoration: none; outline:none !important; color: var(--text-color); transition: var(--transition);}
a:hover {color: var(--secundary-color); transition: var(--transition);}

.btn {padding: 15px 40px; background: var(--primary-color); display: inline-block; border-radius: 5px;}
.btn.secundary {padding: 15px 40px; background: transparent; position: relative; padding-left: 0; color: var(--primary-color); font-weight: 700; text-decoration: dashed;}
.btn.black {background: var(--background-color); color: #fff;}
.btn.secundary:after {content: ''; position: absolute; right: 0; top: 50%; background: url("assets/icons/arrow-btn.png"); background-repeat: no-repeat; width: 16px; height: 16px; background-size: contain;}

p {margin-bottom: var(--line-height);}
p:last-child {margin-bottom: 0;}
address {font-style: normal; color: var(--text-color);}
address a {display: block;}
ol, ul {margin-bottom: var(--line-height);}
li {margin-left: 20px;}

/* ########## menu ########## */

.menu {position: fixed; transform: translateY(-100%); width: 100%; height: 100%; background:  var(--background-color); z-index: 5;}
.menu .menu-content-container {height: 100%; display: grid; align-items: center; width: 90%; max-width: var(--wrp-width); margin: 0 auto;}
.menu nav ul li {list-style-type: none; margin-bottom: 75px; transform: translateX(150px);}
.menu nav ul li a {font-size: 100px; text-transform: uppercase; position: relative; line-height: 120px; transition: var(--transition);}
.menu nav ul li a:hover {transform: translateX(35px); transition: var(--transition);}
.menu nav ul li a:before {content: ''; position: absolute; width: 100px; height: 3px; background: var(--text-color); top: 50%; left: -150px; transform: translateY(-50%); transition: var(--transition);}
.menu nav ul li a:after {content: ''; position: absolute; width: 20px; height: 3px; background: var(--text-color); top: 50%; left: -50px; transform: translateY(-50%); transition: var(--transition);}
.menu nav ul li a:hover:after {transition: var(--transition); left: -170px; background: var(--primary-color);}

.menu .spektrum-nav {position: absolute; z-index: 5; width: 60vw; height: 60vw; top: -20vw; right: -15vw;}

/* ########## Header ########## */

header {position: fixed; top: 0; width: 100%; z-index: 10; padding: 20px 0; box-sizing: border-box; transition: .4s ease-in-out;}
header .header-grid {display: grid; grid-template-columns: 200px auto; grid-template-rows: auto; justify-items: start; align-items: center; justify-content: space-between;}
header .header-grid .logo {width: 100%;}
header .header-grid .logo a {display: flex; align-items: center;}
header .header-grid .mainnav-toggle {display: none;justify-self: end;}

header.hidden {top: -120px; transition: .4s ease-in-out;}

.scrolled header {background: rgba(0,0,0,.4); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px);}

/* Kopfbereich Startseite / Unterseite  */

.stage {width: 100%; position: relative;}
.stage video {width: 100%; aspect-ratio: 1920/860; object-fit: cover;}
.stage img {width: 100%; height: 100%; min-height: 220px; object-fit: cover; object-position: center;}
.stage .videooverlay {width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(0,0,0,0.7609637605042017) 0%, rgba(255,255,255,0) 82%);}

.stage .wrp {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1;}
.stage .wrp h1 {margin-bottom: 50px;}
.stage .wrp p {max-width: 37ch;}

.stage.subpage img {width: 100%; aspect-ratio: 1920/500; object-fit: cover;}

/* ########## Content ########## */

/* Text */

.text.multiple-col .wrp {-webkit-columns: 2 350px; -moz-columns: 2 350px; columns: 2 350px; -webkit-column-gap: 4em; -moz-column-gap: 4em; column-gap: 4em;}
.text.textblock_center .wrp {background: var(--primary-color); padding: 50px 5%; border-radius: var(--border-radius); max-width: 50%;}
.text.textblock_center .wrp p {max-width: 70ch; margin: 0 auto;}
.text.textblock_center .wrp p {max-width: 70ch; margin: 0 auto;}

.text h2 {font-size: 45px; font-weight: 700;}
.text p {font-size: clamp(16px,2vw,35px); line-height: clamp(24px,2.5vw,45px); font-weight: 300;}

/* Text Bild */

.textbild .wrp {display: grid; align-items: center; justify-content: space-between; box-sizing: border-box;}
.textbild .text {border-radius: 5px 0 0 5px; box-sizing: border-box;}
.textbild .text h2 {margin-bottom: 30px;}
.textbild .bild {width: 100%; height: 100%; border-radius: var(--border-radius); overflow: hidden;}
.textbild .bild img {width: 100%; height: 100%; object-fit: cover;}

@media (max-width: 768px) {
    .textbild .wrp {grid-template-columns: 100%!important;}
}

/* Image */

.image img {display:block; width:100%; height:auto;}

.bildtrenner {width:100%; aspect-ratio: 3/.75; overflow: hidden; min-height: 350px; position: relative;}
.bildtrenner .wrp {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;}
.bildtrenner img {width:100%; height: 100%; object-fit: cover; object-position: 50% 50%;}
.bildtrenner .bildtrenner-video {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.bildtrenner .videooverlay {top: 0; left: 0; width: 100%; height: 100%; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(0,0,0,0.7609637605042017) 0%, rgba(255,255,255,0) 100%); position: absolute;}

.bildtrenner h2 {font-size: 8em; font-weight: 700; line-height: 1em;}

.bildtrenner.bildtrenner-align .videooverlay {background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.7609637605042017) 100%);}


/* Galerie */

.gallery .fresco-gallery:not(.masonry) {display: grid; gap: 50px; margin-bottom: 0;}
.gallery .fresco-gallery li {list-style-type: none; margin: 0 0 25px 0; border-radius: 5px;overflow: hidden;}
.gallery .fresco-gallery:not(.masonry) li {margin: 0 0 50px 0;}
.gallery .fresco-gallery li a {position: relative; display: block; overflow: hidden;}
.gallery .fresco-gallery li a .overlay {width: 100%; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--secundary-color); opacity: 0; transition: var(--transition);}
.gallery .fresco-gallery li a:hover .overlay {opacity: 0.6; transition: var(--transition);}
.gallery .fresco-gallery li a .overlay .icon-wrp {position: absolute; top: 50%; left: 50%; width: 45px; height: 45px; transform: translate(-50%, -50%);}
.gallery .fresco-gallery li a .overlay .icon-wrp svg {width: 100%; height: 100%; transform: scale(0); transition: var(--transition);}
.gallery .fresco-gallery li a .overlay .icon-wrp svg path {fill: #fff;}
.gallery .fresco-gallery li a:hover .overlay .icon-wrp svg { transform: scale(1); transition: var(--transition);}
.gallery .fresco-gallery li img {width: 100%;}

.gallery .fresco-gallery.masonry {gap: 25px; columns: 4; margin: 0 auto;}

.gallery .video-gallery-grid {display: grid; grid-column-gap: 50px; grid-row-gap: 50px;}
.gallery .video-gallery-grid .video-gallery-item {height: 220px; width: 100%; display: block; position: relative; overflow: hidden;}
.gallery .video-gallery-grid .video-gallery-item .overlay {width: 100%; position: absolute; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: var(--secundary-color); opacity: 0; transition: var(--transition); z-index: 4;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay {opacity: 0.6; transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp {position: absolute; top: 50%; left: 50%; width: 45px; height: 45px; transform: translate(-50%, -50%);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg {width: 100%; height: 100%; transform: scale(0); transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item .overlay .icon-wrp svg path {fill: #fff!important;}
.gallery .video-gallery-grid .video-gallery-item:hover .overlay .icon-wrp svg { transform: scale(1); transition: var(--transition);}
.gallery .video-gallery-grid .video-gallery-item img {height: 100%; width: 100%; object-fit: cover; object-position: center; transform: scale(1.2);}

@media (max-width: 1024px) {
  .gallery .fresco-gallery {grid-template-columns: repeat(4, 1fr)!important;}
  .gallery .video-gallery-grid {grid-template-columns: repeat(2, 1fr)!important;}
  .gallery .filterrow {display: grid; grid-template-columns: 100%; gap: 25px;}
  .gallery .filterrow #filter {flex-wrap: wrap;}

}

@media (max-width: 550px) {
  .gallery .video-gallery-grid {grid-template-columns: 100%!important;}
  .gallery .fresco-gallery {grid-template-columns: repeat(2, 1fr)!important;}
}

/* Infinite Carousel */

.projekte { display: flex; justify-content: center;}

@-webkit-keyframes scroll {
    0% {transform: translateX(0);}
    100% {transform: translateX(calc(-400px * 6));}
}

@keyframes scroll {
    0% {transform: translateX(0);}
    100% {transform: translateX(calc(-400px * 6));}
}
.slider {margin: auto;overflow: hidden;position: relative;width: 100%;}
.slider::before, .slider::after {background: linear-gradient(to right, #212426 0%, rgba(0, 0, 0, 0) 100%);content: "";position: absolute;width: 200px;z-index: 2;}
.slider::after {right: 0;top: 0;transform: rotateZ(180deg);}
.slider::before {left: 0;top: 0;}
.slider .slide-track {-webkit-animation: scroll 40s linear infinite; animation: scroll 40s linear infinite; display: flex; width: calc(400px * 14);}
.slider .slide-track:nth-child(2) {-webkit-animation: scroll 55s linear infinite; animation: scroll 55s linear infinite;}
.slider .slide {width: 400px;aspect-ratio: 3/2;border-radius: var(--border-radius);display: block;overflow: hidden; margin: 0 1% 50px 0;}
.slider .slide img {width: 100%; height: 100%; object-fit: cover;}

/* oEmbed */

.embed .respo-video{position: relative;height: 0;overflow: hidden;}
.embed .respo-video iframe {position: absolute; top: 0; left: 0; width: 100%;	height: 100%;}
.embed .respo-video ._brlbs-cb-youtube {margin-bottom: -56.25%;}

/* Teasercards */

.teasercards img {width: 100%; aspect-ratio: 2/1.5; height: auto; object-fit: cover;}
.teasercards .cards.no-carousel {display: grid; grid-column-gap: 5%; grid-row-gap: 50px; margin: 0;}
.teasercards .splide ul.cards {display: flex; grid-column-gap: unset;}

.teasercards .teasercard-item {border-radius: var(--border-radius); padding: 45px 35px; box-sizing: border-box;}
.teasercards .teasercard-item .inhalt svg {width: 60px; height: 60px; margin-bottom: 30px;}
.teasercards .teasercard-item .inhalt svg path {transition: var(--transition);}

.teasercards .teasercard-item h3 {height: 52px;}
.teasercards .teasercard-item:hover {background: var(--primary-color);}
.teasercards .teasercard-item:hover svg path {fill: var(--text-color); transition: var(--transition);}

.splide__arrow--next {right:0!important}
.splide__arrow--prev {left:0!important}

@media (max-width: 1024px) {
  .teasercards .cards.no-carousel {grid-template-columns: repeat(2, 1fr)!important;}
}

@media (max-width: 500px) {
  .teasercards .cards.no-carousel {grid-template-columns: 100% !important;}
}

/* Accordion */

.accordion .item-accordion-head {cursor: pointer; position: relative; background: #f2f2f2; margin-bottom:10px; padding:10px 25px 10px 10px; border:1px solid #f2f2f2;}
.accordion .active .item-accordion-head {background-color:#f8f8f8}
.accordion .item-accordion-btn {width: 26px; height: 26px;float: right; margin: 0; cursor: pointer; position: absolute; right: 5px; top: 50%; transform: translateY(-50%);}
.accordion .item-accordion-btn:before {content: '-'; color: #555; position: absolute; width: 26px; height: 26px; text-align: center; line-height: 22px; font-size: 24px;}
.accordion .item-accordion {margin-bottom: 5px; }
.accordion .item-accordion.hidden .item-accordion-btn:before {content: '+'; line-height: 26px;}
.accordion .item-accordion.active .item-accordion-btn:before {content: '-'; line-height: 22px; }
.accordion .item-accordion.hidden.active .item-accordion-btn:before {content: '-'; line-height: 22px;}
.accordion .item-accordion.hidden .item-accordion-content {display: none;padding:20px 20px;background:#f8f8f8;margin-bottom:10px;}
.accordion .item-accordion.hidden .item-accordion-content:after {display:block;width: 0;height: 0;border-right: 100px solid #037CA9;border-top: 50px solid transparent;border-bottom: 50px solid transparent;}

/* ########## Blog ########## */

main.withsidebar .content .blog-grid {display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 50px; grid-row-gap: 50px;}
main.withsidebar .content .blog-grid .post {width: 100%;}
main.withsidebar .content .blog-grid .post img {width: 100%; height: auto; object-fit: cover;}

article.singlepost .post-image {}
article.singlepost .post-image img {width: 100%; height: auto; object-fit: cover;}

@media (max-width: 768px) {
    main.withsidebar .content .blog-grid {grid-template-columns: repeat(2, 1fr);}
}

/* ########## Footer ########## */

.contact-banner {background: var(--primary-color); color: #fff; padding: 100px 0;}
.contact-banner .btn-wrp {display: grid; place-items: center;}
.contact-banner p {max-width: 60ch; margin: 0 auto 50px auto;}

footer {}
footer .footer-grid {display: grid; grid-template-columns: repeat(3,1fr); gap: 5%; justify-content: space-between;}
footer .footer-grid .footer-item {border-radius: var(--border-radius); border: 2px solid #fff; padding: 40px 60px; display: flex; align-items: center;}
footer .footer-grid .footer-item .info-wrp span {display: block;}
footer .footer-grid .footer-item .icon-wrp {width: 30px; height: 30px; margin-right: 15px;}
footer .footer-grid .footer-item .icon-wrp svg {width: 100%; height: 100%;}

/* Bottom */

.bottom {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; background: #000; height: 50px; line-height: 50px; font-size: 12px;}
.bottom a {font-size: 12px;}

/* 404 */

body.error404 {position: relative; height: 100vh;}
body.error404 main .content {margin-top: 150px;}
body.error404 footer {position: absolute; bottom: 0; width: 100%;}

/* Loader */

.loader{background-color: var(--background-color);position:fixed; top:0;left:0;right:0;bottom:0;opacity:0;z-index:12;transform:translateY(-100%);-webkit-animation:loader 1.2s cubic-bezier(0.5, 0.6, 0.2, 1);-moz-animation:loader 1.2s cubic-bezier(0.5, 0.6, 0.2, 1);animation:loader 1.2s cubic-bezier(0.5, 0.6, 0.2, 1);-webkit-animation-fill-mode:backwards;-moz-animation-fill-mode:backwards;animation-fill-mode:backwards;-webkit-animation-delay: 1.5s;animation-delay: 1.5s;}

@-webkit-keyframes loader {
    0% {opacity:1;transform:translateY(0%);}
    100% {opacity:1;transform:translateY(-100%);}
}
@keyframes loader {
    0% {opacity:1;transform:translateY(0%);}
    100% {opacity:1;transform:translateY(-100%);}
}

.loader2 {background-color: #343638;position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;z-index: 11;transform:translateY(-100%);-webkit-animation:loader .8s cubic-bezier(0.5, 0.6, 0.2, 1);-moz-animation:loader .8s cubic-bezier(0.5, 0.6, 0.2, 1);animation:loader .8s cubic-bezier(0.5, 0.6, 0.2, 1);-webkit-animation-fill-mode:backwards;-moz-animation-fill-mode:backwards;animation-fill-mode:backwards;-webkit-animation-delay: 2s;animation-delay: 2s;}

@-webkit-keyframes loader {
    0% {opacity:1;transform:translateY(0%);}
    100% {opacity:1;transform:translateY(-100%);}
}
@keyframes loader {
    0% {opacity:1;transform:translateY(0%);}
    100% {opacity:1;transform:translateY(-100%);}
}

.center {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;height: 100%;width: 100%; background: url("assets/icons/loader-bg-image.png"); background-size: cover; background-attachment: fixed;}
.center .loader-logo {width: 120px; height: auto;}
.center .loader-logo img {width: 100%;}
.fadeInUp {-webkit-animation:fadeInUp 1.6s cubic-bezier(0.2, 0.6, 0.2, 1);-moz-animation:fadeInUp 1.6s cubic-bezier(0.2, 0.6, 0.2, 1);animation:fadeInUp 1.6s cubic-bezier(0.2, 0.6, 0.2, 1);-webkit-animation-fill-mode:backwards;-moz-animation-fill-mode:backwards;animation-fill-mode:backwards;-webkit-animation-delay: .2s;animation-delay: .2s;}
.delay {-webkit-animation-delay: .5s;animation-delay: .5s;}

@-webkit-keyframes fadeInUp {
    0% {opacity: 0;-webkit-transform: translateY(30px);}
    100% {opacity: 1;-webkit-transform: translateY(0);}
}
@keyframes fadeInUp {
    0% {opacity: 0;transform: translateY(30px);}
    100% {opacity: 1;transform: translateY(0);}
}

.animate {-webkit-animation:animate 1.2s cubic-bezier(0.2, 0.6, 0.2, 1);-moz-animation:animate 1.2s cubic-bezier(0.2, 0.6, 0.2, 1);animation:animate 1.2s cubic-bezier(0.2, 0.6, 0.2, 1);-webkit-animation-fill-mode:backwards;-moz-animation-fill-mode:backwards;animation-fill-mode:backwards;-webkit-animation-delay: 2s;animation-delay: 2s;}

@-webkit-keyframes animate {
    0% {-webkit-transform: translateY(100%);}
    100% {-webkit-transform: translateY(0%);}
}
@keyframes animate {
    0% {opacity: 0;transform: translateY(100%);}
    100% {opacity: 1;transform: translateY(0%);}
}