body header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 15px;
    padding-bottom: 0;
}
body header #header_inner {
    width: 100%;
    max-width: 1200px;
}
body header #header_inner #header_inner_top {
    display: flex;
    flex-direction: row;
    align-items: center;
    column-gap: 16px;
}
body header #header_inner #header_inner_top #header_inner_top_left {
    display: flex;
    align-items: center;
    justify-content: center;
}
body header #header_inner #header_inner_top #header_inner_top_left img {
    padding-top: 32px;
    padding-left: 32px;
    padding-bottom: 8px;
    cursor: pointer;
}
body header #header_inner #header_inner_top #header_inner_top_center {
    flex-grow: 1;
}
body header #header_inner #header_inner_top #header_inner_top_right {
    display: flex;
    align-items: center;
    justify-content: center;
}
body header #header_inner #header_inner_top #header_inner_top_right #header_inner_top_right_noauth {
    display: flex;
    flex-direction: row;
    align-items: center;
    column-gap: 16px;
}
body header #header_inner #header_inner_top #header_inner_top_right #header_inner_top_right_noauth .header_inner_top_right_noauth_item {
    cursor: pointer;
    font-weight: 500;
    color: var( --color-frontend_layout_header_top_right_auth_color );
    transition: color 0.3s ease;
}
body header #header_inner #header_inner_top #header_inner_top_right #header_inner_top_right_noauth .header_inner_top_right_noauth_item:hover {
    color: var( --color-frontend_layout_header_top_right_auth_color_hover );
}

body header #header_inner navbar {
    background-color: var( --color-frontend_layout_header_inner_navbar_bgnd );
    border-radius: 0.125rem;
    padding: 0px 32px;
    padding-right: 0;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
body header #header_inner navbar #header_inner_navbar_desktop {
    width: 100%;
    display: flex;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    /* column-gap: 32px; */
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item {
    position: relative;
    padding-left: 16px;
    padding-right: 16px;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_title {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    font-weight: 500;
    cursor: pointer;
    font-weight: 500;
    color: var( --color-frontend_layout_header_inner_navbar_left_color );
    font-size: 0.9rem;
    transition: color 0.3s ease;    
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_title:hover {
    color: var( --color-frontend_layout_header_inner_navbar_left_color_hover );    
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children {
    overflow: hidden;
    height: 0;
    position: absolute;
    left: 0;
    background-color: var( --color-frontend_layout_header_inner_navbar_left_children_bgnd );
    box-shadow: 0px 4px 4px 0px var( --color-frontend_layout_header_inner_navbar_left_children_shadow );
    border-bottom-left-radius: 0.225rem;
    border-bottom-right-radius: 0.225rem;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children .header_inner_navbar_desktop_left_item_children_inner {
    padding: 16px;
    padding-right: 64px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    row-gap: 8px;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children .header_inner_navbar_desktop_left_item_children_inner i.fa-xmark {
    position: absolute;
    top: 16px;
    right: 16px;
    cursor: pointer;
    color: var( --color-frontend_layout_header_inner_navbar_left_children_close_color );
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children .header_inner_navbar_desktop_left_item_children_inner .header_inner_navbar_desktop_left_item_children_inner_parent {
    font-weight: 500;
    font-size: 1rem;
    color: var( --color-frontend_layout_header_inner_navbar_left_children_parent_color );
    transition: opacity 0.3s ease;
    cursor: pointer;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children .header_inner_navbar_desktop_left_item_children_inner .header_inner_navbar_desktop_left_item_children_inner_parent:hover {
    opacity: 0.75;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children .header_inner_navbar_desktop_left_item_children_inner .header_inner_navbar_desktop_left_item_children_inner_child {
    font-size: 0.8rem;
    white-space: nowrap;
    color: var( --color-frontend_layout_header_inner_navbar_left_children_child_color );
    cursor: pointer;
    transition: opacity 0.3s ease;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_left .header_inner_navbar_desktop_left_item .header_inner_navbar_desktop_left_item_children .header_inner_navbar_desktop_left_item_children_inner .header_inner_navbar_desktop_left_item_children_inner_child:hover {
    opacity: 0.5;
}

body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_right {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    column-gap: 16px;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_right #header_inner_navbar_desktop_right_search {
    padding: 8px 0;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_right #header_inner_navbar_desktop_right_search input {
    border: none;
    border-radius: 0.125rem;
    padding: 6px 12px;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_right #header_inner_navbar_desktop_right_events {
    padding: 8px 16px;
    background-color: var( --color-frontend_layout_header_inner_navbar_right_events_bgnd );
    display: flex;
    flex-direction: row;
    align-items: center;
    column-gap: 4px;
    color: var( --color-frontend_layout_header_inner_navbar_right_events_color );
    font-weight: 500;
    font-size: 0.9rem;
}
body header #header_inner navbar #header_inner_navbar_desktop #header_inner_navbar_desktop_right #header_inner_navbar_desktop_right_events i {
    display: flex;
    align-items: center;
    justify-content: center;
}

body header #header_inner navbar #header_inner_navbar_mobile {
    padding: 8px 16px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    display: none;    
}

@media( max-width: 600px ) {
    body header { padding-left: 0; padding-right: 0; }
    body header #header_inner #header_inner_top #header_inner_top_left { flex-grow: 1; }
    body header #header_inner #header_inner_top #header_inner_top_left img { padding-left: 0;  }
    body header #header_inner #header_inner_top #header_inner_top_center { display: none; }
    body header #header_inner #header_inner_top #header_inner_top_right { display: none; }

    body header #header_inner navbar { padding-left: 0; padding-right: 0; }    
    body header #header_inner navbar #header_inner_navbar_desktop { display: none; }	
    body header #header_inner navbar #header_inner_navbar_mobile { display: flex; width: 100%; }
    body header #header_inner navbar #header_inner_navbar_mobile #header_inner_navbar_mobile_left i { color: var( --color-frontend_layout_header_inner_navbar_left_color ); }
    body header #header_inner navbar #header_inner_navbar_mobile #header_inner_navbar_mobile_right i { color: var( --color-frontend_layout_header_inner_navbar_left_color ); }    
}