html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block}
body {line-height:1}
ol,ul {list-style:none}
blockquote,q {quotes:none}
blockquote:before,blockquote:after,q:before,q:after {content:''; content:none}
table {border-collapse:collapse; border-spacing:0}
html {height:100%}
body {height:100%; font-family:"Open Sans",sans-serif}
.bodyWrap {min-height:100%; position:relative}
::selection {background:rgba(100,188,98,0.6)}
.wrap {width:960px; margin:auto}
.clear {clear:both}
.fullWidth,header,section,footer {width:100%; min-width:960px}
.beforeFooter {padding-bottom:100px; clear:both}
.left {float:left}
.right {float:right}
.textLeft {text-align:left}
.textCenter {text-align:center}
.textRight {text-align:right}
.textJust {text-align:justify}
.fixed {position:fixed}
.relative {position:relative}
.absolute {position:absolute}
.hide,.mobile {display:none}
.block,.desktop {display:block}
.inline {display:inline}
.inlineBlock {display:inline-block}
.bold,strong {font-weight:bold}
.regular {font-weight:normal}
.italic,em {font-style:italic}
.element {position:relative}
.element:after {content:''; display:block; padding-top:100%}
.videoContainer {position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden}
.videoContainer iframe,.videoContainer object,.videoContainer embed {position:absolute; top:0; left:0; width:100%; height:100%}
.fullImg {position:relative; overflow:hidden}
.fullImg img {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); margin:auto; min-width:100%; min-height:100%}

a {text-decoration:none}

.content {color:#2C3339}
.content h1 {font-size:40px; font-size:2.5rem; line-height:45px; line-height:2.8125rem}
.content h2 {font-size:30px; font-size:1.875rem; line-height:35px; line-height:2.1875rem; font-weight:600; margin-bottom:15px}
.content h3 {font-size:20px; font-size:1.25rem; line-height:25px; line-height:1.5625rem; font-weight:600; margin-bottom:10px}
.content h4 {font-size:18px; font-size:1.125rem; line-height:23px; line-height:1.4375rem; font-weight:600; margin-bottom:10px}
.content p {font-size:16px; font-size:1rem; line-height:21px; line-height:1.3125rem; margin-bottom:25px; color:#878787}
.content ul {padding-left:25px; margin-bottom:25px; list-style:disc; color:#878787}
.content ul li {font-size:16px; font-size:1rem; line-height:21px; line-height:1.3125rem}
.content ol {padding-left:25px; margin-bottom:25px; list-style:decimal; color:#878787}
.content ol li {font-size:16px; font-size:1rem; line-height:21px; line-height:1.3125rem}

.break {width:80px; height:2px; background:rgba(135,135,135,0.2); margin-bottom:50px}

form {box-sizing:border-box}
form label {margin-bottom:15px; display:flex; flex-direction:column}
form label span {padding-bottom:5px; color:#2C3339; font-weight:600}
form input {box-sizing:border-box; width:100%; height:35px; border:1px solid #878787}
form input::-webkit-input-placeholder {color:#000}
form input:-moz-placeholder {color:#000; opacity:1}
form input::-moz-placeholder {color:#000; opacity:1}
form input:-ms-input-placeholder {color:#000}
form input:placeholder-shown {color:#000}
form textarea {box-sizing:border-box}

.flex {display:flex}
.flex-wrap {flex-wrap:wrap}
.flex-noWrap {flex-wrap:nowrap}

header {background:#fff; box-sizing:border-box; padding:20px 0; box-shadow:0px 3px 6px rgba(0,0,0,0.1); position:sticky; top:0; z-index:999}
header .wrap {display:flex; justify-content:space-between; align-items:center}
header .logo img {height:50px}
header nav ul {display:flex}
header nav ul li {margin:0 15px}
header nav ul li a {padding:10px; color:#878787}
header nav ul li.active a,header nav ul li:hover a {color:#64bc62}
header nav ul li:last-child {margin-right:0}

section {padding:50px 0; box-sizing:border-box}
section .col-2 .main-area {width:50%}
section .col-2 .main-area img {max-width:100%}
section .col-2 .content {width:50%; margin-left:50px}
section#hero {height:600px; position:relative; background-size:cover; background-position:center; background-repeat:no-repeat}
section#hero .overlay {background:rgba(0,0,0,0.3); width:100%; height:100%; position:absolute; top:0; left:0}
section#hero .wrap {display:flex; height:100%; justify-content:center; align-items:center; position:relative; z-index:9}
section#hero .wrap .hero-content {display:flex; align-items:center; flex-direction:column}
section#hero .wrap .logo img {width:500px}
section#hero .wrap .text .btn {margin-top:30px}
section.green {background:#64bc62}
section.green p {color:#dbecda}
section.green.mission .wrap {display:grid; grid-template-columns:repeat(3, [row] 1fr); grid-gap:50px}
section.green.mission .wrap .text {text-align:center; color:#fff}
section.green.mission .wrap .text h2 {margin-bottom:15px; font-size:20px; font-size:1.25rem; line-height:20px; line-height:1.25rem; font-weight:600}
section.green.mission .wrap .text p {font-size:15px; font-size:.9375rem; line-height:22px; line-height:1.375rem}
section.green.mission .wrap .image img {margin-top:-70px; max-width:100%}
section.green.sign-up h2 {color:#fff; font-size:25px; font-size:1.5625rem; line-height:32px; line-height:2rem; font-weight:600; margin-bottom:10px}
section.green.sign-up p {font-size:16px; font-size:1rem; line-height:22px; line-height:1.375rem; margin-bottom:20px}
section.green.sign-up form {display:flex}
section.green.sign-up form input {width:100%; height:50px; border-radius:5px; border:0; padding:0 15px}
section.green.sign-up form button {border:0; cursor:pointer; background:#2C3339; border-radius:5px; padding:0 15px; color:#fff; font-size:18px; text-transform:uppercase; font-weight:600; margin-left:10px}
section.green.sign-up form button:hover {color:#64bc62; background:#fff}
section aside {margin-left:50px; min-width:220px; margin-top:50px}
section .courses {display:grid; grid-template-columns:repeat(2, [row] 1fr); grid-gap:40px}

.course {width:100%; box-sizing:border-box; box-shadow:0px 4px 10px rgba(0,0,0,0.1)}
.course .image {width:100%; height:310px; overflow:hidden; display:flex; align-items:center; justify-content:center}
.course .image img {min-width:100%; min-height:100%}
.course .text {box-sizing:border-box; padding:20px}
.course .text h2 {font-weight:600; font-size:16px; font-size:1rem; line-height:22px; line-height:1.375rem; color:#878787; margin-bottom:10px}
.course .text h3 {font-weight:400; font-size:18px; font-size:1.125rem; line-height:22px; line-height:1.375rem; color:#64bc62}

.plans {flex-direction:column}
.plans .course .image img {max-width:100%}

footer {background:#2C3339; color:#878787; box-sizing:border-box; padding:50px 0}
footer .info .logo {margin-bottom:30px}
footer .info .logo img {width:300px}
footer .info ul li {margin-bottom:15px; display:flex; font-size:16px; font-size:1rem; line-height:22px; line-height:1.375rem}
footer .info ul li span.icon {min-width:20px; display:inline-flex}
footer .info ul li a {color:#878787}
footer .info ul li a:hover {color:#64bc62}
footer .underline {border-bottom:1px solid rgba(135,135,135,0.3); margin-bottom:50px; padding-bottom:50px}

.btn {display:inline-flex}
.btn a {padding:9px 25px; font-weight:600; font-size:16px; font-size:1rem}
.btn.outline a {border-radius:5px; border-width:1px; border-style:solid}
.btn.outline a:hover {background:#64bc62}
.btn.outline.white a {border-color:#fff; color:#fff}
.btn.outline.white a:hover {border-color:#64bc62}
.btn.outline.green {border-radius:5px; background:#fff; color:#64bc62; border-color:#64bc62}
.btn.outline.green:hover {background:#64bc62; color:#fff; border:1px solid #fff}
.btn.input {padding:9px 25px; text-transform:uppercase; width:fit-content; margin-left:auto; cursor:pointer}
.btn.solid {border-radius:5px}
.btn.solid.green a {border-radius:5px; border-width:1px; border-style:solid; background:#64bc62; color:#fff; border-color:#64bc62}
.btn.solid.green a:hover {background:#fff; color:#64bc62; border:1px solid #fff}

@media screen and (max-width: 960px) {
	.desktop {display:none}
	.mobile {display:block}
	.linebreak br {content:' '}
	.linebreak br:after {content:' '}
	.wrap {width:90%;}
	.fullWidth, header, section, footer {min-width:auto;}
	section.green.mission .wrap {grid-template-columns: repeat(2, [row] 1fr);}
	section.green.mission .wrap .image {display:none;}
	.course .image img {width:100%;}
}

@media screen and (max-width: 720px) {
	section#hero {height:300px;}
	section#hero .wrap .logo img {width:80vw;}
	section .courses {grid-template-columns: repeat(1, [row] 1fr);}
	section.green.mission .wrap {grid-template-columns: repeat(1, [row] 1fr);}
	section aside {margin-left:0;}
	section .col-2 .main-area, section .col-2 .content {width:100%; margin-left:0;}
	section .col-2 .main-area { order:2;}
	section .col-2 .content {order:1; margin-bottom:50px;}
	.wrap.flex {flex-wrap:wrap;}
	header nav ul li {margin:0 15px 0 0;}
	header nav ul li a {padding:5px;}
}

