body {
margin: 0;
font-family: 'Merriweather', serif;
font-size: 18px;
background-color: #f7f2e8;
background-image: url('/assets/img/paper.png');
position: relative;
}
    body:before {
    content: '';
    position: absolute;
    background-image: url("/assets/img/square.png");
    left: 0%;
    top: 0;
    width: 100%;
    height: 260px;
    background-position: center center;
    background-repeat: repeat;
    z-index: -1;
    }

main {
display: flex;
flex-direction: column;
align-items: center;
min-height: 95vh;
}

h1,h2,h3,h4,h5,h6 {
font-family: 'Barlow Condensed', sans-serif;
}
    h1 {
    font-size: 9rem;
    color: #25224a;
    filter: drop-shadow(5px 6px 0 #a9bdc9);
    text-transform: uppercase;
    text-align: center;
    margin: 20px 0;
    }
    @media only screen and (max-width: 1400px) {
        h1 {
        font-size: 6rem;
        }
    }
    @media only screen and (max-width: 900px) {
        h1 {
        font-size: 3rem;
        }
    }
    @media only screen and (max-width: 480px) {
        h1 {
        font-size: 2.2rem;
        }
    }

.row {
max-width: 1400px;
width: 100%;
padding: 15px;
box-sizing: border-box;
margin-top: 100px;
}

.col-2 {
display: flex;
flex-wrap: wrap;
margin-left: -15px;
}
    .col-2 > * {
    margin-left: 15px;
    width: calc(50% - 15px);
    }

.col-3 {
display: flex;
flex-wrap: wrap;
margin-left: -15px;
}
    .col-3 > * {
    margin-left: 15px;
    width: calc(33% - 15px);
    }

.col-4 {
display: flex;
flex-wrap: wrap;
margin-left: -15px;
}
    .col-4 > * {
    margin-left: 15px;
    width: calc(25% - 15px);
    }

@media only screen and (max-width: 480px) {
    .col-2 > * {
    width: 100%;
    }
    .col-3 > * {
    width: 100%;
    }
    .col-4 > * {
    width: calc(50% - 15px);
    }
}

.vert-center {
align-items: center;
}

img {
max-width: 100%;
width: 100%;
height: auto;
}

a {
text-decoration: none;
color: #3fc1be;
}
.button {
background-color: #3fc1be;
color: #fff;
padding: 0.7em 2.6em;
display: inline-block;
transition: all 0.3s ease;
}
    .button:hover {
    background-color: #353e3d;
    }

.center {
text-align: center;
}
.right {
text-align: right;
}


.script {
font-family: 'Satisfy', cursive;
}

.subtitle-wrap {
display: flex;
width: 100%;
align-items: center;
}
    .subtitle {
    width: auto;
    padding: 0 10px;
    color: #25224a;
    margin: 0;
    font-size: 2rem;
    }
        .subtitle-side-decor {
        position: relative;
        width: auto;
        flex-grow: 1;
        }
            .subtitle-side-decor:before {
            background-color: #25224a;
            content: '';
            position: absolute;
            left: 0;
            width: 100%;
            height: 3px;
            top: -7px;
            }
            .subtitle-side-decor:after {
            background-color: #25224a;
            top: 7px;
            height: 8px;
            background-repeat: repeat-x;
            -webkit-mask-image: url('/assets/img/star.svg');
            mask-image: url('/assets/img/star.svg');
            content: '';
            position: absolute;
            left: 0;
            width: 100%;
            }

.banner-text {
font-family: Satisfy;
position: relative;
display: inline-block;
margin-top: 16px;
}
    .banner-text span {
    color: #eae5de;
    font-size: 3rem;
    background-color: #e53e26;
    text-transform: capitalize;
    position: relative;
    line-height: initial;
    display: inline-block;
    padding: 0 60px;
    background-image: url('/assets/img/green-dust-and-scratches.png');
    background-position: center 65%;
    }
    .banner-text .left-shape, 
    .banner-text .right-shape {
    position: absolute;
    z-index: -1;
    top: -16px;
    }
    .banner-text .left-shape {
    right: calc(100% - 29px);
    }
    .banner-text .right-shape {
    left: calc(100% - 29px);
    }
        .banner-text:before, 
        .banner-text:after {
        content: '';
        position: absolute;
        bottom: 100%;
        width: 0;
        height: 0;
        border-style: solid;
        filter: brightness(0.65);
        border-color: transparent transparent #e53e26 transparent;
        }
        .banner-text:before {
        left: 0;
        border-width: 0 0 16px 29px;
        }
        .banner-text:after {
        right: 0;
        border-width: 0 29px 16px 0;
        }

        @media only screen and (max-width: 900px) {
            .banner-text span {
            padding: 0 20px;
            font-size: 1.6rem;
            }
        }

        @media only screen and (max-width: 480px) {
            .banner-text {
            transform: scale(0.8);
            }
        }


ul.lightning_style {
margin-left: 0;
padding-left: 0;
list-style: none;
}
    ul.lightning_style li {
    position: relative;
    padding: 15px 0 15px 35px;
    background-image: -webkit-linear-gradient(left, #D5CDC1 33%, rgba(255,255,255,0) 0%);
    background-image: -o-linear-gradient(left, #D5CDC1 33%, rgba(255,255,255,0) 0%);
    background-image: linear-gradient(to right, #D5CDC1 33%, rgba(255,255,255,0) 0%);
    background-position: top;
    background-size: 8px 2px;
    background-repeat: repeat-x;
    }

    ul.lightning_style li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    width: 1.75rem;
    height: 1.75rem;
    -webkit-mask-image: url('/assets/img/star.svg');
    mask-image: url('/assets/img/star.svg');
    background-color: #e53e26;
    }

    .ripped {
    -webkit-mask-image: url('/assets/img/ripped.svg');
    -webkit-mask-position: bottom center;
    -webkit-mask-size: auto 1920px;
    -webkit-mask-repeat: no-repeat;
      }