.section__hero.animated  {
    margin-bottom: 0;
    padding-bottom: 0;
}


.section__hero h1 {
    display: flex;
    flex-direction: column;
}

.section__hero.animated h1,
.section__hero.animated li {
	font-size: 3rem;
}

.section__hero.animated h1 div {
    opacity: 0;
}

.section__hero.hero__image {
    justify-content: flex-end;
    padding-bottom: 0;
}

.section__hero.sogooditsgood h1 {
    margin-bottom: 6rem;
    color: #18F264;
    text-shadow: 1px 1px #620418;
}

svg#sogooditsgood {
    display: block;
    width: 90%;
    margin:auto;
    margin-bottom: 2rem;
    fill: #18F264;
    /* fill: #F5093B; */
}

@media screen and (min-width: 414px) {
    .section__hero h1,
    .section__hero li {
        font-size: 2rem;
    }

    .section__hero.animated h1,
    .section__hero.animated li {
        font-size: 3.5rem;
    }

    .section__hero.hero__image h1 {
        margin-bottom: 11rem;
        font-size: 2.3rem;
    }
}

@media screen and (min-width: 768px) {
    .section__hero h1,
    .section__hero li {
        font-size: 3.5rem;
    }

    .section__hero.animated h1,
    .section__hero.animated li {
        font-size: 6.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .section__hero.hero__image {
		justify-content: flex-end;
		padding-bottom: 0;
	}

    .section__hero.hero__image h1 {
        margin-bottom: 0;
        font-size: 6rem;
    }

    .section__hero h1,
    .section__hero li {
        font-size: 5rem;
    }

    svg#sogooditsgood {
        width: 50%;
        margin-left: 0;
        margin-bottom: 6rem;
    }
}

@media screen and (min-width: 1200px) {
    .section__hero h1,
    .section__hero li {
        font-size: 5.5rem;
    }

    svg#sogooditsgood {
        width: 40%;
        margin-bottom: 4rem;
    }
}

@media screen and (min-width: 1400px) {
    .section__hero h1,
    .section__hero li {
        font-size: 6rem;
    }
}