﻿/* CSS Document */
/*Author: Snowbird Media, Terri Harlow, https://snowbirdmedia.ca*/

:root {
font-size:calc(1vw+1vh+.5vmin)
}

body {
background-color:#e8e8e8;
font-family:Cabin, Sans-Serif;
font-style: normal;
font-weight:400;
font-size:1.3rem;
color:#00334e;
}

a:link {
color:#145374;
margin:0 2px;
padding:0 2px
}

a:visited {
color:#653460;
margin:0 2px;
padding:0 2px
}

a:hover,a:active,a:focus {
background-color:#000;
color:#fff;
margin:0 2px;
padding:0 2px
}

header {
display:block;
background-color:#00334e;
margin:0 auto;
padding:1em 30em .25em
}

main {
display:block;
margin:0 auto;
padding:0 30em
}

h1,h2,h3,h4,h5,h6 {
font-family:'Roboto Condensed', Sans-Serif;
font-style:normal;
font-weight:700;
color:#5588a3;
margin-bottom:0
}

h1 {
font-size:2rem
}

header h1 {
font-size:2rem;
font-style:normal;
font-weight:400
}

header h2 {
font-size:2.8rem;
font-style:normal;
font-weight:700;
color:#fff;
margin-top:0.35em;
margin-bottom:0.25em
}

.intro {
font-size:1.6rem;
line-height:1.4
}

.services {
font-style:bold;
font-weight:700;
color:#000
}

.credit {
display:none
}

.detail {
font-style:bold;
font-weight:700;
color:#000
}

footer {
display:block;
margin:1em auto;
padding:0 30em
}

footer p {
font-size:1rem
}

ul li {
line-height:1.7
}

h2,h3 {
font-size:2.1rem
}

h4,h5 {
font-size:1.8rem
}
/* large desktop view */
@media screen and (max-width:2000px) {
header {
margin:0 auto;
padding: 1em 16em 0.25em
}
main {
margin:0 auto;
padding:0 16em
}
footer {
margin:1em auto;
padding:0 16em
}
}
/* laptop view */
@media screen and (max-width:1440px) {
header {
margin:0 auto;
padding: 1em 6em 0.25em
}
main {
margin:0 auto;
padding:0 6em
}
footer {
margin:1em auto;
padding:0 6em
}
}
/* medium screen view */
@media screen and (max-width:1024px) {
body {
font-size:1.2rem
}
header {
margin:0 auto;
padding: 1em 3em 0.25em
}
h2, h3, h4, h5 {
color: #3D4647; 
margin-bottom: 0
}
header h1{
font-size:1.9rem;
}
header h2 {
font-size:2.4rem
}
h2,h3 {
font-size:1.6rem
}
h4,h5 {
font-size:1.4rem
}
main {
margin:0 auto;
padding:0 3em
}
.intro {
font-size:1.5rem
}
ul {
padding-bottom: 0
}
li {
line-height:1.5
}
footer {
margin:1em auto;
padding:0 3em
}
}
/* Tablet view */
@media screen and (max-width:769px) {
body {
font-size:1.2rem
}
header {
margin:0 auto;
padding: 1em 2em 0.25em
}
h2, h3, h4, h5 {
color: #3D4647; 
margin-bottom: 0
}
header h1{
font-size:1.6rem;
}
header h2 {
font-size:2rem
}
h2,h3 {
font-size:1.6rem
}
h4,h5 {
font-size:1.4rem
}
main {
margin:0 auto;
padding:0 2em
}
.intro {
font-size:1.4rem
}
ul {
padding-bottom: 0
}
li {
line-height:1.5
}
footer {
margin:1em auto;
padding:0 2em
}
}
/* Mobile view */
@media screen and (max-width:480px) {
body {
font-size:1.1rem
}
header {
margin:0 auto;
padding: 1em 1em 0.25em
}
h2, h3, h4, h5 {
color: #3D4647; 
margin-bottom: 0
}
header h1{
font-size:1.6rem;
}
header h2 {
font-size:1.7rem
}
h2,h3 {
font-size:1.6rem
}
h4,h5 {
font-size:1.4rem
}
main {
margin:0 auto;
padding:0 1em
}
.intro {
font-size:1.2rem
}
ul {
padding-bottom: 0
}
li {
line-height:1.5
}
footer {
margin:1em auto;
padding:0 1em
}
}
