/* START NAV STYLES */
nav {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  transition: background-color .5s ease;
  background-color: rgba(0,0,0,0);
}

.nav-logo {
  padding: .5em 2em .1em 1em;
  z-index: 100;
}

.nav-logo img {
  position: relative;
  width: 200px;
}

.nav-links-wrapper {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-around;
  padding: 0 .5em;
  z-index: 100;
}

.nav-link {
  position: relative;
  padding: .8em;
  color: #999999;
  font-size: 1.5rem;
  letter-spacing: .5px;
  transition: all 0.2s ease-in-out;
}

.nav-link a {
  color: #999999;
  text-decoration: none;  
}

.nav-link a:hover {
  color: #fff;
  cursor: pointer;
  text-decoration: underline;
}

.active {
  color: #fff !important;
  text-decoration: underline !important;
}

.side-nav-links-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  background-color: #000;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  padding: 0 .5em;
  z-index: 100;
}

.side-nav-link {
  position: relative;
  padding: .8em;
  color: #999999;
  font-size: 1.5rem;
  letter-spacing: .5px;
  transition: all 0.2s ease-in-out;
}

.side-nav-link a {
  color: #999999;
  text-decoration: none;  
}

.side-nav-link a:hover {
  color: #fff;
  cursor: pointer;
  text-decoration: underline;
}

.hamburger-wrapper {
  padding: 0 1em;
  z-index: 10000;
}

.nav-icon {
  width: 60px;
  height: 45px;
  position: relative;
  margin: 0 auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

.nav-icon span {
  display: block;
  position: absolute;
  height: 5px;
  width: 50%;
  background: #E05E36;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.nav-icon span:nth-child(even) {
  left: 50%;
  border-radius: 0 9px 9px 0;
}

.nav-icon span:nth-child(odd) {
  left:0px;
  border-radius: 9px 0 0 9px;
}

.nav-icon span:nth-child(1), .nav-icon span:nth-child(2) {
  top: 0px;
}

.nav-icon span:nth-child(3), .nav-icon span:nth-child(4) {
  top: 18px;
}

.nav-icon span:nth-child(5), .nav-icon span:nth-child(6) {
  top: 36px;
}

.nav-icon.open span:nth-child(1),.nav-icon.open span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.nav-icon.open span:nth-child(2),.nav-icon.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.nav-icon.open span:nth-child(1) {
  left: 5px;
  top: 7px;
}

.nav-icon.open span:nth-child(2) {
  left: calc(50% - 5px);
  top: 7px;
}

.nav-icon.open span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

.nav-icon.open span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

.nav-icon.open span:nth-child(5) {
  left: 5px;
  top: 29px;
}

.nav-icon.open span:nth-child(6) {
  left: calc(50% - 5px);
  top: 29px;
}

/* END NAV STYLES */

/* START HEADER STYLES */
.header-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 1em 0;
}

.header-tagline {
  color: #fafafa;
  font-size: 4rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

@media only screen and (max-width: 600px) {
  .header-tagline {
    font-size: 2rem !important;
  }
}

.header-tagline span {
  padding: 0 1em;
  margin: 0;
  height: 70px;
}

.header-tagline-divider {
  position: relative;
  width: 8px;
  background-color: #fff;
  height: 9em;
}

.learn-more-wrapper {
  width: 9em;
  height: 3em;
  margin: 3em auto;
  border-radius: 8px;
  background: linear-gradient(-90deg, #BD3E7F, #E05E36);
  transition: box-shadow .2s ease-in-out;
}

.learn-more-button {
  margin: 0 auto;
  color: #fff;
  font-size: 1.3em;
}

.learn-more-wrapper:hover {
  cursor: pointer;
  box-shadow: inset 0 0 0 3px #E05E36;
}

.learn-more-link {
  text-decoration: none;
}
/* END HEADER STYLES */

/* START MISSION SECTION STYLES */
#mission {
  background-color: #E05E36;
  box-shadow: 0 4px 8px rgba(0,0,0,.3);
}

.mission-wrapper {
  width: 70%;
  min-height: 50px;
  margin: 0 auto;
  color: #fff;
  font-size: 1.7rem;
  font-style: italic;
  text-align: center;
  z-index: 100;
}
/* END MISSION SECTION STYLES */

/* START SERVICES STYLING */
.services-wrapper {
  width: 60%;
  margin: 0 auto;
}

.section-header {
  margin: 0 auto;
  text-align: center;
  font-size: 4rem;
  font-weight: 300;
  /* padding: 0 5em; */
}

.section-header span {
  font-weight: 400;
}

.service-boxes-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  padding: 2em 0 0 0;
}

.service-boxes-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}

.service-boxes-row:nth-child(1) .service-box-wrapper:nth-child(1), .service-boxes-row:nth-child(2) .service-box-wrapper:nth-child(2) {
  background-color: rgba(0,0,0,.1);
}

.service-box-wrapper {
  width: 50%;
  text-align: center;
}

.content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.service-box-icon img {
  /* width: 4em; */
  padding: 0 0 1em 0;
  max-height: 4em;
}

.service-box-header {
  font-size: 2.5rem;
  color: #4A4A4A;
  letter-spacing: -1.3px;
}

.service-box-content {
  width: 80%;
  margin: 0 auto;
  font-size: 1.3rem;
  font-weight: 300;
  color: #4A4A4A;
}

/* @media only screen and (max-width: 1000px) {
  .service-box-header {
    font-size: 2rem;
  }
  .service-box-content {
    font-size: .8rem;
  }
}

@media only screen and (max-width: 750px) {
  .service-box-header {
    font-size: 1.5rem;
  }
  .service-box-content {
    font-size: .5rem;
  }
} */

@media only screen and (max-width: 800px) {
  .service-box-header {
    font-size: 2.5rem;
  }
  .service-box-content {
    font-size: 1.3rem;
  }
  .service-box-wrapper {
    width: 100%;
    text-align: center;
    /* padding: 1em 0; */
  }
  .reorder {
    order: -1;
  }
  .services-wrapper {
    width: 60%;
  }
  .service-box-icon img {
    width: 6em;
    padding: 0 0 1em 0;
  }
}

@media only screen and (max-width: 600px) {
  .service-box-header {
    font-size: 2rem;
  }
  .service-box-content {
    font-size: 1.3rem;
  }
  .service-box-wrapper {
    width: 100%;
    text-align: center;
    /* padding: 1em 0; */
  }
  .reorder {
    order: -1;
  }
  .services-wrapper {
    width: 80%;
  }
  .service-box-icon img {
    width: 4em;
    padding: 0 0 1em 0;
  }
}
/* END SERVICES STYLING */

/* START TEAM STYLING */
.team-wrapper {
  width: 100%;
  margin: 0 auto;
}

.team-members-wrapper {
  width: 100%;
  padding: 2em 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.team-member {
  width: 33%;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
}

.team-member-image img {
  /* width: 13em; */
  height: 13em;
  /* height: 40%; */
  border-radius: 100%;
  box-shadow: 0 4px 8px rgba(0,0,0,.3);
}

.team-member-name {
  font-size: 2rem;
  font-weight: 300;
  padding: .5em 0;
}

.team-member-name span {
  font-weight: 400;
}
/* END TEAM STYLING */

/* START CONTACT STYLING */
#contact {
  /* background-color: #E05E36; */
  background: linear-gradient(141deg, #761CEC 0%, #9423BE 25%, #BD3E7F 50%, #E05E36 75%, #FD8503 100%);
}

#contact .h-divider {
  background-color: #fff;
}

#contact .section-header {
  color: #fff;
}

.contact-wrapper {
  width: 100%;
  margin: 0 auto;
}

.contact-subheader {
  text-align: center;
  font-size: 2rem;
  font-weight: 300;
  color: #fff;
  padding: 1em 0;
  width: 90%;
  margin: 0 auto;
}

.contact-callouts-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}

.contact-callout-wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  padding: 1em 2em;
  width: 20%;
}

.contact-callout-icon:hover {
  cursor: pointer;
  transform: scale(1.1);
}

.contact-callout-icon {
  border: 1px solid #fff;  
  border-radius: 100%;
  /* width: 3em; */
  /* height: 3em; */
  margin: 0 auto 1.5em auto;
  text-align: center;
  transition: all .2s ease-in-out;
}

.contact-callout-icon img {
  width: 3em;
  height: 3em;
  padding: 2em;
  color: #fff;
}

.contact-callout-content {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  text-align: center;
  width: 100%;
}

.contact-callout-content span:nth-child(1) {
  color: #fff;
  font-size: 1.5rem;
  text-transform: uppercase;
}

.contact-callout-content span:nth-child(2) {
  color: #fafafa;
  font-size: 1rem;
  padding: .5em 0;
}

.contact-callout-content span:nth-child(2) a {
  text-decoration: none;
  color: #fafafa;
}

.contact-callout-content span:nth-child(2) a:hover {
  text-decoration: underline;
  color: #4A4A4A;
}

/* EMD CONTACT STYLING */

footer {
  width: 100%;
  padding: .5em 0;
  text-align: center;
  background-color: #fafafa;
  font-weight: 300;
}

.copyright {
  font-size: .7em;
}