/* ===================================
   USO HEADER
=================================== */

#uso-header{

    width:100%;
    margin:0 auto 15px;

}

.uso-header-bg{

    position:relative;

    height:190px;

    background:url("./images/header/header-bg.jpg") center top no-repeat;
    background-size:cover;

    border:1px solid #40678f;
    border-radius:8px;

    overflow:hidden;

}

.uso-logo{

    position:absolute;

    top:18px;

    left:50%;

    transform:translateX(-50%);

}

.uso-logo-row{

    height:150px;

    display:flex;

    justify-content:center;

    align-items:center;

}

.uso-logo img{

    max-width:850px;

    transition:.3s;

}

.uso-logo img:hover{

    transform:scale(1.02);

}

/*==================================================
 USO TOOLBAR
==================================================*/

#uso-toolbar{

    position:relative;

    margin-top:-1px;

    height:48px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 18px;

    background:rgba(10,10,12,.92);

    border:1px solid #384b60;

    border-top:none;

    border-radius:0 0 8px 8px;

}

.uso-toolbar-left,
.uso-toolbar-right{

    display:flex;

    align-items:center;

    gap:8px;

}

#uso-toolbar input,
#uso-toolbar select{

    height:30px;

    background:#1d1d1d;

    color:#ddd;

    border:1px solid #444;

    padding:0 10px;

}

.uso-login-btn,
.uso-register-btn{

    display:inline-block;

    padding:8px 16px;

    color:#fff;

    text-decoration:none;

    border-radius:5px;

    background:linear-gradient(#3b9638,#23621f);

}

.uso-register-btn{

    background:linear-gradient(#4ea447,#2f7b29);

}

/* ===================================
   USO TOOLBAR CENTER
=================================== */

.uso-toolbar-center{

    display:flex;

    justify-content:center;

    align-items:center;

    flex:1;

}

.uso-greeting{

    color:#d7e8f8;

    font-size:14px;

}

.uso-user-link{

    margin-left:6px;

    color:#7fd2ff;

    font-weight:bold;

    text-decoration:none;

}

.uso-user-link:hover{

    color:#ffffff;

}

/* ===================================
   USER INFO
=================================== */

.uso-toolbar-user{

    display:flex;

    align-items:center;

    margin-right:18px;

    color:#d8e8f6;

    font-size:13px;

}

.uso-toolbar-user strong{

    margin-left:6px;

    color:#7fd4ff;

    font-size:14px;

    font-weight:bold;

}

/*==================================================
 USO USERBAR
==================================================*/

#uso-userbar{

    display:flex;
    justify-content:space-between;
    align-items:center;

    height:38px;

    margin:10px 0;

    padding:0 18px;

    background:rgba(8,12,18,.90);
    border:1px solid #314b66;
    border-radius:6px;

    font-size:12px;
    color:#9db5ca;

}

.uso-userbar-left,
.uso-userbar-center,
.uso-userbar-right{

    display:flex;
    align-items:center;
    gap:14px;

}

.uso-userbar-center{
    justify-content:center;
    flex:1;
    color:#a9bfd6;
}

#uso-userbar a{

    color:#cfe8ff;
    text-decoration:none;
}

#uso-userbar a:hover{
    color:#ffffff;
}

#uso-userbar strong{
    color:#ffffff;
    font-weight:normal;
}

/* phpBB Standardleisten ausblenden */

#nav-main,
#nav-breadcrumbs,
#nav-footer{

    display:none;

}

/* Standard-Infobar von phpBB ausblenden */

.action-bar {

    display:none;

}

.uso-badge{

    display:inline-block;

    min-width:18px;

    height:18px;

    line-height:18px;

    margin-left:6px;

    padding:0 6px;

    border-radius:20px;

    background:#3f78d8;

    color:#fff;

    font-size:11px;

    text-align:center;

}

/*=========================================
 USO NAVIGATION
=========================================*/

.uso-navigation{

    position:absolute;

    left:50%;
    bottom:14px;

    transform:translateX(-50%);

    display:flex;
    justify-content:center;
    align-items:center;

    gap:10px;

    margin:0;
    padding:0;

    list-style:none;

    z-index:20;

}

.uso-navigation li{

    margin:0;
    padding:0;

}

.uso-navigation li a{

    transition:.25s;

}

.uso-navigation li a:hover{

    background:linear-gradient(#4f6d90,#2b415b);

    box-shadow:0 0 10px rgba(120,170,255,.45);

}

.uso-navigation li a.active{

    background:linear-gradient(#5684b7,#36567d);

    box-shadow:0 0 12px rgba(90,160,255,.55);

}

.uso-navigation a{

    display:block;

    width:110px;
    height:36px;

    line-height:36px;

    text-align:center;

    text-decoration:none;

    text-transform:uppercase;

    font-size:13px;
    font-weight:bold;

    color:#ffffff;

    border-radius:6px;

    border:1px solid #4f6d8b;

    background:linear-gradient(#3d5673,#24384e);

    box-shadow:
        inset 0 1px rgba(255,255,255,.15),
        0 2px 4px rgba(0,0,0,.45);

    transition:.20s;

}

.uso-navigation a:hover{

    background:linear-gradient(#5b7fa6,#36506d);

    color:#fff;

    transform:translateY(-2px);

}

.uso-navigation a:active{

    transform:translateY(0);

}

