*{
  margin:0px;
  padding:0px;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Roboto', sans-serif;
/*  dark green*/
  color:#132B13; 
  font-size: 16px;
  line-height: 1.4em;
  margin: 0;
}

h1, h2, h3, h4{
  font-family: 'Aleo', serif;
  font-weight: 800;
  line-height: 1.4em;
}

h1{
  margin-top: 0px;
  margin-bottom: 40px;
  font-size: 3em;
}

p, h2, h3 {
  margin-bottom: 20px;
  margin-top: 0px;
}

h3{
  font-size: 1.5em;
  text-transform: uppercase;
}

a{
  text-decoration: none;
  transition: .2s;
  color: inherit;
}

a.normal-link{
  font-weight: 500 !important;
  font-size: 1em !important;
}

ul, ol{
  padding-left:40px;
}

ol li{
  padding-bottom: 5px;
}

.subpage-hero h2{
  margin:10px 0 0;
  text-align: center;
  font-weight: 400;
  text-transform: uppercase;
}

.subpage-content p a{
  border-bottom: 1px solid #e0c764;
  font-weight: 500;
}

.subpage-content p a:hover{
  color: #e0c764;
}

.thank-you-content {
  text-align: center;
}

.thank-you-content p{
  margin-bottom: 40px;
}

.thank-you-content img{
  width: 300px;
  height: auto;
}


/*** DESKTOP STYLES ***/
@media (min-width: 1100px) {

  .container {
    width: 1100px;
    margin:0 auto;
  }

  .content{
    padding: 80px 0;
  }

  /*** HEADER DESKTOP STYLES ***/

  p#mobile-text{
    display: none;
  }

  #mobile-section{
    display: none;
  }

  a#mobile-logo{
    display: none;
  }

  #navContainer{
    width: 100%;
    transition: .4s;
    position: fixed;
    top: 0;
    min-height: fit-content;
    background-color: transparent;
    z-index: 10;
    border-bottom: 2px solid lightgray;
  }

  a.icon{
    display: none;
  }

  a#headerLogo{
    position: absolute;
    top: 0;
    left:50px;
  }

  #myTopnav img{
    height: 75px;
    width: auto;
    margin-top:6px;
  }

  #myTopnav {
    transition: .4s;
  }

  #myTopnav .container{
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .topnav{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 500px;
  }

  .topnav a,
  .d-btn{
    display: inline-block;
    color: #fff;
    border-bottom: 1px solid transparent;
    font-weight: 500;
    font-size: 1.2em;
    outline: none;
    background-color: inherit;
  }

  .topnav a:hover,
  .d-btn:hover{
    color: #e0c764;
  }

  .d-btn-large, .d-btn{
    padding:30px 0;
    letter-spacing: 2px;
    font-family: 'Aleo', serif;
    font-weight: bold !important;
    border-top:4px solid transparent;
  }

  .d-btn:focus{
    color: #132B13;
  }

  .d-btn:hover{
    cursor: default;
    border-bottom: 1px solid transparent !important;
  }

   .topnav a.current{
    color:#e0c764;
    border-top:4px solid #e0c764;
    padding: 30px 0;
    letter-spacing: 2px;
    font-family: 'Aleo', serif;
    font-weight: bold !important;
  }

  .normal-btn:hover{
    cursor: pointer;
  }

  .closebtn{
    display: none;
  }

  /*.dropdown {
    float: left;
    overflow: hidden;
  }*/

  .hidden a{
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
  }

  .d-content {
    display: none;
    position: absolute;
    background: rgb(19, 43, 19, 1);
    background-color: #fff;
    width: 100%;
    left: 0;
    z-index: 12;
    padding: 30px 0 10px;
    flex-flow: row wrap;
    justify-content: space-around;
    align-items: flex-start;
    border-bottom: 1px solid #adadad;
    border-top:8px solid #e0c764;
    box-shadow: 0px 8px 16px 1px rgba(0,0,0,0.3);
  }

  .dropdown:hover .d-content, .dropdown:hover .hidden-row {
    display: flex;
  }

  .d-content, .hidden-row {
    animation: fadeIn .5s;
    -webkit-animation: fadeIn .5s;
    -moz-animation: fadeIn .5s;
    -o-animation: fadeIn .5s;
    -ms-animation: fadeIn .5s;
  }
  @keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
  }

  @-moz-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
  }

  .hidden-row {
    display: none;
    position: absolute !important;
    z-index: 1;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 15px;
    background: white;
    width: 200px;
    margin: 0px 0 0 -15px;
    border-top:8px solid #e0c764;
    box-shadow: 0px 8px 16px 1px rgba(0,0,0,0.3);
  }

  .hidden-row a {
    color: #132B13;
    padding: 8px;
    text-decoration: none;
    display: block;
    background: #fff;
    font-size: .9em;
    border-bottom: none;
    width: calc(100% - 16px);
    transition: .4s;
    border-bottom: 1px solid lightgray;
  }

  .hidden-row a:hover{
    background-color: #327132;
    color: #fff;
    border-bottom: 1px solid #327132;
    display: block;
    opacity: 1;
  }

 /* .dropdown:hover .hidden-row {
    display: block;
  }
*/
  .column {
    margin-bottom: 30px;
    width: 23%;
    margin:0 10px 20px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
  }

  .column a {
      display: block;
      width: 100%;
      color: #132B13;
      font-weight: 500;
      padding:5px 8px;
      font-size: .9em;
      border-bottom: 1px solid lightgray;
    }

    .column a:hover {
      color: #fff;
      background-color: #327132;
    }  

    .column h3 {
      color: #132B13;
      background-color: #E0E0E0;
      width: 100%;
      text-transform: uppercase;
      padding: 8px 5px 5px 15px;
      margin-bottom: 10px;
      font-size: 1.1em;
      line-height: 1em;
    } 

    a#overlayLogo{
      display: none;
    }

    a.full-width{
      width: 100%;
    }

    #myDropdown3 .full-width{
      width: 336px;
/*      text-align: center;*/
    }

    #headerEmail{
      padding-left:60px;
      margin-left:60px;
      height: 85px;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      color: white;
      border-left:2px solid lightgray;
      transition: .4s;
      z-index: 11;
    }

    #headerEmail a{
      padding:10px 20px;
      border:2px solid lightgray;
      position: relative;
      overflow: hidden;
    }

    #headerEmail a:before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      background-color: #327132;
      height: 100%;
      width: 120%;
      z-index: -1;
      transform-origin: 100% 100%; 
      transform: translateX(-100%);
      transition: transform .6s;
    }

    #headerEmail a:hover:before {
      transform: translateX(0);
    }

    /*HOMEPAGE HERO DESKTOP STYLES*/

    #homepage-hero{
      width:100%;
      background:url(images/homepage-hero.jpg) no-repeat center;
      background-size: cover;
      height: 900px;
      position: relative;
      padding:0;
    }

    #myVideo {
      position: absolute;
      right: 0;
      bottom: 0;
      min-width: 100%; 
      min-height: 400px;
      margin-top:93px;
      z-index: 1;
    }

    #homepage-hero:before {
      content:"";
      position: absolute;
      top:0;
      right:0;
      left:0;
      bottom:0;
      z-index:2;
      background:linear-gradient(to right,rgba(19, 43, 19, 0.6),rgba(19, 43, 19, 0.6));
    }

    #homepage-hero .container{
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      padding-top:40px;
    }

    #homepage-hero h1{
      font-size: 5em;
      width: 700px;
/*      line-height: 1em;*/
      font-weight: 900;
      color: white;
      margin-bottom: 60px;
      position: relative;
      z-index: 3;
    }

    .green-bar{
      width: 155px;
      position: absolute;
      left:0;
      height: 100%;
      background: #132B13;
      z-index: 3;
    }   

    /***MAIN BODY DESKTOP STYLES***/

    .content{
      position: relative;
    }

    .arrow-left{
      position: absolute;
      left: 0;
      top:135px;
      display: flex;
      align-items: center;
    }

    .title-container{
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 130px;
    }

    .title-container h1{
      margin-bottom: 0px;
      text-transform: uppercase;
    }

    .title-container h1 span{
      color: #327132;
    }

    .title-container p{
      color: #b3b3b3;
      font-weight: 500;
      width: 650px;
      margin-bottom: 0px;
    }

    .service-container{
      display: flex;
      flex-flow: row wrap;
      justify-content: space-between;
      align-items: flex-start;
      margin-top: 60px;
    }

    .service{
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      width: 520px;
      height: 340px;
      margin-bottom: 40px;
      transition: .3s transform .1s ease;
    }

    .service:hover{
      transform: scale(1.02);
    }

    .service:hover h3{
      color: #e0c764;
    }

    .service-line{
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      font-weight: bold;
      font-size: 2em;
      height: 100%;
    }

    .green-vertical{
      width: 2px;
      background: #132B13;
      height: 300px;
    }

    .service-background{
      height: 100%;
      width: 460px;
      position: relative;
    }

    .service-background img{
      position: absolute;
      z-index: 1;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
    }

    .service-background::after{
      content:'';
      width: 100%;
      height: 100%;
      position: absolute;
      z-index: 2;
      background-image: linear-gradient(to bottom, rgb(19, 43, 19, 1), rgb(19, 43, 19, 0));
    }

    .service-background h3{
      position: absolute;
      top:15px;
      left:15px;
      z-index: 3;
      color: white;
      transition: .3s;
    }

    .neg-margin-top{
      margin-top:-80px;
    }

    .no-padding-bottom{
      padding-bottom: 0px;
    }

    #about-us-container{
      width: 100%;
      position: relative;
    }

    #about-us-img-container{
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      height: 500px;
      margin-bottom: 20px;
    }

    .about-us-img-background{
      background: url(images/team1.jpg) no-repeat center;
      background-size: cover;
      width: calc(50% - 10px);
      height: 100%;
    }

    .about-us-img-background img{
      display: none;
    }

    .experience-text{
      width: calc(50% - 50px);
      height: calc(100% - 80px);
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding:40px 0 40px 40px;
      background: #327132;
      color: #cccccc;
    }

    .experience-text h1{
      color: white;
      width: 300px;
      margin-bottom: 40px;
      line-height: 1em;
    }

    .experience-text p{
      padding-right:20px;
      margin-bottom: 0px;
    }

    .arrow-right{
      position: absolute;
      right: 0;
      top: 135px;
      display: flex;
      align-items: center;
    }

    #about-us-container .arrow-right{
      top:105px;
    }

    /*SUBPAGE DESKTOP STYLES*/
    
    .subpage-hero{
      background: url(images/homepage-hero.jpg) no-repeat center;
      background-size: cover;
      height: 600px;
      position: relative;
      padding:0px;
      color: white;
    }

    .subpage-hero .container{
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
    }

    /*ABOUT US DESKTOP STYLES*/

    .team-member{
      padding-top: 40px;
      margin-top: 40px;
      border-top: 1px solid lightgray;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
    }

    .team-member img{
      width: 300px;
      height: auto;
      margin-right:100px;
    }

    .team-text{
/*      width: 700px;*/
    }

    /*SERVICES PAGE ACCORDION DESKTOP*/

    .accordion {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      width: 100%;
    }

    .accordion .acc-container {
      position: relative;
      width: 23%;
    }

    .accordion .label {
      position: relative;
      padding: 10px 20px;
      font-size: 1.15em;
      font-weight: bold;
      color: white;
      cursor: pointer;
      background: #132B13;
      margin:10px 0;
    }

    .accordion .label::before {
      content: '+';
      color: white;
      position: absolute;
      top: 50%;
      right: 20px;
      font-size: 30px;
      transform: translateY(-50%);
    }

    .accordion .acc-content {
      position: relative;
    /*  background: transparent;*/
      height: 0;
      font-size: 16px;
      text-align: justify;
    /*  width: 780px;*/
      overflow: hidden;
      transition: 0.5s;
    }

    .accordion p a{
      text-align: left;
      display: inline-block;
    }

    .accordion hr {
      width: 100%;
      margin-left: 0;
      border: 1px solid grey;
      display: none;
    }

    .accordion .acc-container.active .acc-content {
      height: 270px;
      background:#f5f5f5;
      padding:20px 0 0 20px;
      margin-bottom: 15px;
    }

    .accordion .acc-container.active .label::before {
      content: '-';
      font-size: 30px;
    }

    .accordion .acc-container.active .label{
      background: #e0c764;
    }

    .center-text{
      text-align: center;
    }

    /*CONTACT DESKTOP STYLES*/

    #contact-content .container{
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
    }

    .green-vertical-border{
      height: 360px;
      width: 2px;
      background: #132B13;
    }

    .contact-form{
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      width: 500px;
    }

  .contact-form input, .contact-form textarea{
    font-family: 'Roboto', sans-serif;
    padding:10px;
    border:1px solid #A3A3A3;
    color: #838383;
    border:none;
    background: #F5F5F5;
    width: calc(100% - 20px);
    margin-bottom: 20px;
  }

  .contact-form textarea {
    height: 100px;
  }

  input#submit{
    width: 30%;
    padding:10px 20px;
    color: white;
    background: #132B13;
/*    border:2px solid #132B13;*/
    transition: .4s;
    font-weight: bold;
  }

  input#submit:hover{
    cursor: pointer;
    background: #e0c764;
  }

    /*FOOTER DESKTOP STYLES*/

    #footer-side-bar{
      position: absolute;
      left:0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding:0px 40px;
      height: 340px;
      background: #132B13;
      color: white;
      width: 7%;
    }

    #footer-side-bar i{
      margin:10px 0 !important;
      font-size: 1.5em;
    }

    #footer-side-bar a{
      border:none !important;
    }

    #footer-contact a:hover{
      color: #e0c764;
    }

    #footer-contact {
      position: relative;
      background:#327132;
      height: 340px;
      color: white;
      border-bottom: 20px solid white;
    }

    #footer-contact .container{
      display: flex;
      align-items: center;
      justify-content: space-around;
      height: 100%;
    }

    #footer-contact h1,
    #footer-contact p{
      margin-bottom: 0px;
    }

    #footer-contact p{
      color: #cccccc;
      width: 500px;
    }

    #footer-contact a{
      padding:10px 20px;
      border:2px solid #132B13;
      font-weight: bold;
      margin-top:20px;
      display: inline-block;
      display: none;
    }

    #footer-contact a i{
      margin-left:10px;
      transition: .2s margin-left .2s;
    }

    #footer-contact a:hover{
      border:2px solid white;
    }

    #footer-contact a:hover i{
      margin-left:40px;
    }

    footer{
      background: url(images/footer-bg.jpg) no-repeat center;
      background-size: cover;
      padding:60px 0 40px;

    }

    footer .container:nth-of-type(2){
      border-bottom: 1px solid #327132;
      padding-bottom: 40px;
      margin-top:60px;
    }

    #footer-logo{
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      color: white;
    }

    #footer-logo img{
      width: 70px;
      height: auto;
    }

    #footer-logo p{
      line-height: 2em;
      font-size: 1.15em;
      font-weight: 500;
    }

    #footer-logo p a{
      border-bottom: 1px solid lightgray;
    }

    #footer-logo p a:hover{
      color: #e0c764;
      border-bottom: 1px solid #e0c764;
    }

    footer .row{
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
    }

    #footer-links{
      display: flex;
      flex-flow: row wrap;
      justify-content: space-between;
      color: white;
      width: 620px;
    }

    #footer-links h3{
      width: 100%;
    }

    .footer-col p a:hover{
      color: #e0c764;
    } 

    #footer-partners{
      color: white;
    }

    .partner-container{
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    padding:30px;
    width: 280px;
/*    border-radius: 10px;*/
    position: relative;
    color: white;
   }

   .partner-container:before, .partner-container:after{
    content: '';
    display: block;
    position: absolute;
    background-color: transparent;
    pointer-events: none;
   }

   .partner-container:before{
    top: 0;
    left: 0;
    right: 70%;
    bottom: 0;
    border-top: 1px solid #327132;
    border-left: 1px solid #327132;
   }

   .partner-container:after{
    top: 0;
    right: 0;
    left: 70%;
    bottom: 0;
    border-bottom: 1px solid #327132;
    border-right: 1px solid #327132;
   }

   .partner-container img{
    width: 100px;
    height: auto;
    transition: .3s transform .1s;
   }

   .partner-container img:hover{
    transform: scale(1.03);
   }

    #sub-footer{
      margin-top:40px;
      font-size: .9em;
      color: white;
      text-align: center;
      padding: 0 20px;
    }

    #sub-footer a{
      border-bottom:1px solid #e0c764;
      font-weight:500; 
    }

    #sub-footer a:hover{
      color: #e0c764;
    }


}


/*** MOBILE STYLES ***/
@media (max-width: 1099px) {

  .container {
    width:100%;
    margin: 0 auto;
  }

  .content{
    padding: 60px 20px;
  }

  h1{
    font-size: 2em;
  }

  /*** HEADER MOBILE STYLES ***/

  p#mobile-text{
    color: #e0c764;
    position: absolute;
    top:50%;
    left:50%;
    transform: translateX(-50%) translateY(-50%);
    margin-bottom: 0px;
    font-family: 'Aleo', serif;
    font-weight: bold;
    font-size: .9em;
  }

  a#headerLogo{
    display: none;
  }

  #navContainer{
    border-bottom: 1px solid #2e406c;
    position: fixed;
    width: 100%;
    background: #132B13;
    top:0;
    z-index: 200;
  }

  #topHeader{
    margin:0px !important;
  }

  #topHeader{
    padding:0 !important;
  }

  #topHeader img {
    float: left;
    width:50px;
    height:auto;
    margin-left: 20px;
    padding: 5px 0;
    position: relative;
    z-index: 10;
  }

  /* NAV */

  #myTopnav{
    background-color: #fff !important;
  }

  /* Hamburger bars styles*/
     a.icon {
      position: absolute;
      display: block;
      font-size:32px;
      right:20px;
      top:26px;
      color: #fff;
    }

     a.icon:hover{
      background: none !important;
    }

    a#overlayLogo{
      position: absolute;
      left:0;
      top:0;
      width: 50px;
      height: auto;
      border-bottom:none;
/*      z-index: 11;*/
    }

    #overlayLogo img{
      width: 100%;
      height: auto;
    }

    #overlayLogo:hover{
      background: transparent !important;
    }

    #headerEmail {
      height: fit-content !important;
      display: none;
    }

    /* The Overlay (background) */
   .overlay{
     height: 0;
     width: 100%;
     position: fixed; /* Stay in place */
     z-index: 10; /* Sit on top */
     right: 0;
     top: 0;
     background-color: white;
     overflow-x: hidden; /* Disable horizontal scroll */
     transition: height 0.6s ease; 
     box-shadow: -5px 0px 10px 2px rgba(0,0,0,0.3);
   }

   /* Position the content inside the overlay */
  .overlay-content {
    position: relative;
    top: 8%; /* 10% from the top */
    text-align: left;
    margin-top: 40px; 
    padding:0 5px;
  }

  /* The navigation links inside the overlay */
  .overlay a {
    padding: 16px 8px;
    text-decoration: none;
    font-size: 18px;
/*    font-weight: 500;*/
    text-transform: uppercase;
    color: inherit;
    border-bottom: 1px solid lightgray;
    display: flex;
    justify-content: space-between;
    transition: 0.3s; /* Transition effects on hover (color) */
    padding-left:20px;
  }

  /* Position the close button (top right corner) */
  .overlay .closebtn {
    position: absolute;
    top: 18px;
    right: 10px;
    padding:10px !important;
    font-size: 50px;
    color: #132B13 !important;
    border-bottom: none !important;
  }

  .overlay .closebtn:hover{
    background: none !important;
    color: #132B13 !important
  }

  .overlay a:hover, .dropdown:hover .d-btn {
    color: #fff;
    background: #132B13;
    transition: background-color .4s;
  }

  .topnav {
    margin-top:30px;
  }

  .d-btn{
    font-weight: 500;
    font-size: 1.15em !important;
  }

  .topnav a.current{
    color: #e0c764;
  }

  .d-content {
    display: none;
    z-index: 10;
    margin: 10px 0;
  }

  .hidden-row{
    display: none;
    margin:10px 0;
    flex-flow: row wrap;
    justify-content: flex-start;
    padding-left:10px;
  }

  .hidden-row a{
/*    padding-left:30px;*/
    border-bottom: none;
    font-size: .95em;
    padding:10px;
  }

  .d-content, .hidden-row {
      animation: fadeIn .5s;
      -webkit-animation: fadeIn .5s;
      -moz-animation: fadeIn .5s;
      -o-animation: fadeIn .5s;
      -ms-animation: fadeIn .5s;
    }
    @keyframes fadeIn {
      0% {opacity:0;}
      100% {opacity:1;}
    }

    @-moz-keyframes fadeIn {
      0% {opacity:0;}
      100% {opacity:1;}
    }

  .column {
    padding: 10px;
    display: flex; 
    flex-flow: row wrap;
    justify-content: space-between;
  }

  .column a {
    display: flex;
    align-items: center;
    width: 100%;
    text-align: left;
    padding:10px;
    font-size: .95em;
    font-weight: 400;
    border-bottom: none;
  }

  .column a:last {
    margin-bottom: 20px;
  }

   a.full-width{
      width: 100%;
    }

  .column h3 {
    color: inherit;
    background-color: #E0E0E0;
    width: 100%;
    margin-bottom: 10px;
    text-transform: uppercase;
    padding: 10px;
    padding-left:10px;
    font-size: .9em;
  }

  .column a:hover, .hidden-row a:hover {
    color: #fff;
    background: #327132;
    transition: background .2s, color .2s;
  }

  /* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
    .show {display:block;}

    .show-flex {display: flex;} 

  #mobile-section{
    padding:0 0 20px 15px;
    margin-top:60px;
  }

  .mobile-social{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    border-bottom: 1px solid lightgray;
    padding-bottom: 20px;
    margin-bottom: 30px;
  }

  .mobile-social a{
    border-bottom: none;
    padding: 10px 8px;
  }

  #header-mobile-text i{
    margin-right:10px;
  }

  #header-mobile-text a{
    justify-content: flex-start;
    align-items: center;
    font-size: 16px;
    padding:0 0 2px 0;
    margin-bottom: 10px;
    border-bottom: none;
    width: fit-content;
  }

  #header-mobile-text a:hover{
    background: transparent;
    color: #e0c764;
  }
    
  /*HERO MOBILE STYLES*/

  #homepage-hero{
    background:url(images/homepage-hero.jpg) no-repeat center;
    background-size: cover;
/*    height: 600px;*/
    position: relative;
    margin-top: 69px;
    min-height: 480px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  #myVideo {
    position: absolute;
    right: 0;
    top: 0;
    min-width: 100%;
    height: 600px;
    z-index: 1;
  }

  #homepage-hero:before {
    content:"";
    position: absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    z-index:2;
    background:linear-gradient(to right,rgba(19, 43, 19, 0.6),rgba(19, 43, 19, 0.6));
  }

  #homepage-hero h1{
    text-transform: uppercase;
    font-size: 3em;
/*    line-height: 1em;*/
    font-weight: bolder;
    color: white;
    padding:0 20px;
    position: relative;
    z-index: 3;
    text-align: center;
  }

 
  /***MAIN BODY MOBILE STYLES***/

  .arrow-left{
    display: none;
  }

  .title-container{
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .title-container h1{
    text-align: center;
    width: 100%;
    padding-bottom: 40px;
    border-bottom: 1px solid lightgray;
    text-transform: uppercase;
  }

  .title-container span{
    color: #327132;
  }

  .title-container p{
    max-width: 600px;
  }

  .service-container{
      display: flex;
      flex-flow: row wrap;
      justify-content: center;
      align-items: flex-start;
      margin-top: 60px;
    }

    .service{
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      width: 320px;
      height: 216px;
      margin: 0 10px 40px;
    }

    .service-line{
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      font-weight: bold;
      font-size: 2em;
      height: 100%;
    }

    .green-vertical{
      width: 2px;
      background: #132B13;
      height: 80%;
    }

    .service-background{
      height: 100%;
      width: 260px;
      position: relative;
    }

    .service-background img{
      position: absolute;
      z-index: 1;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
    }

    .service-background::after{
      content:'';
      width: 100%;
      height: 100%;
      position: absolute;
      z-index: 2;
      background-image: linear-gradient(to bottom, rgb(19, 43, 19, 1), rgb(19, 43, 19, 0));
    }

    .service-background h3{
      position: absolute;
      top:15px;
      left:15px;
      z-index: 3;
      color: white;
    }

    .no-padding-bottom{
      padding:60px 0 0px;
    }

    #about-us-container{
      width: 100%;
      position: relative;
    }

    #about-us-img-container{
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-bottom: 20px;
    }

    .about-us-img-background img{
      width: 100%;
      height: auto;
      margin-bottom: 15px;
    }

    .experience-text{
      width: calc(100% - 40px);
      height: auto;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding:40px 20px;
      background: #327132;
      color: #cccccc;
    }

    .experience-text h1{
      color: white;
      width: 300px;
      margin-bottom: 40px;
      line-height: 1em;
    }

    .experience-text p{
      padding-right:20px;
      margin-bottom: 0px;
    }

    .arrow-right{
      position: absolute;
      right: 0;
      top: 135px;
      display: flex;
      align-items: center;
      display: none;
    }

    #about-us-container .arrow-right{
      top:105px;
    }

    /*SUBPAGE MOBILE STYLES*/
    
    .subpage-hero{
      background: url(images/homepage-hero.jpg) no-repeat center;
      background-size: cover;
      height: 400px;
      position: relative;
      padding:0px;
      color: white;
      margin-top:69px;
    }

    .subpage-hero .container{
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
    }

    /*ABOUT US MOBILE STYLES*/

    .team-member{
      padding-top: 40px;
      margin-top: 40px;
      border-top: 1px solid lightgray;
    }

     .team-member img{
      width: 300px;
      height: auto;
      margin:0 auto 20px;
      display: block;
    }

    .team-member h3{
      text-align: center;
    }

    /*SERVICES ACCORDION STYLES*/

    .accordion {
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 100%;
    }

    .accordion .acc-container {
      position: relative;
      width: 100%;
      max-width: 450px;
    }

    .accordion .label {
      position: relative;
      padding: 10px 20px;
      font-size: 1.15em;
      font-weight: bold;
      color: white;
      cursor: pointer;
      background: #132B13;
      margin:10px 0;
    }

    .accordion .label::before {
      content: '+';
      color: white;
      position: absolute;
      top: 50%;
      right: 20px;
      font-size: 30px;
      transform: translateY(-50%);
    }

    .accordion .acc-content {
      position: relative;
    /*  background: transparent;*/
      height: 0;
      font-size: 18px;
      text-align: justify;
    /*  width: 780px;*/
      overflow: hidden;
      transition: 0.5s;
    }

    .accordion p a{
      text-align: left;
      display: inline-block;
    }

    .accordion hr {
      width: 100%;
      margin-left: 0;
      border: 1px solid grey;
      display: none;
    }

    .accordion .acc-container.active .acc-content {
      height: 270px;
      background:#f5f5f5;
      padding:20px 0 0 20px;
      margin-bottom: 15px;
    }

    .accordion .acc-container.active .label::before {
      content: '-';
      font-size: 30px;
    }

    .accordion .acc-container.active .label{
      background: #e0c764;
    }

    /*CONTACT DESKTOP STYLES*/

    #contact-content .container{
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    .contact-text{
      text-align: center;
    }

    .green-vertical-border{
      height: 1px;
      width: 100%;
      background: #132B13;
      margin:40px 0 60px;
    }

    .contact-form{
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      max-width: 500px;
      width: 100%;
    }

    .contact-form input, .contact-form textarea{
    font-family: 'Roboto', sans-serif;
    padding:10px;
    border:1px solid #A3A3A3;
    color: #838383;
    border:none;
    background: #F5F5F5;
    width: calc(100% - 20px);
    margin-bottom: 20px;
  }

  .contact-form textarea {
    height: 100px;
  }

  input#submit{
    width: 30%;
    padding:10px 20px;
    color: white;
    background: #132B13;
/*    border:2px solid #132B13;*/
    transition: .4s;
    font-weight: bold;
  }

  input#submit:hover{
    cursor: pointer;
    background: #e0c764;
  }

    /*FOOTER MOBILE STYLES*/

    #footer-side-bar{
      display: flex;
      align-items: center;
      justify-content: center;
      padding:20px;
      background: #132B13;
      color: white;
    }

    #footer-side-bar a{
      margin:10px !important;
      padding: 0 !important;
    }

    #footer-side-bar i{
      font-size: 1.5em;
      margin:0 !important;
    }

    #footer-side-bar a{
      border:none !important;
    }

    #footer-contact a:hover{
      color: #e0c764;
    }

    #footer-contact {
      position: relative;
      background:#327132;
      color: white;
      border-bottom: 20px solid white;
    }

    #footer-contact .container{
      display: flex;
      flex-direction: column;
      align-items: center;
      padding:40px 0px;
    }

    #footer-contact h1,
    #footer-contact p{
      margin-bottom: 0px;
      padding:0 20px;
    }

    #footer-contact p{
      color: #cccccc;
      max-width: 500px;
      margin-top:40px;
    }

    #footer-contact a{
      padding:10px 20px;
      border:2px solid #132B13;
      font-weight: bold;
      margin-top:20px;
      display: inline-block;
    }

    #footer-contact a i{
      margin-left:10px;
      transition: .2s margin-left .2s;
    }

    #footer-contact a:hover{
      border:2px solid white;
    }

    #footer-contact a:hover i{
      margin-left:40px;
    }

    footer{
      background: url(images/footer-bg.jpg) no-repeat center;
      background-size: cover;
      padding:60px 20px 40px;

    }

    footer .container:nth-of-type(2){
      border-bottom: 1px solid #327132;
      padding-bottom: 40px;
      margin-top:40px;
    }

    #footer-logo{
      display: flex;
      flex-direction: column;
      align-items: center;
      color: white;
      text-align: center;
    }

    #footer-logo img{
      width: 70px;
      height: auto;
      margin-bottom: 20px;
    }

    #footer-logo p{
      line-height: 2em;
      font-size: 1.15em;
      font-weight: 500;
    }

    #footer-logo p a{
      border-bottom: 1px solid lightgray;
    }

    #footer-logo p a:hover{
      color: #e0c764;
      border-bottom: 1px solid #e0c764;
    }

    #footer-links{
      display: flex;
      flex-flow: row wrap;
      justify-content: space-around;
      color: white;
    }

    .footer-col{
      display: flex;
      flex-flow: row wrap;
      justify-content: center;
      margin-bottom: 40px;
    }

    .footer-col h3{
      width: 100%;
      text-align: center;
      padding-bottom: 2px;
    }

    .footer-col p{
      margin:10px;
    }

    .footer-col p a:hover{
      color: #e0c764;
    } 

    #footer-partners{
      color: white;
      margin-top:60px;
    }

    #footer-partners h3{
      text-align: center;
    }

    .partner-container{
      display: flex;
      flex-flow: row wrap;
      justify-content: space-around;
      padding:30px;
      width: 280px;
  /*    border-radius: 10px;*/
      position: relative;
      color: white;
      margin:0 auto;
     }

   .partner-container:before, .partner-container:after{
    content: '';
    display: block;
    position: absolute;
    background-color: transparent;
    pointer-events: none;
   }

   .partner-container:before{
    top: 0;
    left: 0;
    right: 70%;
    bottom: 0;
    border-top: 1px solid #327132;
    border-left: 1px solid #327132;
   }

   .partner-container:after{
    top: 0;
    right: 0;
    left: 70%;
    bottom: 0;
    border-bottom: 1px solid #327132;
    border-right: 1px solid #327132;
   }

   .partner-container img{
    width: 100px;
    height: auto;
    transition: .3s transform .1s;
   }

   .partner-container img:hover{
    transform: scale(1.03);
   }

    #sub-footer{
      margin-top:40px;
      font-size: .9em;
      color: white;
      text-align: center;
      padding: 0 20px;
    }

    #sub-footer a{
      border-bottom:1px solid #e0c764;
      font-weight:500;
    }

    #sub-footer a:hover{
      color: #e0c764;
    }

}

/*SUBPAGE HERO STYLES*/

#about-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/about-hero.jpg);
  background-size: cover;
  background-position: 50% 30%;
}
#contact-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/contact-hero.jpg);
  background-size: cover;
  background-position: 50% 30%;
}
#active-shooter-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/active-shooter-training.jpg);
  background-size: cover;
  background-position: 50% 30%;
}
#range-sim-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/range-sim-hero.jpg);
  background-size: cover;
  background-position: 50% 30%;
}
#range-training-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/range-training-hero.jpg);
  background-size: cover;
  background-position: 50% 40%;
}
#risk-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/risk-hero.jpg);
  background-size: cover;
  background-position: 50% 40%;
}
#close-quarter-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/close-quarter-hero.jpg);
  background-size: cover;
  background-position: 50% 40%;
}
#security-contract-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/contract-hero.jpg);
  background-size: cover;
  background-position: 50% 10%;
}
#tactical-sim-hero {
  background-image: linear-gradient(to bottom, rgb(19, 43, 19, .6), rgb(19, 43, 19, .6)), 
  url(images/tac-sim-hero.jpg);
  background-size: cover;
  background-position: 50% 40%;
}




/*FOOTER ACCORDION UNIVERSAL STYLES*/

.footer-acc .accordion{
    flex-flow:row wrap;
    justify-content: space-between;
    align-items: flex-start;
  }

  .footer-acc .acc-container{
    width: 45%;
    font-size: .9em;
  }

  .footer-acc .accordion .label {
    background: transparent;
    color: white;
    border-bottom: 1px solid white;
    padding:5px 10px;
  }

  .footer-acc .acc-container.active .label,
  .footer-acc .acc-container.active .acc-content {
      background: transparent;
      color: white;
  }

  .footer-acc .acc-container.active .label{
    border-bottom: 1px solid #e0c764;
    color: #e0c764;
  }

  .footer-acc .acc-container.active .label::before{
    color: #e0c764;
  }

  .footer-acc .acc-container.active .acc-content{
    padding-top:10px;
  }

  .footer-acc .acc-container:nth-of-type(1).active .acc-content{
    height: 130px;
  }
  .footer-acc .acc-container:nth-of-type(2).active .acc-content{
    height: 190px;
  }
  .footer-acc .acc-container:nth-of-type(3).active .acc-content{
    height: 160px;
  }
  .footer-acc .acc-container:nth-of-type(4).active .acc-content{
    height: 120px;
  }

  .footer-acc .accordion p {
      margin-bottom: 10px;
  }

  .footer-acc .accordion p a:hover{
    color: #e0c764;
  }

  @media (max-width: 500px) {

      .footer-acc .acc-container {
        width: 100%;
        font-size: .9em;
    }

}