/* CARDS */
.animate-cards > .wp-block-group{
	width:100%;
}
.animate-cards > .is-controls > div > .wp-block-button > .wp-element-button{
    background-color: transparent;
    color:var(--color4);
    font-weight: 500;
    padding:12px 16px;
}
.animate-cards > .is-controls > div > .wp-block-button > .wp-element-button:hover{
    background-color: var(--color6);
}
.animate-cards > .is-controls > div > .wp-block-button > .wp-element-button.is-active{
    color: var(--white);
    background-color: var(--color4);
    opacity: 1;
    text-shadow: 0 0 1px var(--white);
}
@media(min-width:1025px){
	/* CARDS */
    .animate-cards{
        position:relative;
    }
    .animate-cards > .is-controls{
        height: 60px;
    }
    .animate-cards > .is-controls > div{
        background:var(--white);
        border-radius:100px;
        padding:8px;
        left:0;
        right: 0;
        margin:auto;
        width:max-content;
    }
    .animate-cards > .wp-block-group:not(.is-controls){
        height:100vh;
    }
    .animate-cards > .wp-block-group > .wp-block-columns{
        z-index:1;
		width:100%;
    }
    .animate-cards > .is-controls > div > .wp-block-button > .wp-element-button{
        opacity: 0.7;
    }
    .animate-cards > .wp-block-group.is-active > .wp-block-columns{
        left:0;
        right:0;
    }
    .animate-cards:not(.is-done) > .is-controls.is-active > div{
        position:fixed;
        top:14px;
    }
	body.is-scroll-up .animate-cards:not(.is-done) > .is-controls.is-active > div{
        top:80px;
    }
    .animate-cards:not(.is-done) > .wp-block-group.is-active > .wp-block-columns{
        position:fixed;
    }
    .animate-cards:not(.is-done) > .wp-block-group.is-active > .wp-block-columns{
        top:88px;
    }
	body.is-scroll-up .animate-cards:not(.is-done) > .wp-block-group.is-active > .wp-block-columns{
        top:154px;
    }
    .animate-cards.is-done > .wp-block-group > .wp-block-columns{
        position:absolute;
        bottom:0;
    }
	/* STICKY BLOCK */
	.animate-sticky-block.is-init.is-active > div{
		position:fixed;
	}
	.animate-sticky-block.is-init.is-done > div{
		position:absolute;
		bottom:0;
		top:unset!important;
	}
}
@media(min-width:1400px){
    .animate-cards > .is-controls{
        height:64px;
    }
    .animate-cards:not(.is-done) > .wp-block-group.is-active > .wp-block-columns{
        top:96px;
    }
}
@media(max-width:1024px){
    .animate-cards > .is-controls > div > .wp-block-button > .wp-element-button{
        background-color: var(--color6);
    }
}
