@charset "UTF-8";

/*  RESET
---------------------------------------------------*/

* {
  padding:0;
  margin:0;
  outline:none;
}

a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, center, canvas, caption, cite, code, command, datalist, dd, del, details, dfn, dl, div, dt, 
em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, keygen, label, legend, li, meter, nav,
object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, tfoot, thead, th, tr, tdvideo, tt, u, ul, var, a img {
  background:transparent;
  border:0 none;
  outline:none;
  vertical-align:baseline;
  padding:0;
  margin:0;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;   
}

.clearer { 
  clear:both;
}


/* Custom Scrollbar */

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #ff4d0e #ffffff;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 10px;
}

*::-webkit-scrollbar-track {
  background:transparent;
}

*::-webkit-scrollbar-thumb {
  scrollbar-width: thin;
  background-color: #ff4d0e;
  border-radius: 10px;
}


/* General */

html, body {
  height:100%;
  background:#fafbef;
  position:relative;
  overflow-x:hidden;
}

body {
  overflow-x:hidden;
}

h1 {
  font:400 90px/90px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
}

h2 {
  font:400 40px/48px "GT Walsheim Regular", arial, sans-serif;
}

h3 {
  font:400 23px/28px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 20px 0;
}

h4 {
  font:400 35px/42px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
}

p {
  font:400 22px/28px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 40px 0;
}

a {
  color:#ff4d0e;
}

.link {
  font:400 20px/24px "GT Walsheim Bold", arial, sans-serif;
  color:#ff4d0e;
  text-decoration:none;
  border-bottom:2px solid #ff4d0e;
}

.link-button:hover {
  cursor: pointer
}

.link-button {
  font: 400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color: #ff4d0e;
  text-decoration: none;
  border-bottom: 2px solid #ff4d0e;
  position: relative;
  overflow: hidden;
  display:inline-block;
}

.link-button:before {
  content: attr(data-hover);
  position: absolute;
  top:0; left: 0;
  width: 100%;
  text-align:center;
  /*transform: translate(0, 200%);*/
  transform: translateY(100%);
  transition: all .3s ease-in-out;
  display:inline-block;
}

/*button:before (attr data-hover)*/
.link-button:hover:before {
  opacity: 1;
  transform: translate(0,0);
}

/*button div (button text before hover)*/
.link-button:hover div {
  opacity: 1;
  transform: translate(0, 100%)
}

.link-button div {
  transition: all .3s ease-in-out;
  display:inline-block;
}

main {
  background:#fafbef;
  position:relative;
  z-index:1;
}

.flex {
  display:flex;
}

.container {
  padding:100px 70px;
}

.two-columns {
  flex-wrap: wrap;
}

.two-columns .col {
  width:50%;
  position:relative;
}

.two-columns .col img {
  width:100% !important;
}

.four-columns {
  flex-wrap: wrap;
}

.line {
  width: 100%;
  height: 96px;
  position: relative;
  overflow: hidden;
}

#home .line {
  width: 100%;
  height: 127px;
  position: relative;
  overflow: hidden;
}

#home .line:nth-child(2) {
  top:-15px;
}
   
.line span {
  position: absolute;  
}

.list {
  list-style:none;
  margin:0 0 40px 0;
}

.list li {
  font:400 22px/28px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
  position:relative;
  padding:0 0 0 15px;
  margin-bottom:10px;
}

.list li:before {
  content: "";
  width:6px;
  height:6px;
  display:block;
  background:#0b4b5e;
  position:absolute;
  top:10px;
  left:0;
}

#scroll {
    position:fixed;
    right:30px;
    bottom:30px;
    cursor:pointer;
    width:70px;
    height:70px;
    background-color:#fafbef;
    display:none;
    -webkit-border-radius:60px;
    -moz-border-radius:60px;
    border-radius:60px;
    z-index:9999;
}

#scroll:hover {
    background-color:#0b4b5e;
    opacity:1;filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}


/* Colors */

.blue {
  background:#0b4b5e;
}

.blue h2,
.blue h4,
.blue p {
  color:#fafbef;
}

.orange {
  background:#ff4d0e;
}

.orange h2,
.orange h3,
.orange h4,
.orange p {
  color:#fafbef;
}

.orange .link,
.orange .link-button {
  color:#fafbef;
  border-bottom:2px solid #fafbef;
}

.cream {
  background:#f4f6dc;
}

.dark h1,
.dark .menu-wrapper p {
  color:#0b4b5e;
}


/* Nav */

nav {
  width:100%;
  position:sticky;
  top:0;
  z-index:1;

}

#logo img,
#client-work #logo img {
  width:460px;
  position:absolute;
  top:50px;
  left:40px;
}

.menu-wrapper {
  position: absolute;
  top: 30px;
  right: 40px;
  width: auto;
  height: 70px;
  display:flex;
  align-items:center;
  justify-content: right;
  cursor: pointer;
}

.menu-wrapper p {
  font:400 22px/28px "GT Walsheim Regular", arial, sans-serif;
  text-align:right;
  text-decoration:none;
  color:#fafbef;
  margin:0 25px 0 0;
}

/*
.hamburger-menu,
.hamburger-menu:after,
.hamburger-menu:before {
  width: 50px;
  height: 5px;
}

.hamburger-menu {
  position: relative;
  transform: translateY(0);
  background: rgba(255, 77, 14, 1);
  transition: all 0ms 200ms;
}

.hamburger-menu.active {
  background: rgba(255, 77, 14, 0); 
}

.hamburger-menu:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 13px;
  background: rgba(255, 77, 14, 1);
  transition: bottom 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hamburger-menu:after {
  content: "";
  position: absolute;
  left: 0;
  top: 13px;
  background: rgba(255, 77, 14, 1);
  transition: top 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hamburger-menu.active:after {
  top: 0;
  transform: rotate(45deg);
  transition: top 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

.hamburger-menu.active:before {
  bottom: 0;
  transform: rotate(-45deg);
  transition: bottom 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
*/




#nav-button {
  position: relative;
  transform: translateY(0);
  transition: all 0ms 200ms;
}

#nav-button span {
  width: 50px;
  height: 5px;
  display:block;
  background: rgba(255, 77, 14, 1);
}

#nav-button.active .line2 {
  background: rgba(255, 77, 14, 0); 
}

#nav-button .line1 {
  position: absolute;
  left: 0;
  bottom: 13px;
  transition: bottom 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

#nav-button .line3 {
  position: absolute;
  left: 0;
  top: 13px;
  transition: top 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

#nav-button.active .line3 {
  top: 0;
  transform: rotate(45deg);
  transition: top 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

#nav-button.active .line1 {
  bottom: 0;
  transform: rotate(-45deg);
  transition: bottom 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
}

#navigation {
  width:600px;
  position:fixed;
  right:-600px;
  z-index:4;
  padding:100px 70px 0 70px;
  display:none;
}

#navigation-overlay {
  width:600px;
  height:100%;
  background:#ff4d0e;
  position:fixed;
  right:-600px;
  z-index:3;
  display:none;
}

#navigation ul {
  list-style:none;
}

#navigation li {
  margin:0;
}

#navigation li a {
  font:400 50px/50px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
  text-decoration:none;
  display:block;
  padding:10px 0;
}



/* Home */

#home header {
  width:100%;
  height:100%;
  background:url("../images/home-header.jpg") no-repeat center center / cover;
  position:sticky;
  top:0;
  padding:100px 70px 100px 70px;
}


#home header #video,
#home header #video-mobile {
  background:url("../images/home-header.jpg") no-repeat center center / cover;
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  right:0;
  overflow:hidden;
}

#home header #video-mobile {
	display:none;
}

#home header #video iframe,
#home header #video-mobile iframe {
  opacity:0.98;
  width:100vw;
  height:56.25vw;
  min-height:100vh;
  min-width:177.77vh;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
}

#home header #video:before,
#home header #video-mobile:before {
  content:"";
  background-image:linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0));
  width:100%;
  height:25%;
  position:absolute;
  top:0;
  left:0;
  z-index:2;
}

#home header #video:after,
#home header #video-mobile:after {
  content:"";
  background-image:linear-gradient(to top, rgba(0,0,0,0.1), rgba(0,0,0,0));
  width:100%;
  height:75%;
  position:absolute;
  bottom:0;
  left:0;
  z-index:2;
}

#home header .container {
  width:100%;
  padding:0 70px 100px 70px;
  position:absolute;
  bottom:0;
  left:0;
}

#home h1 {
  font-size:120px;
  line-height:120px;
  position:relative;
}

/*
#home h1 {
  font-size:120px;
  line-height:120px;
  color:#fafbef;
  margin:0;
  align-self: flex-end;
  position:relative;
  z-index:5;
}*/

#who-we-are {
  position:relative;
}

#who-we-are h3 {
  color:#fafbef;
}

#who-we-are h2 {
  color:#fafbef;
}

#who-we-are .col:nth-child(1) {
  width:20%;
}

#who-we-are .col:nth-child(2) {
  width:80%;
}

.item {
  height: 80px;
  overflow: hidden;
  border-bottom:1px solid #0b4b5e;
}

.item .col:nth-child(1) {
  width:25%;
  padding:0 70px;
  position:relative;
}

.item .col:nth-child(2) {
  width:75%;
  padding:0;
  position:relative;
}

.item .photo {
  width:100%;
  height:100%;
  position:relative;
}

.item h2,
.item h3 {
  width:100%;
  height:80px;
  display:flex;
  align-items:center;
  position:relative;
  z-index:2;
  margin:0;
}

.item h2 {
  font:400 25px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#ff4d0e;
}

.item h3 {
  font:400 23px/28px "GT Walsheim Medium", arial, sans-serif;
  color:#0b4b5e;
}

.item p {
  position:absolute;
  bottom:0;
  left:0;
  padding:0 50px 70px 70px;
  margin:0;
}

.item .button {
  width:180px;
  height:80px;
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fafbef;
  text-decoration:none;
  background:#ff4d0e;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:absolute;
  top:0;
  right:0;
  z-index:2;
  transition:all 0.3s ease;
}

.item .button:hover {
  background:#0b4b5e;
}

.button-outlined {
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#ff4d0e;
  text-decoration:none;
  border:2px solid #ff4d0e;
  padding:16px 32px;
  transition:all 0.3s ease;
}

.button-outlined:hover {
  color:#fafbef;
  background:#ff4d0e;
  border:2px solid #ff4d0e;
}


.button-outlined2:hover {
  cursor: pointer;
  color:#fafbef;
  background:#ff4d0e;
}

.button-outlined2 {
  font: 400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color: #ff4d0e;
  text-decoration: none;
  border:2px solid #ff4d0e;
  padding:16px 32px;
  position: relative;
  overflow: hidden;
  display:inline-block;
}

.button-outlined2:before {
  content: attr(data-hover);
  position: absolute;
  top:17px; left: 0;
  width: 100%;
  text-align:center;
  /*transform: translate(0, 200%);*/
  transform: translateY(200%);
  transition: all .3s ease-in-out;
  display:inline-block;
}

/*button:before (attr data-hover)*/
.button-outlined2:hover:before {
  opacity: 1;
  transform: translate(0,0);
}

/*button div (button text before hover)*/
.button-outlined2:hover div{
  opacity: 1;
  transform: translate(0, 200%)
}

.button-outlined2 div {
  transition: all .3s ease-in-out;
  display:inline-block;
}

#pin1, #pin2, #pin3 {
  width: 100%;
  position:relative;
}

#pin1, #pin2, #pin3, #pin4 {
  height:100vh;
  /*height: calc(100vh - 320px)*/
}
/*
#pin1 {
  height: calc(100vh - 80px*4)
}

.spacer {
  height: 50vh;
  background: lightgrey
}

.spacer.top {
  height: calc(100vh - 100px);
}

.spacer.bot {
  height: 100vh;  
}
*/
/*
article {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  font-size: 1.2em;
}*/


.photo1,
.photo2,
.photo3,
.photo4 {
  width:100%;  /*change */
  height: 100%;  
  -webkit-background-size: cover; 
  -moz-background-size: cover; 
  -o-background-size: cover; 
  background-size: cover; 
  text-align: left;
  background-position-x: 50%;
  background-position-y: 0%;
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}

.photo1.in-view,
.photo2.in-view,
.photo3.in-view,
.photo4.in-view {
  -webkit-animation: zoomin 1s linear;
  animation: zoomin 1s cubic-bezier(.215, .61, .355, 1);
  animation-fill-mode: forwards;
  transition-delay: .6s;
}

@-webkit-keyframes zoomin {
  0% {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.holder {}


/* Whatever you like */

/*
.holder__head {
  padding: 0.4em 2em;
  position: sticky;
  z-index: 1;
  bottom: calc(var(--b) * 2em);
  top: calc(var(--t) * 2em);
}

.holder__item {
  padding: 2rem;
  position: sticky;
  height: 100vh;
  top: calc((var(--t) + 1) * 1.6em);
  padding-bottom: 8em;
}*/

.holder__head {
  height:80px;
  background:#fafbef;
  border-top:1px solid #0b4b5e;
  display:flex;
  align-items:center;
  position: sticky;
  bottom: calc(var(--b) * 80px);
  top: calc(var(--t) * 80px);
  z-index: 1;
  padding: 0;
}

.holder__head .col:nth-child(1) {
  width:25%;
  padding:0 70px;
  position:relative;
}

.holder__head .col:nth-child(2) {
  width:75%;
  padding:0 200px 0 0;
  position:relative;
}

.holder__item {
  height: 100vh;
  background:#fafbef;
  display:flex;
  position: sticky;
  top: calc((var(--t) + 1) * 80px);
  padding: 0;
  padding-bottom: 320px;
}

.holder__item:last-child {
  padding-bottom:0;
}

.holder__item .col:nth-child(1) {
  width:25%;
  padding:0 70px;
  position:relative;
}

.holder__item .col:nth-child(2) {
  width:75%;
  padding:0;
  position:relative;
  overflow:hidden;
}

.holder__item p {
  position:absolute;
  bottom:0;
  left:0;
  padding:0 50px 70px 70px;
  margin:0;
}

.holder__item .photo {
  width:100%;
  height:100%;
  position:relative;
}

.holder__head h2 {
  font:400 25px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#ff4d0e;
  margin:0;
}

.holder__head h3 {
  font:400 20px/25px "GT Walsheim Medium", arial, sans-serif;
  color:#0b4b5e;
  margin:0;
}

.holder__head .button {
  width:180px;
  height:79px;
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fff;
  text-decoration:none;
  background:#ff4d0e;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:absolute;
  top:0;
  right:0;
  z-index:2;
  transition:all 0.3s ease;
}

.holder__head .button:hover {
  background:#0b4b5e;
}

#home-working-with-us {
  overflow:hidden;
  border-top:1px solid #0b4b5e;
  border-bottom:1px solid #0b4b5e;
  position:relative;
  z-index:1;
}

#home-working-with-us .col:nth-child(1) {
  width:70%;
  position:relative;
  padding-right:70px;
}

#home-working-with-us .col:nth-child(2) {
  width:30%;
}

/*
#text {
  width:1950px;
  position:absolute;
  top:0;
  left:0;
  transform:translateX(900px);
}

#home-our-process {
  transform:translateY(800px);
}*/

#home-working-with-us h3 {
  color:#fafbef;
}

#home-working-with-us h2 {
  font-size:100px;
  line-height:100px;
  color:#fafbef;
}

#home-working-with-us p {
  color:#fafbef;
}

#home-logos .flex {
  flex-wrap: wrap;
}

#home-logos .col {
  width:16.666%;
  border-right:1px solid #0b4b5e;
  border-bottom:1px solid #0b4b5e;
  padding:25px 0;
  position:relative;
}

#home-logos .col:nth-child(6),
#home-logos .col:nth-child(11),
#home-logos .col:nth-child(17) {
  border-right:1px solid #fafbef;
}

#home-logos .col#logo-button {
  width:33.334%;
  display:flex;
  align-items:center;
  justify-content:center;
}

#home-logos .col img {
  width:100%;
  display:block;
}

/*
#home-logos img {
  width:300px;
  filter: brightness(0) saturate(100%) invert(22%) sepia(16%) saturate(3089%) hue-rotate(152deg) brightness(98%) contrast(91%);
  transition: filter 0.5s ease-in-out;
}

#home-logos img:hover {
  filter: brightness(0) saturate(0%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0) brightness(0%) contrast(0%);
}*/

/* Subpages */

header {
  position: sticky;
    top: 0;
}

header .container {
  padding:200px 70px 100px 70px;
}

header h3 {
  color:#fafbef;
}

/* The Team */

#people {
  flex-wrap: wrap;
}

#people .col {
  width:33.3%;
  border-bottom:1px solid #0b4b5e;
  border-right:1px solid #0b4b5e;
  position:relative;
}

#people .col:nth-child(3n) {
  border-right:1px solid #fafbef;
}

#people .col img {
  width:100%;
  display:block;
}

.name {
  border-top:1px solid #0b4b5e;
  padding:20px 40px;
}

.photo {
  width:100%;
  position:relative;
}

#the-team .photo {
  overflow:hidden;
}

.bio {
  width:100%;
  height:100%;
  padding:0;
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  display:flex;
  flex-direction:column;
}

.bio .bio-content {
  transform:translateY(30px);
  opacity:0;
  position:absolute;
  bottom:0;
  left:0;
  padding:40px 40px;
}

.bio-content h2 {
  font:400 25px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 5px 0;
}

.bio-content p {
  font-size:20px;
  line-height:24px;
  margin:0;
}

.bio .bio-content p {
  margin:0 0 20px 0;
}

.owl-carousel {
  width:100% !important;
  height:400px;
  position:relative;
}

.owl-carousel img {
  width:auto !important;
  height:400px;
  display:block;
}

.owl-nav {
  width:100%;
  position:absolute;
  top:50%;
}

.owl-prev {
  width:70px;
  height:70px;
  background:url("../images/previous-button.svg") no-repeat !important;
  background-color:#fafbef !important;
  border-radius:50%;
  display:block !important;
  cursor: pointer;
  position:absolute;
  left:25px !important;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
}

.owl-prev span {
  display:none;
}

.owl-next {
  width:70px;
  height:70px;
  background:url("../images/next-button.svg") no-repeat !important;
  background-color:#fafbef !important;
  border-radius:50%;
  display:block !important;
  cursor: pointer;
  position:absolute;
  right:25px !important;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
}

.owl-next span {
  display:none;
}


/* The Team */

#clients {
  flex-wrap: wrap;
}

.play {
  width:63px;
  height:70px;
  display:block;
  opacity:0;
  position:absolute;
  transform: translateY(30px);

}


/* Our Work */

#our-work header img {
  width:100%;
  display:block;
  position:relative;
  left:50%;
  transform: scale(1) translateX(-50%);
  transition: transform 0.5s cubic-bezier(.215, .61, .355, 1);

}

#our-work header:hover img {
  transform: scale(1.3) translateX(-40%);
    transition-delay: 0s;
}

#our-work h1 {
  margin:0 0 20px 0;
}

#our-work .button {
  width:100%;
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fafbef;
  text-decoration:none;
  text-align:center;
  background:transparent;
  padding:0;
  display:inline-block;
  transition:all 0.3s ease;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-55%);
  transform: translateY(-55%);
}

#our-work .button:hover {
  background:#0b4b5e;
}

#our-work .button.more {
  margin-left:20px;
}

#our-work .button-outlined {
  margin-left:20px;
}

#work img {
  width:100%;
  display:block;
}

#work a {
  position:relative;
  text-decoration:none;
  border:0;
  overflow:hidden;
}

#work a img {
  transform: scale(1);
  transition: transform 0.5s cubic-bezier(.215, .61, .355, 1);
}

#work a:hover img {
  transform: scale(1.3);
    transition-delay: 0s;
}

#work .featured {
  position:relative;
  display:block;
}

#our-work .featured .description {
  background:none;
}

#our-work .description p a {
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fafbef;
  display:inline-block;
  text-decoration:none;
  background:#ff4d0e;
  z-index:2;
  padding:16px 32px;
  transition:all 0.3s ease;
}

#our-work .description p a:hover {
  background:#0b4b5e;
}

.work-two-columns {
  flex-wrap: wrap;
}

.work-two-columns .work {
  width:50%;
  position:relative;
  overflow:hidden;
  
}



.work-three-columns {
  flex-wrap:wrap;
}

.work-three-columns .work {
  width:33.3%;
  position:relative;
}

.work-four-columns {
  flex-wrap:wrap;
}

.work-four-columns .work {
  width:25%;
  position:relative;
}

.work-five-columns .work {
  width:20%;
  position:relative;
}

.overlay {
  width:100%;
  height:100%;
  background-image:linear-gradient(to top, rgba(0,0,0,0.4), rgba(0,0,0,0));
  /*background:url("../images/work-overlay.png") repeat-x bottom left;*/
  display:block;
  opacity:0;
  position:absolute;
  bottom:0;
}

.description {
  width:100%;
  height:100%;
  opacity:0;
  position:absolute;
  bottom:0;
  left:0;
  background:rgba(255, 77, 14, 0.7);
}

#our-work h1 {
  position:absolute;
  bottom:40px;
  left:40px;
}

#our-work h5 {
  font:400 23px/28px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 20px 0;
}

#work-intro h3 {
  display:block !important;
}

#our-work .description h3 {
  display:none;
}

#our-work h3 {
  width:100%;
  display:block;
  font:400 32px/35px "GT Walsheim Bold", arial, sans-serif;
  color:#fafbef;
  text-decoration:none !important;
  border:0 !important;
  padding:0 30px 30px 30px;
  margin:0 !important;
  opacity:1 !important;
  position:absolute;
  bottom:0;
  left:0;
}

#our-work .description p {
  width:100%;
  font:400 40px/48px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
  text-decoration:none;
  text-align:center;
  background:transparent;
  display:inline-block;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  padding:0;
  margin:10px 0 0 0;
}

#our-work .featured h1 {
  position:absolute;
  bottom:40px;
  left:40px;
}

#our-work .featured .description p {
  width:auto !important;
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fafbef;
  text-decoration:none;
  text-align:center;
  background:transparent;
  display:inline-block;
  position: absolute;
  top:auto !important;
  bottom:20px;
  left:40px;
  -ms-transform: none !important;
  transform: none !important;
  padding:0;
  margin:10px 0 0 0;
}

.description-text-only {
  width:100%;
  height:100%;
  opacity:0;
  position:absolute;
  bottom:0;
  left:0;
  background:rgba(255, 77, 14, 1);
}

#our-work .text-only {
  position:relative;
  border-top:10px solid #fafbef;
  border-left:5px solid #fafbef;
  border-right:5px solid #fafbef;
  border-bottom:10px solid #fafbef;
}

#our-work .text-only h3 {
  width:100%;
  font:400 50px/58px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
  text-decoration:none;
  text-align:center;
  background:transparent;
  display:inline-block;
  position: absolute;
  opacity:1;
  top: 50%;
  bottom:auto;
  left:auto;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  padding:0;
  margin:0;
  z-index:10;
}

#our-work .description-text-only p {
  width:100%;
  display:block;
  font:400 30px/38px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
  text-align:center;
  text-decoration:none !important;
  border:0 !important;
  padding:0 40px 30px 40px;
  margin:0;
  opacity:0;
  position:absolute;
  bottom:0;
  left:0;
}

header .description p {
  margin:0 0 20px 0;
}

#work .description .link,
header .description .link {
  display:inline-block;
}

header .description h3 {
  font:400 80px/80px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
  margin:0 0 20px 0;
}

#next-prev-work {
  border-top:1px solid #0b4b5e;
}

#next-prev-work a {
  width:50%;
  display:inline-block;
  text-decoration:none;
  padding:50px;
}

#next-prev-work a span {
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#ff4d0e;
  text-decoration:none;
}

#next-prev-work a:first-child {
  border-right:1px solid #0b4b5e;
}

#next-prev-work a:last-child {
  text-align:right;
}

/*button:before (attr data-hover)*/
#next-prev-work a:hover .link-button:before,
#next-prev-work a.link-button:hover:before {
  opacity: 1;
  transform: translate(0,0);
}

/*button div (button text before hover)*/
#next-prev-work a:hover .link-button div,
#next-prev-work a.link-button:hover div {
  opacity: 1;
  transform: translate(0, 100%)
}


/* Client Work */

#client-work header:before {
  content:"";
  background-image:linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0));
  width:100%;
  height:25%;
  position:absolute;
  top:0;
  left:0;
  z-index:2;
}

#client-work header:after {
  content:"";
  background-image:linear-gradient(to top, rgba(0,0,0,0.1), rgba(0,0,0,0));
  width:100%;
  height:75%;
  position:absolute;
  bottom:0;
  left:0;
  z-index:2;
}

#client-work header img {
    position:relative;
    left:50%;
    transform:translateX(-50%);
}

#client-work img {
  width:100%;
  display:block;
}

#client-work .two-columns img {
  width:50%;
}

#client-work .four-columns img {
  width:25%;
}

.second-and-charles header .video {
  background:url("../images/2nd-and-charles-header.jpg") no-repeat center center / cover;
}

.logos {
  background:#fff;
  padding:50px 0;
}

.title {
  width:100%;
  position:absolute;
  bottom:0;
  left:0;
  padding:0 0 100px 70px;
  z-index:3;
}

#client-work img.col1,
#client-work img.col2 {
  width:50%;
  display:inline-block;
}

.white-text h4,
.white-text h3,
.white-text p {
  color:#fff;
}

video {
	width:100%;
	height:auto;
}

.video {
  width:100%;
  height:0px;
  padding:56.25% 0 0;
  position:relative;
  overflow:hidden;
}

.video iframe {
  opacity:0.98;
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}

.playbutton {
  background-color:#fafbef !important;
  border-radius:50%;
  width:130px !important;
  height:130px !important;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:2;
}

#client-work .owl-carousel {
  width:100% !important;
  height:100% !important;
}

#client-work .owl-carousel img {
  width:100% !important;
  height:100% !important;
}

#client-work .owl-carousel img.playbutton {
  width:130px !important;
  height:130px !important;
}

#client-work .owl-carousel .owl-stage-outer {
  width:100% !important;
  height:100% !important;
}

#client-work .owl-dots {
  position:absolute !important;
  bottom:20px !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:2 !important;
}

#client-work .owl-dot {
  background:#fafbef !important;
  width:10px !important;
  height:10px !important;
  margin:0 4px;
  border-radius:10px !important;
  opacity:0.5 !important;
}

#client-work .owl-dot.active {
  opacity:1 !important;
}

#logos .col {
  padding:50px 70px;
  align-self:center;
}

#logos .work-logo img {
  max-width:800px;
  margin:0 auto;
  filter:brightness(0%);
  transition:all 0.3s ease;
}

#logos .work-logo img:hover {
  filter:brightness(100%);
}

/* Client Colors */

.aahs-blue {
  background:#31beef;
}

.afs-red {
  background:#c11c16;
}

.canopy-green {
  background:#31b34a;
}

.chesters-blue {
  background:#001f4f;
}

.daxko-red {
  background:#f3316d;
}

.ecommerce-red {
  background:#a70000;
}

.highlands-college-red {
  background:#ee3124;
}

.highlands-college-green {
  background:#96b0af;
}

.irontribe-yellow {
  background:#ffd200;
}

.irontribe-yellow h3,
.irontribe-yellow h4 {
	color:#434343;
}

.irontribe-blue {
  background:#40c1f2;
}

.irontribe-blue h3,
.irontribe-blue h4 {
	color:#434343;
}

.rfg-blue {
  background:#005baa;
}

.rfg-purple {
  background:#a43b95;
}

.royal-cup-black {
  background:#000;
}

.second-and-charles-black {
  background:#000;
}

.the-shoals-green {
  background:#00a98c;
}

.trojan-black {
  background:#000;
}

.two-and-charles-orange {
  background:#ee7623;
}

.fortera-blue {
  background:#02274b;
}

.fortera-purple {
  background:#923672;
}


/* Just Videos page */

#just-videos h1 .small {
  font-size:50px;
  line-height:50px;
}

#just-videos h3 {
  font:400 23px/28px "GT Walsheim Regular", arial, sans-serif;
  color: #0b4b5e;
  margin: 0 0 10px 0;
}

#just-videos h2 {
  font:400 40px/45px "GT Walsheim Medium", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 15px 0;
}

#just-videos .line.small {
  height:56px;
}

#just-videos article {
  border-bottom:1px solid #0b4b5e;
  overflow:hidden;
}

#just-videos article .col:nth-child(1) {
  width:70%;
  height:600px;
  position:relative;
  border-right:1px solid #0b4b5e;
}

#just-videos article .col:nth-child(2) {
  width:30%;
  position:relative;
}

#just-videos article .col:nth-child(2) .content {
  width:100%;
  padding:70px 60px;
  position:absolute;
  bottom:0;
  left:0;
}

#just-videos article .col:nth-child(2) img {
  width:250px;
  margin:0 0 20px 0;
}

#just-videos .playbutton {
  width: 100px !important;
  height: 100px !important;
}



/* Working With Us */

#testimonials .container {
  padding-top:40px;
  padding-bottom:40px;
}

#testimonials .container h4 {
  font:400 70px/70px "GT Walsheim Regular", arial, sans-serif;
}

#testimonials .owl-carousel {
	height:auto !important;
}

#testimonials article {
  display:flex;
  align-items:center;
  border-top:1px solid #0b4b5e;
  border-bottom:1px solid #0b4b5e;
  border-right:1px solid #0b4b5e;
}

#testimonials article img {
  background:#0b4b5e;
  border-right:1px solid #0b4b5e;
  width:33.3%;
}

#testimonials article h4 {
  margin:0 0 20px 0;
  position:relative;
}

#testimonials article h4:before {
  content:"“";
  position:absolute;
  top:0;
  left:-18px;
}

#testimonials article h4:after {
  content:"”";
}

#testimonials article h3 {
  font:400 25px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fafbef;
  margin:0 0 10px 0;
}

#testimonials article p {
  font-size:20px;
  line-height:24px;
  margin:0 0 20px 0;
}

#testimonials article .quote {
  width:-webkit-calc(100% - 33.3%);
  width:-moz-calc(100% - 33.3%);
  width:calc(100% - 33.3%);
  height:100%;
  padding:50px 70px;
}

#testimonials .owl-prev {
  display:none !important;
}

#services h4 {
  font:400 70px/70px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
}

#services h3 {
  font:400 25px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 10px 0;
}

#services .container {
  padding-top:40px;
  padding-bottom:40px;
}

#services-list {
  border-top:1px solid #0b4b5e;
  flex-wrap:wrap;
}

#services .col {
  width:33.3%;
  padding:50px 70px;
  border-right:1px solid #0b4b5e;
}

#services .col:nth-child(3) {
  border-right:0;
}

/* Featured Work Page */

#featured-work {
  width:100%;
  height:100%;
  background:url("../images/featured-work-header.jpg") no-repeat center center / cover;
}

#featured-work .video iframe {
  opacity:1;
}

.work-title {
  height:80px;
  display:flex;
  align-items:center;
  position:relative;
}

.work-title h2 {
  font:400 25px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#ff4d0e;
  padding:0 70px;
  margin:0;
}

.work-title .button {
  width:180px;
  height:80px;
  font:400 20px/28px "GT Walsheim Bold", arial, sans-serif;
  color:#fff;
  text-decoration:none;
  background:#ff4d0e;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:absolute;
  top:0;
  right:0;
  z-index:2;
  transition:all 0.3s ease;
}

/* Contact Us */

#contact-us {
  width:100vw;
  height:100vh;
  position:fixed;
  top:0;
  background:#0b4b5e;
  display:none;
  opacity:0;
  z-index:999;
}

#contact-us .container {
  width:1200px;
  display: flex;
  height: 100vh;
  flex-direction: column;
  justify-content: center;
  padding:0;
  margin:0 auto;
}

#contact-us .content {
  border:1px solid #fafbef;
  padding:100px;
  position:relative;
  transform: translateY(50px);
  opacity:0;
}

#contact-us h2 {
  font:400 90px/90px "GT Walsheim Regular", arial, sans-serif;
  color:#fafbef;
  margin-bottom:30px;
}

#contact-us h3 {
  color:#fff;
  margin-bottom:10px;
}

#contact-us p {
  color:#fff;
}

.close {
  width:60px;
  height:60px;
  background:url("../images/close.svg") no-repeat;
  text-indent:-999999px;
  display:block;
  position:absolute;
  top:50px;
  right:50px;
}


/* Privacy Policy */

#privacy-policy h4 {
  font:400 40px/45px "GT Walsheim Regular", arial, sans-serif;
  color:#0b4b5e;
  margin:0 0 20px 0;
}

hr {
  width:100%;
  height:40px;
  border:0;
  display:block;
}


/* Footer */

footer {
  position:relative;
  z-index:1;
}

footer .col:nth-child(1) {
  width:70%;
}

footer .col:nth-child(2) {
  width:30%;
}

footer p {
  color:#fafbef;
  margin:0 0 10px 0;
}

footer p a {
  text-decoration:none;
  color:#fafbef;
}

footer .copyright {
  font:400 18px/24px "GT Walsheim Light", arial, sans-serif;
}

#footer-logo img {
  width:460px;
  margin-bottom:20px;
  margin-left:-30px;
}


/* Fonts */

@font-face {
    font-family: 'GT Walsheim Light';
    src: url('../fonts/GT-Walsheim-Light.woff2') format('woff2'),
        url('../fonts/GT-Walsheim-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GT Walsheim Regular';
    src: url('../fonts/GT-Walsheim-Regular.woff2') format('woff2'),
        url('../fonts/GT-Walsheim-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GT Walsheim Medium';
    src: url('../fonts/GT-Walsheim-Medium.woff2') format('woff2'),
        url('../fonts/GT-Walsheim-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GT Walsheim Bold';
    src: url('../fonts/GT-Walsheim-Bold.woff2') format('woff2'),
        url('../fonts/GT-Walsheim-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GT Walsheim Black';
    src: url('../fonts/GT-Walsheim-Black.woff2') format('woff2'),
        url('../fonts/GT-Walsheim-Black.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}