#module-content {
    flex: 1;

    padding: 15px 20px;

    transition: opacity 0.3s ease-in-out;

    position: relative;
}

header {
    width: 100%;
    height: 65px;

    padding: 0 20px;

    border-bottom: 1px solid #e7e7e7;

    display: flex;
    align-items: center;
}

header .logo {
    height: 27.5px;
}

#account {
    width: 45px;
    height: 45px;

    font-size: 15.33px;
    font-weight: bold;
    
    background-color: #f7f7f7;
    
    outline: 1px solid #e7e7e7;
    border-radius: 50%;
    
    display: flex;
    justify-content: center;
    align-items: center;
    
    position: absolute;
    right: 20px;

    cursor: pointer;
}

#account:hover{
    background-color: #e7e7e7;
}

.options-div {
    width: 235px;

    font-weight: 500;
    
    background-color: #fff;
    
    outline: 1px solid #e7e7e7;
    border-radius: 5px;
    
    display: none;
    
    position: absolute;
    right: 0;
    
    z-index: 99;
}

.options-div .items-container {
    padding: 3px 0;
}

.options-div .item {
    width: 100%;
    height: 45px;
    
    font-weight: 500;
    font-size: 13.33px;

    color: #000;
    
    display: flex;
    justify-content: left;
    align-items: center;
}

.options-div .item:hover {
    background-color: #f9f9f9;
}

.options-div .item .icon {
    font-size: 23px;
    
    margin: 0 10px 0 20px;
}

.options-div .item .text {
    font-size: 13.33px;
}

.account-info {
    margin-left: 10px;
    
    display: flex;
    justify-content: center;
    
    flex-direction: column;
}

.account-info .text {
    font-size: 13.33px;
    font-weight: bold;
}

.account-info .subtext {
    font-weight: 500;
}

.account-info .subtext {
    font-size: 13.33px;
}

.warning-box {
    width: 100%;
    height: 65px;

    font-size: 15.33px;
    font-weight: bold;

    background-color: #eb1000;
    color: #fff;
    opacity: 40%;

    border-radius: 5px;

    display: flex;
    justify-content: center;
    align-items: center;
}

.warning-box .icon {
    font-size: 24px;

    color: #fff;

    margin-right: 10px; 
}

nav {
    width: 250px;
    min-height: calc(100vh - 95px);

    margin: 20px 0;
}

nav .item {
    width: 100%;
    height: 45px;

    font-weight: 500;

    margin-bottom: 3px;

    padding-left: 20px;

    border-radius: 0 22.5px 22.5px 0;

    display: flex;
    align-items: center;
    position: relative;

    transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

nav .item:hover {
    background-color: #f7f7f7;
}

nav .selected, nav .selected:hover {
    background-color: #e7e7e7;
}

nav .item .text {
    font-size: 15.33px;

    margin-left: 12.5px;
}

nav .parent {
    color: #000;
    opacity: 40%;

    height: 20px;
    
    margin: 15px 0;
}

nav .parent:hover {
    color: #000;
    opacity: 50%;

    background-color: transparent;
}

nav .parent .text {
    font-size: 13.33px;
    font-weight: bold;

    margin: 0;

    text-transform: uppercase;
}

nav .item .icon {
    font-size: 25px;
}

nav .parent .expand-icon {
    font-size: 21px;

    margin-left: 5px;
}

nav .child {
    display: none;
}

h3 {
    white-space: nowrap;
}