/* Stop content from scrolling when main navigation is visible */

body.overflow-hidden {

    overflow: hidden;

}

.global-header {

    position: fixed;

    top: 0;

    left: 0;

    z-index: 3000;

    height: 64px;

    width: 100%;

/*    max-width:1440px;*/

    padding: 0 1rem;

    margin:0 auto;

    background-color: #FDF8F2;

    color:rgba(255,255,255,0.85);

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}

.global-header__logo {

    height: 4rem;

    background-image: url(../img/moore-hancock-logo.svg);

    background-repeat: no-repeat;

    background-position: center left;

    background-size: contain;

    border: 0.5rem solid transparent;

    border-right-width: 0;

    border-left-width: 0;

    

    position: relative;

    z-index: 5000;

    width: 300px;

    

}

.global-header__logo img {

    height: 50px;

    width:auto;

    margin:10px 0 0 15px;

}

.global-header__logo a {

    height: 50px;

    display: inline-block;

}

    .global-header.is-fixed .global-header__logo {

        background-image: url(../img/moore-hancock-logo.svg);

    }

    .global-header.is-fixed a {

        color:#333333;

    }



@media only screen and (min-width: 400px) {

    .global-header {

        height: 80px;

    }

    .global-header__logo {

        height: 80px;

    }

    .global-header__logo img {

        height: 65px;

    }

    .global-header__logo a {

        height: 65px;

    }

}

@media only screen and (min-width: 768px) {

    .global-header {

        height: 6rem;

        padding: 0 2rem;

    }

    .global-header__logo {

        height: 6rem;

    }

    .global-header__logo img {

        margin:25px 0 5px 30px;

        height: 80px;

    }

    .global-header__logo a {

        height: 80px;

    }

}

@media only screen and (min-width: 1024px) {

    .global-header {

        position: absolute;

        left:0;

        right:0;

        height: 6rem;

        padding: 0 1rem;

        background-color: #FDF8F2;

        -webkit-transition: background-color 0.3s;

        -moz-transition: background-color 0.3s;

        transition: background-color 0.3s;

        /* Force Hardware Acceleration in WebKit */

        -webkit-transform: translate3d(0, 0, 0);

        -moz-transform: translate3d(0, 0, 0);

        -ms-transform: translate3d(0, 0, 0);

        -o-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

    }

    .global-header__logo {

        height: 6rem;

        background-image: url(../img/moore-hancock-logo.svg);

        border: 0.75rem solid transparent;

    }

    .global-header.is-fixed {

        /* when the user scrolls down, we hide the header right above the viewport */

        position: fixed;

        top: -6rem;

        background-color: #FDF8F2;

        -webkit-transition: -webkit-transform 0.3s;

        -moz-transition: -moz-transform 0.3s;

        transition: transform 0.3s;

    }

    

    .global-header.is-visible {

        /* if the user changes the scrolling direction, we show the header */

        -webkit-transform: translate3d(0, 100%, 0);

        -moz-transform: translate3d(0, 100%, 0);

        -ms-transform: translate3d(0, 100%, 0);

        -o-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

        /*box-shadow: 0px 0px 20px rgba(0,0,0,0.5);*/

    }

    .global-header.menu-is-open {

        /* add a background color to the header when the navigation is open */

        background-color: #FDF8F2;

        background-color: #FDF8F2;

    }

    .global-header__logo img {

        height: 70px;

        width:auto;

        margin: 30px 0 10px 50px;

        display:none;

    }

    .global-header__logo a {

        height: 70px;

    }

}

@media only screen and (min-width: 1280px) {

    .global-header {

        height: 7.5rem;

        padding: 0 6rem;

    }

    .global-header.is-fixed {

        top: -7.5rem;

    }

    .global-header__logo img {

        height: 110px;

        margin: 15px 0 5px 120px;

    }

    .global-header__logo a {

        height: 110px;

    }

    .global-header__logo {

        height: 7.5rem;

        background-image: url(../img/moore-hancock-logo.svg);

        border: 1rem solid transparent;

        border-right-width: 0;

        border-left-width: 0;

    }

}