h1 { margin: 10px auto; color: var(--green); font-size: 1.5em; }
h1 span, h2 span { color: var(--black); font-weight: 300; }

section.hero {
	padding: 0;
	font-size: 1em;
	text-align: center;
    margin: 0 auto;
    color: var(--black);
    position: relative;
}

section.hero p {
	padding-bottom: 10px;
	max-width: 85%;
	margin: 0 auto;
}

section.hero p > strong { display: inline-block; }
section.hero p > strong > i {
    color: var(--green);
}

section.hero img.logo {
	width: 60%;
	margin: 10px auto;
}

section.content p { color: var(--black); }
section.content p.small { font-size: .7em; margin-top: 20px; }
section.content p.small strong { display: block; }

section.content > .grid {
	margin-top: 20px;
	align-items: baseline;
	line-height: 1.5em;
	font-size: .8em;
	justify-content: center;
	justify-items: center;
}

section.content > .grid p { margin: 10px 35px; }

section.content > .grid h2 { font-size: 1.5em; }

section.content > .grid ul {
	text-align: left;
	display: inline-block;
}

section.services .margins { 
    padding: 20px;
    background-color: #f3f7ea; 
    margin: 0 !important;
    line-height: 1.5em;
}

section.services .grid {
	align-items: start;
	grid-template-columns: auto;
	margin: 0 auto;
}

section.services .grid img.responsive { max-width: 542px; margin: 0 auto; }

section.services h3 { color: var(--green); font-size: 1.2em; }

section.services .grid > div > h3 {
	/* padding: 30px 0 50px; */
	padding: 5px 0 30px;
	text-align: center;
}

section.services h2 {
    color: var(--white);
    background-color: var(--green);
    padding: 20px;
    font-size: 3em;
    margin-bottom: 20px;
}

section.services h2 > span {
    display: block;
	font-weight: 300;
	font-size: .5em;
    color: inherit;
	line-height: 1.5em;
}

section.services p {
	margin: 10px 0 25px;
	font-size: .8em;
}

section.cta { text-align: center; }
section.cta > div { font-size: 1.2em; line-height: 2em; }
section.cta a.phone { margin: 0; font-size: 1.5em; }

@media only screen and (min-width:320px) {
    section.hero { font-size: 4.8vw; }
    section.hero a.phone { font-size: 8vw; }
    section.hero a.phone::before { width: 5vw;height: 5vw; }
}

@media only screen and (min-width:640px) {
    section.hero {
        font-size: 2vw;
        border-bottom: solid 1px var(--gray);
    }

    section.hero a.phone { font-size: 2em; }
    section.hero a.phone::before { width: 2.5vw;height: 2.5vw; }
}

@media only screen and (min-width:900px) {
    section.services .grid { grid-template-columns: repeat(2, 1fr); }
    section.services .grid img.responsive { margin: 0; justify-self: right; }
    section.services h2 > span { 
        display: inline; 
        vertical-align: middle; 
        white-space: pre;
    }
}

@media only screen and (min-width:1400px) {
    body { font-size: 26px; }
    section.hero { font-size: 28.8px; }
    section.hero a.phone { font-size: 1.8em; }
    section.hero a.phone::before { width: 35px;height: 35px; }
}