@import url("normalize.css");
@import url("reusable.css");
@import url("plugins.css");


/* ==========================================================================
   Base
   ========================================================================== */

/**
 * Html
 */

html {
    height: 100%;
    overflow-x: hidden;

    -webkit-font-smoothing: antialiased;
}

/**
 * Body
 */

body {
    position: relative;
    min-width: 320px;
    height: 100%;
    font: 14px/24px "Proxima N W01 Reg", Arial;
    color: #444;
    background: #b1c2ee;
    overflow-x: hidden;
}

/**
 * Links
 */

a {
    text-decoration: none;
    color: #444;
    transition: color 200ms ease, background-color 200ms ease, text-shadow 200ms ease, box-shadow 200ms ease, border 200ms ease;

    -webkit-transition: color 200ms ease, background-color 200ms ease, text-shadow 200ms ease, box-shadow 200ms ease, border 200ms ease;
}

a:hover {
    text-decoration: underline;
}


/* ==========================================================================
   Fonts
   ========================================================================== */

/**
 * Proxima N W01 Light
 * Proxima N W01 Smbd
 * Proxima N W01 Reg It
 * Proxima N W01 Bold It
 * Proxima N W01 Cd Light
 * Proxima N W01 Cd Reg
 * Proxima N W01 Reg
 * Proxima N W01 Cd Smbd
 */


/* ==========================================================================
   General
   ========================================================================== */

/**
 * Menu
 */

#menu {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 260px;
    background: #454545;
}

#menu ul li a {
    display: block;
    text-transform: uppercase;
    font: 14px/24px "Proxima N W01 Light", Arial;
    color: #fff;
    padding: 20px 10px;
    background: #454545;
    border-bottom: 1px solid #5c5c5c;
}

#menu ul li a:hover {
    text-decoration: none;
    background: #333;
}

body.single-about #menu ul .menu-item-12 a,
body.single-about #menu ul .menu-item-12 a:hover,
body.single-services #menu ul .menu-item-13 a,
body.single-services #menu ul .menu-item-13 a:hover,
#menu ul .current-menu-item a,
#menu ul .current-menu-item a:hover,
#menu ul .current a,
#menu ul .current a:hover {
    background: #fe7532;
}

/**
 * Menu helper class
 */

#menu .scroll {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    overflow-y: scroll;

    -webkit-overflow-scrolling: touch;
}

/**
 * Wrapper
 */

#wrapper {
    position: relative;
    left: 0;
    min-height: 100%;
    background: #b1c2ee;
    -webkit-box-shadow: -5px 0 5px rgba(0,0,0,0.3);
    -moz-box-shadow: -5px 0 5px rgba(0,0,0,0.3);
    box-shadow: -5px 0 5px rgba(0,0,0,0.3);
    overflow: hidden;
}
/*
#mobile #wrapper {
    -webkit-transform: translateZ(0);
    -webkit-perspective: 1000;
    -webkit-backface-visibility: hidden;
}*/

/**
 * Header
 */

#header {
    position: relative;
    background: #efefea;
}

#header h1 {
    float: left;
    padding: 23px 0 0 0;
}

#header h1 a {
    display: block;
    width: 305px;
    height: 74px;
    background: url(../images/logo.png);
}

#header nav {
    float: right;
}

#header nav .menu {
    display: none;
    position: absolute;
    top: 50%;
    left: 10px;
    width: 40px;
    height: 32px;
    margin: -16px 0 0 0;
}

#header nav .menu:after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 17px;
    content: "";
    margin: -8px 0 0 -10px;
    border-top: 10px double #5e6c96;
    border-bottom: 3px solid #5e6c96;
    box-sizing: border-box;

    -moz-box-sizing: border-box;
}

#header nav ul li {
    float: left;
    position: relative;
}

#header nav ul li a {
    display: block;
    font: 400 15px/120px "Proxima N W01 Smbd", Arial;
    text-transform: uppercase;
    color: #777;
    padding: 0 20px;
}

body.single-about #header nav ul .menu-item-3 > a,
body.single-about #header nav ul .current-about-ancestor > a,
body.single-services #header nav ul .current-services-ancestor > a,
body.single-services #header nav ul .menu-item-4 > a,
#header nav ul .current-menu-item > a,
#header nav ul li:hover > a {
    text-decoration: none;
    color: #fff;
    background: #fe7532;
}

#header nav ul li ul {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    white-space: nowrap;
    padding: 20px 0 0 0;
    z-index: 9999;
}

#header nav ul li:hover ul {
    display: block;
}

#header nav ul li ul:before {
    position: absolute;
    top: 4px;
    right: 10px;
    width: 0;
    height: 0;
    content: "";
    border: 8px solid transparent;
    border-bottom-color: #efefea;
}

#header nav ul li ul li {
    float: none;
}

#header nav ul li ul li a {
    font: 14px/55px "Proxima N W01 Light", Arial;
    text-transform: none;
    color: #5e6c96;
    padding: 0 100px 0 20px;
    background: #efefea;
}

/**
 * Main
 */

#main {
    padding: 100px 0 50px 0;
    margin: 0 0 40px 0;
}

/**
 * Homepage
 */

#homepage .image {
    float: right;
    position: relative;
    margin: -50px 0 0 100px;
}

#homepage .image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
}

#homepage .image .hover {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    filter: alpha(opacity="0");
    transition: opacity 200ms ease;

    -webkit-transition: opacity 200ms ease;
}

#homepage .hover:hover {
    opacity: 1;
    filter: alpha(opacity="100");
}

#homepage .mobile {
    display: none;
}

#homepage h1 {
    font: 400 48px/52px "Proxima N W01 Light", Arial;
    padding: 0 0 50px 0;
    color: #5e6c96;
}

#homepage p {
    font: 20px/30px "Proxima N W01 Light", Arial;
    color: #030303;
    padding: 0 0 50px 0;
}

/**
 * General header
 */

#general header {
    position: relative;
    padding: 0 0 25px 0;
    margin: 0 0 50px 0;
    border-bottom: 1px solid #d8e1f7;
}

#general header h1 {
    font: 400 46px/50px "Proxima N W01 Light", Arial;
    color: #5e6c96;
    padding: 0 40px 0 0;
}

#general header .uppercase {
    text-transform: uppercase;
}

#general header .category {
    display: block;
    position: absolute;
    right: 0;
    bottom: 33px;
    width: 34px;
    height: 33px;
    background: url(../images/category.png);
}

#general header .category:hover {
    background-position: 0 -33px;
}

#general header .category span {
    position: absolute;
    top: -1px;
    bottom: -1px;
    right: 100%;
    width: 0;
    font: 17px/35px "Proxima N W01 Cd Light", Arial;
    text-transform: uppercase;
    color: #fff;
    white-space: nowrap;
    margin: 0 15px 0 0;
    background: #5e6c96;
    overflow: hidden;
}

#general header .category:hover span {
    width: auto;
    padding: 0 20px;
    transition: all 200ms ease;

    -webkit-transition: all 200ms ease;
}

/**
 * General submenu
 */

#general .submenu {
    font: 30px/34px "Proxima N W01 Light", Arial;
    padding: 0 0 0 30px;
}

#general .submenu li {
    padding: 10px 0;
}

#general .submenu li a {
    position: relative;
    color: #fff;
    transition: all 200ms ease;

    -webkit-transition: all 200ms ease;
}

#general .submenu li a:hover {
    left: 10px;
    text-decoration: none;
    color: #fe7532;
}

/**
 * General sidebar
 */

#general aside {
    float: left;
    width: 380px;
    font: 16px/20px "Proxima N W01 Cd Smbd", Arial;
    text-align: right;
    text-transform: uppercase;
}

#general aside ul {
    padding: 0 15px 0 0;
    margin: 0 0 30px 0;
    border-right: 1px solid #d8e1f7;
}

#general aside ul li {
    padding: 5px 0 0 0;
}

#general aside ul li:first-child {
    padding: 0;
}

#general aside ul li a {
    display: block;
    color: #fff;
    padding: 10px 15px;
}

#general aside ul .current_page_item a,
#general aside ul .current_page_item a:hover {
    display: block;
    color: #fe7532;
    background: #eee;
}

#general aside ul li a:hover {
    text-decoration: none;
    color: #fe7532;
}

#general aside ul li a span {
    display: block;
    font-size: 14px;
    font-family: "Proxima N W01 Light", Arial;
}

#general aside .pdf {
    display: inline-block;
    font-family: "Proxima N W01 Cd Reg", Arial;
    color: #5e6c96;
    padding: 10px 15px;
    margin: 0 16px 0 0;
    background: #eee;
    transition: all 200ms ease;

    -webkit-transition: all 200ms ease;
}

#general aside .pdf:hover {
    text-decoration: none;
    color: #fe7532;
}

#general aside .pdf .document {
    display: inline-block;
    width: 22px;
    height: 26px;
    vertical-align: middle;
    margin: -3px 0 -3px 10px;
    background: url(../images/document.png);
}

#general aside .pdf:hover .document {
    background-position: 0 -26px;
}

/*
 * General entry
 */

#general .entry {
    padding: 0 0 0 400px;
    margin: 0 0 -20px 0;
}

#general .entry p {
    padding: 0 0 20px 0;
}

#general .entry ul {
    padding: 0 0 20px 20px;
}

#general .entry ul ul {
    padding: 0 0 0 40px;
    margin: -20px 0 0 0;
}

#general .entry ul li {
    list-style: square;
}

/**
 * Clients
 */

#clients .tagline {
    font: 22px/30px "Proxima N W01 Light", Arial;
    text-align: center;
    padding: 0 0 50px 0;
    margin: 0 0 50px 0;
    border-bottom: 1px solid #d8e1f7;
}

#clients ul {
    float: left;
    width: 33.33%;
    font: 13px/18px "Proxima N W01 Light", Arial;
    text-transform: uppercase;
}

#clients ul li > a,
#clients ul li > span {
    display: inline-block;
    position: relative;
    padding: 3px 30px 0 5px;
}

#clients ul li > a:hover,
#clients ul li > span:hover {
    text-decoration: none;
    background: #f0f3fc;
}

#clients ul li a span,
#clients ul li span span {
    display: block;
    position: absolute;
    top: 3px;
    right: 5px;
    width: 14px;
    height: 14px;
    background: url(../images/link.png);
    opacity: 0;
    filter: alpha(opacity="0");
    transition: opacity 200ms ease;

    -webkit-transition: opacity 200ms ease;
}

#clients ul li a:hover span,
#clients ul li span:hover span {
    opacity: 1;
    filter: alpha(opacity="100");
}

/**
 * Contact
 */

#contact .tagline h2 {
    font: 400 26px/32px "Proxima N W01 Light", Arial;
    padding: 0 0 10px 0;
    margin: 0 0 50px 0;
    border-bottom: 1px solid #d8e1f7;
}

#contact .row {
    font: 400 18px/24px "Proxima N W01 Light", Arial;
    color: #fff;
    padding: 0 0 20px 0;
}

#contact .row .col {
    padding-bottom: 0;
}

#contact .row label {
    display: block;
    padding: 0 0 5px 0;
}

#contact .row label em {
    font-style: normal;
    font-family: "Proxima N W01 Reg It", Arial;
}

#contact .checkboxes .row {
    font: 15px/24px "Proxima N W01 Reg", Arial;
    color: #444;
}

#contact .checkboxes .row ul li {
    float: left;
}

#contact .checkboxes .row ul li:first-child {
    padding: 0 20px 0 0;
}

#contact .submit {
    padding: 30px 0;
    margin: 10px 0 0 0;
    border-top: 1px solid #d8e1f7;
}

/**
 * Location
 */

#location {
    position: relative;
    font: 16px/26px "Proxima N W01 Reg", Arial;
    color: #fff;
    background: #768abf;
}

#location h3 {
    font: 400 32px/36px "Proxima N W01 Light", Arial;
    padding: 0 0 20px 0;
}

#location .office {
    padding: 45px 0 0 0;
}

#location .map {
    position: relative;
    float: right;
    width: 50%;
    margin: -205px 0 0 0;
}

#location .map img {
    display: block;
    width: 100%;
}

#location .map .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #768abf;
    opacity: 0.65;
    filter: alpha(opacity="65");
    transition: opacity 200ms ease;

    -webkit-transition: opacity 200ms ease;
}

#location .map:hover .overlay {
    opacity: 0;
    filter: alpha(opacity="0");
}

#location .map .marker {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 180px;
    height: 30px;
    font: 15px/15px "Proxima N W01 Smbd", Arial;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    padding: 6px 0;
    margin: -50px 0 0 -90px;
    background: #fe7532;
    border-radius: 5px;
    transition: none;

    -webkit-transition: none;
}

#location .map .marker:hover {
    text-decoration: none;
}

#location .map:hover .marker {
    background: #768abf;
}

#location .map .marker:after {
    position: absolute;
    top: 100%;
    left: 50%;
    width: 0;
    height: 0;
    content: "";
    margin: 0 0 0 -10px;
    border: 10px solid transparent;
    border-top-color: #fe7532;
}

#location .map:hover .marker:after {
    border-top-color: #768abf;
}

/**
 * Footer
 */

#footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    font: 400 14px/20px "Proxima N W01 Cd Reg", Arial;
    color: #5e6c96;
    padding: 10px 0;
    background: #efefea;
}

#footer a {
    color: #5e6c96;
}

#footer p {
    float: left;
}

#footer ul {
    float: right;
}