html, body { background-color: var(--site-bg-color); font-family: 'Roboto', sans-serif; font-size: 16px; color: var(--site-text-color); cursor: default;}
a { color: var(--site-link-color); transition: color 0.2s;}
a:hover { color: var(--site-link-hover-color); text-decoration: none;}

.mainHeader { position: relative;}
.mainHeader.home { min-height: calc(90vh - 120px);}
.mainHeader.profile { min-height: 75vh;}
.mainHeader .navbg { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: var(--header-bg-color-to); background-image: linear-gradient(to bottom, var(--header-bg-color-from) 0%, var(--header-bg-color-to) 100%); z-index: 49;}
.mainHeader.home .navbg { opacity: 0.75;}
.mainHeader .navbar { position: relative; z-index: 50;}
.mainHeader .navbar a.navbar-brand,
.mainHeader .navbar-nav > li > a,
.mainHeader .navbar-toggler .navbar-toggler-icon { color: var(--header-text-color);}
.mainHeader .navbar-toggler { border: none;}
.mainHeader.round .navbg,
.mainHeader.round .navbar { border-bottom-left-radius: 24px; border-bottom-right-radius: 24px;}

.homeIntro,
.profileIntro { position: absolute; top: 0; left: 0; right: 0; background: no-repeat center scroll; background-size: cover; z-index: 1;}
.homeIntro { background-color: var(--site-home-slider-bg-color);}
.profileIntro { background-position: center;}
.homeIntroBox { min-height: calc(90vh - 120px); padding-top: 120px; background-color: rgba(241, 54, 85, 0.25);}
.profileIntroBox { min-height: 75vh; background-color: rgba(0, 0, 0, 0.4);}
/*.homeIntroBox .btn { border: 3px solid #ffffff67;}*/
.homeLProfs { background-color: var(--home-newprofiles-bg-color);}
.homeTFoot { position: relative;}
.homeTFootBox { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--site-home-slider-bg-color) no-repeat center scroll; background-size: cover; overflow: hidden;}
.homeTFootBoxInn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #00000085; overflow: hidden;}
.homeTFootBoxTxt { position: relative; z-index: 30;}

.profilePTop { position: relative; margin-top: -40vh; padding-bottom: 5vh; z-index: 10;}
.pptHead { border-top-left-radius: 24px; border-top-right-radius: 24px;}
.pptHead .details { border-bottom: 1px solid #f5f5f5;}
.pptNav { border-bottom: 1px solid #dedede;}
.pptNav .nav .nav-item .nav-link { padding-left: 0; margin-right: 6px; color: #aaaaaa;}
.pptNav .nav .nav-item .nav-link.active { border-bottom: 3px solid #111111; font-weight: 600; color: #333333;}
.pptPics .image .imageHA { overflow: hidden;}

.mainFooter { background-color: #2e2829; color: #cecacb; font-weight: 300;}
.mainFooter a { color: #ffffff;}
.mainFooter .copyright { border-top: 1px solid #4d4546;}
.mainFooter .icon { display: block; background-color: #4d4546; padding: 4px 8px; border-radius: 4px; text-align: center;}

.profilesList .profile { background-color: #ffffff; background-image: linear-gradient(to bottom, #eef1f4 0%, #ffffff 100%); border: 3px solid #ffffff; border-radius: 6px; overflow: hidden;}
.profilesList .image { overflow: hidden;}
.profilesList .image.circle { border-radius: 50%;}
.profilesList .profile .image { transition: border-radius 0.5s; margin-bottom: 0.5rem;}
.profilesList .profile .name { font-weight: 600; color: #111111;}
.profilesList .profile .name .age { color: #555555;}
.profilesList .profile .city { color: #999999;}
.profilesList .profile .bio { max-height: 48px;}
.profilesList .profile:hover .image { border-radius: 0;}

.profilesList .profile2 { position: relative; overflow: hidden;}
.profilesList .profile2 .text { position: absolute; bottom: 0; left: 0; right: 0; color: #ffffff; background-image: linear-gradient(to bottom, transparent 0%, #000000cc 100%);}
.profilesList .profile2 .text.btnon { bottom: 34px;}
.profilesList .profile2 .btn { position: absolute; bottom: 0; border-radius: 0;}

.sitePagination .page-item .page-link { color: var(--site-theme-color); border-radius: 500px; border: none; box-shadow: 0 0 5px 0 #0000001e; margin: 0 3px;}
.sitePagination .page-item.active .page-link { background-color: var(--site-theme-color); border-color: var(--site-theme-color); color: #ffffff;}

.themeLink { color: var(--site-theme-color) !important;}

.pptChatHead { position: relative; background: no-repeat center top scroll; background-size: cover; min-height: 15vh;}
.pptChatHeadBlk { position: absolute; background-color: rgba(0, 0, 0, 0.75); top: 0; left: 0; right: 0; bottom: 0;}
.pptChatHead .modal-header { position: relative; z-index: 10;}
.pptChat { position: relative; background-color: #ffffff; z-index: 15;}
.pptChatIcon { position: relative; margin-top: -60px; z-index: 15;}
.pptChatIcon img { border: 3px solid #ffffff;}

.blogList .item .title { color: #000000;}
.blogList .item:hover .title { color: inherit !important;}

.pageContent img { max-width: 100%;}
.pageContent a { color: blue; text-decoration: underline;}

.profileNPBox a .image { transition: box-shadow 0.3s;}
.profileNPBox a .image i { opacity: 0.00; transition: opacity 0.3s;}
.profileNPBox a .name { color: #e2e2e2; transition: color 0.3s;}
.profileNPBox a:hover .image { box-shadow: 0px 0px 12px 0px rgba(30, 22, 102, 0.20);}
.profileNPBox a:hover .image i { opacity: 0.75;}
.profileNPBox a:hover .name { color: #c4c4c4;}

.mcPointer { cursor: pointer;}

.fs10 { font-size: 10px;}
.fs11 { font-size: 11px;}
.fs12 { font-size: 12px;}
.fs13 { font-size: 13px;}
.fs14 { font-size: 14px;}
.fs15 { font-size: 15px;}
.fs16 { font-size: 16px;}
.fs18 { font-size: 18px;}
.fs20 { font-size: 20px;}
.fs24 { font-size: 24px;}
.fs28 { font-size: 28px;}
.fs30 { font-size: 30px;}
.fs32 { font-size: 32px;}
.fs36 { font-size: 36px;}
.fs40 { font-size: 40px;}
.fs50 { font-size: 50px;}
.fs60 { font-size: 60px;}

.txt300 { font-weight: 300;}
.txt600 { font-weight: 600;}

.text-theme { color: var(--site-theme-color);}
.text-home-icons { color: var(--site-home-icons-color);}

.bg-theme { background-color: var(--site-theme-color);}
.bg-gray { background-color: #eef1f4;}
.bg-black { background-color: #000000;}

.btn-theme,
.btn-theme:hover { background-color: var(--header-bg-color-to); color: var(--header-text-color);}

.btn-profiles,
.btn-profiles:hover { background-color: var(--profiles-btn-bg-color); color: var(--profiles-btn-text-color);}

.txtOverflow { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.txtNoWrap { white-space: nowrap;}

.mtnBox { display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; right: 0; z-index: 2000;}
.mtnBox > div { display: block; width: auto; height: 30px; padding: 0 16px; line-height: 30px; background-color: #000; text-align: center; color: #ffffff; font-size: 12px;}

.flexCenter { display: flex; align-items: center; justify-content: center;}
.imgCover { object-fit: cover; object-position: center;}

.w50 { width: 50px;}
.w60 { width: 60px;}
.w70 { width: 70px;}
.w120 { width: 120px;}
.h44 { height: 44px;}
.h60 { height: 60px;}
.h120 { height: 120px;}

.minw100 { min-width: 100%;}

.opac25 { opacity: 0.25;}
.opac50 { opacity: 0.50;}
.opac75 { opacity: 0.75;}

.boxVMore{position:relative}
.boxVMoreTxtBox{max-height:80px;overflow:hidden}
.boxVMoreBtn{position:absolute;bottom:0;left:0;width:100%;margin:0;padding:0;background-image:linear-gradient(to bottom, transparent, #ffffff)}
.boxVMoreBtn a{display:block;text-align:center;padding:20px 0 0 0;color:var(--site-link-color);font-size:16px}

.breadcrumbs { list-style: none; display: flex; padding: 12px 0 0 0; font-size: 14px; margin-bottom: -12px;}
.breadcrumbs li { position: relative; padding-right: 24px;}
.breadcrumbs li:not(:last-child)::after { content: '/'; position: absolute; right: 8px; top: 0; opacity: 0.75;}
.breadcrumbs li a { color: #000000;}


/* Medium devices (tablets, 768px and up) */

@media (min-width: 768px) {

    .mainHeader.home { min-height: 100vh;}
    .homeIntroBox { min-height: 100vh;}

    .profilePTop { margin-top: -50vh; padding-bottom: 5vh;}

    .mainFooter .copyright { border-top: none;}

    div.dropdown-multicol { width: 30em;}
    div.dropdown-row > a.dropdown-item { display: inline-block; width: 32%;}

    .homeIntroBox .btn:not(a.btn-sm) { padding: .5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: .3rem;}
    .homeIntroBox .btn.btn-sm { font-size: 1rem;}

    .pptPics .list .item:nth-child(odd) { border-right: 0.5rem solid #ffffff;}
    .pptPics .list .item:nth-child(even) { border-left: 0.5rem solid #ffffff;}

    .pptNav .nav .nav-item .nav-link { margin-right: 16px;}

    .profilesList .profile4 { position: relative;}
    .profilesList .profile4 .text { border-left-width: 0 !important;}
    .profilesList .profile4 .btn { position: absolute; right: 1rem; bottom: 1rem; width: auto;}

    /* Common */
    .fs14-md { font-size: 14px;}
    .fs16-md { font-size: 16px;}
    .fs17-md { font-size: 17px;}
    .fs18-md { font-size: 18px;}
    .fs20-md { font-size: 20px;}
    .fs24-md { font-size: 24px;}
    .fs26-md { font-size: 26px;}
    .fs28-md { font-size: 28px;}
    .fs30-md { font-size: 30px;}
    .fs32-md { font-size: 32px;}
    .fs60-md { font-size: 60px;}
    .fs80-md { font-size: 80px;}
    .w-50-md { width: 50% !important;}
    .w-75-md { width: 75% !important;}
    .w100-md { width: 100px;}
    .w200-md { width: 200px !important;}
}

/* Just Mobile devices (max 768px) */

@media (max-width: 767.999px) {

    .mainHeader .navbar .collapse .navbar-nav .nav-item .dropdown-menu { display: block !important;}
    .mainHeader .navbar .collapse .navbar-nav .nav-item.dropdown { width: 100%;}

    .pptBotNav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 50; background-image: linear-gradient(to bottom, transparent 0%, #555555 100%);}
    .pptBotNav .prev,
    .pptBotNav .next { background-color: #ffffff; padding: 3px;}
    .pptBotNav .prev { border-top-right-radius: 500px; border-bottom-right-radius: 500px;}
    .pptBotNav .next { border-top-left-radius: 500px; border-bottom-left-radius: 500px;}

    .modal-dialog-fullscreen { margin: 0; padding: 0; width: 100%; height: 100vh; max-height: 100vh;}
    .modal-dialog-fullscreen .modal-content { width: 100vw; height: 100vh; max-height: 100%; border: none; border-radius: 0;}

    .profilesList .profile4 { position: relative;}
    .profilesList .profile4 .text { border-top-width: 0 !important;}
    .profilesList .profile4 .btn { position: relative; top: -4px;}
}

@keyframes zoominouticon {
    0% { transform: scale(1, 1);}
    50% { transform: scale(1.3, 1.3);}
    100% { transform: scale(1, 1);}
}