.credit-footer {
    position: absolute;
    bottom: 0;
    right: 0.5em;
    font-size: 0.75em;
    margin-bottom: 0.5em;
}

s.title {
    font-size: 2em;
    font-weight: 500;
}

.button-parent-div {
    position: absolute;
    bottom: 10px;
}

.sub-text {
    color: #9CA3AF;
}

input.input-text, .input-text > input {
    background-color: #efefef85 !important;
    border-radius: 5px !important;
    border: none !important;
    padding: 10px !important;
    width: 100% !important;
    outline: none !important;
    padding-left: 32px !important;
    color: #ababab !important;
}

input.input-text::placeholder, .input-text > input::placeholder {
    color: #d0d0d0 !important;
    opacity: 1 !important;
    /* Firefox */
}

.marg-top-50 {
    margin-top: 50px;
}

.marg-top-20 {
    margin-top: 20px;
}





.input-icons i {
    position: absolute;
}

.input-icons {
    width: 100%;
    margin-bottom: 10px;
}

.icon {
    padding: 10px;
    min-width: 40px;
    color: #ababab;
}

.input-field {
    width: 100%;
    padding: 10px;
    text-align: center;
}


.grid-cards {
    box-shadow: rgb(0 0 0 / 12%) 0px 4px 16px;
    height: 30%;
}




/* -------------------------------page CSS------------------------------------------------------ */


.massage-div {
    margin-top: 10px;
    margin-bottom: 0px;
}

.header-toolbar {
    position: sticky;
    top: 0;
}

.header-toolbar ion-header.header-md:after {
    background: none;
}

.header-toolbar ion-header,
.header-toolbar ion-toolbar {
    border: none !important;
    --border-style: none !important;
    border-color: none !important;
    border-bottom: none !important;
}

.header-toolbar ion-toolbar {
    /* background-color: #3880ff; */
    /* --background: url("../assets/images/nav.jpeg") no-repeat center;
    --background-repeat: no-repeat;
    --background-size: contain; */
    --background: #03009b;
    /* --background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%236a9df6' fill-opacity='0.9' fill-rule='nonzero'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); */
}

.topHeader {
    height: 8rem;
    margin-bottom: -8rem;
    /* border-end-start-radius: 60px !important; */
    background-color: #3880ff;
    background: url("../assets/images/navImage.jpeg") no-repeat no-repeat;
    background-size: 100% auto !important;
    /* object-fit: contain; */
    /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%236a9df6' fill-opacity='0.9' fill-rule='nonzero'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); */
}

.avatar {
    border-radius: 10px;
}

.profileStats {
    background-color: #f5f5f5;
    border-radius: 10px !important;
    padding: 0.2rem;
    align-content: center;
    margin-top: 1em;
    --color: #03009b;
}

.profileStat {
    text-align: center;
    margin: 0 auto;
}

.profileStat ion-card-title {
    --color: #03009b;
    font-size: 1rem;
}

.profileStat ion-card-subtitle {
    --color: #03009b;
    font-size: 1rem;
}

.profileInfo {
    text-align: left;
    margin-top: -0.2rem;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.profileName {
    color: #3b3b3b !important;
    font-weight: 500 !important;
}

.profileCard {
    --background: #ffd500;
    color: #03009b !important;
}
.profileCard ion-icon {
    font-size: 1.75rem;
    color: #5893fa;
    margin-bottom: 1rem;
}
.profileStatus ion-card-subtitle {
    color: #03009b !important;
}

.profileStatusContainer {
    margin-top: -2rem;
    margin-bottom: -2rem;
}

.profileStatusContainer ion-card-content {
    margin-top: -1rem !important;
}

.profileActionContainer {
    margin-top: -2rem;
}

.profileStatus ion-card-subtitle {
    margin-top: 0.35rem;
    margin-left: 1rem;
    text-align: center;
    width: 100%;
    font-size: 1.1em;
}

.profileActionCard {
    padding-top: 0.5rem;
}

.profileActionCard ion-icon {
    font-size: 1.75rem;
    color: #5893fa;
    margin-top: -0.3rem;
}

/* -----------for Forms-------------------------------- */

.h1 {
    font-size: 23px !important;
    margin: 10px 0px !important;
}

.h2 {
    font-size: 18px !important;
}

.head {
    margin-left: -5px;
}

.logOut-dropdown {
    background: #ffffffe0 !important;
    width: 25% !important;
    height: 27px;
    border-radius: 9px !important;
    position: fixed;
    right: 10px !important;
    top: 38px;
    padding: 1px 10px !important;
    color: #686868 !important;
    text-align: center;
}