/***************************************************************************************************************
    Dear Dev Pros,

    Only add non-renderable SASS in this file (no CSS selectors), otherwise any CSS will be rendered
    into any file that includes this one (spoiler alert: most files include this file)
****************************************************************************************************************/
.element-card-item { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; margin: 0 auto; min-height: 320px; max-width: 330px; color: #fff; position: relative; background-color: #00b683; overflow: hidden; }

.element-card-item::before { position: absolute; width: 100%; height: 100%; content: ' '; background: rgba(0, 0, 0, 0); top: 0; left: 0; -webkit-transition: background-color 0.3s; -o-transition: background-color 0.3s; transition: background-color 0.3s; z-index: 1; }

.element-card-item::after { position: absolute; width: 436px; height: 234px; content: ' '; background: url("../images/branch-25.png") no-repeat; top: 0; left: 0; z-index: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }

.element-card-item:hover::before { background: rgba(0, 0, 0, 0.2); }

.element-card-item:hover::after { -webkit-filter: blur(2px); filter: blur(2px); }

.element-card-item h4 { position: relative; z-index: 2; }

.element-card-stack-items > :nth-child(1) { background-color: #A5D27E; }

.element-card-stack-items > :nth-child(1)::after { -webkit-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); left: -120px; bottom: 30px; top: inherit; }

.element-card-stack-items > :nth-child(1):hover::after { -webkit-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); }

.element-card-stack-items > :nth-child(2) { background-color: #81CE7B; }

.element-card-stack-items > :nth-child(2)::after { -webkit-transform: rotate(-40deg); -ms-transform: rotate(-40deg); transform: rotate(-40deg); right: -200px; left: inherit; bottom: -134px; top: inherit; }

.element-card-stack-items > :nth-child(3) { background-color: #07B683; }

.element-card-stack-items > :nth-child(3)::after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); top: -100px; left: -20px; }

.element-card-stack-items > :nth-child(4) { background-color: #0C8C81; }

.element-card-stack-items > :nth-child(4)::after { -webkit-transform: scale(-1, 1) rotate(-60deg); -ms-transform: scale(-1, 1) rotate(-60deg); transform: scale(-1, 1) rotate(-60deg); top: inherit; bottom: -100px; left: -200px; }

.element-card-stack-items > :nth-child(5) { background-color: #095767; }

.element-card-stack-items > :nth-child(5)::after { -webkit-transform: scale(-0.7, 0.7) rotate(-110deg); -ms-transform: scale(-0.7, 0.7) rotate(-110deg); transform: scale(-0.7, 0.7) rotate(-110deg); top: 47px; left: 0; }

.element-card-stack-items > :nth-child(6) { background-color: #093856; }

.element-card-stack-items > :nth-child(6)::after { -webkit-transform: scale(-1, 1) rotate(-110deg); -ms-transform: scale(-1, 1) rotate(-110deg); transform: scale(-1, 1) rotate(-110deg); top: inherit; bottom: -158px; left: -220px; }

@media (min-width: 576px) { .element-card-item { -webkit-box-flex: 0; -ms-flex: 0 0 48%; flex: 0 0 48%; margin: 0; } }

@media (min-width: 992px) { .element-card-item { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; min-height: 320px; } }
/*# sourceMappingURL=elementcardstack.css.map */