
.profile-2 {
    font-size: 1.1rem;
    overflow: hidden
}

.profile-2 [class^=btn-outline-], .profile-2 [class*=" btn-outline-"] {
    border-width: 2px
}

.profile-2 section {
    padding-top: 1.95rem
}

.profile-2 .btn {
    border-radius: 50rem
}

.profile-2 .btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #C6000B;
    --bs-btn-border-color: #C6000B;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #a80009;
    --bs-btn-hover-border-color: #9e0009;
    --bs-btn-focus-shadow-rgb: 207, 38, 48;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #9e0009;
    --bs-btn-active-border-color: #950008;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #C6000B;
    --bs-btn-disabled-border-color: #C6000B
                                       }

.profile-2 .btn-outline-primary {
    --bs-btn-color: #C6000B;
    --bs-btn-border-color: #C6000B;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #C6000B;
    --bs-btn-hover-border-color: #C6000B;
    --bs-btn-focus-shadow-rgb: 198, 0, 11;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #C6000B;
    --bs-btn-active-border-color: #C6000B;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #C6000B;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #C6000B;
    --bs-gradient: none
                      }

.profile-2 .title {
    font-size: 1.2rem;
    font-weight: 400;
    color: #c6000b;
    text-align: center;
    word-break: break-all;

}

.profile-2 .top {
    position: relative;
    padding: 0;
    overflow: hidden;
    background-color: #f1f1f1;
    border-bottom-right-radius: 80% 15%;
    border-bottom-left-radius: 80% 15%;
    box-shadow: 0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);
    width: 105%;
    margin-left: -2.5%
}

.profile-2 .top .bg {
    width: 110%;
    display: block;
    position: relative;
    z-index: 1;
    margin-left: -5%;
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom-right-radius: 80% 30%;
    border-bottom-left-radius: 80% 30%;
    box-shadow: 0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)
}

.profile-2 .top .bg.special {
    width: 100%;
    margin: 0
}

.profile-2 .top .intro {
    position: relative;
    z-index: 10;
    top: -3.5rem;
    margin-bottom: -3rem;
    padding-bottom: 1.8rem
}

.profile-2 .top .intro .avatar-container {
    display: block;
    text-align: center;
    position: relative;
    z-index: 10;
    top: -6rem;
    margin-bottom: -6rem;
    padding-bottom: 1rem
}

.profile-2 .top .intro .avatar-container .avatar {
    border-radius: 3.75rem;
    box-shadow: 0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);
    display: inline-block;
    width: 190px;
    height: 190px;
    padding: 5px;
    position: relative;
    background-color: #fff
}

.profile-2 .top .intro .avatar-container .avatar > img {
    border-radius: 3.6rem
}

.profile-2 .top .intro .avatar-container .avatar .img-placeholder {
    display: inline-block;
    width: 75px;
    height: 75px;
    position: absolute;
    border: 4px solid #dee2e6;
    overflow: hidden;
    bottom: 0;
    right: -2rem;
    border-radius: 50%
}

.profile-2 .top .intro .avatar-container .avatar .img-placeholder img {
    border-radius: 50%
}

.profile-2 .top .intro .user-detail {
    display: flex;
    padding: 0 3rem
}

.profile-2 .top .intro .user-detail .detail {
    flex: 1 1 auto
}

.profile-2 .top .intro .user-detail .detail .name, .profile-2 .top .intro .user-detail .detail .jobTitle, .profile-2 .top .intro .user-detail .detail .companyName {
    display: block;
    text-align: center
}

.profile-2 .top .intro .user-detail .detail .name {
    font-size: 1.5rem;
    color: #c6000b
}

.profile-2 .top .intro .user-detail .detail .jobTitle {
    font-size: 1.1rem
}

.profile-2 .top .intro .user-detail .detail .companyName {
    font-weight: 500;
    font-size: 1.1rem
}

.profile-2 .top .intro .user-action {
    display: flex;
    margin-top: 1rem;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
    /*padding: 0 3rem 1rem 3rem;*/
    gap: 1rem
}

@media (min-width: 1199px) {
    .profile-2 .top .intro .user-action {
        display: flex;
        margin-top: 1rem;
        margin-left: 1.5rem;
        margin-right: 1.5rem;
        padding: 0 2rem 1rem 3rem;
        gap: 1rem
    }
}

    .profile-2 .top .intro .user-action .btn {
        flex-grow: 1;
        flex-basis: 0;
        padding: 1rem 1.5rem
    }

    .profile-2 .about, .profile-2 .contact-details {
        padding: 0 1.5rem
    }

    .profile-2 .product-services {
        padding: 0 1rem
    }

        .profile-2 .product-services .title {
            margin-left: .5rem
        }

    .profile-2 .contact-details .detail {
        display: flex;
        margin-top: 1rem
    }

        .profile-2 .contact-details .detail .icn {
            display: inline-flex;
            width: 40px;
            min-width: 40px;
            max-width: 40px;
            height: 40px;
            border-radius: .5rem;
            background-color: #c6000b;
            color: #fff;
            align-items: center;
            justify-content: center;
            margin-right: 1rem;
            margin-top: 0
        }

            .profile-2 .contact-details .detail .icn .material-symbols-outlined {
                font-variation-settings: "FILL" 1,"wght" 500
            }

        .profile-2 .contact-details .detail > div {
            margin-top: .25rem
        }

    .profile-2 .swiper {
        margin-top: 1.5rem;
        border-radius: 1.5rem;
        overflow: hidden;
        box-shadow: 0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23)
    }

    .profile-2 .swiper-pagination {
        margin-top: 1rem;
        position: relative
    }

        .profile-2 .swiper-pagination .swiper-pagination-bullet {
            width: 10px;
            height: 10px;
            background-color: rgba(0,0,0,0);
            border: 1px solid #212529;
            opacity: 1
        }

            .profile-2 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                background-color: #212529
            }

.profile-2 .icon-lists .text-column .icon {
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24)
}

        .profile-2 .icon-lists .text-column .icon img, .profile-2 .icon-lists .text-column .icon svg {
            border-radius: 1.5rem
        }

    .profile-2 .icon-lists .dropper .icon-link {
        color: #c6000b
    }

    .profile-2 .icon-lists .product-services iframe {
        width: -webkit-fill-available;
        aspect-ratio: 1/0.55;
    }

    .branding-footer div div svg#leafy-brand #brand-wifi path,
    .branding-footer div div svg#leafy-brand #brand-leafy path,
    .branding-footer div div svg#leafy-brand #brand-card path {
        fill: #3b3b3b !important;
    }

    .branding-footer {
        fill: #212529;
        background-color: #ffffff;
        padding-top: 3rem;
        display: block;
        color: #adb5bd;
        position: relative;
    }

        .branding-footer p {
            color: #212529;
        }

        .branding-footer .brand {
            width: 130px;
        }

        .branding-footer div .branding-container div {
            background-color: #212529;
        }

            .branding-footer div .branding-container div div {
                margin: auto;
            }

                .branding-footer div .branding-container div div p {
                    text-align: center;
                    padding: 0 0 2rem 0;
                }

                .branding-footer div .branding-container div div div {
                    padding: 2rem 0rem;
                }


