* {margin: 0;padding: 0;box-sizing: border-box;}
html, body{height: 100%;}
img {display: block;max-width: 100%; max-height: 100%;}
a{text-decoration: none !important;}
a:hover{text-decoration: none !important;}
ul{list-style-type: none; padding-left: 0;}
header{height: 4em;}
h1, h2, h3, h4, h5, h6{margin-bottom: 0 !important;}
.text-right{text-align: right;} 
.w-33{width: calc(100% / 3) !important;}

#profile{
    height: 3em !important;
    gap: 1.5em;
}

#profile i.fa-user-circle{
    border-radius: 100%;
    font-size: 2.5em;
}

#profile p{
    display: flex;
    align-items: center;
    gap: 1em;
}

#profile p i{
    position: relative;
    top: -3px;
    font-size: 1.2em;
}

.icon-circle{
    width: 60px;
    height: 60px;
    border: 5px solid #ccc;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.icon-circle i{font-size: 1.5em;}

.icon-circle.success {border-color: #198754;}
.icon-circle.warning {border-color: #ffc107;}
.icon-circle.gray {border-color: #ccc;}
.icon-circle.danger {border-color: #dc3545;}

.icon-circle.success i{color: #198754;}
.icon-circle.warning i{color: #ffc107;}
.icon-circle.gray i{color: #ccc;}
.icon-circle.danger i{color: #dc3545;}

.overflow{
    max-height: 500px;
    overflow-y: scroll;
}