.hero {
    min-height: 334px;
    background-image: url(/images/homepage-2.jpg);
    background-size: cover;
}

.hero h2 {
  color: #fff;
  background-image: url(/images/background-tile-green.jpg);
  background-repeat: repeat;
  background-position: center;
  text-shadow: 5px 5px 0px rgba(73,110,33,0.4), 4px 5px 0px rgba(73,110,33,0.4), 3px 5px 0px rgba(73,110,33,0.4), 5px 4px 0px rgba(73,110,33,0.4), 4px 4px 0px rgba(73,110,33,0.4), 3px 4px 0px rgba(73,110,33,0.4);
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif;
  font-weight: 100;
}

.home header p {
  font-family: 'Noto Sans', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 1.5rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1px;
  width: 250px;
}

.home header h2 {
  line-height: 3.5rem;
  font-size: 3rem;
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif;
  font-weight: 100;
  max-width: 750px;
}

.home .summary {
  font-family: 'Noto Sans', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  line-height: 1.5rem;
  color: #2e2e2e;
  font-weight: 300;
  width: 80%;
  max-width: 500px;
}

.home footer {
  font-size: 2.6rem;
}

.home footer a:after {
  position: relative;
  top: 1px;
  left: 5px;
  content: url(/images/arrow-right.png);
  color: #97ca44;
}

.home footer a,
.home footer a:hover {
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif;
  font-size: 1.5rem;
  line-height: 2.6rem;
  font-weight: 100;
  line-height: 4.6rem !important;
  border-radius: 10px;
  border: 5px solid #000;
  border-radius: 10px;
  background-repeat: repeat;
  background-position: center;
}

.home .services {
  background-image: url(/images/background-tile-white-grit.jpg);
  background-repeat: repeat;
}

.home .services header p {
  border-bottom: 1px solid rgba(0,0,0,0.15);
  border-top: 1px solid rgba(0,0,0,0.15);
  background: #fff;
  background-color: rgba(253,253,253,0.9);
  color: #000;
  background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, #fff 20%, #fff 80%, rgba(255,255,255,0) 100%);
  background: linear-gradient(to right, rgba(255,255,255,0) 0%,#ffffff 20%,#ffffff 80%,rgba(255,255,255,0) 100%);
}

.home .services header h2 {
  text-shadow: 5px 5px 0px rgba(192,192,192,0.4), 4px 5px 0px rgba(192,192,192,0.4), 3px 5px 0px rgba(192,192,192,0.4), 5px 4px 0px rgba(192,192,192,0.4), 4px 4px 0px rgba(192,192,192,0.4), 3px 4px 0px rgba(192,192,192,0.4);
  color: #2991cc;
}

.home .services .grow {
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
  background-color: #fff;
  font-size: 1.5rem;
}

.home .services .col {
  width: 150px;
  font-size: 1.25rem;
}

.home .services a:hover {
  color: #2991cc;
}

.home .technologies h3 {
  font-size: 2rem;
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif;
  font-weight: lighter;
  color: #333;
}

.home .technologies h3 span {
  color: #72a230;
}

.home .services footer {
  font-size: 2.6rem;
}

.home .services footer a,
.home .services footer a:hover {
  background-size: 87.5px 87.5px;
  background-image: url(/images/background-tile-black.jpg);
  color: #fff;
}

.home .methodology {
  background-image: url(/images/background-tile-green.jpg);
  background-repeat: repeat;
  background-position: center;
}

.home .methodology header p {
  background: #fff;
  background-color: rgba(253,253,253,0.9);
  width: 21.2rem;
  border-bottom: 1px solid rgba(0,0,0,0.15);
  border-top: 1px solid rgba(0,0,0,0.15);
  width: 250px;
  background-color: #6b9e37;
  color: #fff;
  background: -webkit-linear-gradient(left, rgba(107,158,55,0) 0%, #6b9e37 20%, #6b9e37 80%, rgba(107,158,55,0) 100%);
  background: linear-gradient(to right, rgba(107,158,55,0) 0%,#6b9e37 20%,#6b9e37 80%,rgba(107,158,55,0) 100%);
}

.home .methodology header h2 {
  text-shadow: 5px 5px 0px rgba(73,110,33,0.4), 4px 5px 0px rgba(73,110,33,0.4), 3px 5px 0px rgba(73,110,33,0.4), 5px 4px 0px rgba(73,110,33,0.4), 4px 4px 0px rgba(73,110,33,0.4), 3px 4px 0px rgba(73,110,33,0.4);
  color: #000;
}

.home .methodology .methods {
  position: relative;
  background-image: url(/images/greane-tree-methodology.jpg);
  background-repeat: no-repeat;
  width: 374px;
  height: 348px;
}

.home .methodology .methods li {
  position: absolute;
  width: 75px;
  display: inline-block;
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif;
  font-size: 1.5rem;
  line-height: 1.5rem;
  text-transform: lowercase;
  text-shadow: 3px 3px 1px rgba(0,0,0,0.2);
}

.home .methodology .methods a {
  color: #fff;
}

.home .methodology .methods .methods-agile {
  top: 80px;
  left: 157px;
}

.home .methodology .methods .methods-build {
  top: 215px;
  left: 34px;
}

.home .methodology .methods .methods-code {
  top: 229px;
  left: 250px;
}

.home .methodology footer a,
.home .methodology footer a:hover {
  background-size: 87.5px 87.5px;
  background-image: url(/images/background-tile-black.jpg);
  color: #fff;
}

.home .company {
  background-image: url(/images/background-tile-black.jpg);
  border-bottom: 15px solid black;
}

.home .company header p {
  border-bottom: 1px solid rgba(0,0,0,0.15);
  border-top: 1px solid rgba(0,0,0,0.15);
  background: #fff;
  width: 200px;
  background-color: #000;
  color: #a4a4a4;
  background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, #202020 20%, #202020 80%, rgba(0,0,0,0) 100%);
  background: linear-gradient(to right, rgba(0,0,0,0) 0%,#202020 20%,#202020 80%,rgba(0,0,0,0) 100%);
}

.home .company header h2 {
  color: #fff;
  text-shadow: 5px 5px 0px rgba(0,0,0,0.4), 4px 5px 0px rgba(0,0,0,0.4), 3px 5px 0px rgba(0,0,0,0.4), 5px 4px 0px rgba(0,0,0,0.4), 4px 4px 0px rgba(0,0,0,0.4), 3px 4px 0px rgba(0,0,0,0.4);
}

.home .company .summary {
  color: #bebebe;
}

.home .company footer a,
.home .company footer a:hover {
  border: 5px solid #bebebe;
  background-image: url(/images/background-tile-white.jpg);
  color: #000;
}

.home .clients {
  background-image: url(/images/background-tile-white-grit.jpg);
}

.home .clients header h2 {
  font-size: 2rem;
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif;
  font-weight: lighter;
  color: #333;
}

.home .clients header span {
  color: #d24698;
}

.home .clients header h3 {
  font-family: 'Noto Sans', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: grey;
  width: 332px;
}

.home .clients blockquote {
  position: relative;
  font-size: 1.1rem;
  line-height: 1.5;
  font-family: 'Noto Sans', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.home .clients blockquote:before {
  position: absolute;
  top: -5px;
  left: -70px;
  content: url(/images/left-quote.png);
}

.home .clients blockquote:after {
  position: absolute;
  top: -5px;
  right: -70px;
  content: url(/images/right-quote.png);
}

.home .clients .testimonial {
  color: #d14196;
  font-weight: 600;
}

.home .clients .attribution {
  font-family: 'Crete Round', Constantia, "Times New Roman", Times, serif
}

.home .clients .attribution .testimonial {
  font-weight: 700;
  font-size: 1.3rem;
}

.home .clients .attribution .position {
  font-size: 1.1rem;
  font-weight: 400;
}

.home .clients .client {
  font-size: .9rem;
  font-weight: 600;
}

.home .relationships {
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
  background-color: #fff;
}

@media (max-width: 639px) {
    h1, h2, h3, h4, h5, h6 {
        font-size: 2rem !important;
        line-height: 2rem !important;
        text-shadow: none !important;
        width: 100% !important;
    }
    .home header p {
        font-size: 1.2rem !important;
        line-height: 2rem !important;
    }
    .home header h2 {
        font-size: 1.5rem !important;
        line-height: 1.7rem !important;
    }
    .home header h3 {
        font-size: 1rem !important;
        line-height: 1.2rem !important;
        text-align: center !important;
        padding-bottom: .25rem !important;
    }
    .home .summary {
        width: 100% !important;
    }
    .home .methods {
        background-image: none !important;
        padding-inline-start: 0 !important;
        text-align: center;
        height: initial !important;
    }
    .home .methods li {
        position: initial !important;
        top: 0 !important;
        left: 0 !important;
        margin: 15px auto !important;
        list-style: none !important;
        display: block !important;
        width: 100% !important;
    }
    .home footer {
        margin-top: 0 !important;
    }
    .bottom h4 {
        font-size: 1.25rem !important;
        line-height: 1.25rem !important;
    }
    .bottom ul {
        text-align: left !important;
        width: 200px !important;
        padding-top: 20px !important;
    }
    .bottom li {
        display: block !important;
        width: 300px !important;
        padding-bottom: 5px !important;
    }
    .bottom li img {
        width: 38px !important;
    }
    .bottom .contact ul {
        margin: 0 auto;
    }
 }