* { box-sizing: border-box; margin: 0;}
html{font-size:1em;}
body {
font-family: 'Alegreya', serif;
line-height:1.4;
}
form, .sans-serif {font-family: 'Poppins', sans-serif;}

input,textarea{font-family:inherit;font-size:1.2rem;}

.container {
max-width: 1100px; margin: auto;
padding: 0 2rem; overflow: hidden;
}
.text-center {text-align: center;}
.text-primary {color: #93cb52;}
.bg-light {background: #f4f4f4;color: #333333;}
.bg-dark {background: #333;color: #fff;}
.bg-primary {background: #93cb52; color: #fff;}
.l-heading {
font-size: 3rem; margin-bottom: 0.75rem;line-height:1.1;
}
.m-heading {
font-size: 2rem; margin-bottom: 0.75rem; line-height:1.1;
}
.lead {font-size: 1.3rem; margin-bottom: 2rem;}
.py-1 {padding: 1.5rem 0;}
.py-2 {padding: 2rem 0;}
.py-3 {padding: 3rem 0;}
.p-1 {padding: 1.5rem;}
.p-2 {padding: 2rem;}
.p-3 {padding: 3rem;}


.btn {
font-size:1.2rem;
display: inline-block;
color: #ffffff;
background: #93cb52;
padding: 0.5rem 2rem;
border: none; border-radius: 5px;
text-decoration: none;
}
.btn:hover {background: #7ab436;}
.btn-dark {background: #333;color: #fff;}
.btn-dark:hover {background: #f4f4f4;color: #333;}

.main {display: flex;justify-content: space-evenly}

#navbar {
display: flex; justify-content: space-between;
position: sticky;  top:0; z-index: 1;
background: #333333; color: #ffffff;
padding: 1rem;
} 
#navbar ul {
display: flex; align-items: center;
list-style: none;
}
#navbar ul li a {
color: #ffffff; 
text-decoration: none;
padding: 0.75rem;
margin: 0 0.25rem;
}
#navbar ul li a:hover {
background: #93cb52; 
border-radius: 5px;
}

#pagehome a#linkhome, #pagecontact a#linkcontact, #pagelearn a#linklearn {background-color: rgba(147, 203, 82, 0.5);border-radius: 5px;}

#showcase {
background: #333 url('http://mandarinline.com/img/forest-2.jpg') no-repeat center center/cover;
height:100vh;
color: #ffffff;
}

#showcase .showcase-content {
display: flex; flex-direction: column;
justify-content: center; align-items: center; 
text-align: center; height: 100%;   
padding: 0 2rem;
/* overlay if-cover-all right: 0; */
position: absolute; top: 65px; left: 0; bottom: 0; background-color: rgba(0,0,0,0.18);
}

/* what we do */
#what .items {display: flex;padding: 1rem;}
#what .items .item {flex: 1; text-align: center;padding: 1rem;}
#what .items .item i {
background: #93cb52; padding: 1rem;
border-radius: 50%; margin-bottom: 1rem;
}

/* Section: contact#contact height:100vh;*/
#contact {display: flex;min-height:100vh;}
#contact .contact-form, #contact .contact-text {flex: 1;}
#contact .contact-form .form-group {margin: 0.75rem;}
#contact .contact-form label {display: block;}
#contact .contact-form input, #contact .contact-form textarea {
width: 100%; padding:0.5rem;
}