/**
 * Header Stylesheet - Exact match with candy77.net
 * 
 * @package kanyaars
 * @version 1.0.0
 */

/* ==========================================================================
   Header - Fixed Position
   ========================================================================== */

.header {
    width: 100%;
    z-index: 999999;
    position: fixed;
    background: #2f2f2f;
}

/* ==========================================================================
   Top Header - Contact Bar
   ========================================================================== */

.top-header {
    width: 100%;
    border-bottom: 1px solid #262626;
    padding: 3px 0;
    background: #1e274b;
}

.top-menu {
    font-size: 11px;
    float: left;
    width: 30%;
    padding: 7px 0;
}

/* ==========================================================================
   Contact Us Links
   ========================================================================== */

ul.contact-us, ul.menu {
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    display: block;
}

ul.contact-us {
    text-transform: capitalize;
    padding: 5px 0;
}

.contact-us {
    height: 25px;
}

.contact-us li {
    border-right: 1px solid #999;
    padding-left: 10px;
    padding-right: 10px;
    display: inline-block;
}

.contact-us li:last-child {
    border: 0;
    padding-right: 10px;
}

.contact-us li a {
    color: #999;
    font-size: 11px;
}

.contact-us li a i {
    vertical-align: middle;
}

.contact-us li a:hover {
    color: #fff;
}

.contact-us .svg-menu {
    height: 20px;
    width: 20px;
    display: inline-block;
    background-size: 17px;
    background-repeat: no-repeat;
}

/* ==========================================================================
   Nav Header
   ========================================================================== */

.nav-header {
    background: #020f32;
    width: 100%;
    height: 77px;
    border-bottom: 4px solid #921488;
}

/* ==========================================================================
   Logo
   ========================================================================== */

.site-logo {
    float: left;
    top: 15px;
}

/* ==========================================================================
   Navigation Menu
   ========================================================================== */

.nav-menu {
    float: right;
    width: 77%;
}

ul.main-menu {
    padding: 25px 0;
    text-transform: uppercase;
}

.main-menu li {
    display: block;
    float: left;
}

.main-menu li a {
    color: #929cac;
    display: block;
    padding: 16px 27px;
}

.main-menu li [aria-current], .main-menu li a:hover {
    color: #fff;
}

.main-menu li [aria-current] {
    background-color: #490050;
    background-image: -webkit-linear-gradient(top, #490050 0, #90169b 100%);
    border-top: 1px solid #640f7e;
    border-radius: 5px 5px 0 0;
}

.col-border, .main-menu li, .main-menu li a, .menu, .menu li {
    position: relative;
}

/* ==========================================================================
   Login Panel / Action Buttons
   ========================================================================== */

.login-panel {
    float: right;
    width: 20%;
    padding: 4px 0;
}

.menu {
    float: right;
    padding: 0;
    margin: 0 auto;
}

.menu li {
    float: left;
    font-size: 12px;
    text-transform: uppercase;
    margin: 0 0 0 4px;
    padding: 3px;
    vertical-align: inherit;
    border-radius: 2px;
}

.menu ul {
    padding-top: 15px;
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0px 0px 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0px 0px 4px 4px;
    -o-border-radius: 0 0 4px 4px;
}

.menu li a {
    padding: 2px 10px;
    display: block;
    color: #fff;
    font-weight: 700;
}

/* ==========================================================================
   Login/Daftar Buttons
   ========================================================================== */

.daftar {
    background-color: #bb37b4;
    background-image: -webkit-linear-gradient(top, #681e5e 0, #bb37b4 100%);
    border-top: 1px solid #ca0fba;
}

.daftar:hover {
    background: #bb37b4;
}

.login {
    background-color: #da9c2b;
    background-image: -webkit-linear-gradient(top, #da8c2b 0, #ccad00 100%);
    border-top: 1px solid #ffd55f;
}

.login:hover {
    background: #da9c2b;
}

/* ==========================================================================
   Mobile Menu Toggle (Deploy Sidebar)
   ========================================================================== */

.deploy-sidebar {
    background-image: url('../images/deploy-nav.png');
    background-repeat: no-repeat;
    background-position: 9px 16px;
    background-size: 28px 19px;
    height: 50px;
    max-width: 50px;
    z-index: 50;
    width: 20%;
    float: left;
    display: none;
}

/* ==========================================================================
   Mobile Login Buttons
   ========================================================================== */

.login-mobile {
    float: right;
    text-transform: uppercase;
    padding: 0;
    display: none;
}

.login-mobile li {
    border-radius: 2px;
    margin: 12px 8px 0 0;
}

.login-mobile li a {
    color: #fff;
    font-size: 12px;
    padding: 7px 10px;
    display: block;
}