body {
  font-family: 'Karla', sans-serif;
  background: url(/assets/images/close-popup.jpg) no-repeat -9999px -9999px;
}

.margin-top {
    margin-top: 50px;
}

img {
	width: 100%;
}

div, h1, a {
  color: #414042;
}

h1 {
  margin-top: 0px;
  font-size: 65px;
  position: relative;
  left: -0.3%;
  letter-spacing: -2px;
}

p {
  color: #636466;
  font-size: 20px;
}

a {
  color: #17ab56;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: underline;

  -webkit-transition: color .3s;
  -khtml-transition: color .3s;
  -moz-transition: color .3s;
  -ms-transition: color .3s;
  -o-transition: color .3s;
  transition: color .3s;
}

a:hover {
  color: #17ab56;
  text-decoration: none;

  -webkit-transition: color .3s;
  -khtml-transition: color .3s;
  -moz-transition: color .3s;
  -ms-transition: color .3s;
  -o-transition: color .3s;
  transition: color .3s;
}

a:active, a:visited {
  text-decoration: none;
}

a.button {
  text-decoration: none;
  display: inline-block;
  width: 100%;
  text-align: center;
  border-color: #414042;
  border-width: 1px;
  border-style: solid;
  background-color: transparent;
  padding-top: 10px;
  padding-bottom: 10px;
  color: #414042;

  -webkit-transition: background-color .3s, border-color .3s;
  -khtml-transition: background-color .3s, border-color .3s;
  -moz-transition: background-color .3s, border-color .3s;
  -ms-transition: background-color .3s, border-color .3s;
  -o-transition: background-color .3s, border-color .3s;
  transition: background-color .3s, border-color .3s;
}

a.button:hover {
  text-decoration: none;
  border-color: #17ab56;
  color: white;
  background-color: #17ab56;

  -webkit-transition: background-color .3s, border-color .3s;
  -khtml-transition: background-color .3s, border-color .3s;
  -moz-transition: background-color .3s, border-color .3s;
  -ms-transition: background-color .3s, border-color .3s;
  -o-transition: background-color .3s, border-color .3s;
  transition: background-color .3s, border-color .3s;
}

.section-inverted div,
.section-inverted h1,
.section-inverted p,
.section-inverted a {
  color: white;
}

.section-inverted a:hover {
  color: white;
  text-decoration: underline;
}

.section-inverted a.button {
  border-color: white;
}

.section-inverted a.button:hover {
  color: #414042;
  background-color: white;
  text-decoration: none;
}

.section {
  padding: 50px;
  background-color: white;
  background-repeat: none;
  background-size: cover;
  background-position: center;
}

.section .title {
  color: #17ab56;
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: 2px;
  margin-bottom: 20px;
}

.section .sub{
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: 2px;
  margin-bottom: 20px;
}

@media (max-width: 992px) {
  #about .margin-bottom {
    margin-bottom: 40px;
  }
}

.section-inverted .title {
  color: white;
}

p a {
  font-size: 20px;
  letter-spacing: 0px;
  text-transform: none;
}

.section .section-callout {
  background-color: #f2f2f2;
  padding: 15px;
  text-align: center;
}

.section .section-callout .section-callout-link {
    text-align: center;
}

.section .section-callout a {
  font-size: 12px;
  display: inline-block;
  padding: 10px;
  border-top: 1px solid #414042;
  text-decoration: none;
}

.overlay {
  z-index: 999;
  position: fixed;
  left: 0px;
  top: 0px;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  padding: 60px;
  padding-top: 30px;
  display: none;
}

.overlay .popup {
  background-color: white;
  padding: 20px;
}

.overlay .popup .close-popup {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image: url("/assets/images/close-popup.jpg");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
  z-index: 9999;

  -webkit-transition: background-image 0.3s ease-in-out;
  transition: background-image 0.3s ease-in-out;
}

.overlay .popup .close-popup:hover {
  background-image: url("/assets/images/close-popup-hover.jpg");

  -webkit-transition: background-image 0.3s ease-in-out;
  transition: background-image 0.3s ease-in-out;
}

.overlay .popup .popup-continue {
  padding: 0px;
  margin-bottom: 15px;
}

@media (max-width: 992px) {
  .overlay .popup .popup-continue {
    margin-bottom: 0px;
  }
}

#header {
  position: fixed;
  top: 0px;
  left: 0px;
  padding: 20px 50px 20px 50px;
  background-color: transparent;
  width: 100%;
  z-index: 999;
}

#header .row {
  border-width: 1px;
  border-style: solid;
  border-color: white;
  width: 100%;
  margin-right: 0px;
  margin-left: 0px;
  padding: 10px;
  background-color: white;

  -webkit-transition: border-color .3s;
  -khtml-transition: border-color .3s;
  -moz-transition: border-color .3s;
  -ms-transition: border-color .3s;
  -o-transition: border-color .3s;
  transition: border-color .3s;
}

#header .row.scrolled {
  border-color: #999999;

  -webkit-transition: border-color .3s;
  -khtml-transition: border-color .3s;
  -moz-transition: border-color .3s;
  -ms-transition: border-color .3s;
  -o-transition: border-color .3s;
  transition: border-color .3s;
}

#header .logo img {
  height: 20px;
  width: auto;
}

#header .nav-links {
  text-align: right;
}

#header .nav-links a {
  padding-left: 12px;
  margin-left: 12px;
  text-decoration: none;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  color: #414042;

  -webkit-transition: color .3s;
  -khtml-transition: color .3s;
  -moz-transition: color .3s;
  -ms-transition: color .3s;
  -o-transition: color .3s;
  transition: color .3s;
}


#header .nav-links a:hover {
  color: #17ab56;
  text-decoration: none;

  -webkit-transition: color .3s;
  -khtml-transition: color .3s;
  -moz-transition: color .3s;
  -ms-transition: color .3s;
  -o-transition: color .3s;
  transition: color .3s;
}


#header .nav-links .updates.first-ext {
  border-left: 1px solid #cccccc;
  padding-left: 24px;
  margin-left: 24px;
}

#header .nav-links .updates {
  color: #cccccc;
}

#header .nav-links .updates:hover {
  color: #17ab56;
}

#home {
  padding-top: 200px;
  padding-bottom: 200px;
  position: relative;
}

#home .carousel-gradient {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 98;
  background: -webkit-linear-gradient(left,rgba(0,0,0,0.5),rgba(0,0,0,0)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(right,rgba(0,0,0,0.5),rgba(0,0,0,0)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(right,rgba(0,0,0,0.5),rgba(0,0,0,0)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to right,rgba(0,0,0,0.5),rgba(0,0,0,0)); /* Standard syntax */
}

#home .carousel-title h1 {
  z-index: 99;
}

#home #carousel {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#carousel .carousel-inner {
  width: 100%;
  height: 100%;
}

#carousel .item {
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
}

#carousel .slide1 {
  background-image: url("/assets/images/carousel/slide1.jpg");
}

#carousel .slide2 {
  background-image: url("/assets/images/carousel/slide2.jpg");
}

#carousel .slide3 {
  background-image: url("/assets/images/carousel/slide3.jpg");
}

#carousel .slide4 {
  background-image: url("/assets/images/carousel/slide4.jpg");
}

#carousel .slide5 {
  background-image: url("/assets/images/carousel/slide5.jpg");
}

#carousel .slide6 {
  background-image: url("/assets/images/carousel/slide6.jpg");
}

#carousel .slide7 {
  background-image: url("/assets/images/carousel/slide7.jpg");
}

#carousel .slide8 {
  background-image: url("/assets/images/carousel/slide8.jpg");
}

#carousel .slide9 {
  background-image: url("/assets/images/carousel/slide9.jpg");
}

/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb
*/

.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}

#about .border {
  box-shadow: 0px 17px 0px -15px #cccccc;
  padding-bottom: 50px;
}

#link-nyc {
  background-color: #f2f2f2;
}

#link-nyc .link-image {
  text-align: center;
  background-image:  url("/assets/images/linknyc.png");
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 25px;
  height: 447px;
}

#link-nyc .link-image img {
   max-width: 600px;
    margin: 0 auto;
    overflow:hidden;
    display: block;

}

#link-nyc .quote {
  box-shadow: 0px 17px 0px -15px #cccccc;
  text-align: center;
  padding-bottom: 20px;
  padding-top: 20px;
}

#link-nyc .quote:last-child {
  box-shadow: none;
}

#link-nyc .quote h2 {
  width: 55%;
  margin-left: auto;
  margin-right: auto;
  font-size: 30px;
  font-weight: normal;
  color: #808080;
  text-align: center;
}

#link-nyc .quote .quote-separator {
  width: 100px;
  height: 1px;
  background-color: #414042;
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
  margin-bottom: 15px;
}

#link-nyc .quote .quote-logo {
  height: 50px;
  width: auto;
  margin-bottom: 15px;
}

#careers {
    background-image: url("/assets/images/careers-bg.jpg")
}

#contact .row.addresses {
  box-shadow: 0px -17px 0px -15px #cccccc;
  padding-top: 50px;
}

#contact .row.addresses .col-md-6 {
  padding-left: 0px;
}

#contact .row.addresses .col-md-6:first-child {
  padding-right: 60px;
}

#contact .row.addresses .location {
  margin-bottom: 15px;
}

#contact .location {
  color: #414042;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 2px;
}

#contact .location-sub {
  color: #ccc;
}

#contact .address {
  font-size: 20px;
  color: gray;
  margin-bottom: 35px;
}

#footer {
  background-color: #414042;
}

#footer div,
#footer h1,
#footer p,
#footer a {
  color: #787e7e;
}

#footer a:not(.button) {
  text-decoration: underline;
  letter-spacing: 0px;
  text-transform: none;
}

#footer a:not(.button):hover {
  color: white;
}

#footer a.button {
  border-color: #787e7e;
}

#footer a.button:hover {
  border-color: white;
}

#footer .social {
  text-align: right;
}

#footer .social .social-button {
  display: inline-block;
  text-decoration: none;
  width: 25px;
  height: 25px;
  background-repeat: none;
  background-size: 100% 100%;
  background-position: center;
  margin-left: 15px;
  opacity: 0.5;

  -webkit-transition: opacity .3s;
  -khtml-transition: opacity .3s;
  -moz-transition: opacity .3s;
  -ms-transition: opacity .3s;
  -o-transition: opacity .3s;
  transition: opacity .3s;
}

#footer .social .social-button:hover {
  opacity: 1;

  -webkit-transition: opacity .3s;
  -khtml-transition: opacity .3s;
  -moz-transition: opacity .3s;
  -ms-transition: opacity .3s;
  -o-transition: opacity .3s;
  transition: opacity .3s;
}

@media (max-width: 992px) {
  #footer .social {
   text-align: center;
   margin: 10px 0;
  }

  #footer .social .social-button {
    width: 30px;
    height: 30px;
  }
}

#footer .social .social-button.twitter {
  background-image: url("/assets/images/twitter.svg");
}

#footer .social .social-button.facebook {
  background-image: url("/assets/images/facebook.svg");
}

#footer .social .social-button.google {
  background-image: url("/assets/images/google.svg");
  width: 30px;
  background-size: 30px;
}

#footer .social .social-button.linkedin {
  background-image: url("/assets/images/linkedin.svg");
}

#footer .copyright {
  margin-top: 75px;
}

hr {
  border-color: #929292;
}

.mobile-show {
    display: none;
}

.mobile-phone {
  font-size: 20px;
  color: gray;
  letter-spacing: 0;
  pointer-events: none;
  text-decoration: none;
}

@media (max-width: 992px) {
  h1 {
    font-size: 40px;
  }

  h1, p, #footer .copyright-text {
    text-align: left;
  }

  .overlay h1 {
    font-size: 30px;
  }

  .overlay p {
    font-size: 16px;
  }

  .section .title {
    text-align: left;
  }

  #header {
    padding: 0px;
  }

  #header .logo img {
    height: 25px;
    padding-left: 20px;
  }

  #header .nav-links {
    display: none;
  }

  #header .row {
    border-top: 0px;
    border-right: 0px;
    border-left: 0px;
    border-width-bottom: 0px;
  }

  #link-nyc .quote h2 {
      width: 100%;
      font-size: 20px;
  }

  a.button {
    margin-bottom: 20px;
  }

  .mobile-show {
    display: block;
  }

  .mobile-hide {
    display: none;
  }

  .mobile-phone {
    font-size: 20px;
    color: #17AB56;
    text-decoration: underline;
    pointer-events: auto;
  }
}

#news .article {
  max-width: 500px !important;
}

#news a.news {
  display: block;
  width: 100%;
  height: 300px;
  border-color: #404041;
  border-width: 1px;
  border-style: solid;
  padding: 15px;
  position: relative;
  text-decoration: none;
  background-color: white;
  margin-left: auto;
  margin-right: auto;

  -webkit-transition: border-color .3s, background-color .3s;
  transition: border-color .3s, background-color .3s;
}

#news a.news .news-date {
  width: 100%;
  text-align: right;
  color: rgb(128,128,128);
  font-size: 15px;
  letter-spacing: 3px;

  -webkit-transition: color .3s;
  transition: color .3s;
}

#news a.news .news-headline {
  width: 100%;
  margin-top: 10px;
  color: #404041;
  font-size: 25px;
  margin-bottom: 50px;
  letter-spacing: 0px;
  text-transform: none;

  -webkit-transition: color .3s;
  transition: color .3s;
}

#news a.news .news-source {
  width: 100%;
  letter-spacing: 3px;
  font-size: 15px;
  color: rgb(128,128,128);
  position: absolute;
  left: 15px;
  bottom: 15px;

  -webkit-transition: color .3s;
  transition: color .3s;
}

#news a.news .news-source .news-source-line {
  width: 50px;
  height: 2px;
  background-color: #404041;
  margin-bottom: 10px;
  text-transform: uppercase;

  -webkit-transition: background-color .3s;
  transition: background-color .3s;
}

#news a.news:hover {
  border-color: #2aaa4a;
  background-color: #069948;
}

#news a.news:hover .news-date,
#news a.news:hover .news-headline,
#news a.news:hover .news-source {
  color: white;
}

#news a.news:hover .news-source .news-source-line {
  background-color: white;
}

@media (max-width: 1400px) {
  #news h1 {
    font-size: 50px;
  }
}

@media (max-width: 1200px) {
  #news .article-headline,
  #news .article {
    margin-bottom: 25px;
  }
  #news .article:last-child {
    margin-bottom: 0px;
  }
}

@media (max-width: 992px) {
  #news h1 {
    font-size: 40px;
  }

}
