@charset "UTF-8";


/* Elements */
.btn-christi,
#contactForm button {
    background-color: #747474;
    border-color: #747474;
    color:#fff;
}

.btn-christi:hover,
#contactForm button:hover {
    color: #fff;
    background-color: #32b807;
    border-color: #32b807;
}

/* Home Page */
header {
    background-color:#fff;
}

body > div.container-topbar {
    background-color: #4927B0;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    padding: 4px 24px;
    margin-bottom:40px;
}

body header li.nav-item > a {
    text-decoration:none;
    color:#78AB67;
    font-size:18px;
}

#mainWrapper {
    padding:0;
}

.container-header {
    background-color: #fff;
    background-image: none;
}

div[class*="col-"] {
    padding:0;
}

.mod-menu {
    flex-direction: row;
}

a.nav-link {
    padding: 10px;
}

section {
    padding:20px 0;
}

/* The hero image */
.hero-image {
  /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://moonlit-media.com/everydaysurveying/images/template/everydayHero.jpg");

  /* Position and center the image to scale nicely on all screens */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

/* Place text in the middle of the image */
.hero-text {
  text-align: center;
  color: white;
}

#about h1 {
    text-align: center;
    line-height: 1.34em;
    font-size: 36px;
    margin:40px 0;
}

#about button {
    margin:40px 0;
}

#services {
    background-color:#747474;
    color:#fff;
}

#services h1 {
    text-align: center;
    line-height: 1.34em;
    font-size: 50px;
}

#services h3 {
    text-align: center;
    color:#37B70F;
    margin:20px 0;
}

#services .service {
    background-color:#fff;
    color:#000;
}

#photos {
    background-color:#32b807;
}

#photos h1 {
    text-align: center;
    line-height: 1.34em;
    font-size: 50px;
    color:#fff;
}

#photoGallery {
    background-color:#fff;
}

#contact {
    color:#37B70F;
}

#contact h1 {
    text-align: center;
    line-height: 1.34em;
    font-size: 50px;
}

#contactInfo {
    padding: 40px;
}

.map-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}

.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

footer {
    background-color:#747474;
    color:#fff;
}

footer a,
footer a:hover {
    color:#fff;
}

#memberAssociationLogos > img {
    max-width: 160px;
    margin: 40px 40px;
}


/* Home Page */

#careers {
    background-color:#4927B0; 
}

#careers > div.inner {
    background-color:#fff;
    padding: 40px;
}

#careers > div > h1 {
    color:#747474;
}

#careers div.careerTitle {
    color: #78AB67;
    font-weight: bold;
    font-size: 24px;
}

div.careerResponsibilities, 
div.careerPositionRequirements {
    font-weight:bold;
    color:#747474;
} 




/* X-Small devices (portrait phones, less than 576px) */
/* No media query for `xs` since this is the default in Bootstrap */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    body header li.nav-item > a {
    font-size:20px;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {  }

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {  }

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
    #about h1 {
        font-size:50px;
    }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {  }