body {
    background-color: #fff5ed
}

.userhome-icon img {
    max-width: 65px !important;
}

.userhome-icon {
    padding-top: 50px;
    text-align: center;
}

.userhome-text p {
    text-align: center;
    margin: auto;
    font-weight: 500;
    color: #af672e;
}

.item img {
    border-radius: 10px;
}

button.btn.btn-primary {
    background: #af672e;
    text-decoration: none;
    border: none;
    padding: 5px;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
}


.mobile-bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    will-change: transform;
    transform: translateZ(0);
    display: flex;
    height: 66px;
    box-shadow: 0 -2px 5px -2px #333;
    background-color: #fff;
}

.mobile-bottom-nav__item {
    flex-grow: 1;
    text-align: center;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.mobile-bottom-nav__item--active {
    color: red;
}

.mobile-bottom-nav__item-content {
    display: flex;
    flex-direction: column;
}

.mobile-bottom-nav__item-content {
    max-width: 45px;
    text-align: center;
    margin: auto;
}

    .mobile-bottom-nav__item-content p {
        margin: auto;
        color: #af6784;
        font-weight: 700;
    }

img.giftbox {
    max-width: 50px;
}

img.next {
    max-width: 40px;
}

.Opening-text {
    text-align: center;
}

section.box-Opening-b {
    padding: 10px;
    background: #3f4096;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    margin-top: 20px;
    border-radius: 10px;
}

.Opening-text {
    text-align: center;
    font-weight: 600;
    color: aliceblue;
    margin: auto;
    width: 100%;
}

.totel-coin {
    text-align: center;
    font-size: large;
    font-weight: 600;
    color: #21e607;
    margin: auto;
}

img.nav-icon {
    max-width: 40px;
}

div#owl-carousel {
    margin-top: 20px;
}

.logo-company img {
    max-width: 100px !important;
    width: auto;
    text-align: center;
    margin-top: 15px;
}

.profile-img img {
    max-width: 50px;
}

.profile-img {
    text-align: end;
    margin-top: 20px;
}

.footer {
    margin-bottom: 60px;
}

    .footer p {
        text-align: center;
        color: #b16a2f;
        font-weight: 600;
        padding: 10px;
    }

table.table {
    margin-top: 30px;
}

.page-navbar {
    padding: 10px;
    background: #ffffff;
    margin-bottom: 30px;
}

.page-name h2 {
    font-size: 23px;
    color: #af672e;
    font-weight: 400;
}

.page-name {
    text-align: end;
}

.img-user-main {
    text-align: center;
}


.shareArticle {
    display: flex;
    flex-flow: column;
    align-items: center;
    width: 100%;
    padding: 15px;
}

.shareSocial {
    display: flex;
    flex-flow: row;
    align-items: center;
    margin-bottom: 30px;
}

@media (max-width: 767px) {
    .shareSocial {
        flex-flow: column;
    }
}

.shareSocial .socialTitle {
    margin: 0 15px 0 0;
    font-size: 20px;
}

@media (max-width: 767px) {
    .shareSocial .socialTitle {
        margin-bottom: 15px;
        text-align: center;
    }
}

.shareSocial .socialList {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    justify-content: center;
    flex-flow: row wrap;
}

    .shareSocial .socialList li {
        margin: 5px;
    }

        .shareSocial .socialList li:first-child {
            padding-left: 0;
        }

        .shareSocial .socialList li a {
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 50px;
            height: 50px;
            border-radius: 100%;
            text-decoration: none;
            background-color: #999;
            color: #fff;
            transition: 0.35s;
        }

            .shareSocial .socialList li a i {
                position: absolute;
                top: 50%;
                left: 50%;
                transform-origin: top left;
                transform: scale(1) translate(-50%, -50%);
                transition: 0.35s;
            }

            .shareSocial .socialList li a:hover i {
                transform: scale(1.5) translate(-50%, -50%);
            }

        .shareSocial .socialList li:nth-child(1) a {
            background-color: #135cb6;
        }

        .shareSocial .socialList li:nth-child(2) a {
            background-color: #00aced;
        }

        .shareSocial .socialList li:nth-child(3) a {
            background-color: #bd081c;
        }

        .shareSocial .socialList li:nth-child(4) a {
            background-color: #111;
        }

        .shareSocial .socialList li:nth-child(5) a {
            background-color: #1fb381;
        }

.shareLink .permalink {
    position: relative;
    border-radius: 30px;
}

    .shareLink .permalink .textLink {
        text-align: center;
        padding: 12px 60px 12px 30px;
        height: 45px;
        width: 450px;
        font-size: 16px;
        letter-spacing: 0.3px;
        color: #494949;
        border-radius: 25px;
        border: 1px solid #f2f2f2;
        background-color: #f2f2f2;
        outline: 0;
        appearance: none;
        transition: all 0.3s ease;
    }

@media (max-width: 767px) {
    .shareLink .permalink .textLink {
        width: 100%;
    }
}

.shareLink .permalink .textLink:focus {
    border-color: #d8d8d8;
}

.shareLink .permalink .textLink::selection {
    color: #fff;
    background-color: #ff0a4b;
}

.shareLink .permalink .copyLink {
    position: absolute;
    top: 50%;
    right: 25px;
    cursor: pointer;
    transform: translateY(-50%);
}

    .shareLink .permalink .copyLink:hover:after {
        opacity: 1;
        transform: translateY(0) translateX(-50%);
    }

    .shareLink .permalink .copyLink:after {
        content: attr(tooltip);
        width: 140px;
        bottom: -40px;
        left: 50%;
        padding: 5px;
        border-radius: 4px;
        font-size: 0.8rem;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        background-color: #000;
        color: #fff;
        transform: translateY(-10px) translateX(-50%);
        transition: all 300ms ease;
        text-align: center;
    }

    .shareLink .permalink .copyLink i {
        font-size: 20px;
        color: #ff0a4b;
    }
.img-gif-referral img {
    max-width: 400px;
}
.logo-about img {
    max-width: 275px;
}
.logo-about {
    text-align: center;
}
@media screen and (max-width: 480px) {
    .gift-cardd {
        width: 45%; /* tighter on mobile */
    }
}

.user-name-home {
    margin-top: 20px;
}
strong#userName {
    font-size: 20px;
    color: #b36c33;
}
small.Welcome-home {
    color: #c46c33;
    font-weight: 600;
    font-size: 15px;
}
.User-Name img {
    max-width: 40px;
}