body,header,footer,section,div,ul,ol,li,h1,h2,h3,h4,h5,h6,p,a { margin: 0; padding: 0; font-weight: 500; box-sizing: border-box; }


header:after, .content:after, footer:after { content: ' '; display: table; clear: both; }


img { display: block; }
a { text-decoration: none; color: #007afe; }
.hidden { display: none; }
li { list-style: none; }


body { background-color: #eee; font-family: omnes-pro, sans-serif; }

#container { max-width: 1700px; margin: 0 auto; border-top: 10px solid #333; background-color: #fff; }

header, 
.content, 
#main { margin: 0 auto; max-width: 954px; /* 920 + 17 + 17 */ }
#home #main { max-width: none; }

@media screen and (min-width: 768px) {
	header, 
	.content, 
	#main { max-width: 960px; /* 920 + 20 + 20 */ }
	#home #main { max-width: none; }
}

header { border-bottom: 1px solid #ccc; }
#home header { border: 0; }

.content { padding: 18px 17px; }

@media screen and (min-width: 768px) {
	.content { padding: 36px 20px; }
}

#main h2 { color: #000; font-size: 32px; line-height: 36px; font-weight: 700; margin-bottom: 4px; }
#main h3 { color: #000; font-size: 24px; line-height: 28px; font-weight: 700; margin-bottom: 8px; }
#main li,
#main p  { color: #333; font-size: 18px; line-height: 24px; }
#main p  { margin-bottom: 24px; }
#main a  { font-weight: 700; }

#pages h1,
#terms h1,
#policy h1 { color: #000; font-size: 32px; line-height: 36px; font-weight: 700; margin-bottom: 4px; }

@media screen and (min-width: 768px) {
	#main h2 { font-size: 44px; line-height: 52px; }
	#main li,
	#main p  { font-size: 24px; line-height: 36px; }
	#main p  { margin-bottom: 36px; }

	#pages h1,
	#terms h1,
	#policy h1 { font-size: 44px; line-height: 52px; }
	#pages h2,
	#terms h2,
	#policy h2 { font-size: 32px; line-height: 36px; }
}


header { padding: 18px 17px; }
header h2 { float: left; }
nav { float: right; margin-top: 82px; }
nav li { font-size: 14px; line-height: 16px; font-weight: 500; text-transform: uppercase; display: none; float: left; }
nav li a { font-weight: 500; } /* weird */
nav li.alwayson { display: block; }
nav a { display: block; color: #000; padding: 6px 15px; }
nav a:hover { color: #fd258d; }
nav a.button { border: 1px solid #fd258d; border-radius: 8px; padding-left: 12px; padding-right: 12px; margin-top: -1px; margin-left: 15px; }
nav a.button:hover { border-color: #fd258d; }

@media screen and (min-width: 768px) {
	header { padding: 18px 20px; }
	nav { margin-top: 88px; }
	nav li { display: block; }
}

#hero { min-height: 550px; padding: 20px 0; background: url('/images/hero-wide.jpg') no-repeat 50% 50%; background-size: 1700px 700px; display: flex; align-items: center; }
#hero .content { width: 100%; padding: 0; }
#hero .intro { background-color: rgba(238,238,238,0.8); max-width: 350px; padding: 17px 17px 22px; border-radius: 0 8px 8px 0; }
#hero p { font-size: 28px; line-height: 36px; margin-bottom: 24px; font-weight: 600; }
#hero p.button, #main p.button { margin-bottom: 0; }
#hero p.button a, #main p.button a { font-size: 16px; line-height: 24px; padding: 8px 16px; border-radius: 8px; display: inline-block; background-color: #fd258d; color: #fff; text-transform: uppercase; font-weight: 500; }
#hero p.button a:hover { background-color: #fff; color: #fd258d; }
#main p.button a:hover { background-color: #eee; color: #fd258d; }
#hero span, #hero strong { color: #fd258d; font-weight: 700; }
#hero strong { display: inline-block; }

@media screen and (min-width: 768px) {
	#hero { padding: 20px 20px; }
	#hero p { font-size: 32px; line-height: 36px; margin-bottom: 18px; }
	#hero .intro { max-width: 390px; border-radius: 8px; }
}

#notfound #hero { min-height: 600px; padding: 20px 0; background: url('/images/404-hero.jpg') no-repeat 50% 50%; background-size: 1200px 675px; display: flex; align-items: center; }
#notfound #hero .intro { max-width: 580px; padding-bottom: 17px; }

@media screen and (min-width: 768px) {
	#notfound #hero { min-height: 956px; background-size: 1700px 956px; }
}


#company { padding: 36px 17px 0; }

@media screen and (min-width: 768px) {
	#company { padding: 72px 20px 0; }
}


#offerings { padding: 18px 0; }
#offerings .content { padding: 0 17px; }
#offerings h2 { margin-bottom: 18px; }
#offerings li { margin-bottom: 16px; }
#offerings .copyblock { padding: 24px 24px 28px; }
#offerings img { max-width: 100%; display: block; }
#offerings h3,
#offerings h4 { color: #fff; }
#offerings h3 { font-size: 24px; line-height: 24px; margin-bottom: 6px; }
#offerings h4 { font-size: 15px; line-height: 18px; text-transform: uppercase; margin-bottom: 18px; }
#offerings li li,
#offerings p  { color: #f0f0f0; line-height: 24px; margin-bottom: 8px; }
#offerings p { font-size: 17px; margin: 18px 0 0; }
#offerings li li { list-style: circle; margin-left: 1.1em; }
#offerings .one   { background-color: #00665D; }
#offerings .two   { background-color: #006382; }
#offerings .three { background-color: #806E5C; }

@media screen and (min-width: 560px) {
	#offerings .offering { display: flex; align-content: center; align-items: center; }
	#offerings .two { flex-direction: row-reverse; }
	#offerings .offering:nth-child(even) { flex-direction: row-reverse; }
	#offerings div { flex-basis: 50%; }
	#offerings .copyblock { padding: 30px 5%; }
	#offerings li li,
	#offerings p { margin-bottom: 8px; }
}

@media screen and (min-width: 768px) {
	#offerings { padding: 36px 0; }
	#offerings .content { padding: 0 20px; }
	
	#offerings h3 { font-size: 28px; line-height: 32px; margin-bottom: 4px; }
	#offerings h4 { font-size: 18px; line-height: 24px; margin-bottom: 24px; }
	#offerings p { font-size: 20px; margin: 24px 0 0; }
	#offerings li li,
	#offerings p { margin-bottom: 16px; }
}

@media screen and (min-width: 900px) {
	#offerings h3 { font-size: 36px; line-height: 38px; margin-bottom: 4px; }
	#offerings h4 { font-size: 18px; line-height: 24px; margin-bottom: 24px; }
	#offerings p { font-size: 20px; margin: 24px 0 0; }
}


#philosophy { padding: 18px 0; }
#philosophy .content { padding: 0 17px; width: 100%; }
#philosophy h3 { margin-bottom: 4px; }
.flowerncopy { /*position: relative;*/ display: flex; }

@media screen and (max-width: 767px) {
	#philosophy ol { background: url('/images/flower-sm.jpg') no-repeat 0 50%; background-size: 315px 450px; padding-left: 17px; padding-right: 17px; }
}

@media screen and (min-width: 414px) {
	#philosophy ol li { max-width: 410px; }
}

@media screen and (min-width: 768px) {
	#philosophy { padding: 36px 0; }
	#philosophy .content { padding: 0 20px; position: relative; }

	#philosophy .flower { background: url('/images/flower-md.jpg') no-repeat 100% 50%; background-size: 600px 605px; width: 50%; height: 725px; }

	#philosophy ol { position: relative; /*width: 350px;*/ background-color: #eee; }
	#philosophy ol li { max-width: none; }
	#philosophy ol p { font-size: 20px; line-height: 28px; margin-bottom: 0; }
	
	#philosophy .petal { position: absolute; }
	#philosophy .petal1 { left: -170px; top: 0; width: 490px; }
	#philosophy .petal2 { left: -110px; top: 125px; width: 410px; }
	#philosophy .petal3 { left: 20px; top: 275px; width: 330px; }
	#philosophy .petal4 { left: -10px; top: 425px; width: 380px; }
	#philosophy .petal5 { left: -105px; top: 590px; width: 410px; }
}

@media screen and (min-width: 900px) {
	#philosophy .flower { background: url('/images/flower-lg.jpg') no-repeat 100% 50%; background-size: 850px 857px; width: 55%; height: 857px; }

	#philosophy .petal1 { left: -210px; top: 10px; width: 480px; }
	#philosophy .petal2 { left: -80px; top: 170px; width: 400px; }
	#philosophy .petal3 { left: 30px; top: 350px; width: 350px; }
	#philosophy .petal4 { left: -30px; top: 530px; width: 400px; }
	#philosophy .petal5 { left: -150px; top: 720px; width: 480px; }
}


#partners { padding: 18px 17px; clear: both; }
#partners ul { margin-left: -14px; margin-right: -14px; }
#partners li { float: left; width: 100%; padding: 0 14px; margin-bottom: 36px; }
#partners img { max-width: 100%; display: block; margin-bottom: 16px; border: 1px solid #ccc; }
#partners h3 { color: #000; }
#partners p  { color: #333; }
#partners p span { color: #fd258d; display: block; }
#partners a:hover h3, 
#partners a:hover p { color: #fd258d; }
#partners a:hover img { border-color: #fd258d; }
#partners ul p { margin-bottom: 0; }

@media screen and (min-width: 560px) {
	#partners li { width: 50%; margin-bottom: 0; }
}

@media screen and (min-width: 768px) {
	#partners { padding: 36px 20px; }
	#partners ul p { font-size: 20px; line-height: 28px; }
}


#clients { clear: both; padding: 18px 17px 36px; }
#clients h2 { margin-bottom: 18px; }
#clients ul { margin-left: -10px; margin-right: -10px; }
#clients li { float: left; width: 50%; padding: 0 10px; }
#clients img { max-width: 100%; display: block; }

@media screen and (min-width: 600px) { /* 485px */
	#clients ul { margin: 0; }
	#clients li { width: calc(100%/3); padding: 0 50px; }
}

@media screen and (min-width: 768px) {
	#clients { padding: 36px 20px 72px; }
}


#connect { padding: 36px 17px; text-align: center; clear: both; background: url('/images/sand-wide.jpg') no-repeat 50% 50%; min-height: 648px; display: flex; align-items: center; }
#home #connect h2 { text-transform: none; margin-bottom: 16px; }
#connect img { margin: 0 auto 16px; max-width: 200px; height: auto; }
#connect p.button { margin-bottom: 24px; }
#connect p.button a { font-size: 16px; line-height: 24px; padding: 8px 16px; border-radius: 8px; display: inline-block; background-color: #fd258d; color: #fff; text-transform: uppercase; font-weight: 600; }
#connect p.button a:hover { background-color: #fff; color: #fd258d; }
#connect li { display: inline-block; padding: 0 10px; }

@media screen and (min-width: 768px) {
	#connect { padding: 72px 20px; max-width: none; }
}


.footcontent { margin: 0 auto; max-width: 920px; }
footer { background-color: #333; padding: 23px 17px 25px; text-align: right; }
footer h2 { float: left; width: 120px; }
footer ul { padding-top: 5px; }
footer li { margin-bottom: 6px; }
footer li, footer small { font-size: 14px; line-height: 16px; }
footer small span { display: block; }
footer li, footer a { color: #bbb; font-weight: 600; }
footer a:hover { color: #fea8d1; }
footer small { padding-left: 9px; }

@media screen and (min-width: 768px) {
	footer { text-align: left; padding: 23px 20px 25px; }
	footer ul { float: right; }
	footer li { margin: 0; display: inline-block; float: left; }
	footer ul a { padding: 3px 9px 4px; border-right: 1px solid #979797; }
	footer small span { display: inline; }

}

#main .logos { margin: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; font-size: 96px; line-height: 96px; font-weight: 600; }
.logos span { display: block; padding: 0 24px; margin-bottom: 18px; }
.logos img { max-width: 100%; display: block; margin-bottom: 18px; }
.workshop { margin-bottom: 36px; }
#main .workshop h2 { font-size: 24px; line-height: 36px; margin-bottom: 6px; }
.event { margin-bottom: 24px; }
.event ul { margin-bottom: 4px; }
.event li { display: block; }

@media screen and (min-width: 768px) {
	.logos img, .logos span { margin-bottom: 36px; }
	.event { margin-bottom: 18px; }
	.event li { display: inline-block; padding: 0 10px; border-right: 1px solid #979797; }
	.event li.first { padding-left: 0; }
	.event li.last { border: 0; }
}

p.light { font-size: 14px; line-height: 16px; font-weight: 400; }
p.regular { font-size: 14px; line-height: 16px; font-weight: 500; }
p.medium { font-size: 14px; line-height: 16px; font-weight: 600; }
p.semibold { font-size: 14px; line-height: 16px; font-weight: 700; }