header{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: block;
    z-index: 999;
    padding: 10px 0;
    border-bottom: 1px solid #FFF;
}
.header-box{
    width: 1200px;
    max-width: 100%;
    display: block;
    margin: 0 auto;
}
.header-logo{
    font-size: 28px;
    color: #FFF;
    display: block;
    float: left;
    font-weight: bold;
    font-family: 'Saira Extra Condensed';
  
}
.header-logo a{
    letter-spacing: 6px;
    text-shadow: rgba(1, 78, 143, 0.2) 0px 0px 20px,
                rgba(1, 78, 143, 0.3) 0px -1px 20px,
                rgba(1, 78, 143, 0.4) 0px -2px 20px,
                rgba(1, 78, 143, 0.75) 0px -3px 20px,
                 rgba(1, 78, 143, 0.75) 0px -4px 20px,
                rgba(1, 78, 143, 0.3) 0px 1px 20px,
                rgba(1, 78, 143, 0.4) 0px 2px 20px,
                rgba(1, 78, 143, 0.75) 0px 3px 20px,
                 rgba(1, 78, 143, 0.75) 0px 4px 20px,
                rgba(1, 78, 143, 0.75) 0px 0px 20px; 
}
.header-menu{
    display: block;
    float: right;
    font-size: 0;
    padding: 6px 0;
}
.header-menu li{
    font-size: 20px;
    display: inline-block;
    padding: 0 25px;
    letter-spacing: 4px;
    color: #FFF;
    font-family: 'Saira Extra Condensed';
    position: relative;
    transition: all .3s linear;
}
.header-menu li:after{
    content: '/';
    font-size: 20px;
    color: #FFF;
    display: block;
    position: absolute;
    top: 0;
    left: -2px;
    text-shadow: none;
}
.header-menu li:first-child:after{
    display: none;
}
.header-menu li:first-child{
    padding-left: 0;
}
.header-menu li:last-child{
    padding-right: 0;
}
.header-logo-box{
    width: 160px;
    max-width: 100%;
    display: inline-block;
    vertical-align: middle;
}
.header-logo span{
    display: inline-block;
    vertical-align: middle;
}

/*----------------------------------*/
.rwd-menu{
    width: 59px;
    position: absolute;
    right: 3%;
    top: 45px;
    z-index: 99999;
    display: none;
}
.rwd-menu span{
    width: 40px;
    display: block;
    margin: 0 auto;
    height: 4px;
    background-color: #FFF;
    position: relative;
}

.rwd-menu span:nth-child(even){
    margin: 10px auto;
    transition: all .4s linear;
}
.rwd-menu span:nth-child(1){
    transform: scale(1);
    transform-origin: left;
    transition: all .4s linear;
}
.rwd-menu span:nth-child(3){
    transform: scale(1);
    transform-origin: right;
    transition: all .4s linear;
}
.rwd-menu span:nth-child(4){
    top: -28px;
    transform:  scale(0) rotate(-45deg);
}

.rwd-menu.active span:nth-child(odd){
    transform: scale(0);
    transition: all .4s linear;
    transition-delay: 0;
}

.rwd-menu.active span:nth-child(2){
    transform: rotate(45deg);
    transition: all .4s linear;
}
.rwd-menu.active span:nth-child(4){
    transform: scaleX(1) rotate(-45deg);
    transition-delay: 0.3s;
}
.rwd-menu.active span{
    background-color: #FFF;
}

.mask{
    width: 100%;
    height: 100vh;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
    background-color: rgba(0, 0, 0, 0.8);
}
.mask.active{
    display: block;
}