/*
Block Name: Accordion
Description: A block used to create a cascading accordion
*/
:root {
	--brand-1: #7ca844;
	--brand-2: #b33e24;
	--grid-gap: 3rem;
}

.block-accordion .accordion{margin-bottom:1.5rem;}
.block-accordion .accordion .accordion-title {background-color: var(--brand-2);color: #fff;padding:2rem 2.5rem;cursor: pointer;transition:all .25s;position: relative;}
.block-accordion .accordion.active .accordion-title { background-color: var(--brand-1); }
.block-accordion .accordion .accordion-title:after{content:'';width:20px;height:3px;background:#ffffff;position:absolute;right:1.5rem;top:50%;transform:translateY(-50%);}
.block-accordion .accordion .accordion-title:before{content:'';width:20px;height:3px;background:#ffffff;position:absolute;right:1.5rem;top:50%;transform:translateY(-50%) rotate(90deg);transition:all .25s;}
.block-accordion .accordion.active .accordion-title:before{opacity:0;}
.block-accordion .accordion .accordion-title h5 {margin-bottom:0;padding-right:3rem;}

.block-accordion .accordion .accordion-content{height:0;overflow:hidden;transition:all .5s; background: var(--brand-8); }
.block-accordion .accordion .accordion-content .accordion-content-padding{padding: var(--grid-gap);}
.block-accordion .accordion-column-count { display: grid; grid-gap: var(--grid-gap); }