@font-face {
  font-family: 'helvetica-regular';
  src: url("fonts/helvetica-regular.eot");
  src: url("fonts/helvetica-regular.eot?#iefix") format("embedded-opentype"), url("fonts/helvetica-regular.svg#helvetica-regular") format("svg"), url("fonts/helvetica-regular.ttf") format("truetype"), url("fonts/helvetica-regular.woff") format("woff");
  font-style: normal; }
@font-face {
  font-family: 'helvetica-light';
  src: url("fonts/helvetica-light.eot");
  src: url("fonts/helvetica-light.eot?#iefix") format("embedded-opentype"), url("fonts/helvetica-light.svg#helvetica-light") format("svg"), url("fonts/helvetica-light.ttf") format("truetype"), url("fonts/helvetica-light.woff") format("woff");
  font-style: normal; }
@font-face {
  font-family: 'helvetica-heavy';
  src: url("fonts/helvetica-heavy.eot");
  src: url("fonts/helvetica-heavy.eot?#iefix") format("embedded-opentype"), url("fonts/helvetica-heavy.svg#helvetica-heavy") format("svg"), url("fonts/helvetica-heavy.ttf") format("truetype"), url("fonts/helvetica-heavy.woff") format("woff");
  font-style: normal; }
@keyframes spin3D {
  0% {
    transform: rotate3d(0, 0, 0, 360deg); }
  100% {
    transform: rotate3d(1, 1, 1, 360deg); } }
@-webkit-keyframes spin3D {
  0% {
    -webkit-transform: rotate3d(0, 0, 0, 360deg); }
  100% {
    -webkit-transform: rotate3d(1, 1, 1, 360deg); } }
@-ms-keyframes spin3D {
  0% {
    -ms-transform: rotate3d(0, 0, 0, 360deg); }
  100% {
    -ms-transform: rotate3d(1, 1, 1, 360deg); } }
@-moz-keyframes spin3D {
  0% {
    -moz-transform: rotate3d(0, 0, 0, 360deg); }
  100% {
    -moz-transform: rotate3d(1, 1, 1, 360deg); } }
@-o-keyframes spin3D {
  0% {
    -o-transform: rotate3d(0, 0, 0, 360deg); }
  100% {
    -o-transform: rotate3d(1, 1, 1, 360deg); } }
@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg); } }
@-ms-keyframes spin {
  0% {
    -ms-transform: rotate(0deg); }
  100% {
    -ms-transform: rotate(360deg); } }
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(360deg); } }
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg); }
  100% {
    -o-transform: rotate(360deg); } }
@-webkit-keyframes arrow {
  0% {
    top: 0px;
    opacity: 0; }
  50% {
    top: 20px;
    opacity: 1; }
  100% {
    top: 40px;
    opacity: 0; } }
@-moz-keyframes arrow {
  0% {
    top: 0px;
    opacity: 0; }
  50% {
    top: 20px;
    opacity: 1; }
  100% {
    top: 40px;
    opacity: 0; } }
@-ms-keyframes arrow {
  0% {
    top: 0px;
    opacity: 0; }
  50% {
    top: 20px;
    opacity: 1; }
  100% {
    top: 40px;
    opacity: 0; } }
@-o-keyframes arrow {
  0% {
    top: 0px;
    opacity: 0; }
  50% {
    top: 20px;
    opacity: 1; }
  100% {
    top: 40px;
    opacity: 0; } }
@keyframes arrow {
  0% {
    top: 0px;
    opacity: 0; }
  50% {
    top: 20px;
    opacity: 1; }
  100% {
    top: 40px;
    opacity: 0; } }
@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-moz-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-ms-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-o-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
html, body {
  width: 100%;
  height: 100%;
  background: #fff;
  font-family: "Arial", "helvetica-regular"; }

.clearfix {
  display: block;
  float: none;
  clear: both;
  /*height: 0px;*/ }

.responsiveContainer {
  width: auto;
  height: 100%;
  max-width: 954px;
  position: relative;
  margin: 0 auto;
  padding: 0 30px; }

.col2 {
  width: 49%;
  width: calc(50% - 20px);
  display: block;
  float: left;
  position: relative;
  margin-left: 1%;
  margin-left: calc(20px); }
  .col2:first-of-type {
    margin-left: 0;
    margin-right: 1%;
    margin-right: calc(20px); }
  @media only screen and (max-width: 767px) {
    .col2 {
      width: auto;
      margin: 0;
      float: none;
      clear: left; } }

.col23 {
  width: 64%;
  width: calc(65% - 20px);
  display: block;
  float: left;
  position: relative;
  margin-left: 1%;
  margin-left: calc(20px); }
  .col23:first-of-type {
    margin-left: 0;
    margin-right: 1%;
    margin-right: calc(20px); }
  @media only screen and (max-width: 767px) {
    .col23 {
      width: auto;
      margin: 0;
      float: none;
      clear: left; }
      .col23:first-of-type {
        margin: 0; } }

.col13 {
  width: 34%;
  width: calc(35% - 20px);
  display: block;
  float: left;
  position: relative;
  margin-left: 1%;
  margin-left: calc(20px); }
  .col13:first-of-type {
    margin-left: 0;
    margin-right: 1%;
    margin-right: calc(20px); }
  @media only screen and (max-width: 767px) {
    .col13 {
      width: auto;
      margin: 0;
      float: none;
      clear: left; }
      .col13:first-of-type {
        width: auto;
        margin: 0;
        float: none;
        clear: left; } }

p, li, td {
  font-family: "helvetica-light";
  font-size: 20px;
  line-height: 30px;
  margin: 10px 0px;
  color: #7A8082; }
  @media only screen and (max-width: 767px) {
    p, li, td {
      font-size: 14px;
      line-height: 20px; } }
  p.center, li.center, td.center {
    text-align: center;
    padding: 0 10%; }
  p strong, li strong, td strong {
    font-family: "helvetica-heavy"; }
  p a, li a, td a {
    font-family: "helvetica-heavy";
    text-decoration: none;
    color: #b83f28; }
    p a:hover, li a:hover, td a:hover {
      color: #115974; }

ul li {
  list-style: disc;
  margin-left: 15px; }

ol li {
  list-style: decimal;
  margin-left: 15px; }

a {
  cursor: pointer; }

#loading {
  background: #fff;
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 999;
  top: 0px;
  /*#loadingGif {
  	text-align: center;
  	width: 250px;
  	height: 300px;
  	top: 25px;
  	top: calc(50vh - 150px);
  	margin: 0 auto;
  	background-image: url('../images/logos/logoC1.png');
  	background-size: contain;
  	background-position: 50% 0%;
  	background-repeat: no-repeat;
  	position: relative;
  	@include animateSpinZ(1s, linear, 0s, infinite);
  	@include retina {
  		background-image: url('../images/logos/logoC1.svg');
  	}
  	@include tablet {
  		background-image: url('../images/logos/logoC1.svg');
  	}
  	@include mobile {
  		width: 125px;
  		height: 200px;
  		top: calc(50vh - 100px);
  	}
  	p {
  		@include sans;
  		font-size: 14px;
  		line-height: 18px;
  		letter-spacing: 3px;
  		text-align: center;
  		color: $color2;
  		display: block;
  		position: absolute;
  		width: 100%;
  		bottom: 0px;
  	}
  }*/ }
  #loading #loadingGif {
    text-align: center;
    width: 250px;
    height: 300px;
    top: 25px;
    top: calc(50vh - 150px);
    margin: 0 auto;
    position: relative; }
    @media only screen and (max-width: 767px) {
      #loading #loadingGif {
        width: 125px;
        height: 200px;
        top: calc(50vh - 100px); } }
    #loading #loadingGif #spinner {
      width: 250px;
      height: 250px;
      position: relative;
      top: 0;
      left: 0;
      /*@include animateFadeOut(1s, linear, 4s, 1);*/ }
      @media only screen and (max-width: 767px) {
        #loading #loadingGif #spinner {
          width: 125px;
          height: 125px; } }
      #loading #loadingGif #spinner .c {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0; }
        #loading #loadingGif #spinner .c img {
          width: 100%;
          width: 100%; }
        @media only screen and (max-width: 767px) {
          #loading #loadingGif #spinner .c {
            width: 125px;
            height: 125px; }
            #loading #loadingGif #spinner .c img {
              width: 100%;
              width: 100%; } }
        @media only screen and (min-width: 1025px) {
          #loading #loadingGif #spinner .c {
            /*@include animateFadeOut(1s, linear, 4s, 1);*/ }
            #loading #loadingGif #spinner .c:nth-child(1) {
              -webkit-animation: spin3D 1s linear 0s infinite normal;
              -moz-animation: spin3D 1s linear 0s infinite normal;
              -ms-animation: spin3D 1s linear 0s infinite normal;
              -o-animation: spin3D 1s linear 0s infinite normal;
              animation: spin3D 1s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(2) {
              -webkit-animation: spin3D 1.2s linear 0s infinite normal;
              -moz-animation: spin3D 1.2s linear 0s infinite normal;
              -ms-animation: spin3D 1.2s linear 0s infinite normal;
              -o-animation: spin3D 1.2s linear 0s infinite normal;
              animation: spin3D 1.2s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(3) {
              -webkit-animation: spin3D 1.4s linear 0s infinite normal;
              -moz-animation: spin3D 1.4s linear 0s infinite normal;
              -ms-animation: spin3D 1.4s linear 0s infinite normal;
              -o-animation: spin3D 1.4s linear 0s infinite normal;
              animation: spin3D 1.4s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(4) {
              -webkit-animation: spin3D 1.6s linear 0s infinite normal;
              -moz-animation: spin3D 1.6s linear 0s infinite normal;
              -ms-animation: spin3D 1.6s linear 0s infinite normal;
              -o-animation: spin3D 1.6s linear 0s infinite normal;
              animation: spin3D 1.6s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(5) {
              -webkit-animation: spin3D 1.8s linear 0s infinite normal;
              -moz-animation: spin3D 1.8s linear 0s infinite normal;
              -ms-animation: spin3D 1.8s linear 0s infinite normal;
              -o-animation: spin3D 1.8s linear 0s infinite normal;
              animation: spin3D 1.8s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(6) {
              -webkit-animation: spin3D 2s linear 0s infinite normal;
              -moz-animation: spin3D 2s linear 0s infinite normal;
              -ms-animation: spin3D 2s linear 0s infinite normal;
              -o-animation: spin3D 2s linear 0s infinite normal;
              animation: spin3D 2s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; } }
        @media only screen and (max-width: 1024px) {
          #loading #loadingGif #spinner .c {
            /*@include animateFadeOut(1s, linear, 4s, 1);*/ }
            #loading #loadingGif #spinner .c:nth-child(1) {
              -webkit-animation: spin 1s linear 0s infinite normal;
              -moz-animation: spin 1s linear 0s infinite normal;
              -ms-animation: spin 1s linear 0s infinite normal;
              -o-animation: spin 1s linear 0s infinite normal;
              animation: spin 1s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(2) {
              -webkit-animation: spin 1.2s linear 0s infinite normal;
              -moz-animation: spin 1.2s linear 0s infinite normal;
              -ms-animation: spin 1.2s linear 0s infinite normal;
              -o-animation: spin 1.2s linear 0s infinite normal;
              animation: spin 1.2s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(3) {
              -webkit-animation: spin 1.4s linear 0s infinite normal;
              -moz-animation: spin 1.4s linear 0s infinite normal;
              -ms-animation: spin 1.4s linear 0s infinite normal;
              -o-animation: spin 1.4s linear 0s infinite normal;
              animation: spin 1.4s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(4) {
              -webkit-animation: spin 1.6s linear 0s infinite normal;
              -moz-animation: spin 1.6s linear 0s infinite normal;
              -ms-animation: spin 1.6s linear 0s infinite normal;
              -o-animation: spin 1.6s linear 0s infinite normal;
              animation: spin 1.6s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(5) {
              -webkit-animation: spin 1.8s linear 0s infinite normal;
              -moz-animation: spin 1.8s linear 0s infinite normal;
              -ms-animation: spin 1.8s linear 0s infinite normal;
              -o-animation: spin 1.8s linear 0s infinite normal;
              animation: spin 1.8s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; }
            #loading #loadingGif #spinner .c:nth-child(6) {
              -webkit-animation: spin 2s linear 0s infinite normal;
              -moz-animation: spin 2s linear 0s infinite normal;
              -ms-animation: spin 2s linear 0s infinite normal;
              -o-animation: spin 2s linear 0s infinite normal;
              animation: spin 2s linear 0s infinite normal;
              -webkit-animation-play-state: running;
              -moz-animation-play-state: running;
              -ms-animation-play-state: running;
              -o-animation-play-state: running;
              animation-play-state: running; } }
    #loading #loadingGif p {
      font-family: "Arial", "helvetica-regular";
      font-size: 14px;
      line-height: 18px;
      letter-spacing: 3px;
      text-align: center;
      color: #b84028;
      display: block;
      position: absolute;
      width: 100%;
      bottom: 0px; }

.topbar {
  width: 100%;
  height: 0px;
  position: fixed;
  top: 0; }
  .topbar #menuLabel {
    font-family: "Arial", "helvetica-regular";
    font-size: 14px;
    line-height: 14px;
    color: #fff;
    position: absolute;
    right: 90px;
    top: 55px;
    text-shadow: 2px 2px 4px #000000;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    opacity: 1; }
    .topbar #menuLabel.hidden {
      opacity: 0; }
    @media only screen and (max-width: 767px) {
      .topbar #menuLabel {
        right: 70px;
        top: 35px; } }
  .topbar #nav {
    width: 40px;
    height: 40px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    border-radius: 20px;
    background-image: url("../images/bg/transluscent-black.png");
    position: absolute;
    right: 40px;
    top: 40px;
    border: solid 1px #666;
    border: solid 1px rgba(255, 255, 255, 0.5);
    overflow: hidden;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out; }
    @media only screen and (max-width: 767px) {
      .topbar #nav {
        right: 20px;
        top: 20px; } }
    .topbar #nav:hover {
      border: solid 1px #fff; }
    .topbar #nav.open {
      width: 170px;
      height: 210px;
      top: 30px;
      right: 30px; }
      @media only screen and (max-width: 767px) {
        .topbar #nav.open {
          top: 10px;
          right: 10px; } }
      .topbar #nav.open .line {
        right: 20px; }
        .topbar #nav.open .line.teal {
          top: 55px;
          opacity: 1; }
        .topbar #nav.open .line.lightBlue {
          top: 85px; }
        .topbar #nav.open .line.beige {
          top: 115px; }
        .topbar #nav.open .line.gold {
          top: 145px;
          opacity: 1; }
        .topbar #nav.open .line.red {
          top: 175px; }
      .topbar #nav.open #btnNav {
        top: 10px;
        right: 10px; }
        .topbar #nav.open #btnNav .x {
          opacity: 1;
          transform: rotate(90deg); }
      .topbar #nav.open #mainNav a {
        opacity: 1; }
      .topbar #nav.open #mainNav #btn1 {
        top: 48px; }
      .topbar #nav.open #mainNav #btn2 {
        top: 78px; }
      .topbar #nav.open #mainNav #btn3 {
        top: 108px; }
      .topbar #nav.open #mainNav #btn4 {
        top: 138px; }
      .topbar #nav.open #mainNav #btn5 {
        top: 168px; }
    .topbar #nav .line {
      width: 20px;
      height: 1px;
      position: absolute;
      right: 10px;
      -webkit-transition: all 0.7s ease-out;
      -moz-transition: all 0.7s ease-out;
      -o-transition: all 0.7s ease-out;
      transition: all 0.7s ease-out; }
      .topbar #nav .line.teal {
        background: #115974;
        top: 15px;
        opacity: 0; }
      .topbar #nav .line.lightBlue {
        background: #77cdd7;
        top: 15px; }
      .topbar #nav .line.beige {
        background: #dccdc0;
        top: 20px; }
      .topbar #nav .line.gold {
        background: #a38a53;
        top: 25px;
        opacity: 0; }
      .topbar #nav .line.red {
        background: #b83f28;
        top: 25px; }
    .topbar #nav #btnNav {
      width: 40px;
      height: 40px;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
      -ms-border-radius: 20px;
      border-radius: 20px;
      position: absolute;
      right: 0px;
      top: 0px;
      -webkit-transition: all .2s ease-out;
      -moz-transition: all .2s ease-out;
      -o-transition: all .2s ease-out;
      transition: all .2s ease-out; }
      .topbar #nav #btnNav .x {
        width: 15px;
        height: 15px;
        left: 13px;
        top: 13px;
        position: absolute;
        opacity: 0;
        -webkit-transition: all .2s ease-out;
        -moz-transition: all .2s ease-out;
        -o-transition: all .2s ease-out;
        transition: all .2s ease-out; }
    .topbar #nav #mainNav {
      position: absolute;
      top: 0;
      right: 40px; }
      .topbar #nav #mainNav a {
        font-family: "Arial", "helvetica-regular";
        font-size: 14px;
        line-height: 20px;
        text-align: right;
        text-decoration: none;
        white-space: nowrap;
        color: #999;
        color: rgba(255, 255, 255, 0.5);
        position: absolute;
        display: block;
        top: 0;
        right: 20px;
        opacity: 0;
        -webkit-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        transition: all 0.7s ease-out; }
        .topbar #nav #mainNav a:hover {
          color: #fff; }

.section {
  position: relative;
  overflow: hidden; }
  .section.reveal {
    max-height: 0;
    position: relative;
    overflow: hidden;
    padding: 0;
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out; }
    .section.reveal.services {
      background: #D9DEE3; }
    .section.reveal .responsiveContainer {
      padding: 50px 30px; }
  .section#secServicesReveal {
    background: #D9DEE3; }
    .section#secServicesReveal.open {
      max-height: 210px; }
      @media only screen and (max-width: 767px) {
        .section#secServicesReveal.open {
          max-height: initial; } }
  .section#secClientsReveal {
    background: #fff; }
    .section#secClientsReveal.open {
      max-height: 1830px; }
      @media only screen and (max-width: 1024px) {
        .section#secClientsReveal.open {
          max-height: 2400px; } }
      @media only screen and (max-width: 767px) {
        .section#secClientsReveal.open {
          max-height: initial; } }
    .section#secClientsReveal #clientsFilters {
      text-align: center; }
      .section#secClientsReveal #clientsFilters .legend {
        margin-top: 5px; }
      .section#secClientsReveal #clientsFilters a {
        font-family: "helvetica-light";
        font-size: 16px;
        line-height: 30px;
        text-decoration: none;
        color: #ccc;
        display: inline-block;
        margin: 0 20px; }
        @media only screen and (max-width: 767px) {
          .section#secClientsReveal #clientsFilters a {
            font-size: 14px;
            line-height: 20px;
            margin: 0 7px; } }
        .section#secClientsReveal #clientsFilters a:hover {
          color: #b83f28; }
        .section#secClientsReveal #clientsFilters a.active {
          color: #7A8082;
          border-bottom: solid 1px #7A8082; }
    .section#secClientsReveal #clientsList {
      text-align: center;
      margin: 50px 0; }
      .section#secClientsReveal #clientsList img {
        width: 5%;
        height: 5%;
        margin: 1% 3.05%;
        display: inline;
        float: none;
        opacity: 1;
        -webkit-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        transition: all 0.7s ease-out;
        -webkit-transform: rotate3d(0, 0, 0, 80deg);
        /* Safari */
        transform: rotate3d(0, 0, 0, 80deg); }
        @media only screen and (max-width: 767px) {
          .section#secClientsReveal #clientsList img {
            width: 10%;
            height: 10%;
            margin: 1% 5%; } }
        .section#secClientsReveal #clientsList img.initial {
          opacity: 0;
          -webkit-transform: rotate3d(1, 0, 0, 90deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 90deg); }
        .section#secClientsReveal #clientsList img.hidden1 {
          opacity: 0.1;
          -webkit-transform: rotate3d(0, 1, 0, 80deg);
          /* Safari */
          transform: rotate3d(0, 1, 0, 80deg); }
        .section#secClientsReveal #clientsList img.hidden2 {
          opacity: 0.1;
          -webkit-transform: rotate3d(1, 0, 0, 80deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 80deg); }
        .section#secClientsReveal #clientsList img:nth-child(even).initial {
          opacity: 0;
          -webkit-transform: rotate3d(1, 0, 0, 90deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 90deg); }
        .section#secClientsReveal #clientsList img:nth-child(even).hidden1 {
          opacity: 0.1;
          -webkit-transform: rotate3d(1, 0, 0, 80deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 80deg); }
        .section#secClientsReveal #clientsList img:nth-child(even).hidden2 {
          opacity: 0.1;
          -webkit-transform: rotate3d(0, 1, 0, 80deg);
          /* Safari */
          transform: rotate3d(0, 1, 0, 80deg); }
    .section#secClientsReveal #awards p, .section#secClientsReveal #awards li, .section#secClientsReveal #awards td {
      font-size: 14px;
      line-height: 16px; }
      @media only screen and (max-width: 767px) {
        .section#secClientsReveal #awards p, .section#secClientsReveal #awards li, .section#secClientsReveal #awards td {
          font-size: 12px;
          line-height: 14px; } }
    .section#secClientsReveal #media {
      font-family: "helvetica-light";
      font-size: 14px;
      line-height: 16px; }
      @media only screen and (max-width: 767px) {
        .section#secClientsReveal #media {
          font-size: 12px;
          line-height: 14px; } }
      .section#secClientsReveal #media a {
        display: block;
        font-family: "helvetica-heavy";
        text-decoration: none;
        margin-top: 20px;
        color: #a38a53; }
        .section#secClientsReveal #media a:hover {
          color: #b83f28; }
  .section .responsiveContainer h1 {
    font-family: "helvetica-light";
    font-size: 60px;
    line-height: 60px;
    color: #7A8082;
    margin: 50px 0;
    position: relative;
    padding-top: 50px;
    top: 250px;
    opacity: 0;
    -webkit-transform: rotateX(90deg);
    /* Safari */
    transform: rotateX(90deg);
    -webkit-transform-origin: 20% 20%;
    transform-origin: 20% 20%;
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out; }
    .section .responsiveContainer h1.active {
      top: 0px;
      opacity: 1;
      -webkit-transform: rotateX(0deg);
      /* Safari */
      transform: rotateX(0deg); }
    @media only screen and (max-width: 767px) {
      .section .responsiveContainer h1 {
        font-size: 40px;
        line-height: 40px;
        margin: 50px 0;
        padding-top: 20px; } }
    .section .responsiveContainer h1.right {
      text-align: right;
      color: #fff; }
    .section .responsiveContainer h1 .line {
      width: 100px;
      height: 1px;
      position: absolute;
      top: 0;
      left: 0; }
      .section .responsiveContainer h1 .line.teal {
        background: #115974; }
      .section .responsiveContainer h1 .line.lightBlue {
        background: #77cdd7; }
      .section .responsiveContainer h1 .line.beige {
        background: #dccdc0;
        right: 0;
        left: auto; }
      .section .responsiveContainer h1 .line.gold {
        background: #a38a53; }
      .section .responsiveContainer h1 .line.red {
        background: #b83f28; }
  .section .responsiveContainer h3 {
    font-family: "helvetica-heavy";
    font-size: 16px;
    line-height: 16px;
    margin: 20px 0 0 0;
    color: #262961; }
  .section .responsiveContainer .btnRounded {
    display: inline-block;
    font-family: "Arial", "helvetica-regular";
    font-size: 16px;
    line-height: 50px;
    color: #7A8082;
    border: solid 1px #7A8082;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    border-radius: 25px;
    padding: 0 50px;
    margin: 50px 0; }
    @media only screen and (max-width: 767px) {
      .section .responsiveContainer .btnRounded {
        margin: 20px 0; } }
    .section .responsiveContainer .btnRounded:hover {
      color: #b83f28;
      border: solid 1px #b83f28; }
  .section .responsiveContainer .btnSquare {
    width: 180px;
    float: left;
    display: block;
    position: relative;
    margin: 0 20px 0 0;
    text-align: center;
    text-decoration: none;
    border: solid 1px #7A8082;
    /*@include tablet {
    	margin: 0 0 20px 0;
    }*/ }
    .section .responsiveContainer .btnSquare.mail picture {
      width: 39px; }
    .section .responsiveContainer .btnSquare.phone picture {
      width: 35px; }
    @media only screen and (max-width: 767px) {
      .section .responsiveContainer .btnSquare {
        width: 45%;
        width: calc(46% - 2px);
        margin: 0 0 0 4%; }
        .section .responsiveContainer .btnSquare:first-of-type {
          margin: 0 4% 0 0; } }
    .section .responsiveContainer .btnSquare:hover {
      border: solid 1px #b83f28; }
      .section .responsiveContainer .btnSquare:hover p {
        color: #b83f28; }
    .section .responsiveContainer .btnSquare picture {
      display: inline-block;
      margin: 20px auto 10px auto;
      position: relative;
      height: 35px; }
    .section .responsiveContainer .btnSquare p {
      font-family: "Arial", "helvetica-regular";
      font-size: 16px;
      line-height: 16px;
      color: #7A8082;
      margin: 10px auto 20px auto; }
      @media only screen and (max-width: 767px) {
        .section .responsiveContainer .btnSquare p {
          font-size: 12px;
          line-height: 12px; } }
  .section .responsiveContainer .contentContainer {
    top: 100px;
    opacity: 0;
    -webkit-transform: rotateY(90deg);
    /* Safari */
    transform: rotateY(90deg);
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out; }
    .section .responsiveContainer .contentContainer.active {
      top: 0px;
      opacity: 1;
      -webkit-transform: rotateY(0deg);
      /* Safari */
      transform: rotateY(0deg); }
    .section .responsiveContainer .contentContainer.left {
      position: relative;
      width: 50%;
      display: block;
      -webkit-transform-origin: 20% 20%;
      transform-origin: 20% 20%; }
      @media only screen and (max-width: 767px) {
        .section .responsiveContainer .contentContainer.left {
          width: auto; } }
    .section .responsiveContainer .contentContainer.right {
      position: relative;
      width: auto;
      padding: 0 0 0 50%;
      display: block;
      text-align: right;
      -webkit-transform-origin: 80% 20%;
      transform-origin: 80% 20%; }
      @media only screen and (max-width: 767px) {
        .section .responsiveContainer .contentContainer.right {
          padding: 0; } }
      .section .responsiveContainer .contentContainer.right p, .section .responsiveContainer .contentContainer.right li, .section .responsiveContainer .contentContainer.right td {
        color: #fff; }
      .section .responsiveContainer .contentContainer.right .btnRounded:hover {
        border: solid 1px #fff;
        color: #fff; }
    .section .responsiveContainer .contentContainer.fullWidth {
      position: relative;
      width: auto;
      display: block; }
  .section .videoContainer {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden; }
    .section .videoContainer video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: 50% 50%;
      position: absolute;
      top: 0;
      left: 0;
      /*@include tablet {
      	display: none;
      }*/ }
  .section .iconBullet {
    font-family: "helvetica-light";
    font-size: 20px;
    line-height: 30px;
    color: #7A8082;
    padding-left: 50px;
    background-position: 0% 50%;
    background-repeat: no-repeat;
    margin: 25px 0;
    position: relative; }
    .section .iconBullet.site {
      background-image: url("../images/icons/iconSite.png"); }
      @media only screen and (min-resolution: 180dpi) {
        .section .iconBullet.site {
          background-image: url("../images/icons/iconSite.svg"); } }
      @media only screen and (max-width: 1024px) {
        .section .iconBullet.site {
          background-image: url("../images/icons/iconSite.svg"); } }
    .section .iconBullet.apps {
      background-image: url("../images/icons/iconApps.png"); }
      @media only screen and (min-resolution: 180dpi) {
        .section .iconBullet.apps {
          background-image: url("../images/icons/iconApps.svg"); } }
      @media only screen and (max-width: 1024px) {
        .section .iconBullet.apps {
          background-image: url("../images/icons/iconApps.svg"); } }
    .section .iconBullet.touch {
      background-image: url("../images/icons/iconTouch.png"); }
      @media only screen and (min-resolution: 180dpi) {
        .section .iconBullet.touch {
          background-image: url("../images/icons/iconTouch.svg"); } }
      @media only screen and (max-width: 1024px) {
        .section .iconBullet.touch {
          background-image: url("../images/icons/iconTouch.svg"); } }
  .section.home {
    min-height: 100%;
    min-height: 100vh;
    background-image: url("../images/bg/staticbg.jpg");
    background-size: cover;
    background-position: 50% 50%;
    padding: 0; }
    @media only screen and (max-width: 1024px) {
      .section.home {
        min-height: 90vh; } }
    @media only screen and (max-width: 767px) {
      .section.home {
        min-height: 40vh; } }
    @media only screen and (max-width: 767px) and (orientation: landscape) {
      .section.home {
        min-height: 100vh; } }
    .section.home .bgHome {
      width: 100%;
      height: 100%;
      background-image: url("../images/bg/staticbg.jpg");
      background-size: cover;
      background-position: 50% 50%;
      position: absolute;
      left: 0;
      top: 0;
      display: none; }
      @media only screen and (max-width: 1024px) {
        .section.home .bgHome {
          display: block; } }
    .section.home #logoHome {
      width: 208px;
      height: 40px;
      position: absolute;
      top: 40px;
      left: 40px; }
      @media only screen and (max-width: 1024px) {
        .section.home #logoHome {
          top: auto;
          left: auto;
          position: relative;
          display: none;
          margin: 0 auto;
          top: 30vh; } }
    .section.home #scrollIcon {
      width: 100%;
      height: 50px;
      background-image: url("../images/icons/scrollbg.png");
      background-size: 100px 50px;
      background-position: 50% 0%;
      background-repeat: no-repeat;
      position: absolute;
      bottom: 0;
      left: 0; }
      @media only screen and (min-resolution: 180dpi) {
        .section.home #scrollIcon {
          background-image: url("../images/icons/scrollbg-2x.png"); } }
      @media only screen and (max-width: 1024px) {
        .section.home #scrollIcon {
          background-image: url("../images/icons/scrollbg-2x.png"); } }
      .section.home #scrollIcon #scrollArrow {
        width: 14px;
        height: 10px;
        position: relative;
        display: block;
        margin: 0 auto;
        top: 0;
        -webkit-animation: arrow 1s linear 0s infinite normal;
        -moz-animation: arrow 1s linear 0s infinite normal;
        -ms-animation: arrow 1s linear 0s infinite normal;
        -o-animation: arrow 1s linear 0s infinite normal;
        animation: arrow 1s linear 0s infinite normal;
        -webkit-animation-play-state: running;
        -moz-animation-play-state: running;
        -ms-animation-play-state: running;
        -o-animation-play-state: running;
        animation-play-state: running; }
        .section.home #scrollIcon #scrollArrow img {
          width: 14px;
          height: 10px; }
  .section.services {
    min-height: 800px;
    background-image: url("../images/bg/bgServices.jpg");
    background-size: cover;
    background-position: 50% 0%; }
    @media only screen and (max-width: 767px) {
      .section.services {
        min-height: auto;
        background: #eaeef1;
        background-image: none; } }
    .section.services #bgServices {
      display: none; }
      @media only screen and (max-width: 767px) {
        .section.services #bgServices {
          display: block;
          width: 100%;
          height: 250px; } }
  .section.clients {
    min-height: 800px; }
    @media only screen and (max-width: 767px) {
      .section.clients {
        min-height: auto; } }
    .section.clients .section {
      background: #77cdd7; }
      .section.clients .section h1 {
        color: #fff; }
    .section.clients #clientsFilters {
      text-align: center;
      margin-top: 50px; }
      .section.clients #clientsFilters span {
        font-family: "Arial", "helvetica-regular";
        color: #999;
        margin: 0px 20px;
        display: inline-block; }
        @media only screen and (max-width: 767px) {
          .section.clients #clientsFilters span {
            margin: 0px 5px; } }
        .section.clients #clientsFilters span img {
          width: 20px;
          height: 20px;
          top: 5px;
          position: relative; }
          @media only screen and (max-width: 767px) {
            .section.clients #clientsFilters span img {
              width: 14px;
              height: 14px; } }
      .section.clients #clientsFilters a {
        font-family: "helvetica-light";
        font-size: 16px;
        line-height: 30px;
        text-decoration: none;
        color: #ccc;
        display: inline-block;
        margin: 0 20px; }
        @media only screen and (max-width: 767px) {
          .section.clients #clientsFilters a {
            font-size: 13px;
            line-height: 20px;
            margin: 0 5px; } }
        .section.clients #clientsFilters a:hover {
          color: #b83f28; }
        .section.clients #clientsFilters a.active {
          color: #7A8082;
          border-bottom: solid 1px #7A8082; }
    .section.clients #clientsList {
      text-align: center;
      margin: 50px 0; }
      .section.clients #clientsList img {
        width: 5%;
        height: 5%;
        margin: 1% 3.05%;
        display: block;
        float: left;
        opacity: 1;
        -webkit-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        transition: all 0.7s ease-out;
        -webkit-transform: rotate3d(0, 0, 0, 80deg);
        /* Safari */
        transform: rotate3d(0, 0, 0, 80deg); }
        @media only screen and (max-width: 767px) {
          .section.clients #clientsList img {
            width: 10%;
            height: 10%;
            margin: 1% 5%; } }
        .section.clients #clientsList img.initial {
          /*opacity: 0;*/
          -webkit-transform: rotate3d(1, 0, 0, 90deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 90deg); }
        .section.clients #clientsList img.hidden1 {
          opacity: 0.1;
          -webkit-transform: rotate3d(1, 0, 0, 80deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 80deg);
          /*width: 0;
          height: 0;
          margin: 0;*/ }
        .section.clients #clientsList img.hidden2 {
          opacity: 0.1;
          -webkit-transform: rotate3d(1, 0, 0, 80deg);
          /* Safari */
          transform: rotate3d(0, 1, 0, 80deg);
          /*width: 0;
          height: 0;
          margin: 0;*/ }
        .section.clients #clientsList img:nth-child(even).initial {
          /*opacity: 0;*/
          -webkit-transform: rotate3d(0, 1, 0, 90deg);
          /* Safari */
          transform: rotate3d(0, 1, 0, 90deg); }
        .section.clients #clientsList img:nth-child(even).hidden1 {
          opacity: 0.1;
          -webkit-transform: rotate3d(1, 0, 0, 80deg);
          /* Safari */
          transform: rotate3d(0, 1, 0, 80deg);
          /*width: 0;
          height: 0;
          margin: 0;*/ }
        .section.clients #clientsList img:nth-child(even).hidden2 {
          opacity: 0.1;
          -webkit-transform: rotate3d(1, 0, 0, 80deg);
          /* Safari */
          transform: rotate3d(1, 0, 0, 80deg);
          /*width: 0;
          height: 0;
          margin: 0;*/ }
  .section.awards {
    min-height: 500px; }
    @media only screen and (max-width: 767px) {
      .section.awards {
        min-height: auto; } }
    .section.awards .section {
      min-height: 500px;
      background-image: url("../images/bg/bgClients.jpg");
      background-size: cover;
      background-position: 50% 50%; }
      @media only screen and (max-width: 767px) {
        .section.awards .section {
          min-height: auto; } }
    .section.awards .awardsList {
      padding: 50px; }
      @media only screen and (max-width: 767px) {
        .section.awards .awardsList {
          padding: 30px; } }
      .section.awards .awardsList #awards p, .section.awards .awardsList #awards li, .section.awards .awardsList #awards td {
        font-size: 14px;
        line-height: 16px; }
        @media only screen and (max-width: 767px) {
          .section.awards .awardsList #awards p, .section.awards .awardsList #awards li, .section.awards .awardsList #awards td {
            font-size: 12px;
            line-height: 14px; } }
      .section.awards .awardsList #socialMedia {
        margin-bottom: 20px; }
        @media only screen and (max-width: 767px) {
          .section.awards .awardsList #socialMedia {
            margin: 20px 0; } }
        .section.awards .awardsList #socialMedia table {
          width: 100%; }
          @media only screen and (max-width: 767px) {
            .section.awards .awardsList #socialMedia table {
              width: auto;
              margin: 0 auto; } }
          .section.awards .awardsList #socialMedia table tr td {
            width: 30px;
            text-align: center;
            line-height: 10px; }
            .section.awards .awardsList #socialMedia table tr td:first-of-type {
              width: auto;
              text-align: right;
              white-space: nowrap;
              padding-right: 10px; }
            .section.awards .awardsList #socialMedia table tr td a {
              margin: 0; }
              .section.awards .awardsList #socialMedia table tr td a img {
                height: 20px; }
      .section.awards .awardsList #media {
        font-family: "helvetica-light";
        font-size: 14px;
        line-height: 16px; }
        @media only screen and (max-width: 767px) {
          .section.awards .awardsList #media {
            font-size: 12px;
            line-height: 14px; } }
        @media only screen and (max-width: 767px) {
          .section.awards .awardsList #media #twitterFeed {
            display: none; } }
        .section.awards .awardsList #media a {
          display: block;
          font-family: "helvetica-heavy";
          text-decoration: none;
          margin-top: 20px;
          color: #a38a53; }
          .section.awards .awardsList #media a:hover {
            color: #b83f28; }
  .section.management .section {
    background: #77cdd7; }
    .section.management .section h1 {
      color: #fff; }
  .section.contact {
    background-image: url("../images/bg/bgMap.png");
    background-size: cover;
    background-position: 50% 50%;
    min-height: 600px; }
    @media only screen and (max-width: 1024px) {
      .section.contact {
        background-position: 75% 50%; } }
    @media only screen and (max-width: 767px) {
      .section.contact {
        background: #f1f5f6;
        background-image: none;
        min-height: auto; } }
    .section.contact #bgMap {
      display: none; }
      @media only screen and (max-width: 767px) {
        .section.contact #bgMap {
          display: block;
          width: 100%; } }
    .section.contact .contentContainer {
      min-width: 410px; }
      @media only screen and (max-width: 767px) {
        .section.contact .contentContainer {
          min-width: initial; } }
  .section.footer {
    height: 200px;
    background-image: url("../images/bg/bgFooter.png");
    background-size: 2500px 200px;
    background-position: 50% 50%;
    padding: 0; }
@incude retina {
  .section.footer {
    background-image: url("../images/bg/bgFooter.svg"); } }
@incude tablet {
  .section.footer {
    background-image: url("../images/bg/bgFooter.svg"); } }
    .section.footer .social {
      margin-top: 100px;
      height: 25px;
      text-align: right; }
      .section.footer .social a {
        width: 25px;
        height: 25px;
        display: inline-block;
        margin-left: 10px;
        float: left;
        background-size: 25px 50px;
        background-position: 0% 0%;
        text-indent: -9999px;
        text-decoration: none;
        font-size: 0;
        float: right; }
        .section.footer .social a:hover {
          background-position: 0% 100%; }
        .section.footer .social a.facebook {
          background-image: url("../images/icons/iconFacebook.png"); }
          @media only screen and (min-resolution: 180dpi) {
            .section.footer .social a.facebook {
              background-image: url("../images/icons/iconFacebook.svg"); } }
          @media only screen and (max-width: 1024px) {
            .section.footer .social a.facebook {
              background-image: url("../images/icons/iconFacebook.svg"); } }
        .section.footer .social a.twitter {
          background-image: url("../images/icons/iconTwitter.png"); }
          @media only screen and (min-resolution: 180dpi) {
            .section.footer .social a.twitter {
              background-image: url("../images/icons/iconTwitter.svg"); } }
          @media only screen and (max-width: 1024px) {
            .section.footer .social a.twitter {
              background-image: url("../images/icons/iconTwitter.svg"); } }
        .section.footer .social a.linkedin {
          background-image: url("../images/icons/iconLinkedin.png"); }
          @media only screen and (min-resolution: 180dpi) {
            .section.footer .social a.linkedin {
              background-image: url("../images/icons/iconLinkedin.svg"); } }
          @media only screen and (max-width: 1024px) {
            .section.footer .social a.linkedin {
              background-image: url("../images/icons/iconLinkedin.svg"); } }
    .section.footer .legal {
      clear: both;
      float: none;
      margin-top: 20px; }
      .section.footer .legal p {
        font-family: "Arial", "helvetica-regular";
        font-size: 12px;
        line-height: 14px;
        text-align: right;
        color: #115974; }
        .section.footer .legal p a {
          text-decoration: none;
          color: #115974; }
          .section.footer .legal p a:hover {
            color: #fff; }

.tabsContainer.horizontal .tabBtns {
  text-align: center; }
  .tabsContainer.horizontal .tabBtns a {
    width: 150px;
    padding: 0px 25px;
    font-family: "Arial", "helvetica-regular";
    font-size: 16px;
    line-height: 40px;
    color: #ccc;
    background: none;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    float: none;
    margin: 10px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    border-radius: 20px;
    border: solid 1px #ccc; }
    .tabsContainer.horizontal .tabBtns a:hover {
      color: #7A8082;
      background: none;
      border: solid 1px #7A8082; }
    .tabsContainer.horizontal .tabBtns a.active {
      color: #262961;
      background: none;
      border: solid 1px #262961; }
@media only screen and (max-width: 767px) {
  .tabsContainer.horizontal .tabs .tab {
    width: 100%;
    padding: 20px 0px; } }
.tabsContainer.horizontal .tabs .tab h3 {
  font-family: "helvetica-heavy";
  font-size: 16px;
  line-height: 16px;
  margin: 20px 0 0 0;
  color: #262961; }

.panels {
  width: 100%;
  float: none;
  clear: left;
  display: block;
  position: relative; }
  .panels .panel {
    width: 9%;
    width: calc(10% - 1px);
    width: 150px;
    height: 600px;
    position: relative;
    display: block;
    float: left;
    background: #000;
    background-size: cover;
    background-position: 67% 30%;
    background-repeat: no-repeat;
    border-left: solid 1px #fff;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out; }
    .panels .panel:hover .blackout {
      background: rgba(255, 255, 255, 0.2); }
    .panels .panel:first-child {
      width: 10%;
      width: 150px;
      border-left: none; }
    .panels .panel.evan {
      background-image: url("../images/team-evan.jpg");
      background-position: 57% 30%; }
    .panels .panel.rick {
      background-image: url("../images/team-rick.jpg");
      background-position: 56% 30%; }
    .panels .panel.david {
      background-image: url("../images/team-david.jpg");
      background-position: 56% 30%; }
    .panels .panel.michael {
      background-image: url("../images/team-michael.jpg");
      background-position: 39% 30%; }
    .panels .panel.active {
      width: 69%;
      width: calc(70% - 1px);
      width: calc(100% - 453px); }
      .panels .panel.active:first-child {
        width: 70%;
        width: calc(100% - 453px);
        border-left: none; }
      .panels .panel.active .blackout {
        /*opacity: 1;*/
        background: rgba(0, 0, 0, 0.7) !important;
        /*@include linear-gradient(to right, rgba(0,0,0,0.7), rgba(0,0,0,0.2));*/ }
      .panels .panel.active .bio {
        padding: 250px 50px 50px 50px;
        opacity: 1;
        /*-webkit-transform: rotateY(0deg); /* Safari */
        /*transform: rotateY(0deg);*/ }
        @media only screen and (max-width: 1024px) {
          .panels .panel.active .bio {
            padding: 140px 30px 30px 30px; } }
    .panels .panel.initial {
      width: 24%;
      width: calc(25% - 1px);
      border-top: solid 1px #fff; }
      .panels .panel.initial:first-child {
        width: 25%;
        border-left: none; }
      @media only screen and (max-width: 767px) {
        .panels .panel.initial {
          width: 100%;
          border-left: none; }
          .panels .panel.initial:first-child {
            width: 100%; } }
    .panels .panel .blackout {
      width: 100%;
      height: 100%;
      /*background-image: url('../images/bg/transluscent-black.png');*/
      background: rgba(0, 0, 0, 0);
      position: absolute;
      top: 0;
      left: 0;
      /*opacity: 0;*/
      -webkit-transition: all 0.7s ease-out;
      -moz-transition: all 0.7s ease-out;
      -o-transition: all 0.7s ease-out;
      transition: all 0.7s ease-out; }
      @media only screen and (max-width: 767px) {
        .panels .panel .blackout {
          background: rgba(0, 0, 0, 0.7);
          background: rgba(0, 0, 0, 0);
          background: -webkit-linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
          background: -o-linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
          background: -moz-linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
          background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)); } }
    .panels .panel .bio {
      width: 400px;
      padding: 250px 50px 50px 250px;
      opacity: 0;
      position: absolute;
      /*-webkit-transform: rotateY(90deg); /* Safari */
      /*transform: rotateY(90deg);*/
      -webkit-transition: all 0.7s ease-out;
      -moz-transition: all 0.7s ease-out;
      -o-transition: all 0.7s ease-out;
      transition: all 0.7s ease-out; }
      @media only screen and (max-width: 1024px) {
        .panels .panel .bio {
          width: 240px;
          padding: 140px 30px 30px 250px; } }
      @media only screen and (max-width: 767px) {
        .panels .panel .bio {
          width: auto;
          padding: 30px;
          bottom: 30px;
          left: 0;
          opacity: 1;
          /*-webkit-transform: rotateY(0deg); /* Safari */
          /*transform: rotateY(0deg);*/ } }
      .panels .panel .bio h2 {
        font-family: "helvetica-light";
        font-size: 46px;
        line-height: 46px;
        margin-bottom: 5px;
        color: #fff; }
      .panels .panel .bio h3 {
        font-family: "helvetica-heavy";
        font-size: 18px;
        line-height: 20px;
        text-transform: uppercase;
        margin-bottom: 20px;
        color: #a38a53; }
      .panels .panel .bio p, .panels .panel .bio td, .panels .panel .bio li {
        font-family: "helvetica-light";
        color: #ccc; }
    .panels .panel .bioContact {
      position: absolute;
      left: 50px;
      bottom: 50px; }
      @media only screen and (max-width: 1024px) {
        .panels .panel .bioContact {
          left: 30px;
          bottom: 30px; } }
      .panels .panel .bioContact a {
        width: 20px;
        height: 20px;
        opacity: 0.5;
        display: block;
        float: left;
        font-size: 0;
        text-indent: -9999px; }
        .panels .panel .bioContact a:hover {
          opacity: 1; }
        .panels .panel .bioContact a:first-child {
          margin-right: 15px; }
        .panels .panel .bioContact a.btnLinkedIn {
          background-image: url("../images/icons/contactLinkedIn.png"); }
          @media only screen and (min-resolution: 180dpi) {
            .panels .panel .bioContact a.btnLinkedIn {
              background-image: url("../images/icons/contactLinkedIn.svg"); } }
          @media only screen and (max-width: 1024px) {
            .panels .panel .bioContact a.btnLinkedIn {
              background-image: url("../images/icons/contactLinkedIn.svg"); } }
        .panels .panel .bioContact a.btnEmail {
          background-image: url("../images/icons/contactEmail.png"); }
          @media only screen and (min-resolution: 180dpi) {
            .panels .panel .bioContact a.btnEmail {
              background-image: url("../images/icons/contactEmail.svg"); } }
          @media only screen and (max-width: 1024px) {
            .panels .panel .bioContact a.btnEmail {
              background-image: url("../images/icons/contactEmail.svg"); } }