/* NAVIGATION HEADER */
/* Desktop only */

@media (min-width:960px) {

  /* ===============================
   HEADER INTRO ANIMATION
================================ */

/* Initial hidden state */
.header .main-menu > li,
.header .header-socials > li,
header .logo-wrapper,
header .master-menu > li {

    opacity: 0;
    transform: translateY(-15px);

    transition:
        opacity .45s ease,
        transform .45s ease;

}


/* Top utility menu */
body.header-ready .header .main-menu > li {

    opacity: 1;
    transform: translateY(0);

    transition-delay: calc(var(--i) * 60ms);

}


/* Social icons */
body.header-ready .header .header-socials > li {

    opacity: 1;
    transform: translateY(0);

    transition-delay: calc((var(--i) + 3) * 60ms);

}


/* Logo */
body.header-ready header .logo-wrapper {

    opacity: 1;
    transform: translateY(0);

    transition-delay: 420ms;

}


/* Main navigation */
body.header-ready .master-menu > li {

    opacity: 1;
    transform: translateY(0);

    transition-delay: calc(600ms + (var(--i) * 60ms));

}


/* Accessibility */
@media (prefers-reduced-motion: reduce) {

    .header .main-menu > li,
    .header .header-socials > li,
    header .logo-wrapper,
    header .master-menu > li {

        opacity: 1;
        transform: none;
        transition: none;

    }

}

}


/* Initial State */
.section-unesco .left-unesco > *,
.section-unesco .main-img-unesco {
    opacity: 0;
    will-change: opacity, transform;
}
.section-unesco .overlay-img-unesco {
    opacity: 0;
    transform: translate(-50%, -50%) translateY(40px) scale(.85) rotate(-3deg);
}
/* Left column elements */
.section-unesco .left-unesco h2 {
    transform: translateY(35px);
}

.section-unesco .left-unesco p {
    transform: translateY(25px);
}

.section-unesco .left-unesco .link-style-one {
    transform: translateY(20px);
}

.section-unesco .left-unesco .logo-unesco {
    transform: translateY(20px);
}

/* Right images */
.section-unesco .main-img-unesco {
    transform: translateX(60px);
}

.section-unesco .overlay-img-unesco {
    transform: translate(-50%, -30%) scale(.85) rotate(-3deg);
}

/* Visible State */
.section-unesco.animate.in-view .left-unesco > *,
.section-unesco.animate.in-view .main-img-unesco {
    opacity: 1;
    transform: none;
}
.section-unesco.animate.in-view .overlay-img-unesco {
    opacity: 1;
    transform: translate(-50%, -50%) translateY(0) scale(1) rotate(0);
}

.section-unesco.animate.in-view .overlay-img-unesco {
    transition:
        opacity .7s ease .65s,
        transform .8s cubic-bezier(.22,1,.36,1) .65s;
}

/* Stagger timing */
.section-unesco.animate.in-view .left-unesco h2 {
    transition: opacity .7s ease, transform .7s ease;
}

.section-unesco.animate.in-view .left-unesco p {
    transition: opacity .7s ease .30s, transform .7s ease .30s;
}

.section-unesco.animate.in-view .left-unesco .link-style-one {
    transition: opacity .7s ease .60s, transform .7s ease .60s;
}

.section-unesco.animate.in-view .left-unesco .logo-unesco {
    transition: opacity .7s ease .130s, transform .7s ease .130s;
}

.section-unesco.animate.in-view .main-img-unesco {
    transition: opacity .9s cubic-bezier(.22,.61,.36,1) .2s,
                transform .9s cubic-bezier(.22,.61,.36,1) .2s;
}

.section-unesco.animate.in-view .overlay-img-unesco {
    transition: opacity .7s ease .65s,
                transform .8s cubic-bezier(.22,1,.36,1) .65s;
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {

    .section-unesco.animate *,
    .section-unesco.animate *::before,
    .section-unesco.animate *::after {
        transition: none !important;
        transform: none !important;
        opacity: 1 !important;
    }

}

/* HOME PAGE - CALLOUTS */
/* ===========================================
   LISTEN / RESOURCES / COMMITMENT
=========================================== */

.section-listrescom .column-lrc {
    opacity: 0;
    transform: translateY(30px);
    transition:
        opacity .6s ease,
        transform .6s ease;
}

.section-listrescom .header-lrc i {
    opacity: 0;
    transform: scale(.9);
    transition:
        opacity .6s ease,
        transform .6s ease;
}

.section-listrescom h4,
.section-listrescom p,
.section-listrescom .link-style-one {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity .45s ease,
        transform .45s ease;
}


/* ---------- COLUMN 1 ---------- */

.section-listrescom.in-view .column-one {
    opacity: 1;
    transform: translateY(0);
}

.section-listrescom.in-view .column-one i {
    opacity: 1;
    transform: scale(1);
    transition-delay: .10s;
}

.section-listrescom.in-view .column-one h4 {
    opacity: 1;
    transform: none;
    transition-delay: .20s;
}

.section-listrescom.in-view .column-one p {
    opacity: 1;
    transform: none;
    transition-delay: .30s;
}

.section-listrescom.in-view .column-one .link-style-one {
    opacity: 1;
    transform: none;
    transition-delay: .40s;
}


/* ---------- COLUMN 2 ---------- */

.section-listrescom.in-view .column-two {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .20s;
}

.section-listrescom.in-view .column-two i {
    opacity: 1;
    transform: scale(1);
    transition-delay: .30s;
}

.section-listrescom.in-view .column-two h4 {
    opacity: 1;
    transform: none;
    transition-delay: .40s;
}

.section-listrescom.in-view .column-two p {
    opacity: 1;
    transform: none;
    transition-delay: .50s;
}

.section-listrescom.in-view .column-two .link-style-one {
    opacity: 1;
    transform: none;
    transition-delay: .60s;
}


/* ---------- COLUMN 3 ---------- */

.section-listrescom.in-view .column-three {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .40s;
}

.section-listrescom.in-view .column-three i {
    opacity: 1;
    transform: scale(1);
    transition-delay: .50s;
}

.section-listrescom.in-view .column-three h4 {
    opacity: 1;
    transform: none;
    transition-delay: .60s;
}

.section-listrescom.in-view .column-three p {
    opacity: 1;
    transform: none;
    transition-delay: .70s;
}

.section-listrescom.in-view .column-three .link-style-one {
    opacity: 1;
    transform: none;
    transition-delay: .80s;
}

/* FEATURED ARTIST */
/* ===========================================
   FEATURED ARTIST
=========================================== */
/* Initial state */
.column-artven .scene,
.column-artven .artist-photo img,
.column-artven h4,
.column-artven .artist-cats,
.column-artven .artist-intro,
.column-artven .link-style-two {
    opacity: 0;
}
/* Orbit */
.column-artven .scene {
    transform: scale(.88) rotate(-12deg);
    transition:
        opacity .8s ease,
        transform .9s ease;
}
/* Artist image */
.column-artven .artist-photo img {
    transform: scale(1.05);
    transition:
        opacity .7s ease,
        transform .9s ease;
}
/* Text */
.column-artven h4,
.column-artven .artist-cats,
.column-artven .artist-intro,
.column-artven .link-style-two {
    transform: translateY(20px);
    transition:
        opacity .45s ease,
        transform .45s ease;

}
/* ===========================
   Animate In
=========================== */
.column-artven.in-view .scene {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}
.column-artven.in-view .artist-photo img {
    opacity: 1;
    transform: scale(1);
    transition-delay: .15s;
}
.column-artven.in-view h4 {
    opacity: 1;
    transform: none;
    transition-delay: .30s;
}
.column-artven.in-view .artist-cats {
    opacity: 1;
    transform: none;
    transition-delay: .45s;
}
.column-artven.in-view .artist-intro {
    opacity: 1;
    transform: none;
    transition-delay: .60s;
}
.column-artven.in-view .link-style-two {
    opacity: 1;
    transform: none;
    transition-delay: .75s;
}
/* ===========================================
   FEATURED VENUE
=========================================== */

/* Initial State */

.column-artven.column-two .venue-pic-header img,
.column-artven.column-two h3,
.column-artven.column-two h4,
.column-artven.column-two .venue-intro,
.column-artven.column-two .link-style-one {
    opacity: 0;
}

/* Image */

.column-artven.column-two .venue-pic-header img {
    transform: scale(1.05);

    transition:
        opacity .7s ease,
        transform .9s ease;
}

/* Vertical Heading */

.column-artven.column-two h3 {
    transform: translateX(30px) rotate(180deg);

    transition:
        opacity .6s ease,
        transform .6s ease;
}

/* Content */

.column-artven.column-two h4,
.column-artven.column-two .venue-intro,
.column-artven.column-two .link-style-one {
    transform: translateY(20px);

    transition:
        opacity .45s ease,
        transform .45s ease;
}


/* ===========================================
   Animate In
=========================================== */

.column-artven.column-two.in-view .venue-pic-header img {
    opacity: 1;
    transform: scale(1);
}

.column-artven.column-two.in-view h3 {
    opacity: 1;
    transform: translateX(0) rotate(180deg);
    transition-delay: .20s;
}

.column-artven.column-two.in-view h4 {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .35s;
}

.column-artven.column-two.in-view .venue-intro {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .50s;
}

.column-artven.column-two.in-view .link-style-one {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .65s;
}





















/* FOOTER */
/* INITIAL STATE */

footer .footer-subscriber,
footer .col1,
footer .col2,
footer .col3,
footer .col4,
footer .copyright,
footer > small {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .65s ease,
        transform .65s ease;
}

/* Individual pieces */

footer .footer-subscriber h5,
footer .footer-subscriber .subscriber-intro,
footer .footer-subscriber form,
footer .col1 img,
footer .socials li,
footer .footer-nav li,
footer .copyright p,
footer .copyright ul,
footer > small {
    opacity: 0;
    transform: translateY(20px);
    transition:
        opacity .45s ease,
        transform .45s ease;
}
footer .footer-nav li {
    opacity: 0;
    transform: translateY(18px);
}

/* VISIBLE */

footer.animate.in-view .footer-subscriber,
footer.animate.in-view .col1,
footer.animate.in-view .col2,
footer.animate.in-view .col3,
footer.animate.in-view .col4,
footer.animate.in-view .copyright,
footer.animate.in-view .copyright p,
footer.animate.in-view .copyright ul,
footer.animate.in-view > small {
    opacity: 1;
    transform: translateY(0);
}


/* Newsletter */

footer.animate.in-view h5 {
    opacity:1;
    transform:none;
    transition-delay:.10s;
}

footer.animate.in-view .subscriber-intro {
    opacity:1;
    transform:none;
    transition-delay:.20s;
}

footer.animate.in-view form {
    opacity:1;
    transform:none;
    transition-delay:.35s;
}


/* Logo */

footer.animate.in-view .col1 img{
    opacity:1;
    transform:none;
    transition-delay:.45s;
}


/* Social Icons */

footer.animate.in-view .socials li:nth-child(1){
    opacity:1;
    transform:none;
    transition-delay:.55s;
}

footer.animate.in-view .socials li:nth-child(2){
    opacity:1;
    transform:none;
    transition-delay:.60s;
}

footer.animate.in-view .socials li:nth-child(3){
    opacity:1;
    transform:none;
    transition-delay:.65s;
}


/* Footer Columns */

footer.animate.in-view .footer-nav li:nth-child(1){transition-delay:.60s;}
footer.animate.in-view .footer-nav li:nth-child(2){transition-delay:.68s;}
footer.animate.in-view .footer-nav li:nth-child(3){transition-delay:.76s;}
footer.animate.in-view .footer-nav li:nth-child(4){transition-delay:.84s;}
footer.animate.in-view .footer-nav li:nth-child(5){transition-delay:.92s;}

footer.animate.in-view .footer-nav li{
    opacity:1;
    transform:none;
}

/* Copyright */

footer.animate.in-view .copyright{
    transition-delay:1s;
}

footer.animate.in-view > small{
    transition-delay:1.15s;
}



/* DIFFERENT ELEMENTS IN WYSIWYG */
 /* Base */
.animate-element-on-scroll {
    opacity: 0;
    transition:
        opacity 0.6s ease,
        transform 0.6s ease;
}

/* Directions */
.animate-up {
    transform: translateY(30px);
}

.animate-down {
    transform: translateY(-30px);
}

.animate-left {
    transform: translateX(30px);
}

.animate-right {
    transform: translateX(-30px);
}

/* Final state */
.animate-element-on-scroll.in-view {
    opacity: 1;
    transform: translate(0, 0);
}