:root {
    
    /* Header Base */
    --el-header-height: 3rem;
    --el-header-padding-side: 1.5rem;
    --el-header-padding-menu-item: 0.2rem 0.5rem;

    --el-header-font-size-logo: 1.2rem;
    --el-header-font-size-search: 1rem;
    --el-header-font-size-menu: 1rem;
    --el-header-font-weight-logo: 600;
    --el-header-font-weight-search: 400;
    --el-header-font-weight-menu: 400;
    --el-header-color: #e7e7e7;

    --el-header-background-color-menu-item-hover: #4B5973;
    --el-header-border-radius: 0.5rem;
    --el-header-transition: 0.5s cubic-bezier(0.05, 0, 0, 1);

    --el-header-z-index: 5001;

}

/* Header Left*/
.el-layout-header .el-header-left {
    display: flex !important;
    flex-wrap: nowrap !important;
    flex-grow: 1 !important;
    -webkit-box-flex: 1 !important;
    flex-shrink: 1 !important;
    color: var(--el-header-color);
    font-size: var(--el-header-font-size-logo);
    font-weight: var(--el-header-font-weight-logo);
    width: 100% !important;
}

.el-header-left .el-left-link {
    display: flex;
}

.el-header-left .el-left-home {
    display: flex;
    height: 100%;
    align-items: center;
}

.el-header-left .el-left-description {
    display: flex;
    height: 100%;
    align-items: center;
    padding-left: calc(var(--el-header-padding-side) * 0.5);

}

/* Header Center */
.el-layout-header .el-header-center {
    display: flex !important;
    flex-wrap: nowrap !important;
    flex-grow: 1 !important;
    -webkit-box-flex: 1 !important;
    flex-shrink: 1 !important;
    width: 100% !important;
    justify-content: center !important;
}

.el-header-center .el-center-search {
    display: flex;
    align-items: center;
    color: var(--el-header-color);
    font-size: var(--el-header-font-size-search);
    font-weight: var(--el-header-font-weight-search);
}

/* Header Right */
.el-layout-header .el-header-right {
    display: flex !important;
    flex-wrap: nowrap !important;
    flex-grow: 1 !important;
    -webkit-box-flex: 1 !important;
    flex-shrink: 1 !important;
    width: 100% !important;
    justify-content: right;
    align-items: center;
}

.el-header-right .menu {
    display: flex;
    justify-content: space-between;
    color: var(--el-header-color);
    font-size: var(--el-header-font-size-menu);
    font-weight: 600;
}

.el-header-right .menu-item {
    display: flex;
    list-style: none;
    padding: var(--el-header-padding-menu-item);

}

.el-header-right .el-right-nav a {
    border-bottom: solid transparent;
    padding: 0 0.5rem;
}

.el-header-right .el-right-nav .menu-item:hover {
    color: #151B26;
    background-color: #dddddd;
    border-radius: 8px;
    border-bottom: solid #151B26;
    transition: background-color var(--el-header-transition);
}

.el-header-right .el-right-nav .current-menu-item a {
    border-bottom: solid var(--el-header-color);
}

/* Header Mobile */
.el-layout-header .el-header-mobile {
    display: none;
    flex-wrap: nowrap !important;
    flex-grow: 1 !important;
    -webkit-box-flex: 1 !important;
    flex-shrink: 1 !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: right !important;
}

.el-header-mobile-menu a {
    display: flex;
    align-items: center;
}

.el-header-mobile .el-header-mobile-icon {
    height: 2rem;
}