@font-face {
  font-family: "Open Sans";
  src: url("fonts/OpenSans-Regular.ttf"); }
@font-face {
  font-family: 'fontello';
  src: url("fonts/Okay_Icons/font/okayicons.eot");
  src: url("fonts/Okay_Icons/font/okayicons.eot") format("embedded-opentype"), url("fonts/Okay_Icons/font/okayicons.woff") format("woff"), url("fonts/Okay_Icons/font/okayicons.ttf") format("truetype"), url("fonts/Okay_Icons/font/okayicons.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'fontelloTwo';
  src: url("fonts/Okay_Icons_2/font/fontello.eot");
  src: url("fonts/Okay_Icons_2/font/fontello.eot") format("embedded-opentype"), url("fonts/Okay_Icons_2/font/fontello.woff") format("woff"), url("fonts/Okay_Icons_2/font/fontello.ttf") format("truetype"), url("fonts/Okay_Icons_2/font/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: "Graphik Med";
  src: url("fonts/Graphik-Medium.otf"); }
@font-face {
  font-family: "Graphik Reg";
  src: url("fonts/Graphik-Regular.otf"); }
@font-face {
  font-family: "Graphik Light";
  src: url("fonts/Graphik-Light.otf"); }
body {
  height: 100%;
  width: 100%;
  margin: 0;
  font-size: 16px;
  -webkit-font-smoothing: antialiased; }

h1, h2, h3, h4, h5, h6 {
  font-size: 16px; }

html {
  width: 100%; }

#main {
  padding: 90px 0 0 0; }

#page {
  margin: auto; }

/*
.loading-gif{
	position:absolute;
	width:40px;
	height:40px;
	left:50%;
	top:50%;
	transform:translate(-20px,-20px);
	z-index:-1;
	img{
		width:40px;
		height:40px;
	}
}
*/
.color-overlay:before {
  content: '';
  position: absolute;
  display: inline-block;
  top: 0;
  bottom: 0px;
  left: 0;
  right: 0;
  opacity: 0;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 1; }

.home-main-region .color-overlay:before {
  bottom: 4px; }

.color-overlay .overlay-item {
  position: absolute;
  display: inline-block;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 1; }

.color-overlay:hover:before {
  opacity: .7; }

.hover-title {
  position: relative; }
  .hover-title .desktop-title {
    display: none;
    line-height: 1.3em;
    margin: 0;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 9;
    opacity: 0;
    transition: all 0.3s ease;
    text-align: center;
    width: calc(100% - 20px); }
    .hover-title .desktop-title a {
      color: #fff;
      text-decoration: none; }
    .hover-title .desktop-title h4 {
      font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
      font-size: 1.25em;
      line-height: 1.4em;
      font-weight: normal;
      margin: 0;
      color: #fff; }
    .hover-title .desktop-title p {
      margin: 0;
      color: #fff;
      font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
      font-size: 1.25em;
      line-height: 1.4em;
      font-weight: normal; }
  .hover-title:hover .desktop-title {
    opacity: 1; }

.mobile-title {
  display: block; }

#main-region {
  min-height: 500px;
  margin: auto; }

.browser-update-hide {
  display: none !important; }

#browser-update,
#ie-update,
#chrome-update,
#safari-update,
#ff-update {
  display: none; }

#browser-update {
  height: 100%; }
  #browser-update #browser-update-inner {
    width: 49.25%;
    margin: 0 0 0 50.75%; }
  #browser-update h3 {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.25em;
    line-height: 1.4em;
    color: #aaaaaa;
    font-weight: normal;
    margin: 0; }
  #browser-update p {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.25em;
    line-height: 1.4em;
    color: #222222;
    font-weight: normal;
    margin: 10px 0 0 0; }
  #browser-update div {
    margin: 15px 0 0 0; }
    #browser-update div a {
      font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
      font-size: 1.25em;
      line-height: 1.4em;
      color: #222222;
      font-weight: normal;
      text-decoration: none; }
    #browser-update div a:hover {
      text-decoration: underline; }

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -ms-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s; }

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width; }

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: -o-transform, opacity;
  transition-property: transform, opacity; }

/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -ms-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s; }

@media only screen and (max-width: 1250px) {
  #fourohfour h3 {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    line-height: 1.4em;
    color: #aaaaaa;
    font-weight: normal; }
  #fourohfour p {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    line-height: 1.4em;
    color: #222222;
    font-weight: normal; }

  #browser-update h3 {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    line-height: 1.4em;
    color: #aaaaaa;
    font-weight: normal; }
  #browser-update p {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    line-height: 1.4em;
    color: #222222;
    font-weight: normal; }
  #browser-update div a {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    line-height: 1.4em;
    color: #222222;
    font-weight: normal; } }
@media only screen and (max-width: 1050px) {
  #main {
    padding: 80px 0 0 0; }

  #fourohfour {
    width: auto;
    margin: 0 20px 150px 20px; }
    #fourohfour h3 {
      font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
      font-size: 1em;
      line-height: 1.4em;
      color: #aaaaaa;
      font-weight: normal; }
    #fourohfour p {
      font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
      font-size: 1em;
      line-height: 1.4em;
      color: #222222;
      font-weight: normal; } }
@media only screen and (max-width: 650px) {
  #browser-update #browser-update-inner {
    width: 94%;
    margin: auto; } }
#masthead {
  width: 100%;
  top: 0;
  position: fixed;
  /*position: relative;*/
  background: white;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  height: 90px;
  z-index: 9999; }

#top-nav {
  width: 1340px;
  margin: auto;
  height: 90px;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease; }
  #top-nav #site-name {
    position: relative;
    float: left;
    width: 50.75%;
    margin: 37px 0 0 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }
    #top-nav #site-name a {
      text-decoration: none;
      color: #222222; }
    #top-nav #site-name h1 {
      display: none;
      margin: 0;
      font-family: "Graphik Med", Arial, Helvetica, sans-serif;
      font-size: 2.5em;
      line-height: 1.4em;
      color: #222222;
      font-weight: 100; }
  #top-nav #logo-normal,
  #top-nav #logo-hover {
    width: 97px;
    position: absolute;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease; }
    #top-nav #logo-normal img,
    #top-nav #logo-hover img {
      width: 100%; }
  #top-nav #logo-hover {
    opacity: 0; }
  #top-nav #site-name a:hover #logo-normal {
    opacity: 0; }
  #top-nav #site-name a:hover #logo-hover {
    opacity: 1; }
  #top-nav #site-menu {
    float: left;
    margin: 28px 0 0 0;
    width: 49.25%;
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.25em;
    line-height: 1.4em;
    color: #aaaaaa;
    font-weight: normal;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }
    #top-nav #site-menu a {
      text-decoration: none;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease; }
    #top-nav #site-menu ul {
      list-style: none;
      display: inline-block;
      padding: 0;
      /*.menu-item-has-children:hover{
      	height:80px;
      	ul{
      		//display:block;
      		//height:25px;
      		opacity:1;
      	}
      }*/ }
      #top-nav #site-menu ul li {
        float: left;
        margin: 0 35px 0 0;
        height: 25px; }
      #top-nav #site-menu ul ul {
        display: none;
        position: absolute;
        margin: 20px 0 0 0;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease; }
      #top-nav #site-menu ul .current-menu-ancestor ul {
        height: 25px; }
      #top-nav #site-menu ul .current_page_ancestor a {
        color: #222222; }
    #top-nav #site-menu .menu-sub-menu-container ul {
      margin: 5px 0 0 0; }
      #top-nav #site-menu .menu-sub-menu-container ul li {
        margin: 0 30px 10px 0; }
      #top-nav #site-menu .menu-sub-menu-container ul li.sub-archive {
        margin: 0 0 10px 0; }
  #top-nav #menu-sub-menu a {
    color: #aaaaaa !important; }
    #top-nav #menu-sub-menu a:hover {
      color: #222222 !important; }
  #top-nav #menu-sub-menu .current-menu-item a {
    color: #222222 !important; }

#current-page {
  cursor: pointer;
  display: none;
  font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
  font-size: 1.25em;
  line-height: 1.4em;
  color: #222222;
  font-weight: normal;
  text-transform: capitalize;
  width: 49.25%;
  float: right;
  margin: 7px 0 0 0; }

.mobile-toggle {
  display: none;
  position: absolute;
  z-index: 99999;
  top: 8px;
  left: 51%;
  width: 20px;
  height: 16px;
  padding: 0;
  cursor: pointer;
  border: none;
  outline: none;
  background: transparent; }
  .mobile-toggle:before, .mobile-toggle:after {
    content: '';
    display: block;
    position: absolute;
    top: 8px;
    left: 0;
    width: 100%;
    height: 2px;
    pointer-events: none;
    -webkit-transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%; }
  .mobile-toggle span {
    display: block;
    position: absolute;
    top: 8px;
    left: 0;
    overflow: hidden;
    width: 100%;
    height: 2px;
    text-indent: 200%;
    -webkit-transition: opacity 0.25s;
    transition: opacity 0.25s; }
  .mobile-toggle::before {
    top: 8px;
    -webkit-transform: translate3d(0, -7px, 0) scale3d(1, 1, 1);
    transform: translate3d(0, -7px, 0) scale3d(1, 1, 1); }
  .mobile-toggle::after {
    -webkit-transform: translate3d(0, 7px, 0) scale3d(1, 1, 1);
    transform: translate3d(0, 7px, 0) scale3d(1, 1, 1); }
  .mobile-toggle.menu-visible {
    display: none; }
    .mobile-toggle.menu-visible span {
      opacity: 0; }
    .mobile-toggle.menu-visible:before {
      -webkit-transform: rotate3d(0, 0, 1, 45deg);
      transform: rotate3d(0, 0, 1, 45deg); }
    .mobile-toggle.menu-visible:after {
      -webkit-transform: rotate3d(0, 0, 1, -45deg);
      transform: rotate3d(0, 0, 1, -45deg); }

.filter-name {
  font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
  font-size: 1em;
  line-height: 1.4em;
  color: #222222;
  font-weight: normal;
  display: none;
  text-transform: capitalize;
  margin: 13px 0 0 0;
  width: 49.25%;
  float: right;
  cursor: pointer; }

#masthead.locked {
  z-index: 999;
  height: 80px; }
  #masthead.locked #top-nav {
    height: 80px; }
    #masthead.locked #top-nav #site-name {
      margin: 24px 0 0 0; }
    #masthead.locked #top-nav #site-menu {
      margin: 14px 0 0 0; }
      #masthead.locked #top-nav #site-menu .menu-sub-menu-container {
        -webkit-transition: all 0.1s ease;
        -moz-transition: all 0.1s ease;
        -o-transition: all 0.1s ease;
        transition: all 0.1s ease;
        opacity: 0; }

#masthead.hidden {
  height: 0px;
  overflow: hidden; }
  #masthead.hidden #top-nav {
    opacity: 0; }

#page.filterVis #masthead {
  height: 145px; }
#page.filterVis #top-nav {
  height: 145px; }
  #page.filterVis #top-nav #site-menu .menu-sub-menu-container {
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    -o-transition: all 0.1s ease;
    transition: all 0.1s ease; }
#page.filterVis #masthead.locked {
  height: 80px; }
  #page.filterVis #masthead.locked #top-nav {
    height: 80px; }
    #page.filterVis #masthead.locked #top-nav #site-name {
      margin: 24px 0 0 0; }
    #page.filterVis #masthead.locked #top-nav #site-menu {
      margin: 14px 0 0 0; }
  #page.filterVis #masthead.locked .menu-sub-menu-container {
    height: 0;
    opacity: 0;
    pointer-events: none; }
#page.filterVis #masthead.hidden {
  height: 0px; }

@media only screen and (max-width: 1390px) {
  #top-nav {
    width: auto;
    margin: 0 40px; }
    #top-nav #site-menu {
      width: 49.25%;
      /*.menu-sub-menu-container{
      	#menu-sub-menu{
      		li{
      			margin:0 15px 0 0 !important;
      		}
      	}
      }*/ }
      #top-nav #site-menu ul li {
        margin: 0 35px 0 0; }
      #top-nav #site-menu .menu-sub-menu-container ul li {
        margin: 0 20px 10px 0; }
      #top-nav #site-menu .menu-sub-menu-container ul li.sub-archive {
        margin: 0 0 10px 0; } }
@media only screen and (max-width: 1250px) {
  #top-nav #site-menu {
    font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    line-height: 1.4em;
    color: #aaaaaa;
    font-weight: normal; } }
@media only screen and (max-width: 1110px) {
  #top-nav #site-menu {
    width: 49%; }
    #top-nav #site-menu ul li {
      margin: 0 30px 0 0; }
    #top-nav #site-menu .menu-sub-menu-container ul li {
      margin: 0 15px 10px 0; }
    #top-nav #site-menu .menu-sub-menu-container ul li.sub-archive {
      margin: 0 0 10px 0; } }
@media only screen and (max-width: 1050px) {
  #masthead {
    height: 70px;
    position: fixed;
    /*background:none;*/ }

  #current-page {
    font-size: 1em;
    display: block;
    width: 49%; }

  #current-page.menu-visible {
    display: none; }

  #top-nav {
    height: 70px;
    margin: 0 20px; }
    #top-nav #site-name {
      margin: 16px 0 0 0;
      position: relative;
      z-index: 9; }
    #top-nav #logo-normal,
    #top-nav #logo-hover {
      width: 82px;
      margin: 5px 0 0 0; }
    #top-nav #site-menu {
      position: relative;
      z-index: 5;
      margin: 5px 0 0 0;
      width: 100%;
      font-family: "Graphik Reg", Arial, Helvetica, sans-serif;
      font-size: 1.06em;
      line-height: 1.4em;
      color: #aaaaaa;
      font-weight: normal; }
      #top-nav #site-menu .menu-main-menu-container {
        display: none;
        position: fixed;
        top: 70px;
        left: 0;
        bottom: 0;
        right: -20px;
        height: 100%;
        padding: 20px 40px 20px 20px;
        z-index: 99999;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        /*background: #3e13ff;*/ }
        #top-nav #site-menu .menu-main-menu-container ul {
          width: 49%;
          height: auto;
          float: right;
          margin: -11px 0 0 0;
          padding-bottom: 100px; }
          #top-nav #site-menu .menu-main-menu-container ul li {
            /*clear: both;*/
            float: none;
            width: 100%;
            max-width: 100%;
            height: auto;
            padding: 15px 0 14px 0; }
            #top-nav #site-menu .menu-main-menu-container ul li ul:before {
              display: none;
              content: '\e802';
              font-family: 'fontello';
              font-size: 1.25em;
              color: #222222; }
            #top-nav #site-menu .menu-main-menu-container ul li ul li {
              display: block; }
            #top-nav #site-menu .menu-main-menu-container ul li a {
              color: #fff; }
              #top-nav #site-menu .menu-main-menu-container ul li a:hover {
                color: #f3f3f3; }
          #top-nav #site-menu .menu-main-menu-container ul .sub-menu {
            display: none;
            position: relative !important;
            width: auto;
            height: auto;
            margin: 10px 0;
            padding: 5px 20px 0 20px;
            border-top: 1px solid rgba(0, 0, 0, 0.4); }
            #top-nav #site-menu .menu-main-menu-container ul .sub-menu li {
              padding: 10px 0 8px 0; }
          #top-nav #site-menu .menu-main-menu-container ul .current-menu-parent .sub-menu {
            display: none;
            float: none; }
          #top-nav #site-menu .menu-main-menu-container ul .menu-contact {
            margin-bottom: -15px; }
        #top-nav #site-menu .menu-main-menu-container #menu-main-menu {
          margin: 0 0 35px 0; }
          #top-nav #site-menu .menu-main-menu-container #menu-main-menu .menu-work,
          #top-nav #site-menu .menu-main-menu-container #menu-main-menu .menu-expertise,
          #top-nav #site-menu .menu-main-menu-container #menu-main-menu .menu-about,
          #top-nav #site-menu .menu-main-menu-container #menu-main-menu .menu-news,
          #top-nav #site-menu .menu-main-menu-container #menu-main-menu .menu-contact {
            						/*border-bottom:1px solid rgba(221,221,221,1);
                        webkit-transition: border 0.5s ease;
                        -moz-transition: border 0.5s ease;
                        -o-transition: border 0.5s ease;
                        transition: border 0.5s ease;*/
            border-bottom: 1px solid rgba(34, 34, 34, 0.3); }
        #top-nav #site-menu .menu-main-menu-container #menu-main-menu.menu-visible .menu-work,
        #top-nav #site-menu .menu-main-menu-container #menu-main-menu.menu-visible .menu-expertise,
        #top-nav #site-menu .menu-main-menu-container #menu-main-menu.menu-visible .menu-about,
        #top-nav #site-menu .menu-main-menu-container #menu-main-menu.menu-visible .menu-news {
          /*border-bottom:1px solid rgba(221,221,221,1);*/ }
      #top-nav #site-menu .menu-main-menu-container.menu-visible {
        display: block; }
      #top-nav #site-menu .menu-sub-menu-container {
        margin: 5px 0 10px 20px; }
        #top-nav #site-menu .menu-sub-menu-container ul {
          width: 100%; }
          #top-nav #site-menu .menu-sub-menu-container ul li {
            margin: 0 15px 0 0; }
        #top-nav #site-menu .menu-sub-menu-container li {
          width: 100%;
          float: left;
          clear: both;
          padding: 10px 0 8px 0; }

  #mobile-toggle {
    display: block;
    width: 49%; }

  .mobile-toggle {
    display: block; }
    .mobile-toggle.menu-visible {
      display: block; }

  .work-menu {
    display: none; }

  #mobile-sub-toggle {
    display: block;
    width: 49%;
    margin: 13px 2px 20px 0; }

  .filter-name {
    display: block;
    margin: 13px 0 20px 0;
    width: 49%; }

  .filter-name.menu-visible {
    display: none; }

  #masthead.locked {
    height: 70px; }
    #masthead.locked #top-nav {
      height: 70px; }
      #masthead.locked #top-nav #site-name {
        margin: 16px 0 0 0; }
      #masthead.locked #top-nav #site-menu {
        margin: 5px 0 0 0; } }
@media only screen and (max-width: 650px) {
  #top-nav #logo-normal,
  #top-nav #logo-hover {
    width: 71px;
    margin: 9px 0 0 0; }
  #top-nav #site-menu {
    width: 100%; }
    #top-nav #site-menu .mobile-toggle {
      left: 100%;
      margin-left: -20px; }
    #top-nav #site-menu .menu-main-menu-container {
      max-height: 100%;
      margin: 0;
      -webkit-transition: all 0.8s ease;
      -moz-transition: all 0.8s ease;
      -o-transition: all 0.8s ease;
      transition: all 0.8s ease; }
      #top-nav #site-menu .menu-main-menu-container ul {
        width: 100%;
        float: none; }
      #top-nav #site-menu .menu-main-menu-container #menu-main-menu {
        margin: 0 0 20px 0; }
      #top-nav #site-menu .menu-main-menu-container ul .menu-contact {
        margin: 0; }
      #top-nav #site-menu .menu-main-menu-container ul li {
        padding: 15px 0 14px 0; }
    #top-nav #site-menu .menu-main-menu-container.menu-visible {
      /*max-height:1000px;*/ }
    #top-nav #site-menu .menu-sub-menu-container {
      width: 100%;
      margin: -70px 0 0 0; }
      #top-nav #site-menu .menu-sub-menu-container ul {
        margin: 5px 0 0 31px; }
        #top-nav #site-menu .menu-sub-menu-container ul li {
          padding: 7px 0 6px 0; }

  #mobile-toggle {
    width: 15px;
    float: right; }

  #mobile-toggle:before,
  #mobile-toggle:after {
    font-size: 1.75em; }

  #current-page {
    display: none !important;
    width: 90%;
    text-align: right;
    float: right;
    margin: 7px 15px 0 0;
    position: absolute;
    right: 15px; }

  #mobile-sub-toggle {
    float: left;
    width: auto;
    margin: 34px 14px 35px 0; }

  #mobile-sub-toggle:before,
  #mobile-sub-toggle:after {
    font-size: 1.75em; }

  .filter-name {
    width: auto;
    float: left;
    margin: 34px 0 35px 0; } }

/*# sourceMappingURL=header.css.map */