@import url("https://fonts.googleapis.com/css2?family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;515;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");

@font-face {
    font-family: "arial";
    src: url("../fonts/arial.eot");
    src: url("../fonts/arial.eot") format("embedded-opentype"),
        url("../fonts/arial.woff2") format("woff2"),
        url("../fonts/arial.woff") format("woff"),
        url("../fonts/arial.ttf") format("truetype"),
        url("../fonts/arial.svg#arial") format("svg");
}

/* width */
::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #ced9df;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #ced9df;
}

* {
    margin: 0;
    padding: 0;
    font-family: "Roboto", serif;
}

body {
    background-color: #f3f3f3;
}

.header {
    height: 60px;
    position: fixed;
    z-index: 999;
    padding: 0 10px 0 0;
    width: 100%;
    float: left;
    box-shadow: 0 1px 2px #0000000d;
    background: #fff;
    margin: 0 0 0 61px;
}

.logo {
    padding: 6px 0;
}

.logo a {
    display: inline-block;
    text-decoration: none;
    color: #fff;
    font-family: "arial";
}

.logo a h2 {
    font-size: 28px;
    font-family: "arial";
    color: #fff;
    margin: 0;
    font-weight: 700;
    letter-spacing: 2px;
}

.modal-backdrop.show {
    opacity: 0;
}

.modal-backdrop {
    position: unset;
}

.container.item-work button.btn.btn-info.btn-lg {
    background-color: #fff;
    border-color: #fff;
    border-radius: 0;
    padding: 0;
    box-shadow: none;
}

.modal-dialog.after-loginpp {
    max-width: 900px;
}

.modal-body.hdr-pp {
    text-align: left;
}

.login-popup {
    width: 150px;
    padding: 10px;
    background: #fff;
    position: absolute;
    top: 56px;
    right: 0;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 1px 2px #0000000d;
    border: 1px solid #efefef;
}

.login-popup.open {
    top: 46px;
    opacity: 1;
    visibility: visible;
}

.login-popup img {
    width: 36px;
    margin: 0 0 2px 0;
}

.menu-box {
    width: 100%;
    float: right;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.menu-box ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.menu-box ul li {
    display: inline-block;
    padding: 2px 14px;
    text-align: left;
    position: relative;
}

.menu-dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    opacity: 0;
    top: 42px;
    left: -163px;
    position: absolute;
    background-color: #fff;
    min-width: 322px;
    box-shadow: 0px 8px 16px -2px rgb(0 0 0 / 57%);
    z-index: 111111;
    padding-top: 5px;
    border-radius: 8px;
    transition: 500ms all ease-in-out 0s;
    visibility: hidden;
    overflow: hidden;
}

.dropdown-content:before {
    position: absolute;
    display: inline-block;
    content: "";
    top: -7px;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #fff;
    right: 43%;
}

.dropdown-content .fr-title {
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc;
    padding: 7px 0 9px 0;
}

.dropdown-content .fr-title h3 {
    float: left;
    font-size: 11px;
    padding-left: 17px;
    padding-top: 6px;
    font-weight: 600;
    color: #54668f;
}

.dropdown-content .fr-title a {
    float: right;
    color: #000;
    font-size: 10px;
    padding-top: 4px !important;
    margin-right: 21px;
    text-transform: uppercase;
    font-weight: bold;
}

.dropdown-content .fr-title a:hover {
    color: #7c5ac2 !important;
}

.menu-dropdown:hover .dropdown-content {
    opacity: 1;
    transition: 500ms all ease-in-out 0s;
    visibility: visible;
}

ul.drop-menu {
    float: left;
    width: 100%;
}

.drop-menu {
    list-style: outside none none;
    padding-left: 0;
}

.drop-menu li {
    border-bottom: 1px solid #ccc;
    display: inline-block;
    position: relative;
    width: 100%;
}

.drop-menu li a {
    display: inline-block;
    padding: 10px;
    width: 100%;
}

.drop-menu li a img {
    display: inline-block;
    max-width: 50px;
    vertical-align: top;
    width: 16.7%;
    border-radius: 100%;
    border: 2px solid #fff;
    box-shadow: 0px 0px 12px -5px #202f50;
}

img {
    max-width: 100%;
}

li.nav-item.nav-item--feed a {
    padding-top: 4px;
}

ul.drop-menu li a {
    padding-bottom: 4px !important;
}

.mesg-meta {
    display: inline-block;
    padding-left: 10px;
    vertical-align: middle;
    width: 81%;
    color: #000;
    text-align: left;
    line-height: 17px;
}

.mesg-meta h6:hover {
    color: #8375d5;
    transition: 0.9s;
}

.mesg-meta p {
    font-size: 11px;
    margin-bottom: 0;
}

.mesg-meta h6 {
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 0.3px;
    margin-bottom: 0;
    text-transform: capitalize;
    line-height: 16px;
}

.mesg-meta p {
    color: #838ea5;
    display: inline-block;
    font-size: 12px;
    line-height: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.mesg-meta i {
    color: #999;
    font-size: 12px;
    font-style: normal;
}

.dropdown-content .button {
    width: 100%;
    background: #e6edff;
    color: #374a74;
    padding: 5px;
    outline: none;
    border-radius: 0;
    border: none;
    font-size: 11px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold;
    padding: 11px 0 9px;
    box-shadow: 0px -4px 20px 0px #a8b4cf;
}

.dropdown-content .button:hover {
    background: #8375d5;
    color: #fff;
    transition: 0.9s;
}

li.nav-item {
    padding-top: 6px !important;
}

.menu-box ul li:first-child:after {
    display: none;
}

.menu-box ul li a {
    text-decoration: none;
    padding: 0px 0;
    position: relative;
    display: block;
    color: #485264 !important;
    font-weight: 500;
}

.profile-img-box {
    height: 100%;
    padding: 8px 11px 9px !important;
    vertical-align: top;
}

.menu-box ul li:last-child:after {
    display: none;
}

.menu-box ul li a:hover,
.menu-box ul li a:hover span {
    transition: 0.4s;
}

.menu-box ul li.nav-item-work a:hover,
.menu-box ul li.nav-item-work a:hover span {
    color: #ccc;
}

.menu-box .nav-item {
    min-width: 80px;
}

.menu-box .nav-item {
    min-width: 40px;
    margin-top: 8px;
}

.nav-item__icon svg {
    overflow: hidden;
    vertical-align: middle;
    width: 22px;
}

.menu-dropdown span.nav-item__icon i {
    font-size: 22px;
}

.nav-item__title {
    font-size: 13px;
    display: block;
    color: #ffffff;
    font-weight: normal;
    letter-spacing: 2px;
    transition: color 0.3s;
}

.menu-dropdown span.nav-item__icon .count {
    width: 19px;
    height: 19px;
    background: #374a74;
    font-size: 12px;
    top: -5px;
    left: 13px;
    position: absolute;
    border-radius: 20px;
    text-align: center;
    color: #fff;
}

.pro-file {
    width: 35px;
    height: 35px;
    border: 2px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    float: left;
    margin-top: 3px;
}

.pro-file img {
    width: 100%;
}

.prof-nam-b {
    float: right;
    display: inline-block;
    padding-left: 6px;
    padding-right: 30px;
}

.prof-nam-b p {
    margin: 0;
    font-size: 10px;
    color: #686868;
    line-height: 8px;
}

.prof-nam-b .fa-caret-down {
    position: absolute;
    right: 10px;
    top: 1px;
}

.nav-item-work {
    padding: 0px 0 !important;
}

.menu-box.menu-log {
    width: 80%;
    overflow: hidden;
    margin-top: -1px;
}

.menu-box.menu-log li.nav-item-work.nav-log {
    background: none;
    list-style-type: none;
}

.item-work {
    float: left;
    width: 100%;
}

.item-work .work-btn {
    outline: none;
    border: none;
    padding: 5px 8px;
    background: #182032;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    cursor: pointer;
    grid-gap: 0 5px;
}

.item-work .btn.focus,
.item-work .btn:focus {
    outline: 0;
    box-shadow: none;
}

.nav-item-work .nav-item__title {
    font-size: 12px;
    display: inline-block;
    color: #fff;
    font-weight: 600;
    letter-spacing: 2px;
    transition: color 0.3s;
    font-family: "arial";
}

.nav-item-work a {
    margin-top: -0 !important;
}

.nav-item-drop__icon i.fa.fa-caret-down {
    line-height: 8px;
    position: relative;
}

.nav-item-work .nav-item__icon {
    color: #fff;
    font-size: 22px;
    line-height: 0;
}

.nav-item-drop__icon {
    float: left;
    width: 100%;
    color: #ff6937;
    line-height: 0;
}

.team-work-popup {
    padding: 15px;
    position: absolute;
    top: 70px;
    right: 0;
    height: 300px;
    width: 300px;
    overflow: auto;
    background: #fff;
    z-index: 9;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    box-shadow: 0 2px 5px #0000002b;
    border-radius: 0 0 6px 6px;
    transition: all 0.3s ease-in-out;
    opacity: 0;
    visibility: hidden;
}

.team-work-popup.open {
    top: 50px;
    opacity: 1;
    visibility: visible;
}

.team-w-p-box {
    width: 30%;
}

.team-w-p-box a {
    margin: 0;
    padding: 0 !important;
    font-size: 28px;
    color: #126105 !important;
    text-align: center;
}

.team-w-p-box a h4 {
    margin: 0;
    padding: 0;
    font-size: 14px;
    color: #515365;
}

.prof-sign {
    display: none;
    position: absolute;
}

.profile-img-box .dropdown-menu.show {
    max-width: none;
    padding: 0px 0 0;
    width: 256px;
    right: 0px;
    left: auto;
    text-align: left;
    position: absolute;
    transform: translate3d(-50px, 77px, 0px) !important;
    top: -11px !important;
    left: 0px;
    will-change: transform;
    border-top: 4px solid #3e89e7;
    transition: all 0.3s ease;
    z-index: 1111111111;
}

.profile-img-box .dropdown-menu.show:before {
    position: absolute;
    display: inline-block;
    content: "";
    top: -11px;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #3e89e7;
    right: 15px;
}

.profile-img-box #dropdownMenuButton {
    border: none;
    background: none;
    outline: none;
}

.profile-img-box .dropdown-toggle::after {
    display: none !important;
}

.profile-img-box .btn-secondary:not(:disabled):not(.disabled).active:focus,
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: none !important;
}

.profile-img-box .btn-secondary.focus,
.profile-img-box .btn-secondary:focus {
    box-shadow: none !important;
}

.artdeco__content-inner {
    float: left;
    width: 100%;
}

.artdeco__content-inner ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.socil-forfile-drop {
    padding: 0;
    display: block;
    width: 100%;
    float: left;
    text-align: left;
    padding: 10px;
}

.socil-forfile-drop a {
    text-decoration: none;
    display: inline-block !important;
    width: 100%;
    float: left;
}

.socil-forfile-drop a svg {
    width: 27px;
    margin-right: 6px;
    position: relative;
    top: -1px;
}

svg.svg-inline--fa.fa-cog.fa-w-16.fa-7x {
    position: relative;
    width: 15px;
    margin-right: 5px;
    opacity: revert;
    top: 4px;
}

.socil-forfile-drop a:hover {
    text-decoration: none;
    color: #202433;
}

.settings-profile {
    float: left;
    width: 100%;
}

.settings__member-info {
    display: inline-block;
    float: right;
    text-align: center;
    width: 100%;
}

.socil-forfile-drop .settings__member-photo {
    width: 60px;
    height: 60px;
    border: 2px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    box-shadow: 0px 0px 15px #202433;
}

.socil-forfile-drop .settings__member-photo img {
    width: 100%;
}

.settings__member-infoP {
    color: #202433;
}

span.settings__member-info h3 {
    font-size: 16px;
    font-weight: bold;
    color: #202433;
    font-family: "arial";
    letter-spacing: 1px;
    margin: 0;
    margin-bottom: 6px;
    padding: 4px 0 0;
}

span.settings__member-info h4 {
    font-size: 13px;
    font-weight: bold;
    color: #515365;
    font-family: "arial";
    letter-spacing: 1px;
    margin: 0;
}

.settings-profile-menu-bar .setting-profile-menu li svg {
    width: 16px;
    margin-right: 3px;
    position: relative;
    top: 3px;
}

.settings-profile-menu-bar {
    float: left;
    width: 100%;
}

.settings-profile-menu-bar h5 {
    padding: 8px 12px;
    text-transform: uppercase;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    background: #f3f6f8;
    font-family: "arial";
    font-size: 14px;
    font-weight: 600;
    color: #202433;
    text-align: center;
}

.setting-profile-menu {
    list-style-type: none;
    margin: 0;
    padding: 0 10px !important;
    margin-bottom: 17px !important;
    margin-top: 8px !important;
}

.settings-profile-menu-bar .setting-profile-menu:nth-child(2) {
    margin-bottom: 0px !important;
}

.settings-profile-menu-bar .setting-profile-menu li {
    display: block !important;
    text-align: left;
    padding: 3px 0 !important;
}

.settings-profile-menu-bar .setting-profile-menu li a {
    display: inline-block;
    color: rgba(0, 0, 0, 0.6);
    font-family: "arial";
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
}

.settings-profile-menu-bar .setting-profile-menu li a:hover {
    color: #3e89e7 !important;
}

.settings-profile-menu-bar .setting-profile-menu li:after {
    display: none;
}

.settings-profile-menu-bar .sign-btton {
    font-size: 14px;
    font-weight: 600;
    border-top: 1px #cfcfcf solid;
    display: inline-block;
    padding: 12px;
    text-align: center;
    font-family: "arial";
    width: 100%;
    letter-spacing: 1px;
    margin-top: 21px;
}

.settings-profile-menu-bar .sign-btton:hover {
    color: #ffffff;
    background: #e7e7e7;
    text-decoration: none;
}

/*--work--*/
.nav-item-work .dropdown-menu.show {
    position: absolute;
    transform: translate3d(-313px, 70px, 0px) !important;
    top: -11px !important;
    left: 0px;
    will-change: transform;
    padding: 3px 16px 20px;
}

.nav-item-work .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
    min-width: 370px;
    padding: 0.5rem;
    margin: 0.125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 0;
    border-radius: 4px;
    box-shadow: 2px 0px 16px #202433d1;
    border-top: 4px solid #202433;
}

.nav-item-work .dropdown-menu h3 {
    margin: 0;
    color: #202433;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
    font-family: "arial";
    margin-top: 13px;
}

.nav-item-work .dropdown-toggle::after {
    display: none;
}

.social-pruduct .product-list {
    list-style-type: none;
    margin: 0;
    padding: 11px;
    border: 1px solid #f1f1f1;
    margin-top: 10px;
    box-shadow: 0 0 4px #20243359;
}

.social-pruduct .product-list li {
    display: inline-block;
    padding: 13px 16px;
}

.social-pruduct .product-list li:after {
    display: none;
}

.social-pruduct .product-list li a {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #ffffff;
    box-shadow: 0 0 10px #b9c2e3;
    text-align: center;
    border-radius: 50%;
    padding: 5px 0;
}

.social-pruduct .product-list li a svg {
    color: #b9c2e3;
    display: inline-block;
    width: 27px;
}

.social-pruduct .product-list li a:hover {
    box-shadow: 0 0 8px #282c3cab;
}

.Business-servc-item {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.Business-servc-item li {
    width: 100%;
    float: left;
    padding: 0px !important;
    border-bottom: 1px solid #e6e6e6;
}

.Business-servc-item li:after {
    display: none;
}

.Business-servc-item li:first-child {
    margin-top: 10px;
    border-top: 1px solid #e6e6e6;
}

.Business-servc-item li a {
    text-decoration: none;
    text-align: left !important;
    width: 100%;
    padding: 12px 6px !important;
}

.Business-servc-item li a:hover {
    background: rgba(152, 216, 244, 0.25);
}

.Business-servc-item li a h5 {
    color: #202433;
    display: inline-block;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    font-family: "arial";
    text-align: left;
    padding: 0;
    margin: 0;
}

.Business-servc-item li a p {
    margin: 0px 0;
    font-size: 13px;
    font-weight: 600;
    color: #878ea6;
    letter-spacing: 1px;
    font-family: "arial";
}

/*--show---more --show-less*/

.moretext {
    display: none;
}

/*-------------------
		body
------------------------*/
.home-detile-box {
    float: left;
    width: 100%;
    background: #f3f3f3;
    padding: 60px 0 14px;
}

.home-detile-box .container-fluid {
    padding-left: 85px;
    padding-right: 78px;
}

.right-bar {
    display: none;
}

/*-*-*.stasts-bar-*-**/
.stasts-bar {
    float: left;
    width: 100%;
    /* background: #fff; */
    padding: 0;
    font-family: "arial";
    border-radius: 10px;
    box-shadow: 0 1px 3px #0000000d;
    position: relative;
    margin-bottom: 0;
}

.stats-item.stats-your {
    float: left;
    width: 93px;
    border-radius: 8px;
    background: #2e2e2e;
    overflow: hidden;
    margin-right: 9.3px;
    position: relative;
}

.your-strtes-img {
    position: absolute;
    bottom: 0;
    text-align: center;
    background: #0000001c;
}

.img-saats {
    float: left;
    width: 100%;
}

.img-saats img {
    width: 100%;
}

.your-plus-icon {
    float: left;
    width: 100%;
    position: relative;
    text-align: center;
    padding: 10px 0 2px;
    margin-top: -13px;
}

span.plus-icn {
    display: inline-block;
    width: 25px;
    height: 25px;
    background: #fff;
    border-radius: 50%;
    color: #6b8e23;
    line-height: 25px;
    margin-top: 0;
}

span.story-hedr {
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 6px;
    font-family: "Quicksand", sans-serif;
    line-height: 17px;
    letter-spacing: 1px;
}

span.plus-img {
    width: 35px;
    height: 35px;
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #6b8e23;
}

span.arrow-stroj {
    width: 30px;
    height: 30px;
    background: #000;
    display: inline-block;
    border-radius: 50%;
    position: absolute;
    text-align: center;
    color: #fff;
    font-size: 17px;
    line-height: 33px;
    top: 50%;
    right: -22px;
    transform: translate(-50%, -50%);
}

span.arrow-stroj a {
    color: #ffffff;
}

.contan-frd-list {
    float: left;
    width: 100%;
    background: #fff;
    padding: 0 14px;
    font-family: "arial";
    border-radius: 10px;
    position: relative;
    margin-bottom: 0;
}

/* .frd-list-head {
    float: left;
    width: 100%;
    margin-bottom: 11px;
} */

.frd-list-head h4 {
    font-size: 17px;
    font-weight: 600;
    color: #515365;
    font-family: "Quicksand", sans-serif;
    margin: 0;
    display: inline-block;
    /* float: left; */
}

.frd-list-head a {
    /* float: right; */
    color: #3e89e7;
    font-size: 14px;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
    cursor: pointer;
}

.frd-list-head a:hover {
    color: #8375d5 !important;
}

.frd-slide-list {
    float: left;
    width: 100%;
}

.frd-slide-list-item {
    float: left;
    width: 100%;
    border: 1px solid #c3c3c3;
    padding: 0px 0px 12px;
    border-radius: 7px;
    text-align: center;
    margin: 0;
    overflow: hidden;
}

.frd-slide-list-item span {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: inline-block;
    overflow: hidden;
    margin-top: -39px;
    border: 3px solid #fff;
    box-shadow: 0px 0px 13px 0px #18203285;
    background: #fff;
}

.frd-slide-list-item span img {
    width: 100%;
}

.frd-slide-list-item h3 {
    font-size: 13px;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
    color: #2a2a2a;
    margin: 8px 0 0;
    padding: 0 5px;
    height: 32px;
    float: left;
    width: 100%;
}

.frd-slide-list-item Span a {
    border: none;
    border-radius: 50px;
    color: #202020;
    margin-top: 14px;
    line-height: initial;
    font-size: 12px;
    font-weight: 600;
    background: #e9e9e9;
}

.frd-slide-list-item h3 a {
    display: inline-block;
    border-radius: 50px;
    color: #202020;
    margin-top: 0;
    font-size: 12px;
    font-weight: 600;
}

.frd-slide-list-item .follow-btn {
    display: inline-block;
    border: none;
    border-radius: 50px;
    padding: 8px 20px;
    color: #ffffff;
    margin-top: 14px;
    line-height: initial;
    font-size: 12px;
    font-weight: 600;
    background: #458cd5;
    cursor: pointer;
}

.frd-slide-list-item .follow-btn:hover {
    color: #202020;
    background: #e9e9e9;
}

/* .frd-cover {
	float: left;
	width: 100%;
	background: url(https://static-exp1.licdn.com/sc/h/dqes6fx46tbp0euqexopntx0n);
	height: 50px;
	background-size: cover;
} */
.frd-slide-list-item {
    text-align: center;
    margin-bottom: 0;
}

.service-image {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 8px;
}

.grope-program-list {
    float: left;
    width: 100%;
}

.grope-program-list {
    float: left;
    width: 100%;
    margin-top: 19px;
}

.frd-slide-list-item.grop-join-list p {
    margin: 0;
    font-size: 13px;
}

.frd-slide-list-item.grop-join-list {
    border: 1px solid #ddd8d8;
    width: 163px;
}

/*-*-*.stasts-bar-*-**/
/*--------.profile-home-left------------*/
.profile-home-left {
    float: left;
    width: 100%;
    background: #374a74;
    border: 1px solid #e6ecf5;
}

.pro-f-cover-img {
    width: 100%;
    float: left;
    height: 100px;
    overflow: hidden;
}

.pro-f-cover-img img {
    width: 100%;
}

.fro-f-imgs {
    text-align: center;
    float: left;
    width: 100%;
    padding: 0 16px 17px;
}

.fro-f-imgs .fofill-dtl-img {
    width: 80px;
    height: 80px;
    border: 4px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    margin-top: -37px;
}

.fro-f-imgs .fofill-dtl-img img {
    width: 100%;
}

.fro-f-imgs a {
    text-decoration: none;
}

.fro-f-imgs h3 {
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    margin: 0;
    padding: 10px 0;
    font-family: "Quicksand", sans-serif;
}

.fro-f-imgs h5 {
    font-size: 13px;
    color: #fff;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
}

.fro-f-imgs ul {
    list-style-type: none;
    margin: 25px 0;
    padding: 0;
}

.fro-f-imgs ul li {
    display: inline-block;
    position: relative;
    font-family: "arial";
    padding: 0 2px;
}

.fro-f-imgs ul li:after {
    content: " ";
    position: absolute;
    height: 25px;
    width: 1px;
    background: #8d8a93;
    top: 12px;
    left: -2px;
}

.fro-f-imgs ul li:first-child:after {
    display: none;
}

.fro-f-imgs .frd-no {
    display: inline-block;
    width: 100%;
    /* color: #fff; */
    font-size: 15px;
    font-weight: bold;
    letter-spacing: 1px;
}

.fro-f-imgs .frd {
    display: inline-block;
    width: 100%;
    /* color: #ff4; */
    font-size: 14px;
    font-weight: normal;
    letter-spacing: 1px;
}

.follow-btn-box {
    float: left;
    width: 100%;
}

.follow-btn-box a {
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    padding: 8px 24px;
    background: #202433;
    color: #fff;
    border-radius: 5px;
    width: auto;
    text-align: center;
    letter-spacing: 2px;
    border: 1px solid #202433;
    font-family: "Quicksand", sans-serif;
    font-weight: bold;
}

.follow-btn-box a:hover {
    background: #ffffff;
    color: #202433;
}

/*-------end  .profile-home-left------------*/

.connections-box {
    float: left;
    width: 100%;
    background: #fff;
    margin-top: 16px;
}

.connections-item-box {
    float: left;
    width: 100%;
    padding: 14px;
}

.connections-item-box .item-left {
    float: left;
}

.connections-item-box .item-right {
    float: right;
    color: #243058;
    font-size: 15px;
    font-weight: bold;
    font-family: "arial";
}

.connections-item-box .item-left p {
    margin: 0;
    font-size: 13px;
    font-weight: 400;
    color: #000000;
    letter-spacing: 1px;
    font-family: "Quicksand", sans-serif;
}

.connections-item-box .item-left h5 {
    margin: 0;
    color: #202433;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "Quicksand", sans-serif;
}

.connections-itm-save {
    font-size: 13px;
    font-weight: 600;
    border-top: 1px #cfcfcf solid;
    display: inline-block;
    padding: 12px;
    text-align: center;
    font-family: "arial";
    width: 100%;
    letter-spacing: 1px;
    text-decoration: none;
    margin-top: 21px;
    color: #202433;
    font-family: "Quicksand", sans-serif;
}

.connections-itm-save:hover {
    text-decoration: none;
    color: #5a689c;
}

.connections-itm-save i.fa.fa-bookmark-o {
    font-weight: bold;
    font-size: 13px;
    position: relative;
    top: 1px;
    color: #444b61;
}

.page-may-like {
    float: left;
    width: 100%;
    background: #fff;
    margin-top: 16px;
}

.page-like-hed {
    float: left;
    width: 100%;
    padding: 10px 15px;
    border-bottom: 1px #cfcfcf solid;
    margin-bottom: 7px;
}

.page-like-hed h3 {
    margin: 0;
    color: #202433;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "arial";
    display: inline-block;
    font-family: "Quicksand", sans-serif;
}

.page-like-hed .page-dotted {
    border: none;
    float: right;
    color: #3e89e7;
    font-size: 17px;
    outline: none;
    background: none;
    position: relative;
}

.page-like-hed .page-dotted:after {
    display: none;
}

.page-like-drop {
    transform: translate3d(110px, 620px, 0px) !important;
    padding: 10px;
    box-shadow: 0 0 6px #2024339c;
    border: none;
}

.page-like-drop::after {
    content: "";
    position: absolute;
    bottom: 100%;
    right: 10px;
    margin-left: 0;
    border-width: 9px;
    border-style: solid;
    border-color: transparent transparent white transparent;
}

.page-may-frofile {
    width: 40px;
    height: 40px;
    border: 0px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    float: left;
}

.page-my-img {
    float: left;
    width: 100%;
    padding: 16px 15px;
    border-bottom: 1px #cfcfcf solid;
}

.page-may-tital h4 {
    margin: 2px 0 3px;
    color: #515365;
    font-size: 14px;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
    text-transform: capitalize;
}

.page-may-tital {
    float: left;
    padding-left: 12px;
    color: #7e84bb;
    font-size: 11px;
    padding-top: 2px;
}

.page-may-tital h6 {
    margin: 0;
    color: #0c0c0c;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    font-family: "Quicksand", sans-serif;
}

.page-may-star {
    float: right;
    font-size: 17px;
    padding: 4px 0;
    color: #616a8a;
    position: relative;
}

.page-may-like .page-my-img:last-child {
    border: none;
}

/*-------------------
	end	body
------------------------*/
/*-----index-page-middle-*/
.shear-post-popu .modal-dialog {
    max-width: 50%;
}

div#forgot_password_modal .modal-dialog {
    max-width: 596px;
}

form#forgot_passwordform {
    width: 100%;
}

form#forgot_passwordform button.btn.btn-warning {
    background-color: #3e89e7 !important;
    color: #fff;
    border: none;
}

.your-post {
    float: left;
    width: 100%;
    background: #fff;
    padding: 18px 19px;
    font-family: "arial";
    border-radius: 10px;
    box-shadow: 0 1px 3px #0000000d;
}

.your-post .share-post {
    color: #ff6937 !important;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    font-family: "PT Sans", sans-serif;
    width: 100%;
    border: 1px solid #c0c0c0;
    border-radius: 8px;
    padding: 11px 10px 20px;
    box-shadow: 0 1px 3px #0000000d;
    margin-bottom: 18px;
}

.your-post h4 {
    margin: 0;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #515365;
    margin-bottom: 10px;
}

.your-post .share-post:hover {
    color: #6a6a6b;
}

.your-post .share-post i {
    font-weight: bold;
    font-size: 19px;
    position: relative;
    top: 3px;
    color: #fd6937;
}

.your-post .share-post span {
    width: 47px;
    height: 47px;
    border-radius: 50%;
    background: #000;
    overflow: hidden;
    display: inline-block;
    float: left;
}

.your-post .share-post span img {
    width: 100%;
}

.your-post .share-post p {
    display: inline-block;
    font-size: 15px;
    font-weight: 400;
    color: #676767;
    padding-left: 12px;
    font-family: "Quicksand", sans-serif;
    padding-top: 10px;
    margin: 0;
}

/*--------pop up---------*/
.shear-post-popu {
    background: #0000008a;
}

.shear-post-popu .modal-title {
    color: #202433;
    display: inline-block;
    font-size: 18px;
    font-weight: 900;
    text-decoration: none;
    font-family: "arial";
    padding: 0px 0;
}

.shear-post-popu .modal-header {
    padding: 15px 10px;
}

.modal-header {
    position: relative;
}

.pupup-close-bnt {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: #000 !important;
    border-radius: 50%;
    color: #fff !important;
    z-index: 111111;
    padding: 0 !important;
    outline: none;
    opacity: 1;
    font-weight: 200;
    text-shadow: none !important;
    border: 2px solid #fff !important;
    border: none;
}

.pupup-close-bnt:hover {
    opacity: 1 !important;
    background: #5d6172 !important;
    color: #f70303 !important;
    outline: none;
}

.your-post ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: right;
}

.your-post ul li {
    display: inline-block;
    font-family: "arial";
    padding: 0 4px;
    vertical-align: top;
    padding-left: 0;
}

.your-post ul li:last-child {
    padding-right: 0;
}

.your-post ul li a {
    display: inline-flex;
    border-radius: 3px;
    text-align: center;
    text-decoration: none;
    padding: 5px 7px 5px;
    border: none;
    color: #686868;
    font-size: 12px;
    font-weight: 500;
    font-family: "Quicksand", sans-serif;
    align-items: center;
    height: 26px;
}

.your-post ul li a:hover {
    border: none;
    background: #dce5f7;
}

.your-post ul li a img {
    border-radius: 4px;
    margin-right: 2px;
    height: 16px !important;
    min-height: inherit !important;
    max-width: inherit !important;
    margin-right: 4px;
}

.new-post-001 {
    float: left;
    width: 100%;
}

.post-001-plbcty {
    float: left;
    width: 100%;
    padding-bottom: 6px;
}

.your-post ul li a svg {
    overflow: hidden;
    vertical-align: middle;
    width: 21px;
}

.post-001-plbcty .pro-001-img {
    width: 70px;
    height: 70px;
    border: 4px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    float: left;
}

.post-001-plbcty .pro-001-img img {
    width: 100%;
}

span.pro-001-name {
    float: left;
    display: inline-block;
    padding: 4px 0;
    margin-left: 6px;
    width: 80%;
}

span.pro-001-name h3 {
    margin: 8px 0 3px;
    color: #202433;
    font-size: 15px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "arial";
    float: left;
    width: 100%;
}

span.pro-001-name a {
    display: inline-block;
    color: #6f6f6f;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    font-family: "arial";
}

span.pro-001-name svg {
    overflow: hidden;
    vertical-align: middle;
    width: 17px;
    color: #202433;
    position: relative;
    top: -2px;
}

.your-mind-001 {
    float: left;
    width: 100%;
}

.your-mind-001 .mind-textar {
    width: 100%;
    height: 100px !important;
    border: 1px solid #e8e7e7;
    padding: 10px;
    font-size: 15px;
    font-family: "arial";
    border-radius: 4px;
    outline: none;
    color: #655f5f;
    font-weight: normal;
    letter-spacing: 1px;
}

.uplord-icon {
    float: left;
    width: 100%;
    text-align: left;
    margin: 14px 0;
}

.post-btn {
    float: right;
    display: inline-block;
    background: #007bff;
    padding: 7px 30px;
    text-decoration: none;
    font-size: 14px;
    letter-spacing: 2px;
    font-weight: 600;
    font-family: "arial";
    border-radius: 4px;
    color: #fff;
    margin-top: 3px;
    height: 40px;
    margin-top: 0 !important;
}

.post-btn:hover {
    text-decoration: none;
    color: #fff;
}

.uplord-icon .uplord-icon-png {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: left;
    width: auto;
}

li.addon {
    margin-left: 58px;
    margin-top: 7px;
    font-size: 12px;
    font-weight: bolder;
}

span.pro-001-img {
    margin-left: 0;
}

.uplord-icon .uplord-icon-png li {
    display: inline-block;
}

.uplord-icon .uplord-icon-png li .input-fild-hid {
    width: 40px;
    height: 40px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 50%;
    position: relative;
    cursor: pointer;
    text-align: center;
    padding: 5px 0;
}

.input-fild-hid .fa.fa-file-text-o {
    font-size: 20px;
    position: relative;
    top: 4px;
    left: 1px;
}

/*--dropdown--*/
li.gol-dropt-don {
    position: relative;
}

li.gol-dropt-don:hover .post-drop-don {
    display: block !important;
    opacity: 1;
    visibility: visible;
}

.post-drop-don {
    display: block;
    position: absolute;
    /* top: 100%; */
    top: 43px;
    right: -81px;
    width: 265px;
    box-shadow: 0 0 34px 0 rgb(48 49 53 / 10%);
    background-color: #ffffff;
    border-radius: 4px;
    opacity: 0;
    transition: visibility 0s linear 0.3s, opacity 0.3s linear;
    text-align: left;
    padding: 15px 17px;
    z-index: 11111;
    visibility: hidden;
}

#emoji_icon_ul li {
    display: inline;
    font-size: 20px;
    float: left;
    padding: 2px 12px;
    float: left;
}

.your-post ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: right;
    width: 100%;
    float: left;
}

span#emoji_icon {
    float: left;
    width: 100%;
}

/*--dropdown--*/
.uplord-icon .uplord-icon-png li:first-child {
    padding-left: 0;
}

.input-fild-hid svg {
    overflow: hidden;
    vertical-align: middle;
    width: 22px;
    cursor: pointer;
}

input.file-in {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

/*====pop up===========*/

.macy_container {
    float: left;
    width: 100%;
    margin-top: 10px;
}

.social-coommemnt-box {
    float: left;
    width: 100%;
    background: #fff;
    padding: 18px 18px;
    font-family: "arial";
    margin-top: 17px;
    border-radius: 10px;
    box-shadow: 0 1px 3px #0000000d;
    padding-bottom: 12px;
}

.social-coommemnt-box .page-may-tital h4 {
    margin: 0px 0 3px;
    font-weight: 700;
}

.social-coommemnt-prof {
    float: left;
    width: 100%;
    position: relative;
    border-bottom: 1px solid #e7dfdf;
    padding-bottom: 13px;
}

.social-coommemnt-box .page-may-tital h4 p {
    display: inline-block;
    font-size: 11px;
    color: #bababa;
    margin: 0;
    font-weight: 500;
}

.social-coommemnt-box .coommemnt-con {
    margin: 9px 0 00;
    font-size: 14px;
    font-weight: 500;
    color: #000000;
    letter-spacing: 0px;
    display: inline-block;
    font-family: "Quicksand", sans-serif;
    width: 100%;
}

p.coommemnt-con.show-read-more a.read-more {
    color: #ff6937;
}

.macy_containerx2 {
    float: left;
    width: 100%;
    margin-top: 14px;
}

.social-coommemnt-box [id^="macy_container"] {
    display: flex !important;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    grid-gap: 4px !important;
    height: auto !important;
}

.social-coommemnt-box [id^="macy_container"] .demo:first-child {
    width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.demo {
    width: 100%;
    height: 200px;
}

.like-comt-line {
    list-style-type: none;
    margin: 8px 0 0 0;
    padding: 0;
    border-bottom: 1px solid #d0cdd2;
    padding-bottom: 6px;
    float: left;
    width: 100%;
}

.like-comt-line li {
    display: inline-block;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0px;
    color: #374a74;
    padding: 0 4px;
    position: relative;
    font-family: "Quicksand", sans-serif;
}

.like-comt-line li:last-child {
    float: right;
}

/*.like-comt-line li:after {
	position: absolute;
	content: '';
	height: 14px;
	width: 1px;
	background: #202433;
	top: 2px;
	left: -3px;
}*/

.row.post-content img {
    width: 100%;
}

.like-comt-line li:first-child:after {
    display: none;
}

.like-comt-line li:first-child {
    padding-left: 0;
}

.like-comment-share-bar {
    list-style-type: none;
    margin: 13px 0 5px;
    padding-left: 0;
    display: block;
    -webkit-box-align: center;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 0 15px;
    text-align: right;
    float: left;
    width: 100%;
}

.like-comment-share-bar li {
    display: inline-block;
    width: fit-content;
    text-align: center;
    padding-left: 12px;
}

.like-comment-share-bar li a {
    text-decoration: none;
    color: #565656 !important;
    font-size: 13px;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
}

.like-comment-share-bar li a:hover {
    color: #6b8e24;
    transition: 0.9s;
}

.like-comment-share-bar li a:hover .fa,
.like-comment-share-bar li a:hover svg {
    color: #6b8e24;
    transition: 0.9s;
}

.like-comment-share-bar li a .fa {
    font-size: 16px;
    font-weight: 800;
    color: #686868;
    margin-right: 0px;
    position: relative;
    top: 2px;
}

.like-comment-share-bar li a svg {
    overflow: hidden;
    vertical-align: middle;
    font-size: 5px;
    width: 17px;
    color: #626262;
    margin-right: 6px;
}

.like-comment-share-bar li:last-child a svg {
    position: relative;
    top: -3px;
    color: #e57e4e;
    margin-right: 1px;
}

/*---dropdown---*/
.page-may-star i.fa.fa-ellipsis-h {
    color: #4a5e89;
    font-size: 20px;
    background: #dae1ef;
    height: 30px;
    width: 30px;
    text-align: center;
    border-radius: 100%;
    line-height: 30px;
    font-size: 16px;
    position: relative;
    top: -3px;
}

.may-star-bttn-view {
    position: absolute;
    will-change: transform;
    top: 0px;
    left: 0px;
    transform: translate3d(-322px, 38px, 0px) !important;
    min-width: 22rem !important;
    padding: 0;
    box-shadow: 0 0 6px -3px #202433;
    border: none;
}

.bttn-view-chose {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
}

.bttn-view-chose li {
    padding: 0 0px;
    float: left;
    width: 100%;
}

.bttn-view-chose li:last-child {
    border: none;
}

.bttn-view-chose li a {
    display: inline-block;
    text-decoration: none;
    width: 100%;
    padding: 4px 4px;
}

.bttn-view-chose li a:hover {
    background: #e5e9f7;
}

span.chose-icon svg {
    overflow: hidden;
    vertical-align: middle;
    width: 17px;
    position: relative;
    top: -4px;
}

span.chose-icon i.fa.fa-bell-o {
    position: relative;
    top: -3px;
}

.bttn-view-chose li a {
    display: inline-block;
    text-decoration: none;
    width: 100%;
    padding: 10px 15px;
    float: left;
    border-bottom: 1px solid #e7e7e7;
    position: relative;
}

span.chose-icon {
    position: absolute;
    right: 9px;
    top: 13px;
    font-size: 9px;
    height: 20px;
    width: 20px;
    background: #ebebeb;
    border-radius: 100%;
    text-align: center;
    line-height: 21px;
    color: #374a74;
}

span.chose-icon svg {
    overflow: hidden;
    vertical-align: middle;
    width: 12px;
    position: relative;
    top: -1px;
}

.bttn-view-chose li a:hover span.chose-icon {
    background: #374a74;
    color: #fff;
}

span.chose-conten {
    float: left;
    display: inline-block;
}

.chose-conten h5 {
    margin: 0px 0 0px;
    color: #1d213c;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "arial";
}

.bttn-view-chose li:last-child span.chose-conten h5 {
    margin-top: 0px;
}

.chose-conten p {
    font-size: 11px;
    font-weight: normal;
    color: #585858;
    font-family: "arial";
    display: inline-block;
    margin: 0;
}

.today-news-views {
    float: left;
    width: 100%;
    background: #fff;
    margin-bottom: 20px;
}

.today-news-views svg {
    overflow: hidden;
    vertical-align: middle;
    width: 16px;
    position: relative;
    top: -1px;
}

.may-star-bttn-view.dropdown-menu.show::after {
    content: "";
    position: absolute;
    bottom: 100%;
    right: 10px;
    margin-left: 0;
    border-width: 9px;
    border-style: solid;
    border-color: transparent transparent white transparent;
}

.news-conten {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
}

.news-conten li {
    position: relative;
    padding: 8px 0 0px 39px;
}

.news-conten li:after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    top: 13px;
    left: 21px;
    background: #000;
}

.news-conten li h4 {
    color: #515365;
    font-size: 13px;
    /* font-weight: bold; */
    letter-spacing: 1px;
    margin: 0;
    margin-bottom: 4px;
    font-family: "Quicksand", sans-serif;
}

.news-conten li p {
    font-size: 12px;
    font-weight: 300;
    color: #626673;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
}

.moreless-button {
    font-size: 13px;
    font-weight: 600;
    border-top: 1px #cfcfcf solid;
    display: inline-block;
    padding: 12px;
    text-align: center;
    width: 100%;
    letter-spacing: 1px;
    text-decoration: none;
    margin-top: 3px;
    color: #202433;
    font-family: "Quicksand", sans-serif;
}

.moreless-button:hover {
    text-decoration: none;
    color: #5a689c;
    transition: 0.9s;
}

.moreless-button i.fa.fa-plus {
    font-size: 11px;
}

.your-dream-job-box {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.2);
    transition: box-shadow 83ms;
    background-color: #fff;
    padding: 6px;
    margin: 0;
    width: 100%;
    float: left;
    margin-top: 16px;
}

.your-dream-job-box.dream-job-top {
    margin: 0;
}

.your-dream-job-box img {
    width: 100%;
}

.footer {
    float: left;
    width: 100%;
    background: #fff;
    padding: 18px 18px;
    font-family: "arial";
    margin-top: 17px;
    text-align: center;
}

.footer ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.footer ul li {
    display: inline-block;
    margin-left: 11px;
    padding: 0px 0;
}

.footer ul li a {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    color: #444650;
    letter-spacing: 1px;
    font-family: "Quicksand", sans-serif;
}

.footer ul li:first-child {
    margin: 0;
}

.footer ul li:last-child {
    margin: 0;
    width: 100%;
    text-align: center;
}

.footer ul li a:hover {
    text-decoration: none;
    color: #202433;
    transition: 0.9s;
}

.copy-right {
    float: left;
    width: 100%;
    text-align: center;
    padding: 10px 0;
}

.copy-right p {
    font-size: 13px;
    font-weight: 500;
    color: #202433;
    letter-spacing: 1px;
    font-family: "arial";
    margin: 0;
}

/*-------------job listing----------*/
.job-listing-banner {
    float: left;
    width: 100%;
    height: 200px;
    overflow: hidden;
    position: relative;
}

.job-listing-banner img {
    width: 100%;
}

.job-listing-banner:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #00000091;
    width: 100%;
    height: 100%;
}

.job-listing-search-box {
    float: left;
    width: 100%;
    background: #fff;
    margin: 18px 0;
    box-shadow: 0px 0px 18px -10px #000;
    border-radius: 5px;
}

.job-listing-search-box ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.job-listing-search-box ul li {
    display: inline-block;
    width: 39%;
    float: left;
    position: relative;
    padding: 1px 10px;
    border-radius: 3px;
}

.job-listing-search-box ul li:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    background: #d8d8d7;
    width: 1px;
    height: 100%;
}

.job-listing-search-box ul li:last-child:after {
    display: none;
}

.job-listing-search-box ul li:last-child {
    width: 22%;
}

.liting-search {
    position: relative;
}

.liting-search i.fa {
    position: absolute;
    font-size: 18px;
    top: 2px;
    left: 4px;
    color: #6b8e23;
}

.listing-earc {
    border: none;
    padding: 16px 10px;
    width: 100%;
    outline: none;
    padding-left: 25px;
    font-size: 14px;
    font-weight: normal;
    font-family: "arial";
}

.listing-submit {
    padding: 6px 0px;
    border: none;
    background: #6b8e23;
    color: #fff;
    border-radius: 3px;
    font-size: 14px;
    letter-spacing: 2px;
    font-family: "arial";
    font-weight: 500;
    margin: 10px 0;
    width: 100%;
}

input.listing-submit:hover {
    border: none;
    background: #b9c2e3;
    color: #202433;
    transition: 0.9s;
}

.job-apply-box {
    float: left;
    width: 100%;
    padding: 10px;
    box-shadow: 0 0 5px #c1c1c1;
    margin-bottom: 18px;
    background: #fff;
}

.job-apply-left {
    float: left;
    width: 100px;
    box-shadow: 0 0 7px #ccc;
    border-radius: 6px;
}

.job-apply-left img {
    width: 100%;
}

.job-apply-middle {
    float: left;
    width: 60%;
    margin: 0 13px;
}

.job-nem-location {
    float: left;
    width: 100%;
}

.job-nem-location h4 {
    font-size: 15px;
    font-weight: bold;
    font-family: "arial";
    display: inline-block;
    margin-bottom: 0;
    color: #515365;
}

.job-nem-location h4 a {
    color: #202433;
}

.job-nem-location h4 a:hover {
    text-decoration: none;
}

.job-loction {
    float: left;
    font-family: "arial";
    color: #5e5f69;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: 1px;
    padding-top: 2px;
}

.job-loction img {
    position: relative;
    top: -2px;
}

.job-apply-middle p {
    color: #515365;
    font-size: 12px;
    font-family: "Quicksand", sans-serif;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: capitalize;
    line-height: 17px;
    margin-bottom: 1px;
}

.hours-view {
    float: left;
    width: 100%;
    padding-top: 13px;
}

.hours-view .hours-view-bar,
.hours-view-reting-bar {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline-block;
}

.hours-view-reting-bar {
    float: right;
}

.hours-view .hours-view-bar li {
    display: inline-block;
    font-size: 13px;
    color: #f38a94;
    font-family: "PT Sans", sans-serif;
    font-style: italic;
    padding: 0 5px;
    position: relative;
    letter-spacing: 1px;
}

ul.hours-view-reting-bar.star li {
    width: 11px;
    height: 11px;
    font-size: 7px;
    line-height: 18px;
}

ul.hours-view-reting-bar.star {
    float: left;
}

ul.hours-view-reting-bar.star li.nm {
    font-size: 13px;
    margin-top: 3px;
}

.hours-view-reting-bar.star li i.fa.fa-star {
    font-size: 9px;
}

.hours-view .hours-view-bar li:after {
    position: absolute;
    content: "";
    top: 2px;
    left: -4px;
    background: #818698;
    width: 1px;
    height: 16px;
    transform: rotate(15deg);
}

.hours-view .hours-view-bar li:first-child:after {
    display: none;
}

.hours-view .hours-view-bar li:first-child {
    padding-left: 0;
}

.hours-view-reting-bar li {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: #fdb515;
    font-size: 7px;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    line-height: 21px;
    vertical-align: baseline;
}

.hours-view-reting-bar li i.fa.fa-star {
    color: #fff;
    font-size: 12px;
    position: relative;
    top: -2px;
}

.hours-view-reting-bar li:last-child {
    background: none;
    color: #fdb515;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "Open Sans", sans-serif;
    font-size: 15px;
    height: auto;
    width: auto;
    vertical-align: top;
    line-height: 23px;
}

.job-apply-right {
    float: left;
    width: 81px;
    text-align: center;
}

.job-apply-right h4 {
    font-size: 16px;
    font-weight: 900;
    font-family: "PT Sans", sans-serif;
    color: #515365;
    display: inline-block;
    margin-bottom: 0;
    position: relative;
}

.job-apply-right h4:after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 2px;
    background: #202433;
}

.job-apply-right ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.job-apply-right ul li {
    display: block;
    margin-top: 6px;
}

.job-apply-right ul li a {
    display: inline-block;
    font-size: 12px;
    font-weight: 900;
    font-family: "PT Sans", sans-serif;
    background: #eeeeef;
    text-decoration: none;
    padding: 5px 20px;
    letter-spacing: 1px;
    border-radius: 3px;
    color: #7b8094;
    width: 100%;
}

.job-apply-right ul li a img {
    width: 12px;
}

.job-application-box {
    float: left;
    width: 100%;
    font-family: "arial";
    margin-bottom: 0px;
}

.job-application-filter {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    background: #fff;
    padding: 20px;
    box-shadow: 0 0 5px #c1c1c1;
}

.job-application-filter h3 {
    font-size: 15px;
    font-weight: bold;
    font-family: "arial";
    color: #202433;
    letter-spacing: 1px;
    margin-bottom: 5px;
}

.fliter-btnn {
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-top: 14px;
}

.fliter-btnn li {
    font-size: 14px;
    font-weight: normal;
    font-family: "PT Sans", sans-serif;
    color: #6b7185;
    margin-bottom: 0;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 29px;
    height: 14px;
    float: right;
}

/* Hide default HTML checkbox */
.switch input {
    display: none;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #6b8e23;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 10px;
    width: 10px;
    left: 3px;
    bottom: 2px;
    background-color: #ffffff;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

input.default:checked + .slider {
    background-color: #6b8e23;
}

input:checked + .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

.list-group-item {
    position: relative;
    display: block;
    padding: 0;
    background-color: #fff;
    border: none;
}

input.location-input,
.industry select {
    width: 100%;
    padding: 7px 10px 7px 26px;
    border: 1px solid #d7dae2;
    border-radius: 6px;
    font-size: 14px;
    font-weight: normal;
    font-family: "PT Sans", sans-serif;
    outline: none;
    position: relative;
    color: #6b7185;
}

.location-input-box {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-bottom: 9px;
}

.location-input-box:after {
    content: "\f041";
    position: absolute;
    top: 9px;
    left: 9px;
    display: inline-block;
    color: #cbc1c1;
    font: normal normal normal 14px/1 FontAwesome;
    font-weight: bold;
    font-size: 19px;
}

span.location-input-box.sec:after {
    content: "\f002";
    position: absolute;
    top: 9px;
    left: 9px;
    display: inline-block;
    color: #cbc1c1;
    font: normal normal normal 14px/1 FontAwesome;
    font-weight: bold;
    font-size: 15px;
}

span.industry {
    position: relative;
    width: 100%;
    display: inline-block;
}

.industry:after {
    content: "\f0d7";
    position: absolute;
    top: 9px;
    right: 8px;
    display: inline-block;
    color: #202433;
    font: normal normal normal 14px/1 FontAwesome;
    font-weight: bold;
    font-size: 19px;
}

.industry select {
    padding-left: 10px;
    -webkit-appearance: none;
    cursor: pointer;
}

.job-application-filter span.list-group-item {
    font-size: 14px;
    font-weight: normal;
    font-family: "PT Sans", sans-serif;
    color: #6b7185;
    margin-bottom: 0;
    margin-top: 7px;
}

.salary-input {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline-block;
}

.salary-input li {
    width: 44%;
    float: left;
    display: inline-block;
}

.salary-input li input {
    width: 100%;
    padding: 7px 10px 7px 26px;
    border: 1px solid #d7dae2;
    border-radius: 6px;
    font-size: 14px;
    font-weight: normal;
    font-family: "PT Sans", sans-serif;
    outline: none;
    position: relative;
    color: #6b7185;
}

.salary-input li:nth-child(2) {
    width: 12%;
    text-align: center;
    padding-top: 5px;
}

ul.hours-view-bar {
    float: right;
}

.salary-input li:last-child {
    float: right;
}

.salary-aft:after {
    content: "\f155";
    position: absolute;
    top: 9px;
    right: 8px;
    display: inline-block;
    color: #202433;
    font: normal normal normal 14px/1 FontAwesome;
    font-weight: bold;
    font-size: 15px;
    width: 10px;
}

/*---redeo*/
.radio {
    margin: 0.5rem;
    margin-left: 0;
}

.radio input[type="radio"] {
    position: absolute;
    opacity: 0;
}

.radio input[type="radio"] + .radio-label:before {
    content: "";
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #b4b4b4;
    display: inline-block;
    width: 15px;
    height: 15px;
    position: relative;
    top: 2px;
    margin-right: 6px;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease;
}

.radio input[type="radio"]:checked + .radio-label:before {
    background-color: #6b8e23;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}

.radio input[type="radio"]:focus + .radio-label:before {
    outline: none;
    border-color: #202433;
}

.radio input[type="radio"]:disabled + .radio-label:before {
    box-shadow: inset 0 0 0 4px #f4f4f4;
    border-color: #b4b4b4;
    background: #b4b4b4;
}

.radio input[type="radio"] + .radio-label:empty:before {
    margin-right: 0;
}

label.radio-label {
    font-size: 14px;
    font-weight: normal;
    font-family: "PT Sans", sans-serif;
    color: #6b7185;
    margin-bottom: 0;
    cursor: pointer;
}

.fliter-submit {
    float: left;
    width: 100%;
    margin-top: 14px;
}

.fliter-submit button {
    padding: 7px 10px;
    background: #6b8e23;
    color: #fff;
    border: none;
    width: 100%;
    border-radius: 4px;
    font-family: "Open Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
}

.fliter-submit button:hover {
    border: none;
    background: #b9c2e3;
    color: #202433;
    transition: 0.9s;
}

/*---------end----job listing----------*/

/*---------conpany-details------------*/
.company-details {
    float: left;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 5px #848484;
}

.company-details-banner {
    float: left;
    width: 100%;
    height: 200px;
    overflow: hidden;
    position: relative;
}

.company-details-banner img {
    width: 100%;
}

.company-details-banner:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #00000091;
    width: 100%;
    height: 100%;
}

.company-profile-box {
    float: left;
    width: 100%;
    padding: 0 20px;
    position: relative;
    margin-top: -36px;
    margin-bottom: 0;
    padding-bottom: 17px;
}

.company-profile-logo {
    width: 100px;
    height: 100px;
    display: inline-block;
    border-radius: 100%;
    box-shadow: 0 0 10px #616161;
    text-align: center;
    padding: 36px 9px;
    position: relative;
    /* top: -37px; */
    background: #fff;
}

.company-profile-logo img {
    width: 100%;
}

.add-bbttn {
    position: absolute;
    width: 35px;
    height: 35px;
    background: #202433;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 11px #3c3b3b;
    color: #fff;
    text-align: center;
    display: inline-block;
    padding: 4px 0;
    left: -4px;
    bottom: -7px;
    cursor: pointer;
}

.add-bbttn:hover {
    background: #ffffff;
    border: 2px solid #202433;
    box-shadow: 0 0 11px #3c3b3b;
    color: #202433;
}

.add-web-bbttn {
    position: absolute;
    width: 35px;
    height: 35px;
    background: #202433;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 11px #3c3b3b;
    color: #fff;
    text-align: center;
    display: inline-block;
    padding: 1px 0;
    right: -4px;
    bottom: -7px;
}

.add-web-bbttn:hover {
    background: #ffffff;
    border: 2px solid #202433;
    box-shadow: 0 0 11px #3c3b3b;
    color: #202433;
}

.add-web-bbttn svg {
    overflow: hidden;
    vertical-align: middle;
    width: 21px;
}

.company-cont {
    float: right;
    margin-left: 20px;
    margin-top: 55px;
}

.company-cont h3 {
    color: #202433;
    font-size: 18px;
    font-family: "Open Sans", sans-serif;
    font-weight: bold;
    margin: 0;
}

.company-cont p {
    color: #56575e;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    margin: 0;
}

.company-profile-box h5 {
    color: #202433;
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    margin: 0;
    line-height: 24px;
    margin-top: 21px;
}

.employees-link {
    display: inline-block;
    float: right;
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    font-weight: bold;
    text-decoration: none;
    color: #202433;
}

.employees-link:hover {
    color: #b9c2e3;
    text-decoration: none;
}

.menu-tab {
    float: left;
    width: 100%;
    background: #fff;
    margin-top: 19px;
    box-shadow: 0 0 10px #8e8e8e;
}

.menu-tab ul {
    border-bottom: 2px solid #202433;
}

.menu-tab .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border: none;
}

.menu-tab .nav-tabs .nav-link:focus,
.menu-tab .nav-tabs .nav-link:hover {
    border: none;
    color: #b9c2e3;
    transition: 0.9s;
}

.menu-tab .nav-tabs .nav-link {
    border: none;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    font-size: 14px;
    font-weight: bold;
    color: #202433;
    letter-spacing: 1px;
    text-decoration: none;
    font-family: "Open Sans", sans-serif;
    text-transform: uppercase;
}

.menu-tab .nav-tabs .tab-nav-item {
    margin-bottom: -1px;
    padding: 7px 13px;
    /* padding-top: 0 !important; */
    position: relative;
}

.menu-tab .nav-tabs .tab-nav-item:after {
    position: absolute;
    content: " ";
    width: 1px;
    height: 20px;
    background: #000;
    top: 14px;
    left: 0;
}

.menu-tab .nav-tabs .tab-nav-item:first-child:after {
    display: none;
}

.tab-home {
    float: left;
    width: 100%;
    padding: 20px;
}

.tab-home h4 {
    font-size: 17px;
    font-weight: bold;
    font-family: "Open Sans", sans-serif;
    color: #515365;
}

.tab-home p {
    font-size: 14px;
    font-weight: normal;
    font-family: "Open Sans", sans-serif;
    color: #202433;
    line-height: 22px;
}

.tab-home p a {
    display: inline-block;
    float: left;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    font-style: italic;
    color: #202433;
    font-size: 14px;
}

.tab-home h5 {
    font-family: "Open Sans", sans-serif;
    font-weight: normal;
    color: #202433;
    font-size: 14px;
    float: left;
    width: 100%;
    margin: 21px 0;
}

.tab-home h5 a {
    display: inline-block;
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    font-style: italic;
    color: #202433;
    font-size: 14px;
}

.tab-home h5 span {
    font-family: "Open Sans", sans-serif;
    font-weight: 900;
    font-style: italic;
    color: #202433;
    font-size: 14px;
    width: 200px;
    display: inline-block;
}

.tab-home h5 p {
    float: right;
    display: inline-block;
    width: 66%;
}

.map-box {
    float: left;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 5px #848484;
    margin-top: 20px;
    padding: 20px;
}

.map-box iframe {
    width: 100%;
}

.map-box h4 {
    font-family: "Open Sans", sans-serif;
    font-weight: bold;
    color: #515365;
    font-size: 15px;
    float: left;
    width: 100%;
    margin: 8px 0;
}

.map-box p {
    font-size: 14px;
    font-weight: normal;
    font-family: "Open Sans", sans-serif;
    color: #202433;
    line-height: 22px;
    margin: 0;
}

/*-------company listing--------*/
.company-listing {
    float: left;
    width: 100%;
}

.company-listing-box {
    width: 100%;
    background: #fff;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 0 8px #808080;
    margin-bottom: 27px;
}

.listing-cover-box {
    width: 100%;
    float: left;
    height: 80px;
    overflow: hidden;
}

.listing-cover-box img {
    width: 100%;
}

.listing-text {
    float: left;
    width: 100%;
    text-align: center;
    position: relative;
    top: -25px;
}

.listing-profile-img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    border: 2px solid #fff;
    background: #000;
    padding: 14px 6px;
}

.listing-profile-img img {
    width: 100%;
}

.listing-text h3 {
    margin: 0;
    color: #202433;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "arial";
    margin: 11px 0 5px;
}

.listing-text h4 {
    font-size: 14px;
    font-weight: 400;
    color: #515365;
    font-family: "arial";
    letter-spacing: 1px;
    margin: 0;
    margin-bottom: 6px;
}

.listing-text h5 {
    font-size: 13px;
    font-weight: 600;
    color: #7780a2;
    font-family: "arial";
    letter-spacing: 1px;
    margin: 0;
    font-style: italic;
}

.listing-text a {
    font-size: 13px;
    font-weight: bold;
    color: #292935;
    font-family: "arial";
    letter-spacing: 1px;
    margin: 0;
    font-style: italic;
    text-decoration: none;
    display: inline-block;
    margin-top: 16px;
}

.listing-text a:hover {
    color: #9797b1;
}

.listing-profile-img .add-bbttn {
    position: absolute;
    width: 20px;
    height: 20px;
    background: #202433;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 11px #3c3b3b;
    color: #fff;
    text-align: center;
    display: inline-block;
    padding: 1px 0;
    left: 18px;
    bottom: -7px;
    font-size: 10px;
    cursor: pointer;
}

.listing-profile-img .add-bbttn:hover {
    background: #ffffff;
    border: 2px solid #010101;
    box-shadow: 0 0 11px #3c3b3b;
    color: #010101;
}

.company-listing-box p {
    font-size: 14px;
    font-weight: normal;
    border-top: 1px #cfcfcf solid;
    display: inline-block;
    padding: 12px;
    text-align: center;
    font-family: "arial";
    width: 100%;
    letter-spacing: 0;
    text-decoration: none;
    color: #797979;
    margin: 0;
}

.company-listing-box p svg {
    overflow: hidden;
    vertical-align: middle;
    width: 16px;
    position: relative;
    top: -1px;
    left: -2px;
}

/*-----------job detiles--------------*/
.job-designation-box {
    float: left;
    width: 100%;
    padding: 15px;
    box-shadow: 0 0 5px #c1c1c1;
    margin-bottom: 18px;
    background: #fff;
    text-align: center;
    border-radius: 4px;
}

.job-designation-box-right {
    float: right;
    width: 33%;
    text-align: right;
}

.job-designation-box-left {
    float: left;
    width: 33%;
    text-align: left;
}

.job-designation-box-middle {
    display: inline-block;
    width: 33%;
    padding-top: 25px;
}

.job-designation-box-left h3 {
    color: #202433;
    font-size: 17px;
    font-weight: 900;
}

.job-designation-box-left ul {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
}

.job-designation-box-left ul li {
    display: inline-block;
    width: 100%;
    font-size: 14px;
    color: #5e5f69;
    margin-top: 7px;
}

.job-designation-box-left ul li:first-child {
    background: url(../img/ind-map.png) left center no-repeat;
    padding-left: 22px;
}

.job-designation-box-middle ul.hours-view-reting-bar {
    width: 100%;
}

.job-designation-box-middle ul.hours-view-reting-bar li {
    display: inline-block;
    width: 17px;
    height: 17px;
    background: #fdb515;
    font-size: 7px;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    line-height: 24px;
    vertical-align: baseline;
}

.job-designation-box-middle .hours-view-reting-bar li i.fa.fa-star {
    color: #fff;
    font-size: 10px;
    position: relative;
    top: -2px;
}

.job-designation-box-middle .hours-view-reting-bar li:last-child {
    background: none;
    color: #fdb515;
    font-weight: 900;
    letter-spacing: 0px;
    font-family: "Open Sans", sans-serif;
    font-size: 24px;
    height: auto;
    width: auto;
    vertical-align: top;
    line-height: 23px;
}

.job-designation-box-middle a {
    display: inline-block;
    background: #6b8e23;
    color: #fff;
    font-weight: 500;
    padding: 3px 21px 6px;
    border-radius: 4px;
    margin-top: 10px;
}

.job-designation-box-middle a:hover {
    background: #5d6179;
    text-decoration: none;
}

.job-designation-box-right span {
    display: inline-block;
    background: #fff;
    box-shadow: 0px 0px 6px -3px #000;
    border-radius: 6px;
    padding: 5px 15px;
}

.job-designation-box-left ul li a {
    color: #5e5f69;
    text-orientation: none;
}

.job-designation-box-left ul li a:hover {
    color: #1a1c24;
    text-decoration: none;
}

.company-info {
    float: left;
    width: 100%;
    padding: 15px;
    box-shadow: 0 0 5px #c1c1c1;
    margin-bottom: 18px;
    background: #fff;
    text-align: left;
    border-radius: 4px;
}

.company-info h4 {
    color: #515365;
    font-size: 19px;
    font-weight: 900;
}

.company-info ul {
    float: left;
    width: 100%;
    margin: 0 0 10px;
    padding: 0;
}

.company-info ul li {
    display: inline-block;
    width: 49%;
    margin-bottom: 8px;
}

.company-info p {
    color: #848484;
}

.company-info h5 {
    color: #202433;
    font-size: 17px;
    font-weight: 900;
}

.company-info ul.listex li {
    display: inline-block;
    width: 100%;
    position: relative;
    padding-left: 19px;
}

.company-info ul.listex li:after {
    content: "";
    height: 7px;
    width: 7px;
    background: #000;
    border-radius: 100%;
    z-index: 11;
    position: absolute;
    left: 0;
    top: 9px;
}

/*-----------Login--------------*/
/*.login-boxes-new2 {*/
/*	background: url(../img/Whatsapp-Wallpaper-120.jpg) left top no-repeat;*/
/*	width: 100%;*/
/*	position: relative;*/
/*}*/

.login-form-page-left {
    float: right;
    width: 50%;
}

.login-form-page-left form {
    float: left !important;
    width: 100% !important;
    text-align: center;
    padding: 10px 0 !important;
}

.login-form-page-left .login-form-box {
    float: left;
    width: 100%;
    padding: 8px 53px 0;
}

.login-form-page-right {
    float: left;
    width: 50%;
    border-radius: 10px;
}

.profile-home-left.lf-log.edit-profil-prosanl {
    background: none;
    border: none;
}

.pro-f-cover-img.lf-log-img {
    border-radius: 10px 10px 0 0;
    height: 248px;
}

ul.log-ulist {
    width: 100%;
}

.login-form-page-right .carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 485px;
    background: #ccc;
    border-radius: 12px;
}

.login-boxes form .login-form-box input[type="submit"],
.continue {
    background: #3e89e7;
    border: 2px solid #3e89e7;
    text-transform: uppercase;
    color: #fff;
    font-size: 14px;
    letter-spacing: 1px;
    padding: 8px 23px;
    border-radius: 26px;
    margin-bottom: 1px;
    margin-top: 48px;
    outline: none;
    cursor: pointer;
}

.continue {
    margin-top: 0;
    font-size: 13px;
    padding: 0 20px;
    height: 30px;
    line-height: 20px;
    outline: none !important;
    float: right;
}

.register-box input[type="submit"] {
    margin-top: 0px !important;
}

.carousel-caption {
    position: absolute;
    right: 15%;
    bottom: 77px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: left;
    top: 41%;
}

.carousel-item:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.35); */
    left: 0;
    top: 0;
}

.login-btn a {
    color: #fff !important;
    text-transform: uppercase;
    font-weight: bold;
}

.menu-box ul li.login-btn {
    padding-top: 19px;
    background: #000;
    padding-bottom: 17px;
}

.login-btn a:hover {
    color: #616a8c !important;
}

.login-boxes {
    background: url(../img/login-map-img.png) left top no-repeat;
}

.login-boxes form {
    width: 40%;
    text-align: center;
    padding: 50px 0;
}

.login-boxes form h1 {
    font-weight: bold;
    color: #202433;
}

.login-boxes form h1 span {
    display: block;
    font-size: 28px;
    /* color: #3e89e7; */
    letter-spacing: 1px;
    position: relative;
    margin-bottom: 06px;
    margin-top: 10px;
}

.login-boxes form h1 span:after {
    position: absolute;
    content: "";
    height: 4px;
    width: 129px;
    left: 50%;
    bottom: -12px;
    transform: translate(-50%, 0%);
    /* background: #dddddd; */
    border-radius: 48px;
}

.login-boxes form h1 span i {
    background: url(../img/shado.png) bottom center no-repeat;
    background-size: 100%;
    padding: 0px 16px;
}

.login-boxes form p {
    color: #7e849a;
    font-size: 17px;
}

.login-form-box {
    float: left;
    width: 100%;
    padding: 0 95px;
}

footer.clearfix {
    width: 100%;
    float: left;
    background: #ffffff;
    border-top: 1px solid #00000017;
}

.ft-cnt.clearfix {
    padding: 20px 0;
    float: left;
    width: 100%;
}

.ft-lng {
    border-bottom: 1px solid #bababa;
    float: left;
    width: 100%;
}

.ft-lng ul li {
    float: left;
    display: inline-block;
    padding-right: 20px;
}

.ft-lng button.btn.btn-info.btn-lg {
    margin-top: -17px;
    padding: 0 10px;
    font-size: 15px;
    border-color: #3e89e7;
    background-color: #3e89e7;
}

.ft-lng button.btn.btn-info.btn-lg:hover {
    border-color: #c5c5c5;
    background-color: #f8f8f8;
    color: #000;
}

.ft-lng ul li a {
    color: #686868;
    font-size: 13px;
    display: block;
}

.ft-dtl ul li {
    float: left;
    display: inline-block;
    padding-right: 18px;
    margin-top: 6px;
}

.ft-dtl ul li a {
    display: block;
    color: #686868;
    font-size: 14px;
}

.ft-lng .modal-dialog {
    max-width: 750px;
}

.ft-lng .modal-header {
    padding: 6px;
    background: #ff6937;
}

.ft-lng .modal-header h4 {
    font-size: 16px;
    color: #fff;
}

.modal-body.ft-pop h4 {
    font-size: 14px;
}

.lng-hd {
    padding-bottom: 10px;
    border-bottom: 1px dashed #ccc;
}

.lng-cntn {
    padding-top: 16px;
}

.modal-body.ft-pop h4 {
    font-size: 14px;
}

/*-----*/
.input-field {
    position: relative;
    width: 100%;
    float: left;
    height: auto;
    /* line-height: 44px; */

    margin-bottom: 3px;
}

.register-box .input-field {
    margin-top: 10px !important;
}

.input-field label {
    position: absolute;
    top: 9px;
    left: 15px;
    /* width: 100%; */
    color: #bababa;
    transition: 0.2s all;
    cursor: text;
    margin: 0;
    text-align: left;
    padding: 0 5px;
    background: #fff;
    display: inline-block;
}

.input-field input {
    width: 100%;
    background: none;
    border: none;
    border: 1px solid #d0d0d0;
    margin: 0px 0 5px;
    padding-left: 11px;
    font-size: 15px;
    color: #43464f;
    font-weight: 500;
    font-family: "arial";
    border-radius: 6px;
    height: 40px;
}

.input-field input:invalid {
    outline: 0;
}

.input-field input:focus,
input:valid {
    border-color: #f1f1f1;
}

.input-field input:focus ~ label,
.input-field input:valid ~ label {
    font-size: 15px;
    top: -10px;
    color: #000000;
}

/*form prograss------------*/
#msform {
    text-align: left;
    position: relative;
    width: 100%;
    z-index: 1;
    margin-top: 13px;
    float: left;
}

#msform fieldset {
    border: 0;
    /* padding: 20px 105px 0;*/
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
}

#msform fieldset:not(:first-of-type) {
    display: none;
}

.login-form-box {
    overflow: hidden;
}

.sesses {
    font-size: 30px;
    font-weight: bold;
    color: #ff8d23;
    padding: 56px;
}

.login-form-box .notice-cnt {
    width: 100%;
    float: left;
    margin-top: 19px;
}

.login-form-box .notice-cnt p {
    margin-bottom: 0;
    font-size: 13px;
    color: #bababa;
    text-align: justify;
}

/*form prograss------------*/

/*----------*/

.register-box h6 {
    margin-bottom: 0px !important;
    color: #43464f;
}

.register-box form h1 {
    margin-bottom: 28px !important;
}

.register-box h6 {
    float: left !important;
    position: relative;
    margin-bottom: 12px;
}

.login-form-box input::placeholder {
    color: #43464f;
    font-weight: 500;
}

.login-form-box input[type="text"]:focus,
.login-form-box input[type="password"]:focus {
    outline: none;
}

.email-input {
    background: url(../img/mail.png) left center no-repeat !important;
    background-position: 95% center !important;
}

.login-form-page-left .login-form-box .input-field .phon-input {
    background: url(../img/phone-icon.png) left center no-repeat;

    background-position: 95% center;
    background-size: 20px;
}

.login-form-box .input-field.two input[type="password"] {
    /* background: url(../img/lock-icon.png) left center no-repeat; */
    margin-bottom: 15px;
    background-position: 95% center;
}

.login-form-box svg.svg-inline--fa.fa-eye.fa-w-18.fa-2x,
.login-form-box svg.svg-inline--fa.fa-slash.fa-w-20.fa-3x {
    position: absolute;
    top: 5px;
    width: 19px;
    right: 14px;
    color: #ff9f44;
}

.login-form-box svg.svg-inline--fa.fa-slash.fa-w-20.fa-3x {
    display: none;
}

.login-form-box a {
    font-size: 15px;
    color: #7d7d7d;
    font-weight: normal;
    float: lett;
}

.login-form-box h6 {
    float: left;
    position: relative;
    color: #43464f;
    margin-bottom: 0;
}

.login-form-box h6 label {
    font-size: 14px;
    color: #7d7d7d;
    font-weight: 700;
    user-select: none;
    position: relative;
    padding-left: 25px;
    font-weight: normal;
}

.register-box h6 label {
    color: #43464f !important;
}

.login-form-box h6 input[type="checkbox"] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.login-form-box h6 input[type="checkbox"]:checked + label:after {
    position: absolute;
    left: 0;
    top: 0;
    height: 17px;
    width: 17px;
    border: 1px solid #ff8d23;
    content: "\f00c";
    background: #ff8d23;
    color: #fff;
    border-radius: 3px;
    font: normal normal normal 14px/1 FontAwesome;
}

.login-form-box h6 label:after {
    position: absolute;
    left: 0;
    top: 0;
    height: 17px;
    width: 17px;
    border: 1px solid #202433;
    content: "";
    border-radius: 3px;
}

.continue-bax-btn {
    padding-top: 4px;
}

.register-box h6 label:after {
    position: absolute;
    left: 0;
    top: 0;
    height: 17px;
    width: 17px;
    border: 1px solid #202433;
    content: "";
    border-radius: 3px;
}

.register-box h6 input[type="checkbox"]:checked + label:after {
    position: absolute;
    left: 0;
    top: 0;
    height: 17px;
    width: 17px;
    border: 1px solid #202433;
    content: "\f00c";
    background: #202433;
    color: #fff;
    border-radius: 3px;
    font: normal normal normal 14px/1 FontAwesome;
}

.login-boxes form .login-form-box input[type="submit"]:focus,
.continue:hover {
    outline: none;
}

.login-boxes form .login-form-box input[type="submit"]:hover,
.continue:hover {
    background: #dddddd;
    border: 2px solid #dddddd;
    color: #000;
    transition: 0.9s;
}

.login-boxes form .login-form-box h2 {
    font-weight: 900;
    font-size: 29px;
    font-family: "arial";
    color: #202433;
    letter-spacing: 1px;
}

.login-boxes form .login-form-box h2 span {
    display: block;
    font-size: 15px;
    color: #202433;
    font-weight: normal;
    font-family: "PT Sans", sans-serif;
    margin-top: 5px;
}

.login-boxes form .login-form-box ul {
    width: 100%;
    margin: 10px 0 0;
    padding: 0;
}

.login-boxes form .login-form-box ul li {
    display: inline-block;
    margin: 0 5px;
}

.login-boxes form .login-form-box ul li a {
    display: inline-block;
    font-size: 13px;
    height: 32px;
    width: 32px;
    letter-spacing: 1px;
    font-family: "PT Sans", sans-serif;
    color: #272727;
    padding-right: 0;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid #dadada;
    font-size: 16px;
    text-align: center;
    line-height: 30px;
}

.login-boxes form .login-form-box ul li a:hover {
    text-decoration: none;
    background: #2a427d;
    color: #fff;
}

.login-boxes form .login-form-box ul li:first-child a:hover {
    background: #228bba;
}

.login-boxes form .login-form-box ul li:last-child a:hover {
    background: #bc3929;
}

.login-boxes form .login-form-box h6.regi {
    font-size: 15px;
    color: #202433;
    width: 100%;
    text-align: center;
    margin-top: 6%;
}

.login-boxes form .login-form-box h6.regi a {
    font-size: 15px;
    color: #3e89e7;
    font-weight: bold;
    float: none;
    display: block;
    margin-top: 10px;
}

.last-f {
    background: #f4f5f7;
    float: left;
    width: 100%;
    padding: 20px 0;
    text-align: center;
}

.last-f ul {
    float: left;
    width: 100%;
    margin: 0 0 15px 0;
    padding: 0;
}

.last-f ul li {
    display: inline-block;
    padding: 0 15px;
    position: relative;
}

.last-f ul li a {
    display: inline-block;
    color: #202433;
    font-size: 15px;
    text-decoration: none;
    font-weight: 600;
}

.last-f ul li a:hover {
    color: #566075;
}

.last-f ul li:after {
    content: "";
    position: absolute;
    right: -4px;
    top: 6px;
    height: 14px;
    width: 2px;
    background: #202433;
}

.last-f ul li:last-child:after {
    display: none;
}

.last-f p {
    font-size: 15px;
    color: #5a5d6b;
}

.fixed-sidebar {
    position: fixed;
    z-index: 22;
    width: 70px;
    min-height: 1000vh;
    left: 0;
    top: 0;
    z-index: 1111;
}

.fixed-sidebar-left {
    position: absolute;
    height: 100%;
    background-color: #fff;
    transition: -webkit-transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: transform 0.5s cubic-bezier(0.55, 0, 0.1, 1),
        -webkit-transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    box-shadow: 0 0 34px 0 rgba(63, 66, 87, 0.1);
}

.fixed-sidebar-left.sidebar--small {
    width: 70px;
    transition-delay: 0.3s;
}

.fixed-sidebar-left.sidebar--large {
    width: 270px;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}

.fixed-sidebar .side-log {
    height: 60px;
    background-color: #182032;
    padding: 7px 10px;
    color: #fff;
    display: inherit;
    text-align: center;
    font-size: 30px;
}

.fixed-sidebar .sidebar--small-icon {
    max-height: calc(100vh - 60px);
    overflow-y: scroll;
    transition-delay: 0.3s;
}
.fixed-sidebar .sidebar--small-icons {
    max-height: calc(100vh - 60px);
    overflow-y: scroll;
    transition-delay: 0.3s;
}

.fixed-sidebar .sidebar--small-icon::-webkit-scrollbar {
    display: none;
}

.fixed-sidebar ul {
    float: left;
    width: 100%;
    margin: 0;
    text-align: center;
    padding: 0;
}

.fixed-sidebar ul li {
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid #dbe0eb;
}

.fixed-sidebar ul li:last-child {
    border: none;
}

.fixed-sidebar ul li a {
    padding: 10px 0 10px 0px;
    display: block;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #374a74 !important;
    transition: 500ms ease-in-out 0s;
}

.fixed-sidebar ul li a:hover {
    color: #000000 !important;
    transition: 500ms ease-in-out 0s;
}

.fixed-sidebar .sidebar--small-icon ul li a {
    font-size: 14px;
    padding: 10px 0 10px 0;
}

.fixed-sidebar.open .sidebar--small {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    transition-delay: 0.3s;
}

.fixed-sidebar.open .sidebar--large {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition-delay: 0.3s;
}

.fixed-sidebar.open .sidebar--large ul {
    text-align: left;
}

.fixed-sidebar.open .sidebar--large ul li a {
    font-size: 16px;
    font-weight: 500;
    padding: 12px 24px;
    color: #024b71;
}

.fixed-sidebar.open .sidebar--large ul li a:hover {
    text-decoration: none;
    background: #e2e6f5;
    text-shadow: none;
    color: #7c85a7;
}

.author-status .author-name:hover {
    background: none !important;
    color: #ea5725 !important;
}

.right-bar {
    position: fixed;
    z-index: 22;
    width: 310px;
    min-height: 100vh;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.pai-box {
    float: left;
    width: 100%;
    background: #fff;
    padding-bottom: 15px;
    padding-top: 8px;
}

.right-bar-fixed {
    max-height: calc(100vh - 83px);
    overflow-y: scroll;
    transition-delay: 0.3s;
    position: fixed;
    bottom: 0;
}

.right-bar-fixed::-webkit-scrollbar {
    display: none;
}

.fixed-sidebar .sidebar--large ul li a .fa {
    margin-right: 9px;
}

/*-------css---right side bar---------*/
.fixed-sidebar.right {
    top: 70px;
    z-index: 20;
    right: 0;
    left: auto;
    min-height: 100%;
}

/*--------------------------------------

-------------------------------------------*/

/*--------------------------------------

-------------------------------------------*/
.fixed-sidebar-demo-right {
    top: 61px;
    z-index: 20;
    right: 0;
    left: auto;
    min-height: 100%;
    position: fixed;
    z-index: 22;
    width: 60px;
    min-height: 1000vh;
}

.fixed-sidebar-right.sidebar--small {
    width: 60px;
    transition-delay: 0.3s;
}

.fixed-sidebar-right {
    position: absolute;
    border-left: 1px solid #e6ecf5;
    z-index: 20;
    right: 0;
    top: -10px;
    bottom: 70px;
    background-color: #fff;
    transition: -webkit-transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: transform 0.5s cubic-bezier(0.55, 0, 0.1, 1),
        -webkit-transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    box-shadow: 0 0 34px 0 rgba(63, 66, 87, 0.1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

/*---------------sidebar-roing----*/
.fixed-sidebar.open .fixed-sidebar-right {
    transition: -webkit-transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: transform 0.5s cubic-bezier(0.55, 0, 0.1, 1),
        -webkit-transform 0.5s cubic-bezier(0.55, 0, 0.1, 1);
}

.fixed-sidebar.open .fixed-sidebar-right.sidebar--small {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

.fixed-sidebar.open .fixed-sidebar-right.sidebar--large {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition-delay: 0.3s;
}

.fixed-sidebar-right.sidebar--small {
    width: 60px;
    transition-delay: 0.3s;
}

.fixed-sidebar-right.sidebar--large {
    width: 270px;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

.fixed-sidebar.fixed-sidebar-responsive {
    display: none;
    height: auto;
    min-height: 70px;
    transition: all 0.3s ease;
}

.fixed-sidebar.fixed-sidebar-responsive.open {
    min-height: 1000vh;
}

.fixed-sidebar.fixed-sidebar-responsive.right {
    z-index: 30;
    top: 0;
}

.fixed-sidebar.fixed-sidebar-responsive.right .sidebar--small {
    width: 70px;
    height: 70px;
    background-color: #ff5e3a;
    transition-delay: 0.3s;
    padding-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

/*----------end        s0ide--------------*/
.fixed-sidebar.right .mCustomScrollbar {
    max-height: calc(100vh - 168px);
}

.fixed-sidebar .mCustomScrollbar {
    max-height: calc(100vh - 70px);
    /*	overflow: hidden;*/
}

.ps {
    -ms-touch-action: auto;
    touch-action: auto;
    /*overflow: hidden !important;*/
    -ms-overflow-style: none;
}

.chat-users {
    margin-bottom: 0;
    list-style: none;
    padding: 0;
}

.chat-users li {
    padding: 13px 10px;
    cursor: pointer;
}

.chat-users .author-thumb {
    margin-right: 8px;
}

.author-thumb {
    display: inline-block;
    position: relative;
}

.author-thumb img {
    border-radius: 100%;
    overflow: hidden;
    max-width: unset;
    display: block;
}

.chat-users .author-thumb .icon-status {
    border-color: #fff;
}

.author-thumb .icon-status {
    position: absolute;
    margin-right: 0;
    top: 0;
    left: 0;
    border: 1px solid #3f4257;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.icon-status.online {
    background-color: #32e4cd;
}

.search-friend {
    position: relative;
    box-shadow: 0 -50px 45px -3px rgba(255, 255, 255, 0.7);
    padding: 18px 25px;
    background-color: #fff;
    height: 60px;
    line-height: 19px;
    /* margin-top: auto; */
    float: left;
    width: 100%;
}

.search-friend a {
    fill: #9a9fbf;
}

.inline-items > * {
    display: inline-block;
    vertical-align: middle;
}

.fixed-sidebar-demo-right .search-friend svg {
    height: 20px;
    width: 20px;
}

.olympus-chat {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    background-color: #3e89e7;
    fill: #fff;
    height: 57px;
    text-align: center;
    padding: 0 19px;
}

.olympus-chat svg {
    overflow: hidden;
    vertical-align: middle;
    color: #fff;
    width: 26px;
    text-align: center;
}

.icon-status.disconected {
    background-color: #e55353;
}

.icon-status.away {
    background-color: #ffbf0a;
}

.Edit-year-name-email {
    float: left;
    width: 100%;
}

/*----open-side bar- online chat open css-----*/
/*------------- #UI-BLOCK --------------*/
.ui-block {
    border: 1px solid #e6ecf5;
    margin-bottom: 15px;
}

.ui-block-title {
    padding: 18px 14px 18px;
    line-height: 1;
    border-bottom: 1px solid #e6ecf5;
    border-top: 1px solid #e6ecf5;
    display: table;
    width: 100%;
    position: relative;
    border-radius: 5px 5px 0 0;
}

.ui-block-title .more {
    padding-left: 25px;
    text-align: right;
    width: 16px;
}

.ui-block-title > * {
    margin-bottom: 0;
    display: table-cell;
    vertical-align: middle;
}

.ui-block-title.ui-block-title-small {
    padding: 10px 25px;
}

.ui-block-title.ui-block-title-small .title {
    font-size: 9px;
    text-transform: uppercase;
    font-family: "Quicksand", sans-serif;
    color: #9a9fbf;
}

.fixed-sidebar .ui-block-title a + a {
    float: right;
    color: #515365;
    text-decoration: none;
}

.fixed-sidebar .ui-block-title a {
    margin-left: 20px;
    text-transform: uppercase;
    font-size: 9px;
    padding: 0;
    text-decoration: none;
    font-family: "Quicksand", sans-serif;
}

.ui-block-title .btn {
    display: inline-block;
    margin-bottom: 0;
}

.ui-block-title .btn + * {
    margin-left: 20px;
}

.ui-block-title.inline-items .more {
    float: right;
    margin-top: 6px;
    padding-left: 0;
}

.ui-block-title + .ui-block-title {
    border-bottom: none;
}

.ui-block-title .icon-add {
    margin-right: 0;
}

#accordion + .ui-block-title {
    border-top: none;
    border-bottom: none;
}

.ui-block-content {
    padding: 24px 23px 23px;
}

/*----open-side bar- online chat open css- end----*/

/*-------online chat open css------chat-box-online=====--*/
.chat-users {
    margin-bottom: 0;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.sidebar--large .chat-users li {
    padding: 13px 25px;
    cursor: pointer;
}

.chat-users .author-thumb {
    margin-right: 8px;
    display: inline-block;
    position: relative;
}

.author-thumb img {
    border-radius: 100%;
    overflow: hidden;
    max-width: unset;
    display: block;
    border: 2px solid #ffffff;
    box-shadow: 0 1px 4px 0px #00000040;
    height: 40px;
    width: 40px;
}

.chat-users .author-thumb .icon-status {
    border-color: #fff;
}

.author-thumb .icon-status {
    position: absolute;
    margin-right: 0;
    top: 0;
    left: 0;
    border: 1px solid #3f4257;
    width: 8px;
    height: 8px;
}

.icon-status.online {
    background-color: #3e89e7;
}

.icon-status {
    width: 6px;
    height: 6px;
    border-radius: 100%;
    display: inline-block;
    margin-right: 8px;
}

.chat-users .more {
    float: right;
    margin-top: 7px;
}

.chat-users .author-name {
    font-size: 12px !important;
    padding: 0 !important;
    font-family: "Quicksand", sans-serif;
}

.chat-users .status {
    text-transform: uppercase;
    font-size: 8px;
    font-weight: 700;
    display: block;
    font-family: "Quicksand", sans-serif;
}

/*---search-frend-box--------*/
.sidebar--large .search-friend {
    padding: 0;
    border-top: 1px solid #e6ecf5;
}

.search-friend {
    position: relative;
    box-shadow: 0 -50px 45px -3px rgba(255, 255, 255, 0.7);
    padding: 25px 14px;
    background-color: #fff;
    height: 69px;
    margin-top: 0;
}

.search-friend .form-group {
    margin: 15px 10px 15px 20px;
    max-width: 150px;
}

.search-friend input {
    padding: 0.5rem 1.1rem;
    font-size: 12px;
}

.search-friend input,
.form-control {
    color: #515365;
    line-height: inherit;
    font-size: 0.875rem;
}

.search-friend select,
.search-friend input,
.form-control {
    background-color: transparent;
}

.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #515365;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #aaa !important;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    height: 40px;
}

select.form-control:not([size]):not([multiple]) {
    height: 40px !important;
}



.search-friend a {
    color: #9a9fbf;
    width: auto;
    display: inline-block;
    margin: 0 7px;
}

.sidebar--large .olympus-chat {
    padding: 15px 15px 15px 30px;
}

.olympus-chat {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: #7c5ac2;
    fill: #fff;
    height: 57px;
    text-align: center;
    padding: 0 19px;
    text-decoration: none;
}

.olympus-chat:hover {
    text-decoration: none;
}

.olympus-chat .olympus-chat-title {
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 0;
    font-size: 15px;
    text-decoration: none;
}

/*---end----online chat open css------chat-box-online=====--*/
/*-----end--css---right side bar---------*/

/*------------dash Bord css----------------*/
.dash-bord-profile {
    float: left;
    width: 100%;
    background: #fff;
    /* padding: 10px 15px; */
    font-family: "arial";
    border-radius: 5px;
    position: relative;
}

.nav-tabs .nav-item {
    margin-bottom: -1px;
    padding: 0 !important;
    vertical-align: middle;
    height: auto;
    display: inline-block;
}

.nav-tabs .nav-link {
    margin-right: 13px;
    display: inline-block;
    padding: 0px 7px 1px;
    height: auto;
    font-family: "Quicksand", sans-serif;
}

.dash-bord-cover-img {
    float: left;
    width: 100%;
    height: 415px;
    overflow: hidden;
    border-radius: 5px;
}

.dash-bord-cover-img img {
    width: 100%;
}

.dash-bord-for-file {
    float: left;
    width: 100%;
    padding: 6px 38px;
    background: rgb(0 0 0 / 35%);
    position: absolute;
    bottom: 0;
}

.dash-bord-for-file-left {
    float: left;
    width: 100%;
    position: relative;
    margin-right: 0;
    text-align: center;
    margin-top: -111px;
}

.dash-bord-images {
    width: 200px;
    height: 200px;
    overflow: hidden;
    border-radius: 6%;
    position: relative;
    display: inline-block;
    border: 1px solid #ccc;
    margin-bottom: -41px;
}

.dash-bord-images img {
    width: 317px;
    position: absolute;
    left: -63px;
    top: 0px;
}

.dash-bord-pro-file-prasent {
    width: 55px;
    height: 55px;
    overflow: hidden;
    border-radius: 50%;
    background: #ff8d23;
    display: inline-block;
    position: absolute;
    top: 4px;
    right: 40%;
    color: #ffff;
    z-index: 1111;
    font-size: 16px;
    text-align: center;
    padding: 14px 0px;
    transform: translate(50%, -50%);
}

.dash-bord-for-file-right {
    float: left;
    width: 100%;
}

.dash-bord-for-file-name-socal-icon {
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}

.dash-bord-for-file-name-socal-icon h3 {
    color: #ff6937;
    display: inline-block;
    font-size: 17px;
    font-weight: 700;
    text-decoration: none;
    padding: 6px 0;
    font-family: "Quicksand", sans-serif;
    margin: 0;
}

.file-name-socal-icon-left {
    float: left;
    width: 100%;
}

.file-name-detals {
    list-style-type: none;
    margin: 0;
    padding-bottom: 0;
    display: inline-block;
    float: left;
}

.file-name-detals li {
    display: inline-block;
    color: #fff;
    font-size: 13px;
    /* font-weight: bold; */
    letter-spacing: 1px;
    margin: 0;
    margin-bottom: 4px;
    font-family: "Quicksand", sans-serif;
    position: relative;
    padding: 0 13px;
}

.file-name-detals li:first-child {
    padding-left: 0;
}

.file-name-detals li:after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    top: 7px;
    left: -5px;
    background: #000;
}

.file-name-detals li:first-child:after {
    display: none;
}

.file-name-socal {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline-block;
    float: right;
}

.file-name-socal li {
    display: inline-block;
    padding: 0 6px;
}

.file-name-socal li a {
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    color: #ffffff;
}

.file-name-socal li a:hover {
    color: #ff8d23;
    transition: 0.9s;
}

.exam-starts {
    float: left;
    width: 100%;
    padding: 14px 0 0;
}

.exam-starts .exam-starts-li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.exam-starts .exam-starts-li li {
    display: inline-block;
    padding: 0 11px;
}

.exam-starts .exam-starts-li li:first-child {
    padding-left: 0;
}

.exam-starts .exam-starts-li li:last-child {
    float: right;
    padding-right: 0;
}

.exam-starts .exam-starts-li li:last-child a {
    padding-left: 6px 10px;
}

.exam-starts .exam-starts-li li p {
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
}

.exam-starts .exam-starts-li li h5 {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #fff;
    position: relative;
    font-family: "Quicksand", sans-serif;
}

.exam-starts-li .star-ratting li {
    padding: 0 3px !important;
    font-size: 12px;
    color: #ff8d23;
}

.exam-starts-li .star-ratting li:last-child {
    position: relative;
    top: 3px;
    font-size: 15px;
    left: 11px;
    color: #fff;
    font-weight: 700;
}

.exam-starts .exam-starts-li li:last-child a {
    padding: 8px 17px;
    text-decoration: none;
    background: #ff6937;
    color: #fff;
    border-radius: 3px;
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-top: 7px;
    display: inline-block;
}

.exam-starts .exam-starts-li li:last-child a:hover {
    background: #ff8d23;
    transition: 0.9s;
}

.dash-bord-tab {
    float: left;
    width: 100%;
    margin-top: 21px;
}

.dash-bord-tab a#home-tab {
    border: none;
}

.dash-bord-tab .nav-tabs {
    border: none;
    background: #fff;
    padding: 14px 15px;
}

.dash-bord-tab a#home-tab:hover {
    border: none;
}

.dash-bord-tab a#profile-tab:hover {
    border: none;
}

.dash-bord-tab .nav-tabs .nav-link {
    border: none;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.dash-bord-tab .nav-link.active {
    color: #ffffff;
    background-color: #ff8d23;
    border-color: #dee2e6 #dee2e6 #fff;
    box-shadow: 0 0 5px #000;
}

.dash-bord-tab .nav-link {
    color: #000;
}

.dash-question {
    float: left;
    width: 100%;
    padding: 20px;
    box-shadow: 0 0 3px #636363;
    background: #ffffff;
    border-radius: 3px;
    margin-top: 29px;
}

.dash-bord-tab .dash-bord-tab .nav-tabs {
    border: none;
    background: #fff;
}

.dash-question h5 {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #202433;
    position: relative;
    font-family: "Quicksand", sans-serif;
    background: #e2e2e2;
    padding: 9px 10px;
    border-radius: 1px;
}

.dash-question .question-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    padding-left: 10px;
}

.dash-question .question-list li {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    color: #202433;
    position: relative;
    font-family: "Quicksand", sans-serif;
    padding: 4px 0;
}

.dash-question .question-list li svg {
    color: #ff8d23;
    width: 17px;
    position: relative;
    top: -1px;
    margin-right: 11px;
    font-weight: 100;
}

.svg-close svg {
    color: red !important;
}

.total-time-box {
    float: left;
    width: 100%;
    margin-top: 14px;
}

.total-time-li {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: right;
}

.total-time-li li {
    display: inline-block;
    padding: 0 11px;
}

.total-time-li li p {
    font-size: 12px;
    font-weight: 700;
    color: #626673;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
}

.total-time-li li span {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #202433;
    position: relative;
    font-family: "Quicksand", sans-serif;
}

.total-time-li .star-ratting li {
    padding: 0 1px !important;
    font-size: 11px;
    color: #ff8d23;
}

.total-time-li .star-ratting li:last-child {
    position: relative;
    top: 0px;
    font-size: 12px;
    left: 2px;
    color: #000;
    font-weight: 700;
}

/*-----------End   Dash Bord css----------------*/

/*--------edit-profil-prosanl----------*/
.edit-profil-prosanl ul {
    list-style-type: none;
    margin: 25px 0;
    padding: 0;
    /* float: left; */
}

.edit-profil-prosanl ul li {
    display: inline-block;
    position: relative;
    font-family: "arial";
    padding: 0 2px;
    width: 32%;
}

.edit-profil-prosanl .follow-btn-box a {
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    padding: 6px 21px;
    background: #ff6937;
    color: #fff;
    border-radius: 65px;
    width: auto;
    text-align: center;
    letter-spacing: 1px;
    border: 1px solid #ff6937;
    font-family: "Quicksand", sans-serif;
    font-weight: bold;
    box-shadow: 0 0 13px -3px #ad5300;
    text-transform: capitalize;
}

.edit-profil-prosanl .follow-btn-box a:hover {
    background: #ad5300;
    color: #ffffff;
    transition: 0.9s;
}

.Edit-year-personal-form {
    float: left;
    width: 100%;
    background: #fff;
    padding: 15px 20px;
    border-radius: 4px;
    border: 1px solid #e6ecf5;
}

.hd {
    margin-left: -20px;
    margin-right: -20px;
    border-bottom: 1px solid #ccc;
}

.hd h3 {
    font-size: 16px;
    padding: 4px 19px 10px 19px;
}

.Edit-year-personal-setting {
    float: left;
    width: 100%;
}

.Edit-year-personal-setting h3 {
    font-size: 16px;
    font-weight: bold;
    color: #202433;
    margin: 0;
    padding: 10px 0;
    font-family: "Quicksand", sans-serif;
}

.Edit-year-form-grope {
    position: relative;
}

.Edit-year-form-grope svg.svg-inline--fa.fa-facebook-f.fa-w-10.c-facebook,
.Edit-year-form-grope svg.svg-inline--fa.fa-twitter.fa-w-16.c-twitter,
.Edit-year-form-grope svg.svg-inline--fa.fa-google-plus-g.fa-w-20.fa-3x,
.Edit-year-form-grope svg.svg-inline--fa.fa-linkedin-in.fa-w-14.fa-5x {
    display: block;
    position: absolute;
    left: 14px;
    top: 64%;
    color: #3b5998;
    font-size: 15px;
}

.Edit-year-form-grope svg.svg-inline--fa.fa-twitter.fa-w-16.c-twitter,
.Edit-year-form-grope svg.svg-inline--fa.fa-google-plus-g.fa-w-20.fa-3x {
    color: #38bff1;
    width: 15px;
}

.Edit-year-form-grope svg.svg-inline--fa.fa-linkedin-in.fa-w-14.fa-5x {
    color: #0e76a8;
    width: 12px;
}

.Edit-year-form-grope svg.svg-inline--fa.fa-google-plus-g.fa-w-20.fa-3x {
    width: 16px;
    color: #db4a39;
}

.Edit-year-form-grope.fb-icon:after {
    content: "";
    position: absolute;
    display: block;
    height: 56%;
    width: 1px;
    background-color: #e6ecf5;
    top: 31px;
    left: 35px;
}

.Edit-year-form-grope input.icon {
    padding-left: 44px;
    border: #e6ecf5 solid 1px;
}

.Edit-year-name-email,
.Edit-year-form-grope {
    float: left;
    width: 100%;
}

.Edit-year-form-grope {
    margin-bottom: 20px;
}

.Edit-year-form-grope .Edit-year-label {
    width: 25%;
    text-align: left;
    font-size: 14px;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    padding: 6px 0px;
    text-transform: capitalize;
}

.Edit-year-form-grope input {
    width: 70%;
    padding: 9px 18px;
    border-radius: 2px;
    border: none;
    /* box-shadow: 0 0 3px 0px #ccc; */
    outline: none;
    font-size: 13px;
    float: right;
    font-family: "Quicksand", sans-serif;
    height: 50px;
}

.form-grope-city-cintyry select {
    width: 100%;
    padding: 6px 18px;
    border-radius: 2px;
    border: none;
    box-shadow: 0 0 3px 0px #ccc;
    outline: none;
    font-size: 15px;
    float: right;
    font-family: "Quicksand", sans-serif;
    appearance: none;
    background: url(../img/slider-arrow-png-4.png) no-repeat;
    background-position: 97% center;
    background-size: 13px;
    height: 50px;
}

.form-grope-city-cintyry .Edit-year-label {
    width: 100%;
    text-align: left;
    float: left;
}

.form-grope-city-cintyry input {
    width: 100%;
}

/*-=-=-=-payment-=-=-=-*/
.cosla-paymemt {
    float: left;
    width: 100%;
    background: #fff;
    padding: 15px 20px;
    border-radius: 4px;
    border: 1px solid #e6ecf5;
    margin-top: 13px;
}

.cosla-paymemt h3 {
    font-size: 18px;
    font-weight: bold;
    color: #202433;
    margin: 0;
    padding: 10px 0;
    font-family: "Quicksand", sans-serif;
    border-bottom: 1px solid #cccccc8f;
    margin-bottom: 20px;
}

.pay-box-soc {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.pay-box-soc input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 2px;
    left: 0;
    height: 19px;
    width: 19px;
    background-color: #ffffff;
    border-radius: 50%;
    border: 1px solid #6b8e23;
}

/* On mouse-over, add a grey background color */
.pay-box-soc:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.pay-box-soc input:checked ~ .checkmark {
    background-color: #2196f3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.pay-box-soc input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.pay-box-soc .checkmark:after {
    top: 3px;
    left: 3px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: white;
}

.cosla-paymemt ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.pay-box-soc p {
    font-size: 15px;
    font-weight: 500;
    color: #202433;
    letter-spacing: 0px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
}

.cosla-paymemt ul li {
    padding: 10px 0 0px;
    border-bottom: 1px solid #bbbbbb87;
}

/*-=-=-=-payment-=-=-=-*/
/*-------------chack-box---------*/
.Edit-year-chack-box {
    float: left;
    width: 100%;
}

.unstyled {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.styled-checkbox {
    position: absolute;
    opacity: 0;
}

.styled-checkbox + label {
    position: relative;
    cursor: pointer;
    padding: 0;
}

.styled-checkbox + label:before {
    content: "";
    margin-right: 10px;
    display: inline-block;
    vertical-align: text-top;
    width: 20px;
    height: 20px;
    background: white;
    border: 2px solid #ccc;
}

.styled-checkbox:hover + label:before {
    /*background: #f35429;*/
}

.styled-checkbox:focus + label:before {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}

.styled-checkbox:checked + label:before {
    background: #f35429;
}

.styled-checkbox:disabled + label {
    color: #b8b8b8;
    cursor: auto;
}

.styled-checkbox:disabled + label:before {
    box-shadow: none;
    background: #ddd;
}

.styled-checkbox:checked + label:after {
    content: "";
    position: absolute;
    left: 5px;
    top: 11px;
    background: white;
    width: 2px;
    height: 2px;
    box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white,
        4px -6px 0 white, 4px -8px 0 white;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.unstyled label {
    color: #202433;
    font-size: 14px;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
}

.Edit-year-submit-btn {
    float: left;
    width: 100%;
    padding: 10px 0;
    text-align: left;
}

.Edit-year-submit-btn input {
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    padding: 7px 53px;
    background: #007bff;
    color: #fff;
    border-radius: 38px;
    width: auto;
    text-align: center;
    letter-spacing: 1px;
    border: 1px solid #007bff;
    font-family: "Quicksand", sans-serif;
    font-weight: bold;
    text-transform: capitalize;
    height: 40px;
}

.Edit-year-submit-btn input:hover {
    color: #ffffff;
    transition: 0.9s;
}

.extrernal-links .Edit-year-form-grope {
    margin-bottom: 0px;
}

.profile-menu-dasbord {
    border-radius: 8px;
    border: 1px solid #e6ecf5;
    margin-bottom: 15px;
    float: left;
    width: 100%;
    margin-top: 20px;
    padding: 0px;
}

.profile-menu-dasbord ul {
    list-style-type: none;
    margin: 0;
}

.profile-menu-dasbord ul li {
    background-color: #374a74;
    margin: 0px;
}

.profile-menu-dasbord ul li a {
    text-decoration: none;
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    padding: 12px 6px;
    letter-spacing: 1px;
    margin-bottom: 3px;
}

.profile-menu-dasbord ul li a svg {
    overflow: hidden;
    vertical-align: middle;
    width: 17px;
    margin-right: 9px;
    position: relative;
    top: -2px;
}

.profile-menu-dasbord ul li .active {
    background: #17a2b8;
    color: black;
}

.profile-menu-dasbord ul li a:hover {
    background: #e6ecf5;
    transition: 0.9s;
    color: #515365;
}

.widget {
    margin-top: 1px;
    padding: 10px;
    /* border-top: 1px solid #e6ecf5; */
    float: left;
    width: 100%;
}

.w-socials .title {
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 1.3;
    color: #515365;
    font-family: "Quicksand", sans-serif;
    font-size: 14px;
    float: left;
    width: 100%;
}

.widget .social-item {
    font-size: 13px;
    color: #fff;
    padding: 7px 15px;
    display: block;
    border-radius: 3px;
    margin-bottom: 15px;
    text-align: center;
    width: 100%;
    float: left;
}

.widget a {
    transition: all 0.15s ease;
    text-decoration: none;
    display: block;
}

.bg-facebook {
    background-color: #2f5b9d;
}

.bg-twitter {
    background-color: #38bff1;
}

.bg-dribbble {
    background-color: #f74881;
}

.widget .svg-inline--fa {
    width: 12px;
    margin-right: 10px;
}

.widget .svg-inline--fa {
    width: 13px;
    margin-right: 10px;
    position: relative;
    top: -2px;
}

svg.svg-inline--fa.fa-facebook-f.fa-w-10 {
    width: 9px;
    position: relative;
    top: -1px;
}

.social-item:hover {
    color: #fff;
    opacity: 0.9;
}

.ui-block-title a.h6.title {
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #515365;
    font-family: "Quicksand", sans-serif;
}

.items-round-little {
    color: #fff;
    font-weight: 700;
    font-size: 10px;
    text-align: center;
    width: 19px;
    height: 19px;
    line-height: 19px;
    border-radius: 100%;
    margin-left: 12px;
    font-family: "Quicksand", sans-serif;
}

.bg-primary {
    background-color: #ff5e3a !important;
}

.bg-primary:hover,
.bg-blue:hover {
    text-decoration: none;
    color: #fff;
}

.bg-blue {
    background-color: #38a9ff;
}

/*--------------security-Login------------------*/
.security-Login {
    float: left;
    width: 100%;
    padding: 0 100px 100px;
}

.security-Login h3 {
    font-size: 20px;
    font-weight: bold;
    color: #202433;
    margin: 0;
    padding: 10px 0;
    font-family: "Quicksand", sans-serif;
    margin-bottom: 20px;
}

.security-input-fild {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.security-input-fild label {
    width: 100%;
    text-align: left;
    color: #202433;
    font-size: 15px;
    letter-spacing: 1px;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    padding: 6px 0px 10px;
}

.security-input-fild input {
    width: 100%;
    padding: 10px 18px;
    border-radius: 2px;
    border: none;
    box-shadow: 0 0 3px 0 #ccc;
    outline: none;
    font-size: 13px;
    float: right;
    font-family: "Quicksand", sans-serif;
}

span.forgot-pw a,
.change-pw a {
    display: inline-block;
    text-decoration: none;
    font-size: 14px;
    color: #212121;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 500;
    font-family: "Quicksand", sans-serif;
}

.change-pw a {
    float: right;
}

span.forgot-pw a:hover,
.change-pw a:hover {
    color: #ff8d23;
    transition: 0.9s;
}

.security-input-bttnm {
    float: left;
    width: 100%;
    margin: 25px 0;
}

.security-input-bttnm .cancel-btn {
    background: #000 !important;
    border: 1px solid #000 !important;
}

.security-input-bttnm .cancel-btn,
.security-input-bttnm .save-btn {
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    padding: 7px 17px;
    background: #ff6937;
    color: #fff;
    border-radius: 3px;
    width: auto;
    text-align: center;
    letter-spacing: 1px;
    border: 1px solid #ff6937;
    font-family: "Quicksand", sans-serif;
    font-weight: bold;
    box-shadow: 0 0 5px -1px #ff8d23;
    text-transform: capitalize;
    outline: none;
    margin-right: 20px;
}

.security-input-bttnm .cancel-btn:hover,
.security-input-bttnm .save-btn:hover {
    background: #ad5300;
    color: #ffffff;
    transition: 0.9s;
}

/*--------edit-profil-prosanl----------*/

/*----css--------profile-all-diteal---------css-------*/
.profile-all-diteal {
    float: left;
    width: 100%;
    padding-top: 15px !important;
}

.profile-images-box {
    float: left;
    width: 100%;
    border: 1px solid #e6ecf5;
}

.top-header-thumb-cover {
    position: relative;
    float: left;
    display: block;
    width: 100%;
    border-radius: 5px 5px 0 0;
    overflow: hidden;
    height: 406px;
}

.top-header-thumb-cover img {
    width: 100%;
}

.top-header-thumb-cover:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0px -120px 55px -30px rgba(0, 0, 0, 0.5);
}

.profile-section {
    position: relative;
    padding: 6px 23px;
    z-index: 3;
    float: left;
    border-top: 0;
}

.profile-images-author {
    /* position: absolute; */
    /* left: 120px; */
    /* -webkit-transform: translate(-50%, 0); */
    /* transform: translate(-50%, 0); */
    /* bottom: 15px; */
    text-align: center;
    max-width: 300px;
    z-index: 4;
    display: inline-block;
    /* margin-top: -115px; */
    padding: 0 0;
    width: 286px;
    float: left;
}

.pro-fiel-img01 {
    float: left;
    width: 100%;
    position: relative;
    background: #fff;
}

.pro-fiel-img01-box {
    float: left;
    width: 100%;
    position: absolute;
    background: #fefefe0a;
    top: 0;
    padding: 113px 0 0px;
    /* overflow: hidden; */
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    max-width: 1110px;
}

.Interests {
    float: left;
    width: 100%;
    padding: 13px 20px 13px 0;
    background: rgba(255, 255, 255, 0.28);
    margin-top: 0;
}

.author-content {
    float: left;
    width: 286px;
    text-align: center;
    margin-top: 20px;
}

.author-content p {
    font-size: 14px;
    color: #fff;
    letter-spacing: 1px;
    margin: 0;
    margin-top: 4px;
}

.Interests ul li a svg {
    width: 16px;
    margin-right: 5px;
    vertical-align: middle;
    position: relative;
    top: -2px;
}

svg.svg-inline--fa.fa-sliders-v-square.fa-w-14.fa-7x {
    width: 14px;
    top: -1px;
}

.haby-g {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 56%;
    float: left;
    text-align: left;
}

.haby-g li {
    display: inline-block;
    margin-right: 0px;
    margin-bottom: 0px;
}

.haby-g li a {
    display: inline-block;
    text-decoration: none;
    padding: 2px 15px 2px 15px;
    border-radius: 29px;
    background: #ffffffc2;
    box-shadow: 0px 0px 4px 0px #6b8e24;
    color: #463838;
    vertical-align: middle;
    font-size: 13px;
    margin: 3px 0;
}

.haby-g li a:hover {
    background: #6b8e24;
    transition: 0.9s;
    box-shadow: 0px 0px 4px 0px #000000;
    color: #fff;
}

.pro-file-update-ic li a.prof-02-sst:hover {
    background: #6b8e24;
    transition: 0.9s;
    box-shadow: 0px 0px 4px 0px #000000;
    color: #fff;
}

.pro-file-update-ic {
    /* position: absolute; */
    /* right: 24px; */
    /* bottom: 14px; */
    width: 17%;
    float: right;
    margin-top: 12px;
}

svg.svg-inline--fa.fa-candle-holder.fa-w-14.fa-7x {
    width: 14px;
}

svg.svg-inline--fa.fa-running.fa-w-13.fa-7x {
    top: 0px;
    width: 14px;
}

svg.svg-inline--fa.fa-smile.fa-w-16.fa-7x {
    position: relative;
    left: 0px;
    top: -1px;
}

p.country {
    display: none;
}

.pro-file-update-ic ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: right;
}

.pro-file-update-ic li {
    display: inline-block;
    margin: 0 3px !important;
    padding: 3px;
}

.pro-file-update-ic li a.prof-02-sst {
    text-decoration: none;
    cursor: pointer;
    border-radius: 100%;
    width: 40px;
    height: 40px;
    line-height: 36px;
    padding: 0;
    fill: #fff;
    font-size: 20px !important;
    /* background-color: #6b8e24d6; */
    text-align: center;
    display: inline-block;
    margin: 0 1px;
    border: 1px solid #ffffff4f;
    padding: 0px !important;
    background: none !important;
    box-shadow: none !important;
}

.pro-file-update-ic li .prof-02-sst:hover {
    background: #6b8e24 !important;
    box-shadow: 0px 0px 5px -1px #000;
    transition: 0.9s;
}

.pro-file-update-ic li svg {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: #fff;
    margin: 0 !important;
}

/*
.bg-purple {
    background-color: #7c5ac2;
}*/
.author-thumb-img {
    border-radius: 0;
    border: 2px solid #fff;
    margin: 0 auto;
    overflow: hidden;
    width: 180px;
    height: 180px;
    background-color: #ffffff;
    box-shadow: 0px 0px 7px -1px #000000bd;
    margin-bottom: 10px;
}

.author-thumb-img {
    display: inline-block;
    position: relative;
    bottom: -38px;
}

.author-thumb-img img {
    width: 190px;
    /* position: absolute; */
    /* left: -34px; */
    /* top: 0; */
}

a.h4.author-name {
    text-decoration: none;
    font-size: 24px;
    font-weight: bold;
    color: #ffffff;
    font-family: "arial";
    letter-spacing: 1px;
    text-transform: capitalize;
}

a.h4.author-name:hover {
    color: #ff6937;
    transition: 0.9s;
}

.country {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #202433;
    position: relative;
    font-family: "Quicksand", sans-serif;
    border-radius: 1px;
    margin-bottom: 0;
    margin-top: 6px;
}

.profile-menu {
    float: right;
    width: 100%;
    position: relative;
    padding: 28px 0;
}

.profile-menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.profile-menu ul li {
    display: inline-block;
    position: relative;
}

.profile-menu ul li a {
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    color: #9a9fbf;
    display: block;
    font-family: "arial";
    letter-spacing: 1px;
    transition: all 0.3s ease;
}

.profile-menu ul li a:hover {
    color: #ff6937;
    transition: 0.9s;
}

.more-with-triangle:before {
    position: absolute;
    display: inline-block;
    content: "";
    top: -7px;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #fff;
    right: 25px;
}

.profile-menu ul li ul {
    background: white;
    visibility: hidden;
    opacity: 0;
    min-width: 150px;
    position: absolute;
    transition: all 0.5s ease;
    margin-top: 1rem;
    left: -118px;
    display: none;
    top: 5px;
    padding: 10px;
    box-shadow: 0 0 4px 0 #00000026;
}

/*.profile-menu .more-dropdown {
    width: 100px;
    top: calc(100% + 10px);
    right: -25px;
}*/
.profile-menu .more-dropdown li a {
    font-weight: 500;
}

.profile-menu ul li:hover > ul,
.profile-menu ul li ul:hover {
    visibility: visible;
    opacity: 1;
    display: block;
    transition: all 0.3s ease;
}

.profile-menu ul li ul li {
    clear: both;
    width: 100%;
}

.profile-menu-dasbord h4 {
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    letter-spacing: 0px;
    color: #515365;
    font-family: "Quicksand", sans-serif;
}

.about-text {
    float: left;
    width: 100%;
    padding: 17px 11px 8px;
}

.about-text h5 {
    font-size: 0.812rem;
    color: #515365;
    font-weight: 600;
    margin-bottom: 1px;
    font-family: "PT Sans", sans-serif;
}

.about-text p {
    font-size: 13px;
    font-weight: 500;
    color: #515365;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    padding: 0;
    letter-spacing: 0px;
    margin-bottom: 3px;
}

.timeline-view-box {
    float: left;
    width: 100%;
    margin-top: 23px;
}

.timeline-view-box .profile-menu-dasbord {
    margin-top: 0;
}

.timeline-view-box .page-may-tital h6 {
    margin: 0;
}

.timeline-view-box .page-may-tital h6 a {
    font-size: 12px;
    font-family: "Quicksand", sans-serif;
    color: #888da8;
    text-decoration: none;
}

.timeline-view-box .social-coommemnt-box .coommemnt-con {
    color: #888da8;
    line-height: 20px;
    font-family: "Quicksand", sans-serif;
}

.timeline-view-box .like-comment-share-bar li {
    display: inline-block;
    width: 124px;
    text-align: center;
}

.timeline-view-box .like-comt-line li {
    color: #515365;
}

.may-star-bttn-view.dropdown-menu.show {
    z-index: 1;
}

li.profil-dropdown {
    position: relative;
}

/*.profil-update-show {
    top: -35px;
    left: -56px;
     display: none;
    position: absolute;
    background-color: #fff;
    min-width: 100px;
    box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 57%);
    width: 100%;
    z-index: 1;
    padding-top: 5px;
    border-radius: 6px;
    text-align: left;
}*/
.profil-update-show {
    display: block;
    position: absolute;
    /* top: 100%; */
    top: 48px;
    right: -13px;
    width: 180px;
    box-shadow: 0 0 34px 0 rgba(63, 66, 87, 0.1);
    background-color: #fff;
    border-radius: 4px;
    opacity: 0;
    transition: visibility 0s linear 0.3s, opacity 0.3s linear;
    text-align: left;
    padding: 15px 20px;
    z-index: 11111;
    visibility: hidden;
}

.profil-update-show:before {
    position: absolute;
    display: inline-block;
    content: "";
    top: -7px;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #fff;
    right: 28px;
}

.like-comment-share-bar li.active i {
    color: #3e89e7;
}

.profil-ul a {
    padding: 7px 0;
    font-size: 12px;
    color: #515365;
    display: block;
    font-weight: 700;
    text-decoration: none;
}

.profil-ul a:hover {
    color: #6b8e24;
    transition: 0.9s;
}

ul.profil-ul {
    text-align: left;
}

li.profil-dropdown:hover .profil-update-show {
    display: block !important;
    opacity: 1;
    visibility: visible;
}

.modal-dialog {
    /*    top: 59%;
    transform: translate(0,-50%) !important;*/
    max-width: 1047px;
}

.profile-upd-popup .modal-header {
    padding: 14px 25px 14px;
    border-bottom: 1px solid #e6ecf5;
}

.profile-upd-popup .modal-title.text-center {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    color: #515365;
    text-align: left !important;
    float: left;
}

.modal {
    /*overflow: hidden !important;*/
    background: rgba(5, 5, 5, 0.49);
}

button.close.profile-btn {
    position: absolute;
    right: -20px;
    top: -28px;
    font-size: 42px;
    font-weight: 100;
    color: #ffffff !important;
    opacity: 1;
    box-shadow: none;
    text-shadow: none;
}

button.close.profile-btn:hover {
    color: #f00 !important;
    transition: 0.9s;
}

.for-tab-style-02 .nav-link {
    font-size: 14px;
    color: #ccb;
}

.for-tab-style-02 .nav-link {
    font-size: 14px;
    text-decoration: none;
    display: block;
    font-weight: 500;
    color: #515365 !important;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    padding: 12px 12px;
    letter-spacing: 1px;
    background: #fff !important;
}

.for-tab-style-02 li.nav-item {
    padding-top: 0px !important;
}

.search-bar {
    float: left;
    padding: 11px 0;
    margin-left: -14px;
    width: 30% !important;
    position: relative;
}

.search-bar input {
    outline: none;
    padding: 10px 16px;
    width: 100%;
    font-size: 13px;
    vertical-align: middle;
    font-weight: 300;
    border-radius: 31px;
    float: left;
    box-sizing: border-box !important;
    background: #e6edff;
    border: 1px solid #cfd8f1;
    color: #182032;
    padding-left: 40px;
}

.search-bar input::placeholder {
    color: #182032;
    font-size: 13px;
    font-style: italic;
    letter-spacing: 1px;
}

.sr-icon {
    float: left;
    background: #fff;
    margin-top: 10px;
    padding: 7px;
}

.sr-set {
    float: left;
    margin-top: 19px;
    width: 20px;
    position: absolute;
    right: 35px;
    top: 1px;
}

.sr-set i {
    color: #374a74;
    font-size: 14px;
    position: relative;
}

ul.sr-set-inr li a span {
    padding-right: 12px;
}

ul.sr-set-inr li a i.fa.fa-university {
    font-size: 14px;
}

.search-bar .fst {
    position: absolute;
    top: 22px;
    left: 15px;
    color: #374a74;
}

ul.sr-set-inr {
    visibility: hidden;
    opacity: 0;
    display: block;
    position: absolute;
    width: 145px;
    box-shadow: 0px 2px 6px 0px #c0c0c0;
    background-color: #fff;
    border-radius: 5px;
    opacity: 0;
    transition: visibility 0s linear 0.3s, opacity 0.3s linear;
    text-align: left;
    padding: 0;
    z-index: 11111;
    top: 29px;
    right: -22px;
    border-bottom: 2px solid #374a74;
}

ul.sr-set-inr li {
    display: block;
    text-align: left;
    border-bottom: 1px solid #e3e3e3;
    padding: 8px 13px;
}

ul.sr-set-inr li:last-child {
    border: none;
}

ul.sr-set-inr li a {
    color: #000;
    text-align: left;
}

.sr-set:hover .sr-set-inr {
    opacity: 1;
    transition: 500ms all ease-in-out 0s;
    visibility: visible;
}

ul.sr-set-inr li a:hover {
    color: #6b8e24;
    transition: 0.9s;
}

ul.sr-set-inr:before {
    position: absolute;
    display: inline-block;
    content: "";
    top: -7px;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #fff;
    right: 4px;
}

.for-tab-style-02 .nav-pills {
    background-color: #fff;
    border-radius: 0px;
    border: 1px solid #e6ecf5;
    float: left;
    width: 100%;
    padding: 0px;
    padding: 5px;
    margin: 0;
}

.for-tab-style-02 ul .nav-item .active {
    background: #e6ecf5 !important;
}

.for-tab-style-02 ul .nav-item:hover a {
    background: #e6ecf5 !important;
    transition: 0.9s;
}

/*----css--------profile-all-diteal---------css-------*/

/*--------Start Landing Page----------*/
.doctor-banner-section {
    float: left;
    width: 100%;
}

.doctor-banner-section img {
    width: 100%;
}

.service-box {
    float: left;
    width: 100%;
    margin-top: 25px;
}

.service-box ul {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
    text-align: center;
}

.service-box ul li {
    display: inline-block;
    width: 22%;
    background: #fff;
    vertical-align: top;
    border: 1px solid #eaeaea;
    margin: 8px 5px;
    text-align: center;
    height: 185px;
    border-radius: 4px;
    padding: 15px 0;
}

.service-box ul li a {
    display: inline-block;
    text-decoration: none;
}

.service-box ul li span {
    display: block;
    font-weight: bold;
    color: #464646;
}

.service-box ul li span:last-child {
    color: #4e4e4e;
    font-size: 16px;
}

.service-img {
    float: left;
    width: 100%;
}

.service-img span {
    display: inline-block !important;
    width: 90px;
    height: 90px;
    padding: 14px 12px;
}

.service-img span img {
    width: 100%;
}

.service-box ul li p {
    color: #ccc;
    font-size: 15px;
}

.row.fdsr {
    background: #fff;
    margin: 0 0 18px 0;
    padding: 24px 0;
}

.row.frdtl-dtl {
    margin-bottom: 31px;
}

form.f-search input[type="text"] {
    border-color: #d8d8d8;
    border: 1px solid #d8d8d8;
    position: relative;
    padding: 10px;
    border-radius: 3px;
    width: 100%;
    outline: none;
}

form.f-search button {
    position: absolute;
    right: 15px;
    padding: 11px;
    border: 0;
    color: #fff;
    outline: none;
    background: #d7d9e5;
    width: 62px;
}

.fr-icon {
    width: 100%;
    float: left;
    margin-top: 13px;
}

.fr-icon svg.svg-inline--fa.fa-smile.fa-w-16.fa-3x,
.fr-icon svg.svg-inline--fa.fa-comment-alt-lines.fa-w-16.fa-7x {
    width: 20px;
    color: #fff;
}

.svg-iconone,
.svg-icon {
    position: relative;
    width: 25px;
    height: 25px;
    background: #ff8d23;
    padding: 24px;
    border-radius: 50px;
}

.svg-iconone {
    float: left;
    margin-left: 45px;
}

.svg-iconone svg.svg-inline--fa.fa-smile.fa-w-16.fa-3x,
.svg-icon svg.svg-inline--fa.fa-comment-alt-lines.fa-w-16.fa-7x {
    text-align: center;
    top: 14px;
    left: 15px;
    position: absolute;
}

.svg-icon {
    float: right;
    margin-right: 45px;
}

/*video*/

.video-player {
    position: relative;
    overflow: hidden;
}

/* .video-player:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 61%;
	box-shadow: inset 0px -120px 55px -30px rgba(0, 0, 0, 0.5);
	opacity: 0;
	transition: all .3s ease;
} */
.video-player .play-video {
    opacity: 0;
}

.play-video {
    width: 64px;
    height: 64px;
    line-height: 53px;
    background-color: rgba(255, 94, 58, 0.7);
    border: 4px solid #fff;
    border-radius: 100%;
    text-align: center;
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    transition: all 0.3s ease;
    outline: none;
}

.play-video svg {
    fill: #fff;
    width: 18px;
    height: 22px;
    margin-left: -3px;
    margin-top: -19px;
}

.overlay.overlay-dark {
    background: rgba(43, 45, 59, 0.8);
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 42%;
    left: 16px;
    right: 16px;
    background: rgba(43, 45, 59, 0.2);
    transition: all 0.3s ease;
    opacity: 0;
}

.video-item .video-player {
    margin: 0;
    border-radius: 3px 3px 0 0;
}

.video-player img {
    width: 100%;
    display: block;
}

.video-item .more {
    position: absolute;
    right: 25px;
    top: 20px;
    color: #fff;
    fill: #fff;
    opacity: 0;
    z-index: 5;
}

.ui-block-content.video-content time.published {
    color: #888da8;
    font-size: 13px;
}

.more {
    position: relative;
    transition: all 0.3s ease;
    color: #888da8;
    fill: #c0c4d8;
}

.more > svg {
    cursor: pointer;
}

.olymp-three-dots-icon {
    width: 16px;
    height: 4px;
}

.ui-block-content {
    padding: 18px 15px 18px;
    float: left;
    width: 100%;
}

.video-item .title {
    display: block;
    margin-bottom: 0;
    color: #000;
}

.video-item .title:hover {
    color: #ff8d23;
    text-decoration: none;
}

.video-item:hover .more,
.video-item:hover .play-video,
.video-item:hover .overlay {
    opacity: 1;
}

.play-video button.btn.btn-info.btn-lg {
    background-color: rgb(255 94 58 / 12%);
    border-color: rgb(255 94 58 / 12%);
    width: 40px;
    border: 0;
    height: 29px;
    outline: none;
}

.modal-dialog.video {
    max-width: 1100px;
}

.md-cmnt {
    float: left;
    width: 100%;
}

.md-cmnt ul.like-comment-share-bar li {
    width: 117px;
}

.modal-header.vd-hd h3 {
    color: #ff9800;
    padding-top: 0px;
    margin: 0;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
    font-size: 22px;
}

.modal-dialog.modal-lg.vmodal {
    max-width: 1078px;
}

.comment-form {
    padding: 25px;
    border-top: 1px solid #e6ecf5;
    overflow: hidden;
}

.comment-form .post__author {
    margin-bottom: 0;
    display: flex;
    align-items: center;
}

.comment-form .post__author img {
    margin-right: 10px;
    min-width: 28px;
    max-width: 28px;
    height: 28px;
    display: block;
}

.post__author img {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    overflow: hidden;
    margin-right: 12px;
}

.features-video .form-group {
    max-width: 85%;
}

.comment-form .form-group {
    margin-bottom: 0;
    width: 100%;
    margin-left: auto;
}

.features-video textarea {
    font-size: 13px;
}

.comment-form textarea {
    min-height: 60px;
    height: 60px;
    transition: all 0.3s ease;
}

.comment-form .add-options-message {
    position: absolute;
    right: 20px;
    bottom: 15px;
    width: auto;
    padding: 0;
}

.modal-header.verify-hd h1 {
    font-size: 24px;
    color: #464646;
    margin: 0;
    text-transform: capitalize;
    font-family: "Quicksand", sans-serif;
}

.form-group label.verify-one ul li {
    list-style-type: decimal;
    padding-left: 10px;
    margin: 0 94px;
}

.form-group label.verify-one img {
    width: 100%;
}

ul.verifymd li {
    list-style-position: inside;
    list-style-type: decimal;
    margin: 0 94px;
}

ul.verifymd label.verify-one {
    margin-top: -24px;
    padding-left: 24px;
}

.modal-body.verifyup a.pre-order-btn {
    float: right;
    width: 106px;
    height: 43px;
    background: #ff9800;
    text-align: center;
    line-height: 42px;
    font-size: 18px;
    color: #fff;
    border-radius: 37px;
}

.modal-body.verifyup a.pre-order-btn {
    text-decoration: none;
}

section.home-detile-box .container.upcon {
    max-width: 1185px;
}

.selfie-body {
    width: 100%;
    float: left;
    background: #fff;
    margin-bottom: 31px;
}

.selfie {
    padding: 7px 17px 0 20px;
    text-align: center;
    margin-bottom: 32px;
}

.selfie-body h2 {
    border-bottom: 1px solid #eaeaea;
    color: #464646;
    text-align: left;
    font-size: 21px;
    text-transform: capitalize;
    padding: 10px 20px;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
}

.selfie h3 {
    color: #ff6937;
    font-size: 15px;
    text-align: center;
    padding-bottom: 10px;
    font-weight: 600;
    font-family: "Quicksand", sans-serif;
}

.selfie h4 {
    color: #515365;
    font-size: 15px;
    line-height: 25px;
    font-family: "Quicksand", sans-serif;
}

.s-upload {
    float: left;
    width: 100%;
    padding: 42px 0 33px 0;
    border-radius: 10px;
}

.upload-right {
    width: 100%;
    float: left;
    box-shadow: 0px 0px 17px 0px #bfbfbf;
    height: 253px;
    padding: 25px;
    background: #fff;
    border-radius: 8px;
}

.upload-right img {
    width: 100%;
}

.upload-box + .upload-box {
    margin-top: 2.5rem;
}

.s-upload .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile-4 + label {
    color: #d3394c;
}

.inputfile + label {
    max-width: 100%;
    font-size: 21px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 11px 0 0;
}

.inputfile-4 + label figure {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: #ff6937;
    display: block;
    padding: 25px 23px 25px 23px;
    margin: 0 auto 10px;
}

.inputfile-4 + label img {
    width: 100%;
}

.upload-pic {
    width: 100%;
    float: left;
    background: #fff;
    padding: 11px;
    box-shadow: 0px 0px 17px 0px #bfbfbf;
    border-radius: 8px;
}

.upload-box span {
    color: #ff6937;
}

.blank {
    width: 27%;
    float: left;
    background: #fff;
    position: fixed;
    padding: 12px;
    height: 600px;
}

section.home-detile-box.upl .col-sm-4 {
    padding-left: 9px;
}

.apparent-message {
    width: 100%;
    border-style: solid;
    border-width: 2px;
    margin-bottom: 19px;
}

.apparent-message .apparent-message-icon {
    flex: 0 0 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: #fff;
    text-shadow: 1px 1px 10px #000;
}

.apparent-message .apparent-message-icon .fa-2x {
    box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.45);
}

.message-container {
    display: flex;
}

.message-container .content-container {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    justify-content: center;
    padding-left: 15px;
    background-color: #fff;
    position: relative;
}

.message-container .content-container .message-header {
    font-size: 18px;
}

.message-container .content-container .message-body {
    margin: 1px 0 10px 0;
    font-size: 14px;
    color: #515151;
}

.message-container .content-container .message-action {
    position: absolute;
    bottom: 18px;
    right: 18px;
}

.warning-message {
    background-color: #ff6937;
    border-color: #ff6937;
    border-radius: 3px;
}

.warning-message .message-action,
.warning-message .message-header {
    color: #ff6937;
}

.info-message {
    background-color: #3598db;
    border-color: #3598db;
}

.info-message .message-action,
.info-message .message-header {
    color: #3598db;
}

.success-message {
    background-color: #43a046;
    border-color: #43a046;
}

.success-message .message-action,
.success-message .message-header {
    color: #43a046;
}

.error-message {
    background-color: #e1374c;
    border-color: #e1374c;
}

.error-message .message-action,
.error-message .message-header {
    color: #e1374c;
}

.apparent-message.warning-message .message-body {
    width: 64%;
}

.message-action a {
    color: #fff;
    width: 25px;
    height: 25px;
    padding: 7px 23px 7px 23px;
    background: #ff6937;
    border-radius: 30px;
}

.apparent-message.warning-message.two {
    background: #09bbff;
    border-color: #09bbff;
}

.apparent-message.warning-message.three {
    background-color: #4fa03f;
    border-color: #4fa03f;
}

.apparent-message.warning-message.four {
    background-color: #d83749;
    border-color: #d83749;
}

.apparent-message.warning-message.two .message-action a {
    background: #09bbff;
}

.apparent-message.warning-message.three .message-action a {
    background: #4fa03f;
}

.apparent-message.warning-message.four .message-action a {
    background: #d83749;
}

.apparent-message.warning-message.two .message-header span {
    color: #09bbff;
}

.apparent-message.warning-message.three .message-header span {
    color: #4fa03f;
}

.apparent-message.warning-message.four .message-header span {
    color: #d83749;
}

.upload-docdtl {
    width: 100%;
    float: left;
    margin-left: 16px;
}

.upload-doc {
    float: left;
    width: 43%;
    text-align: center;
    background: #f1f1f1;
    padding: 12px;
    margin-right: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
}

.upload-right.two {
    padding: 22px 25px 13px;
    height: auto;
}

.upload-doc ul li {
    float: left;
    width: 100%;
    list-style: none;
}

.upload-doc svg.svg-inline--fa.fa-id-card.fa-w-18.fa-3x {
    width: 45px;
    color: #ff6937;
}

.upload-doc svg.svg-inline--fa.fa-passport.fa-w-14.fa-3x {
    width: 35px !important;
    color: #ff6937;
}

.upload-doc ul li span {
    display: block;
    padding-top: 10px;
    font-size: 16px;
    font-family: "Quicksand", sans-serif;
}

.modal-dialog.after-loginpp {
    box-shadow: 0 0 14px -2px #525252;
}

.modal-crd h3 {
    margin-bottom: 0;
}

.modal-crd {
    text-align: center;
    width: 100%;
    float: left;
    box-shadow: 0 0 14px -2px #ccc;
    padding: 22px 0;
    margin-bottom: 31px;
}

.modal-crd h3 span {
    display: block;
    padding-top: 13px;
    font-size: 18px;
}

.modal-crd h3 i {
    color: #fff;
    background: #ff6937;
    width: 80px;
    height: 80px;
    text-align: center;
    line-height: 80px;
    font-size: 32px;
    border-radius: 50px;
}

.w-last-photo li {
    width: 33.33%;
    float: left;
    padding: 0 4px 4px 0;
    overflow: hidden;
}

.w-last-photo img {
    width: 100%;
    border-radius: 3px;
    display: block;
}

.w-last-photo a {
    padding: 0 !important;
    display: inline-block;
    text-decoration: none;
}

.w-last-photo.js-zoom-gallery {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
}

.img-thumbnail {
    padding: 2px;
    background-color: #fff;
    border: 1px solid #f5f5f5;
    border-radius: 0.25rem;
    max-width: 100%;
    height: auto;
}

.w-blog-posts {
    float: left;
    width: 100%;
}

.post {
    position: relative;
    padding: 0px;
    float: left;
    width: 100%;
    padding-bottom: 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid #f1f1f1;
}

.post a {
    text-decoration: none;
    display: inline-block;
}

.post a.h4 {
    font-size: 19px;
    color: #515365;
    font-weight: 100;
    margin-bottom: 10px;
}

.post p {
    font-size: 13px;
    font-weight: 500;
    color: #888da8;
    margin: 0;
    font-family: "Quicksand", sans-serif;
    padding: 0;
    letter-spacing: 0px;
    margin-bottom: 3px;
}

.w-blog-posts .post__date {
    font-size: 12px;
    float: left;
    width: 100%;
    color: #888da8;
}

.w-blog-posts .post:last-child {
    border: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

ul.w-faved-page.js-zoom-gallery {
    padding: 0 !important;
}

ul.w-faved-page li {
    display: inline-block;
    margin: 0 0 8px 8px;
    float: left;
    width: 34px;
    height: 34px;
    border-radius: 100%;
    overflow: hidden;
}

ul.w-faved-page.js-zoom-gallery li a {
    padding: 0 !important;
}

.all-users {
    line-height: 34px;
    text-align: center;
    color: #fff;
    background-color: #ff5e3a;
    font-size: 10px;
    font-weight: 800;
}

li.all-users a {
    color: #fff !important;
    font-weight: 600;
}

li.all-users a:hover {
    background: #e75726 !important;
}

.col-sm-6.ui-block-midil .social-coommemnt-box {
    margin: 0;
    margin-bottom: 19px;
    border: 1px solid #e6ecf5;
    float: left;
    width: 100%;
    border-radius: 8px;
}

.page-may-frofile img {
    width: 100%;
}

.page-may-tital h4 a {
    margin: 2px 0 3px;
    color: #515365;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    font-family: "Quicksand", sans-serif;
    text-decoration: none;
    text-transform: capitalize;
}

.post-thumb-mein-box {
    float: left;
    width: 100%;
}

.post-thumb img {
    width: 100%;
    display: block;
}

.two-img .post-thumb {
    width: 50%;
    height: auto;
    padding: 0 1px;
}

.three-img .post-thumb:first-child {
    width: 100%;
    margin-bottom: 2px;
}

.four-img .post-thumb:first-child {
    width: 50%;
    float: left;
}

/*=====24-11-20=======*/
/*comenet-side bar*/
.comment-floud-box {
    float: left;
    width: 100%;
    padding: 6px;
}

.comment-floud-img-video-bov {
    float: left;
    width: 100%;
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 300px;
    margin-bottom: 0px;
}

.coment-sit-sit {
    float: left;
    width: 100%;
    padding: 10px 0;
    background: #f5f5f5;
    margin: 0;
}

/* The side navigation menu */
.sidenav {
    height: 100vh;
    width: 0;
    position: fixed;
    z-index: 111;
    top: 60px;
    right: 0;
    background-color: #111;
    /* overflow-x: scroll; */
    padding-top: 0px;
    transition: 0.5s;
    padding: 0px;
    padding-bottom: 100px;
}

.comment-floud-hidden-bar {
    overflow-x: scroll;
    float: left;
    width: 100%;
    height: 100vh;
    padding-bottom: 100px;
}

/* The navigation menu links */
.sidenav .closebtn {
    padding: 0;
    text-decoration: none;
    font-size: 25px;
    font-family: Gotham;
    color: #818181;
    display: block;
    transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav .closebtn:hover,
.offcanvas a:focus {
    color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 7px;
    left: 8px;
    font-size: 15px;
    margin-left: 0;
    background: #ff000052;
    text-align: center;
    z-index: 111;
    border: 2px solid #ddb0b0;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    display: inline-block;
}

svg.svg-inline--fa.fa-times.fa-w-10.fa-7x {
    width: 11px;
    color: #ffffff;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left 0.5s;
    padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

    .sidenav .closebtn {
        font-size: 18px;
    }
}

/*=====24-11-20=======*/

/*=====26-11-20=======*/
/*==coment-puppu===*/
/*------------- #NOTIFICATION --------------*/
.popup-chat {
    width: 100%;
    box-shadow: none;
    overflow: hidden;
    position: relative;
    z-index: 5;
}

.popup-chat .modal-body {
    padding: 0;
}

.popup-chat .modal-header {
    align-items: center;
}

.popup-chat .modal-header .title {
    margin-right: auto;
}

.popup-chat .modal-content {
    border: 0;
}

.popup-chat .mCustomScrollbar {
    overflow: hidden;
    max-height: 350px;
}

.popup-chat .ps > .ps__scrollbar-y-rail,
.popup-chat .ps:hover > .ps__scrollbar-y-rail {
    opacity: 0;
    z-index: -1;
    visibility: hidden;
}

.popup-chat .modal-header {
    /* background-color: #6b8e23; */
    padding: 0;
    text-align: left;
    float: right;
    border-radius: 0;
    border: none;
    position: relative;
}

.popup-chat .modal-header .title {
    color: #fff;
}

.popup-chat-responsive {
    position: fixed;
    right: 0;
    top: 67px;
    transform: translatex(100%);
    max-width: 1198px;
    opacity: 1;
    visibility: visible;
    display: block;
    transition: all 0.3s ease;
    margin-bottom: 0;
    z-index: 11;
    border: none;
    /* max-height: 70vh; */
    background: none;
    border-radius: 0;
}

.popup-chat-responsive .mCustomScrollbar {
    overflow: hidden;
    max-height: 150px;
}

.popup-chat-responsive.open-chat {
    left: auto;
    right: 70px !important;
    transform: translatex(0);
}

a.js-sidebar-open-clos svg.svg-inline--fa.fa-times.fa-w-10.fa-7x {
    width: 11px;
    color: #6b8e23;
}

span.olymp-little-delete.js-chat-open1 {
    position: absolute;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid #6b8e23;
    background: #4e7009;
    z-index: 11111111;
    left: 9px;
    top: 9px;
    text-align: center;
    line-height: 34px;
}

span.olymp-little-delete.js-chat-open1 {
    float: right;
    margin-right: 10px;
}

.popup-chat .modal-body {
    padding: 0;
    height: 100vh;
    background: none !important;
}

.popup-chat .modal-body .social-coommemnt-box {
    margin-top: 0;
}

/*------------- Responsive mode styles --------------*/

/**-*-*-*comment-pup-box-*-*-*-*-**/
.mySlides.fade {
    text-align: center;
    height: 86vh;
    position: relative;
}

.cmt-img-slider .numbertext {
    color: #2b2b2a !important;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
    left: 29px !important;
}

.cmt-img-slider .prev,
.cmt-img-slider .next {
    border-radius: 0 !important;
    color: #fff !important;
}

#cmt_frm input.d-none {
    display: block !important;
}

.mySlides.fade img {
    width: unset !important;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.comenet-pup {
    float: left;
    width: 100%;
    background: #d4d4d4;
    padding: 20px;
    border-radius: 3px;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

.comenet-pup .social-coommemnt-box {
    position: absolute;
    height: 100vh;
    top: -27px;
    overflow-y: scroll;
}

.pup-right-images {
    position: relative;
    /* left: 0; */
    float: left;
    width: 100%;
}

.cmt-img-slider {
    /* max-width: 1000px; */
    /*    position: absolute;
    margin: auto;
    top: 50%;
    transform: translate(-0%, 50%);
    left: 0%;*/
    float: left;
    width: 100%;
}

.comment-input-box {
    float: left;
    width: 100%;
    margin-top: 23px;
}

.comment-input-box .author-thumb {
    display: inline-block;
    position: relative;
    top: -1px;
}

.comment-profile-box {
    display: inline-block;
    float: left;
    position: relative;
    top: 4px;
}

.comment-input {
    float: left;
    width: 85%;
    margin-left: 10px;
    background: #f9f9f9;
    border-radius: 44px;
    padding: 4px 3px;
    line-height: 19px;
    position: relative;
    box-shadow: 0px 0px 8px -5px #000;
}

.comment-input input {
    border: none;
    outline: none;
    resize: none;
    background: none;
    color: #535252;
    height: 30px;
    line-height: 30px;
    padding-left: 10px;
    width: 62%;
}

.coment-mooj-icon {
    width: auto;
    position: absolute;
    float: right;
    right: 0;
    top: 58%;
    padding: 3px 13px;
    transform: translate(0%, -50%);
    z-index: 111;
}

.coment-mooj-icon ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
}

.coment-mooj-icon ul li {
    display: inline-block;
    padding: 0 2px;
}

.coment-mooj-icon ul li svg {
    width: 18px;
}

.coment-mooj-icon ul li img {
    width: 25px;
    position: relative;
    top: -4px;
}

span.comdt-comer {
    position: relative;
}

span.comdt-comer .file-input {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.coment-mooj-icon ul li a {
    color: #4c4c4c;
    font-size: 20px;
}

i.gificon-img {
    width: 16px;
    height: 16px;
    display: inline-block;
    background: url(../img/icons-img.png);
    background-position: 0px -277px;
    position: relative;
    top: -1px;
}

.coment-mooj-icon ul li .dropdown-toggle::after {
    display: none;
}

p.komen img {
    /* width: 100%; */
    border-radius: 10px;
}

.dropdown-menu.mooj-coommt56k.show {
    min-width: 227px !important;
    left: -64px !important;
    top: 7px !important;
}

ul#giphyysss li {
    width: 68px;
}

.coment-mooj-icon ul li img {
    width: 100%;
    position: relative;
    top: 0;
}

input#giphy_search {
    margin-bottom: 6px;
    border: 1px solid #ececec;
    font-size: 14px;
}

ul#giphyysss {
    height: 234px;
    overflow: auto;
}

/*-=-=-=-=-=sticky-seaction-==-=-=-===*/
.sidebar-static {
    /* width: 25%; */
    height: 100vh;
    min-height: 200px;
    overflow-y: scroll;
    position: -webkit-sticky;
    position: sticky;
    top: 78px;
    overflow-x: hidden;
}

.main-static {
    /*  width: 60%;*/
    /*  height: 200vh;*/
    /*  min-height: 1000px;*/
    display: flex;
    flex-direction: column;
}

.main-static,
.sidebar-static {
    border-radius: 10px;
    color: #222;
    padding-bottom: 70px;
}

.static-wrapper {
    display: flex;
    justify-content: space-between;
    margin-top: 18px;
}

.all-coments_listing form {
    margin: 0;
}

.all-coments_listing input {
    border: 1px solid #ccc;
    float: left;
    width: 100%;
    margin-left: 10px;
    background: #f9f9f9;
    border-radius: 44px;
    padding: 9px 21px;
    outline: none;
    line-height: 19px;
    position: relative;
    box-shadow: 0px 0px 8px -5px #000;
}

.all-coments_listing button.text.text-danger {
    position: absolute;
    border: 1px solid #6b8e23;
    font-size: 12px;
    border-radius: 50%;
    height: 20px;
    width: 20px;
    font-weight: 600;
    display: inline-block;
    padding: 0px;
    line-height: 18px;
    outline: none;
}

span.cmt_emoji_icon li {
    cursor: pointer;
}

.list-group li {
    cursor: pointer;
}

.media-body span {
    cursor: pointer;
}

/*-=-=-=-=-=sticky-seaction-==-=-=-===*/
/**-*-*-*comment-pup-box-*-*-*-*-**/

/*shar dropdown*/
[class*="dropdown-menu-tip-"]::after {
    content: "";
    position: absolute;
    width: 0.5rem;
    height: 0.5rem;
    background-color: white;
    border: solid 1px rgba(0, 0, 0, 0.15);
    border-bottom: none;
    border-left: none;
}

.dropdown-menu-tip-n::after {
    top: calc(-0.25rem - 1px);
    left: calc(50% - 0.25rem);
    transform: rotate(-45deg);
}

.dropdown-menu-tip-ne::after {
    top: calc(-0.25rem - 1px);
    right: 1rem;
    transform: rotate(-45deg);
}

.dropdown-menu-tip-nw::after {
    top: calc(-0.25rem - 1px);
    left: 73px;
    transform: rotate(-45deg);
}

.dropdown-menu-tip-s::after {
    left: calc(50% - 0.25rem);
    bottom: calc(-0.25rem - 1px);
    transform: rotate(135deg);
}

.dropdown-menu-tip-se::after {
    right: 1rem;
    bottom: calc(-0.25rem - 1px);
    transform: rotate(135deg);
}

.dropdown-menu-tip-sw::after {
    left: 1rem;
    bottom: calc(-0.25rem - 1px);
    transform: rotate(135deg);
}

li.dropdown-Share .dropdown-toggle::after {
    display: none;
}

li.dropdown-Share .dropdown-menu.show {
    display: block;
    top: 1px !important;
    left: -36px !important;
    z-index: 1;
}

/*shear*/
@media (max-width: 768px) {
    .popup-chat-responsive {
        opacity: 1;
        visibility: visible;
        display: block;
    }
}

/*==coment-puppu===*/
/*=====26-11-20=======*/
/*imgdgkghkjhg*/
.n_img_bx {
    height: auto !important;
}

.n_img_bx .demo {
    width: 100% !important;
    position: relative !important;
    float: left;
}

.n_img_bx .demo img {
    width: 100%;
}

/*comenet-side bar*/

@media only screen and (min-width: 1400px) {
    .popup-chat-responsive {
        max-width: 1342px;
    }
}

@media only screen and (min-width: 1600px) {
    .popup-chat-responsive {
        max-width: 1526px;
    }
}

@media only screen and (min-width: 1800px) {
    .popup-chat-responsive {
        max-width: 1635px;
    }
}

@media only screen and (max-width: 1199px) {
    .login-form-page-right .carousel-inner {
        height: 409px;
    }

    .login-form-page {
        width: 77%;
    }
}

@media only screen and (max-width: 1199px) {
    .login-boxes-new2 {
        padding: 123px 0 29px 0;
    }
}

@media only screen and (max-width: 991px) {
    .login-form-page {
        width: 100%;
    }

    .login-boxes-new2 {
        padding: 123px 0 10px 0;
    }

    .ft-lng ul li {
        padding-right: 17px;
    }

    .login-form-page-left {
        width: 51%;
    }

    .login-form-page-right {
        width: 49%;
    }

    .header-left-box {
        width: 50%;
    }

    .menu-box {
        width: 100%;
    }

    .stats-item.stats-your {
        float: left;
        width: 76px;
    }

    span.arrow-stroj {
        right: -20px;
    }

    .more-image-sec {
        width: 100%;
        display: block;
    }

    .image-4-sec {
        width: 100%;
        display: block;
    }
}

@media only screen and (max-width: 800px) {
    .header-left-box {
        width: 50%;
    }

    .menu-box {
        width: 100%;
    }

    .logo a h2 {
        font-size: 25px;
    }

    ul#toolbar {
        display: none !important;
    }
}

@media only screen and (max-width: 768px) {
    .d-none {
        display: block !important;
    }

    .carousel-caption {
        top: 22%;
    }

    .login-form-page-right,
    .login-form-page-left {
        width: 100%;
    }

    .ft-dtl ul li {
        padding-right: 15px;
    }

    .ft-lng ul li {
        padding-right: 12px;
        padding-bottom: 13px;
    }

    .login-boxes form .login-form-box h6.regi {
        margin-top: 3%;
    }

    .menu-box {
        width: 100%;
    }

    .search-bar {
        float: left;
        padding: 13px 0;
        margin-left: -8px;
        width: 30% !important;
        position: relative;
        margin-top: 0;
    }

    .menu-box ul li {
        padding: 2px 6px;
    }

    .profile-img-box {
        height: 100%;
        padding: 8px 0px 9px !important;
        vertical-align: top;
    }

    .frd-slide-list-item {
        float: left;
        width: 108px;
    }
}

@media only screen and (max-width: 372px) {
    .header-left-box {
        width: 54%;
    }

    .login-boxes form h1 span {
        font-size: 26px;
    }
}

@media only screen and (max-width: 370px) {
    .header-left-box {
        width: 70%;
    }

    .menu-box {
        width: 30%;
    }

    .login-form-page-left .login-form-box {
        padding: 32px 22px 0;
    }

    .toolbar {
        display: none !important;
    }
}

@media only screen and (max-width: 350px) {
    .carousel-caption {
        top: 30%;
    }
}

@media only screen and (max-width: 320px) {
    .login-boxes form h1 span {
        font-size: 27px;
    }

    .login-form-page-right .carousel-inner {
        height: 378px;
    }
}

@media only screen and (max-width: 300px) {
    .login-form-page-right .carousel-inner {
        height: 349px;
    }

    .header-left-box {
        width: 73%;
        margin-left: -28px;
    }

    .login-boxes form h1 span {
        font-size: 24px;
    }

    .login-form-page-left .login-form-box {
        padding: 9px 22px 0;
    }
}

@media only screen and (max-width: 290px) {
    .header-left-box {
        width: 78%;
    }
}

.pro-file-update-ic li a.red-col:hover {
    background-color: #f00 !important;
}

.pro-file-update-ic li a.orng-col:hover {
    background-color: #fb7400 !important;
}

/* buy sell css start */
.main-header {
    padding: 70px 0 70px 0;
    margin: 0 auto 30px;
    position: relative;
    background-position: 50% 50%;
}

.main-header.main-header-has-header-standard {
    padding-top: 0;
}

.ui-block-title {
    padding: 23px 25px 18px;
    line-height: 1;
    border-bottom: 1px solid #e6ecf5;
    border-top: 1px solid #e6ecf5;
    display: table;
    width: 100%;
    position: relative;
    border-radius: 5px 5px 0 0;
}

.ui-block-title .more {
    padding-left: 25px;
    text-align: right;
    width: 16px;
}

.ui-block-title > * {
    margin-bottom: 0;
    display: table-cell;
    vertical-align: middle;
}

.ui-block-title.ui-block-title-small {
    padding: 10px 25px;
}

.ui-block-title.ui-block-title-small .title {
    font-size: 9px;
    text-transform: uppercase;
    color: #9a9fbf;
}

.ui-block-title .btn {
    display: inline-block;
    margin-bottom: 0;
}

.ui-block-title .btn + * {
    margin-left: 20px;
}

.ui-block-title.inline-items .more {
    float: right;
    margin-top: 6px;
    padding-left: 0;
}

.ui-block-title + .ui-block-title {
    border-bottom: none;
}

.ui-block-title .icon-add {
    margin-right: 0;
}

#accordion + .ui-block-title {
    border-top: none;
    border-bottom: none;
}

.ui-block-content {
    padding: 24px 23px 23px;
}

/*------------- #W-SELECT --------------*/
.w-select {
    padding: 0 5px 0 0;
}

.w-select .bootstrap-select > .dropdown-toggle {
    padding: 10px 15px;
    font-size: 12px;
    height: 40px;
    margin-bottom: 0;
}

.w-select .form-group {
    min-width: unset;
    margin-bottom: 0;
}

.w-select .title {
    float: left;
    line-height: 40px;
    margin-right: 15px;
}

.filter-icons li {
    display: inline-block;
    opacity: 0.7;
    transition: all 0.3s ease;
}

.filter-icons li:hover {
    opacity: 1;
}

.filter-icons li + li {
    margin-left: 8px;
}

.blog-post-v3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-post-v3 .post-thumb img {
    min-height: 100%;
    display: block;
}

.blog-post-v3 .post-content {
    width: 50%;
    padding: 25px 30px;
}

.blog-post-v3 .post-category {
    border-radius: 0;
}

.blog-post-v3 .author-date {
    margin-bottom: 5px;
}

.blog-post-v3 .post-additional-info {
    border-top: none;
}

.blog-post-v3 .post-additional-info .comments-shared {
    float: none;
    margin-left: 22px;
    margin-top: 0;
}

.blog-post-v3.featured-post-item {
    display: block;
}

.blog-post-v3.featured-post-item .post-thumb {
    border-radius: 5px 5px 0 0;
    width: auto;
}

.blog-post-v3.featured-post-item .post-content {
    width: auto;
    padding: 25px;
    height: 172px;
}

.blog-post-v3.featured-post-item .post-additional-info {
    padding: 0;
}

/*------------- #UI-BLOCK --------------*/
.ui-block {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e6ecf5;
    margin-bottom: 15px;
}

.ui-block .ui-block-title:last-child {
    border-bottom: 0;
}

.ui-block-title {
    padding: 23px 25px 18px;
    line-height: 1;
    border-bottom: 1px solid #e6ecf5;
    border-top: 1px solid #e6ecf5;
    display: table;
    width: 100%;
    position: relative;
    border-radius: 5px 5px 0 0;
}

.ui-block-title .more {
    padding-left: 25px;
    text-align: right;
    width: 16px;
}

.ui-block-title > * {
    margin-bottom: 0;
    display: table-cell;
    vertical-align: middle;
}

.ui-block-title.ui-block-title-small {
    padding: 10px 25px;
}

.ui-block-title.ui-block-title-small .title {
    font-size: 9px;
    text-transform: uppercase;
    color: #9a9fbf;
}

.ui-block-title:first-child {
    border-top: none;
}

.ui-block-title .btn {
    display: inline-block;
    margin-bottom: 0;
}

.ui-block-title .btn + * {
    margin-left: 20px;
}

.ui-block-title.inline-items .more {
    float: right;
    margin-top: 6px;
    padding-left: 0;
}

.ui-block-title + .ui-block-title {
    border-bottom: none;
}

.ui-block-title .icon-add {
    margin-right: 0;
}

#accordion + .ui-block-title {
    border-top: none;
    border-bottom: none;
}

.ui-block-content {
    padding: 24px 23px 23px;
}

/*------------- #BLOG-POSTS --------------*/
.blog-post-wrap .blog-post {
    margin-bottom: 30px;
}

.blog-post-wrap .ui-block {
    margin-bottom: 30px;
}

.blog-post-wrap .ui-block .blog-post {
    margin-bottom: 0;
}

.blog-post .post-content {
    padding: 20px 25px;
}

.blog-post .post-title {
    display: block;
    margin-bottom: 14px;
}

.blog-post .post-title:hover {
    color: #ff5e3a;
}

.blog-post .author-date {
    text-transform: uppercase;
    font-size: 10px;
}

.blog-post .post__date {
    display: inline-block;
}

.blog-post .post__author-name {
    font-size: 10px;
    font-weight: 700;
}

.blog-post .post-additional-info {
    margin-top: 15px;
}

.blog-post .post-additional-info > * {
    margin-right: 0;
}

.blog-post .friends-harmonic a {
    border-radius: 0;
}

.blog-post .post-additional-info .comments-shared {
    margin-top: 4px;
}

.blog-post.format-link .overlay {
    opacity: 1;
}

.blog-post.format-link .post-link {
    position: absolute;
    bottom: 0;
    right: 0;
}

.blog-post.format-link .post-link svg {
    width: 42px;
    height: 42px;
    fill: rgba(255, 255, 255, 0.8);
    transition: all 0.3s ease;
}

.blog-post.format-link .post-link svg:hover {
    fill: white;
}

.blog-post.format-link .site-link:hover {
    color: #fff;
}

.blog-post.format-link .bg-link {
    background-image: url("../img/post6.jpg");
}

.blog-post.format-link .post-thumb {
    border-radius: 5px;
    padding: 50px;
    background-size: cover;
    background-repeat: no-repeat;
}

.blog-post.format-link .post-content {
    padding: 0;
    z-index: 5;
    position: relative;
}

.blog-post.format-link .post-title {
    color: rgba(255, 255, 255, 0.8);
}

.blog-post.format-link .post-title:hover {
    color: white;
}

.blog-post.format-slider .post-thumb {
    padding-bottom: 10px;
}

.blog-post.format-slider .swiper-container {
    overflow: visible;
}

.blog-post.format-slider .swiper-slide {
    position: relative;
}

.blog-post.format-slider .swiper-pagination {
    background-color: #3f4257;
    padding: 0 5px;
    border-radius: 30px;
    bottom: -10px;
}

.blog-post.format-slider .swiper-pagination-bullet {
    background-color: #8c8e9a;
    border-color: transparent;
}

.blog-post.format-slider
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #fff;
}

.blog-post.format-video .post-type-icon svg {
    width: 14px;
    height: 16px;
}

.blog-post.format-quote {
    text-align: center;
}

.blog-post.format-quote .post__author img {
    width: 48px;
    height: 48px;
    border-radius: 0;
    margin: 0 auto 15px;
    display: block;
}

.blog-post.format-quote .post__author-name {
    font-size: 12px;
    color: #fff;
}

.blog-post.format-quote .author-prof {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 700;
}

.blog-post.format-quote .quote-icon svg {
    width: 30px;
    height: 30px;
    fill: #fff;
}

.blog-post.format-quote .post-title {
    font-size: 36px;
    margin: 100px auto;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 300;
}

.blog-post.format-quote .post-title:hover {
    color: white;
}

.blog-post.format-quote .overlay {
    background-color: rgba(124, 90, 194, 0.95);
    opacity: 1;
}

.blog-post.format-quote .post-thumb {
    padding: 60px 50px;
    background-image: url("../img/quote-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 5px;
}

.blog-post.format-quote .post-content {
    position: relative;
    z-index: 2;
    padding: 0;
}

.blog-post .post-type-icon {
    position: absolute;
    top: 20px;
    right: 20px;
    left: auto;
    width: 40px;
    height: 40px;
    background-color: #ff5e3a;
    border-radius: 100%;
    border: none;
    -webkit-transform: none;
    transform: none;
}

.blog-post .post-type-icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: #fff;
    width: 20px;
    height: 20px;
}

.post-category {
    display: inline-block;
    border-radius: 3px;
    padding: 5px 20px;
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    margin-bottom: 10px;
    font-weight: 700;
}

.post-category.bg-transparent {
    background-color: transparent;
    color: #ff5e3a;
    padding: 0;
    font-size: 10px;
}

.post-category.bg-transparent:hover {
    color: #ff5e3a;
}

.post-category:hover {
    color: #fff;
}

.blog-post-v1:hover .post-title {
    opacity: 1;
    color: #fff;
}

.blog-post-v1 .post-thumb {
    position: relative;
}

.blog-post-v1 .post-thumb:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0 -170px 55px -30px rgba(0, 0, 0, 0.8);
}

.blog-post-v1 .post-content {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 3;
}

.blog-post-v1 .post-additional-info {
    margin-top: 0;
    border-top: none;
    padding: 20px 25px;
}

.blog-post-v1 .post-title {
    color: #fff;
    opacity: 0.7;
}

.blog-post-v1 .author-date {
    color: #888da8;
}

.blog-post-v1 .post__author-name {
    color: #fff;
}

/* buy sell css end */

.bg-account {
    background-image: url("../img/top-header3.png");
    background-position: unset;
    background-size: cover;
}

.content-bg-wrap {
    background-repeat: repeat;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    text-align: center;
    box-sizing: border-box;
    -webkit-animation: slide 50s linear infinite;
    animation: slide 50s linear infinite;
    will-change: background-position;
}

.main-header-content {
    color: #fff;
    text-align: center;
}

.main-header-content p {
    font-weight: 400;
    margin-bottom: 0;
}

.img-bottom {
    position: relative;
    display: block;
    margin: 20px auto 0;
    margin-bottom: -70px;
    width: 100%;
    height: 190px;
}

.btn-md-2 {
    padding: 11px 20px !important;
    font-size: 0.688rem;
    border-radius: 0.3rem;
    vertical-align: middle;
}

.w-search {
    width: 315px;
}

.w-search .form-group {
    margin-bottom: 0;
    position: relative;
}

/* .w-search input {
    padding: 20px 15px;
    font-size: 15px;
} */

.form-group.with-button button {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 35px;
    text-align: center;
    line-height: 100%;
    color: #fff;
    fill: #fff;
    background-color: #d7d9e5;
    border: none;
}

.blog-post-v3 .post-thumb {
    border-radius: 5px 0 0 5px;
    width: 50%;
    max-height: 260px;
    overflow: hidden;
}

.blog-post .post-thumb {
    border-radius: 5px 5px 0 0;
    margin-bottom: 0;
}

.post-thumb {
    border-radius: 5px;
    margin-bottom: 25px;
    overflow: hidden;
    position: relative;
}

.bg-blue-light {
    background-color: #00b7ff;
}

.post-additional-info {
    padding: 20px 0 0;
    border-top: 1px solid #e6ecf5;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.bg-purple {
    background-color: #7c5ac2;
}

.pagination {
    margin-top: 40px;
    margin-bottom: 40px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.pagination .page-item {
    font-size: 16px;
    font-weight: 600;
    padding: 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* @media (min-width:1350px) {
	.container {
		max-width: 1280px;
	}
} */

.ui-block-title h6 {
    font-weight: 700;
    font-size: 18px;
}

.w-personal-info li {
    padding: 15px 0;
}

.w-personal-info li .title {
    color: #515365;
    font-weight: 700;
    margin-right: 7px;
    float: left;
    width: 35%;
    font-size: 13px !important;
}

.w-personal-info li .text {
    color: #888da8;
    display: block;
    overflow: hidden;
    font-size: 13px;
}

.w-personal-info.item-block .title {
    margin-right: 0;
    float: none;
    width: auto;
}

.w-personal-info li .date {
    display: block;
    font-size: 12px;
    color: #bdc0ce;
    font-weight: 500;
    margin-bottom: 15px;
}

/* log-in-page-start */
.text_error.error {
    border-color: red;
}

input.text_error.error {
    color: red;
}

.modal-header.bg-warning.text-white {
    background-color: #2362b0 !important;
}

div#main-carousel {
    margin-top: 0px;
}

.login-boxes-new2 {
    background-size: cover;
    padding: 0;
    min-height: 100vh;
    background: url(../img/video-banner.png) no-repeat;
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center;
}

.login-form-box h4 {
    font-size: 15px;
    color: #515365;
    text-align: center;
    margin: 10px 0 5px;
    font-weight: normal;
}

.login-form-box h1 {
    font-size: 30px !important;
    text-align: center;
}

.login-form-page {
    width: 80%;
    margin: 0 auto;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 0 6px #0000000d;
    box-sizing: border-box;
    overflow: hidden;
    padding: 8px 8px;
    transform: translate(125px, -38px);
}

form label span {
    font-size: 14px;
    color: #7d7d7d;
}

.remember {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    width: 100%;
}

[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
    margin-top: 0px;
}

.continue {
    margin-top: 10px;
    width: 100%;
    height: 40px;
}

.forgot-password a {
    color: #7d7d7d;
}

.pro-f-cover-img.lf-log-img {
    border-radius: 10px 10px 0 0;
    height: 248px;
    position: relative;
}

.fro-f-imgs .fofil-dtl-img {
    width: 150px;
    height: 150px;
    border: 4px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    margin-top: -37px;
    position: absolute;
    top: 150px;
    left: 270px;
}

/* profile-page-start */

.nav-tabs .nav-link {
    margin-right: 5px;
    display: inline-block;
    padding: 6px 30px;
    border-radius: 12px 12px 0px 0px;
    height: auto;
    font-family: "Quicksand", sans-serif;
    background-color: #2362b0;
    color: #fff;
}

.profile-menu ul {
    justify-content: flex-start !important;
}

.pro-file-update-ic {
    width: 25%;
    float: right;
    margin-top: -34px;
}

.pro-file-update-ic .btn-primary {
    padding: 0px 15px;
}

.btn-primary {
    color: #fff;
    background-color: #007bff;
    display: inline-block;
}

.threebutton.btn {
    margin-left: 15px;
}

/* photos-page-css */
.ui-block {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e6ecf5;
    margin-bottom: 15px;
}

.ui-block .ui-block-title:last-child {
    border-bottom: 0;
}

.ui-block-title:first-child {
    border-top: none;
}

.ui-block-title {
    padding: 23px 25px 18px;
    line-height: 1;
    border-bottom: 1px solid #e6ecf5;
    border-top: 1px solid #e6ecf5;
    display: table;
    width: 100%;
    position: relative;
    border-radius: 5px 5px 0 0;
}

.ui-block-title > * {
    margin-bottom: 0;
    display: table-cell;
    vertical-align: middle;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    color: #515365;
}

.align-right {
    text-align: right;
}

.block-btn {
    padding-right: 0px;
}

.ui-block-title > * {
    margin-bottom: 0;
    display: table-cell;
    vertical-align: middle;
}

.align-right .btn {
    margin-left: 20px;
}

.ui-block-title .btn {
    display: inline-block;
    margin-bottom: 0;
}

.btn-md-2 {
    padding: 0.8rem 2.1rem;
    font-size: 0.688rem;
    border-radius: 0.3rem;
}

.btn {
    margin-bottom: 15px;
    position: relative;
}

.ripple-container {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

.align-right .btn {
    margin-left: 20px;
}

.btn.c-grey {
    border-color: #d8dbe6;
}

.photo-gallery {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    top: 0;
    right: 65px;
    height: 100%;
    position: absolute;
    border-bottom: 0;
}

.photo-gallery.nav-tabs .nav-item {
    margin-bottom: 0;
    max-height: 100%;
}

.nav-tabs .nav-item {
    position: relative;
}

.photo-gallery .nav-link {
    border-radius: 0;
    padding: 30px 26px;
    fill: #c2c5d9;
    background-color: #fafbfd;
    border-color: transparent;
    height: 100%;
    border-right-color: #e6ecf5;
    border-left-color: #e6ecf5;
    border-top-color: transparent;
}

.photo-gallery .nav-link.active {
    fill: #ff5e3a;
    background-color: #fff;
    border-top-color: transparent;
}

.photo-gallery .nav-link svg {
    width: 18px;
    height: 20px;
}

.ui-block-title .more {
    padding-left: 25px;
    text-align: right;
    width: 16px;
}

.btn-primary:hover {
    background-color: #ff763a;
    border-color: #ff763a;
    opacity: 1;
}

.btn {
    display: inline-block;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.25s ease-in-out;
    font-size: 13px;
}

button,
a.btn {
    border-radius: 3px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    font-size: 13px;
    cursor: pointer;
    text-decoration: none;
    text-shadow: none;
    display: inline-block;
    cursor: pointer;
}

.timeline-view-box {
    margin-top: 0px;
}

/* bottom-photos-page */
.photo-album-wrapper {
    margin-right: -12px;
}

.col-4-width {
    width: 25%;
}

.photo-album-item-wrap {
    display: inline-block;
    margin-right: -3px;
    padding: 0 12px 12px 0;
    vertical-align: top;
}

.photo-album-item.create-album {
    background-color: transparent;
    border: 2px dashed #bbc0d5;
}

.photo-album-item:last-child {
    margin-right: 0;
}

.photo-album-item {
    position: relative;
    border-radius: 5px;
    border: 1px solid #e6ecf5;
    background-color: #fff;
}

.full-block {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.photo-album-item.create-album .content {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 90%;
}

.photo-album-item .content {
    padding: 25px 25px 20px;
    text-align: center;
}

.photo-album-item.create-album .btn-control {
    margin-bottom: 20px;
    float: none;
}

.btn-control {
    border-radius: 100%;
    width: 50px;
    height: 50px;
    line-height: 54px;
    padding: 0;
    fill: #fff;
    font-size: 20px;
}

.photo-album-item .title {
    display: block;
    margin-bottom: 0;
}

.photo-album-item .sub-title {
    margin-bottom: 30px;
    display: block;
    font-size: 13px;
}

.photo-album-item .photo-item {
    float: none;
    margin: 0;
    border-radius: 3px;
    display: block;
    padding: 0;
}

.photo-item {
    display: inline-block;
    padding: 0 12px 12px 0;
    margin-right: -3px;
    position: relative;
    overflow: hidden;
}

.photo-album-item .photo-item img {
    width: 100%;
    border-radius: 0;
    display: block;
    height: 270px;
}

img {
    vertical-align: unset;
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.photo-album-item .photo-item .overlay {
    bottom: 0;
    right: 0;
    border-radius: 0;
}

.overlay.overlay-dark {
    background: rgba(43, 45, 59, 0.8);
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(43, 45, 59, 0.2);
    transition: all 0.3s ease;
    opacity: 0;
}

.photo-item .more {
    position: absolute;
    top: 25px;
    right: 25px;
    color: #fff;
    fill: #fff;
    opacity: 0;
    transition: all 0.3s ease;
}

.photo-item .post-add-icon {
    fill: #fff;
    position: absolute;
    right: 25px;
    bottom: 30px;
    opacity: 0;
    transition: all 0.3s ease;
}

.photo-album-item.create-album .btn-control {
    margin-bottom: 20px;
    float: none;
    border-radius: 100%;
}

.profile-menu-dasbord {
    border: 0 !important;
}

.h5,
h5 {
    font-size: 1rem;
}

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    z-index: 3;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    box-sizing: content-box;
}

.photo-album-item .content {
    padding: 25px 25px 20px;
    text-align: center;
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.photo-album-item .friends-harmonic {
    display: inline-block;
}

.friends-harmonic {
    margin-bottom: 0;
    overflow: hidden;
}

ul {
    list-style: none;
    padding: 0;
}

.friends-harmonic li {
    float: left;
}

.friends-harmonic li:first-child a {
    margin-left: 0;
}

.friends-harmonic a {
    width: 28px;
    height: 28px;
    border-radius: 100%;
    overflow: hidden;
    border: 2px solid #fff;
    display: block;
    margin-left: -12px;
}

img {
    vertical-align: unset;
    max-width: 100%;
    height: auto;
    display: inline-block;
}

/* modal-popup */
/* create-album+ */
.modal.show .modal-dialog {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.create-photo-album {
    width: 770px;
}

.window-popup {
    max-width: calc(100% - 40px);
}

.modal-dialog {
    pointer-events: auto;
}

.modal-content {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.window-popup .icon-close {
    opacity: 1;
    margin-top: 0;
    margin-right: 0;
}

.window-popup .icon-close {
    opacity: 1;
    margin-top: 0;
    margin-right: 0;
}

.modal-header {
    line-height: 1;
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 24px 23px 23px;
    
}



.photo-album-wrapper {
    margin-right: -12px;
}

.create-photo-album .btn {
    margin: 30px 0;
}

.btn--half-width {
    width: 48%;
}

.btn {
    margin-bottom: 15px;
    position: relative;
}

.create-photo-album .btn + .btn {
    margin-left: 20px;
}

.col-3-width {
    width: 33.33%;
}

.photo-album-item-wrap {
    display: inline-block;
    margin-right: -3px;
    padding: 0 12px 12px 0;
    vertical-align: top;
}

.create-photo-album .photo-album-item.create-album {
    min-height: 200px;
}

.photo-album-item.create-album {
    background-color: transparent;
    border: 2px dashed #bbc0d5;
}

.photo-album-item:last-child {
    margin-right: 0;
}

.photo-album-item {
    position: relative;
    border-radius: 5px;
    border: 1px solid #e6ecf5;
    background-color: #fff;
}

.photo-album-item .form-group {
    margin-bottom: 0;
}

.photo-album-item .form-group > img {
    width: 100%;
    border-radius: 5px 5px 0 0;
    overflow: hidden;
    display: block;
}

img {
    vertical-align: unset;
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.create-photo-album textarea {
    border-radius: 0;
    border-right: 0;
    border-left: 0;
    font-size: 12px;
}

.form-group textarea {
    resize: none;
}

.create-photo-album .olymp-happy-face-icon {
    width: 20px;
    height: 20px;
    fill: #9a9fbf;
    position: absolute;
    top: 10px;
    left: 15px;
}

.form-inline .bootstrap-select.btn-group,
.form-horizontal .bootstrap-select.btn-group,
.form-group .bootstrap-select.btn-group {
    margin-bottom: 0;
    margin-left: 1px;
}

.bootstrap-select.btn-group:not(.input-group-btn),
.bootstrap-select.btn-group[class*="col-"] {
    float: none;
    display: inline-block;
    margin-left: 0;
}

.bootstrap-select.form-control:not([class*="col-"]) {
    width: 100%;
}

.bootstrap-select.form-control {
    margin-bottom: 0;
    padding: 0;
    border: none;
}

.bootstrap-select.style-2 > .dropdown-toggle {
    border: none;
    border-radius: 0;
    padding: 10px 15px 10px 40px;
    line-height: 1;
    margin-bottom: 7px;
}

.bootstrap-select > .dropdown-toggle {
    width: 100%;
    z-index: 1;
    background-color: transparent;
    border: 1px solid #e6ecf5;
    border-radius: 0.25rem;
    padding: 1rem 1rem;
    margin: 0 0 3px 0;
    float: none;
    line-height: 1.47;
}

.form-group.label-floating
    .bootstrap-select.btn-group
    .dropdown-toggle
    .filter-option {
    top: 5px;
    position: relative;
}

.bootstrap-select.btn-group .dropdown-toggle .filter-option {
    display: inline-block;
    overflow: hidden;
    width: 100%;
    text-align: left;
    color: #515365;
    font-weight: normal;
}

.bootstrap-select.btn-group .dropdown-toggle .caret {
    position: absolute;
    top: 50%;
    right: 12px;
    margin-top: -2px;
    vertical-align: middle;
}

.ripple-container {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    pointer-events: none;
}

input,
.form-control {
    color: #515365;
    line-height: inherit;
    font-size: 0.875rem;
}

/* add-photos */
.modal.show .modal-dialog {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.update-header-photo {
    width: 770px;
}

.window-popup {
    max-width: calc(100% - 40px);
}

.window-popup .icon-close {
    opacity: 1;
    margin-top: 0;
    margin-right: 0;
}

.icon-close {
    position: absolute;
    top: -25px;
    right: -25px;
    color: #888da8;
    fill: #888da8;
}

.modal-header {
    line-height: 1;
}

.modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 15px 25px 15px;
    border-bottom: 1px solid #e6ecf5;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
    height: auto;
    width: auto;
}

.modal-header h4 {
    color: #182032;
    font-size: 19px;
    padding: 3px 0 0;
    height: auto;
    width: auto;
}

.modal-header > * {
    margin-bottom: 0;
    cursor: pointer;
    height: auto;
    width: auto;
}

.update-header-photo .modal-body {
    padding: 0;
}

.upload-photo-item:first-child {
    border-right: none;
}

.upload-photo-item {
    display: inline-block;
    vertical-align: middle;
    width: 49%;
    padding: 20px;
    text-align: center;
    fill: #c2c5d9;
    border-left: 1px solid #e6ecf5;
}

.modal-header h6 {
    font-size: 14px;
}

.upload-photo-item h6,
.upload-photo-item .h6 {
    margin-bottom: 0;
    font-size: 14px;
    color: #888da8;
}

.upload-photo-item span {
    font-size: 11px;
    color: #888da8;
}

/* main-video-page */

.ui-block {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e6ecf5;
    margin-bottom: 15px;
    /* margin:30px 0; */
}

.ui-block .ui-block-title:last-child {
    border-bottom: 0;
}

.ui-block-title:first-child {
    border-top: none;
}

.ui-block-title {
    padding: 23px 25px 18px;
    line-height: 1;
    border-bottom: 1px solid #e6ecf5;
    border-top: 1px solid #e6ecf5;
    display: table;
    width: 100%;
    position: relative;
    border-radius: 5px 5px 0 0;
}

.ui-block-title .btn {
    display: inline-block;
    margin-bottom: 0;
}

.bg-yellow {
    background-color: #ffdc1b;
}

.inline-items > * {
    display: inline-block;
    vertical-align: middle;
}

.btn-control-small {
    width: 34px;
    height: 34px;
    line-height: 34px;
}

.btn-control {
    border-radius: 100%;
    width: 50px;
    height: 50px;
    line-height: 54px;
    padding: 0;
    fill: #fff;
    font-size: 20px;
}

.btn-control-small > i,
.btn-control-small svg {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.features-video {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 15px;
}

.features-video .video-player {
    width: 66.66%;
    margin: 0;
    display: inline-block;
    border-radius: 3px 0 0 3px;
}

.video-player {
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    margin: 20px 0;
}

.features-video .video-player img {
    width: 100%;
    display: block;
}

.features-video .video-player .play-video {
    top: 40%;
}

.video-player .play-video {
    opacity: 0;
}

.play-video {
    width: 64px;
    height: 64px;
    line-height: 68px;
    background-color: rgba(255, 94, 58, 0.7);
    border: 4px solid #fff;
    border-radius: 100%;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 5;
    transition: all 0.3s ease;
    outline: none;
}

.video-player:hover .video-content {
    opacity: 1;
}

.features-video .video-content {
    left: 50%;
    bottom: 30%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

.video-player .video-content {
    position: absolute;
    top: 280px;
    left: 50%;
    color: #fff;
    z-index: 5;
    opacity: 0;
    transition: all 0.3s ease;
    padding: 0;
}

.video-player .video-content .title {
    color: #fff;
    display: block;
}

.features-video .title {
    font-weight: 400;
    font-size: 20px;
}

.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(43, 45, 59, 0.2);
    transition: all 0.3s ease;
    opacity: 0;
}

.features-video-content {
    width: 33%;
    display: inline-block;
    background-color: #fff;
}

.post {
    position: relative;
    padding: 25px;
    border-bottom: 1px solid #e6ecf5;
}

.post__author {
    margin-bottom: 20px;
}

.post__author img {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    overflow: hidden;
    margin-right: 12px;
}

.post p {
    margin: 25px 0;
}

p {
    font-size: 0.875rem;
}

.post-additional-info {
    padding: 20px 0 0;
    border-top: 1px solid #e6ecf5;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.post-additional-info > *:last-child {
    margin-right: 0;
    margin-left: auto;
}

.post .control-block-button {
    top: 20px;
    right: -17px;
}

.control-block-button {
    position: absolute;
}

.post-control-button .btn-control {
    display: block;
    margin-bottom: 6px;
    margin-right: 0;
    background-color: #9a9fbf;
    width: 34px;
    height: 34px;
    line-height: 36px;
    border-radius: 50%;
}

.features-video .mCustomScrollbar {
    max-height: 110px;
    overflow: hidden;
}

.comments-list {
    margin-bottom: 0;
}

ul {
    list-style: none;
    padding: 0;
}

.comments-list .comment-item {
    padding: 25px;
    border-bottom: 1px solid #e6ecf5;
    background-color: #fafbfd;
    position: relative;
}

.comments-list .post__author img {
    width: 26px;
    height: 26px;
}

/* popup-v1 */
.open-photo-popup {
    width: 970px;
}

.window-popup {
    max-width: calc(100% - 40px);
}

.modal-dialog {
    pointer-events: auto;
}

.open-photo-popup .modal-content {
    border: none;
}

.modal-content {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.window-popup .icon-close {
    opacity: 1;
    margin-top: 0;
    margin-right: 0;
}

.icon-close {
    position: absolute;
    top: -25px;
    right: -25px;
    color: #888da8;
    fill: #888da8;
}

.open-photo-popup .modal-body {
    padding: 0;
}

.open-photo-thumb {
    padding: 55px 0;
    background-color: #000;
}

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    z-index: 3;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    box-sizing: content-box;
}

.photo-item:last-child {
    margin-right: 0;
}

.open-photo-thumb .photo-item {
    margin: 0;
    border-radius: 0;
    padding: 0;
    display: block;
}

.photo-item .more {
    position: absolute;
    top: 25px;
    right: 25px;
    color: #fff;
    fill: #fff;
    opacity: 0;
    transition: all 0.3s ease;
}

.open-photo-thumb .tag-friends {
    position: absolute;
    top: 25px;
    right: 55px;
    opacity: 0;
    transition: all 0.3s ease;
    fill: #fff;
}

.photo-item .content {
    position: absolute;
    bottom: 25px;
    left: 20px;
    opacity: 0;
    transition: all 0.3s ease;
}

.photo-item .content .title {
    color: #fff;
    display: block;
    margin-bottom: 0;
}

.photo-item .content time {
    font-size: 12px;
    color: #b6bbd7;
}

/* popup-v2 */
.modal-has-swiper.show {
    visibility: visible;
    opacity: 1;
}

.modal.show .modal-dialog {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.open-photo-popup-v2 .open-photo-thumb {
    width: 66.66%;
    float: left;
    z-index: 10;
}

.open-photo-popup-v2 .open-photo-content {
    width: 33%;
    float: left;
}

.open-photo-content {
    width: 33%;
    position: absolute;
    top: 0;
    left: 67%;
    z-index: 9;
    background-color: #fff;
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

.comments-list .comment-item {
    padding: 25px;
    border-bottom: 1px solid #e6ecf5;
    background-color: #fafbfd;
    position: relative;
    overflow: hidden;
}

.like-section h6 i {
    margin-right: 5px;
}

.comments-section h6 i {
    margin-right: 5px;
}

.share-section h6 i {
    margin-right: 5px;
}

.red-link {
    color: red;
}

.post p {
    font-weight: 600;
}

.choose-from-my-photo {
    width: 770px;
}

.window-popup {
    max-width: calc(100% - 40px);
}

.choose-from-my-photo .nav-tabs {
    position: absolute;
    top: 0;
    right: 0;
    max-height: 100%;
    border-bottom: none;
}

.nav-tabs .nav-item {
    position: relative;
}

.choose-from-my-photo .nav-tabs .nav-link {
    border-radius: 0;
    padding: 18px 25px;
    fill: #c2c5d9;
    background-color: #fafbfd;
    border-color: #e6ecf5;
    border-top-color: transparent;
    border-right: none;
    height: 100%;
}

.choose-from-my-photo .nav-tabs .nav-link svg {
    width: 18px;
    height: 20px;
}

.choose-photo-item {
    position: relative;
    border-radius: 5px;
    width: 33%;
    float: left;
    padding: 0 22px 25px 0;
}

.choose-photo-item .radio label span {
    position: absolute;
    top: 15px;
    right: 40px;
    left: auto;
}

.radio label .circle {
    border: 1px solid #dde0e9;
    height: 18px;
    width: 18px;
    border-radius: 100%;
}

.choose-photo-item .circle {
    background-color: #fff;
}

a.btn.btn-secondary.btn-lg.btn--half-width {
    padding: 25px 15px;
}

a.btn.btn-primary.btn-lg.btn--half-width {
    padding: 25px 15px;
}

.img-fluid {
    max-width: 100%;
    height: 100%;
}

.company-banner {
    width: 100%;
    height: auto;
    overflow: hidden;
}

.fro-f-imgs .fofil-dtl-img {
    width: 110px;
    height: 110px;
    border: 5px solid #fff;
    overflow: hidden;
    display: inline-block;
    border-radius: 50%;
    margin-top: -37px;
    position: absolute;
    left: 82px;
}

.profile-home-left.edit-profil-prosnal {
    margin-top: 55px;
}

.demo-profile {
    width: 100%;
    overflow: hidden;
    height: 366px;
    align-items: center;
    display: flex;
    justify-content: center;
}

.demo-cover {
    width: 100%;
    overflow: hidden;
    height: 100%;
    align-items: center;
    display: flex;
    justify-content: center;
}

label {
    font-size: 13px;
    font-weight: 550;
    color: #374a74;
}

.login-form-page-left label {
    font-weight: 500;
    color: #515365;
    font-size: 14px;
    letter-spacing: 1px;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-bottom: 0.5rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    /* color: #515365; */
    color:#fff;
}

input[type="submit"] {
    background-color: #007bff;
    border: #007bff solid 1px;
}

.checkmark_chk {
    position: absolute;
    top: 6px;
    left: 6px;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border-radius: 50%;
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0;
    /* height: 30px; */
}

.image-1-sec {
    width: 100%;
    display: flex;
    justify-content: center;
    height: 300px;
    overflow: hidden;
}

.image-2-sec {
    width: 49.5%;
    display: inline-flex;
}

.image-4-sec {
    width: 49.5%;
    display: inline-flex;
}

.card-success.card-outline {
    border-top: 3px solid #afb9d2;
}
.card-title {
    margin-bottom: 0px !important;
}

.card-title {
    font-size: 15px;
    color: #182032;
}

card-primary.card-outline {
    border-top: 3px solid #007bff;
}

/******** Start Soumya Csss(18-01-25)*************/
.fixed-sidebar ul li a i {
    display: inline-block;
    font-size: 18px !important;
}

.fixed-sidebar ul li span {
    display: block;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.5px;
}

.fixed-sidebar ul li a:hover {
    text-decoration: none;
    color: #8375d5 !important;
}

#list_conti_usr {
    float: left;
    width: 100%;
    position: absolute;
    top: 42px;
}

.menu-box ul.sr-set-inr li a {
    font-size: 13px !important;
}

.menu-box ul.sr-set-inr li a i.fa.fa-user {
    font-size: 14px;
}

.menu-box ul.sr-set-inr li a:hover,
.menu-box ul.sr-set-inr li a:hover i {
    color: #8375d5 !important;
}

i.fa.fa-cog {
    cursor: pointer;
}

span.price {
    display: inline-block;
    font-size: 14px;
    background: #374a74;
    color: #fff;
    padding: 3px 14px;
    border-radius: 28px;
    position: relative;
    top: -4px;
    padding-left: 3px;
}

span.price i {
    font-size: 14px !important;
    margin-right: 3px;
    display: inline-block;
    height: 25px;
    width: 25px;
    background: #fff;
    border-radius: 33px;
    text-align: center;
    color: #374a74;
    line-height: 25px;
}

.friend-list {
    min-height: 390px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0px 1px 6px 0px #cccfd5;
    padding: 20px;
    border-top: 3px solid #374a74;
    font-variant: JIS83;
}

.friend-list.follow {
    border-color: #95a7cd;
}

.friend-list.unfollow {
    border-color: #7b5ac1;
}

.mesg-meta i {
    /* position: relative; */
    /* top: 3px; */
    /* right: 0; */
    font-size: 11px !important;
    line-height: 7px !important;
    color: #a3acbf;
}

.menu-dropdown span.nav-item__icon .count p {
    font-size: 11px;
    line-height: 20px;
}

span.nav-item__name {
    font-size: 13px;
    text-transform: capitalize;
}

span.nav-item__icon {
    color: #374a74;
}

.like-comment-share-bar li:first-child {
    float: left;
    padding-left: 0;
}

.total-man-like {
    display: inline-block;
    vertical-align: top;
    margin-left: 10px;
}

.total-man-like-img {
    display: inline-block;
    float: left;
}

.total-man-like-img span {
    display: inline-block;
    height: 25px;
    width: 25px;
    overflow: hidden;
    border-radius: 100%;
    border: 2px solid #fff;
    box-shadow: 0px 0px 3px 0px #374a74;
    position: relative;
    margin-left: -12px;
    float: left;
}

.total-man-like-img span:first-child {
    margin: 0;
}

.total-man-like-img span img {
    width: 100%;
}

.total-man-like-text {
    display: inline-block;
    width: 105px;
    text-align: left;
    margin-left: 9px;
}

.total-man-like-text h4 {
    font-size: 12px;
    font-weight: bold;
    line-height: 13px;
}

.total-man-like-text h4 span {
    font-weight: normal;
    color: #838ea5;
}

i.fa-regular.fa-heart {
    font-size: 19px;
    position: relative;
    top: 3px;
}

.badge {
    font-size: 78% !important;
    padding-right: 5px !important;
    padding-left: 5px !important;
    padding-top: 4px;
    position: relative;
    top: -1px;
}

.widget-user .widget-user-header {
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    height: 135px;
    padding: 1rem;
    text-align: center;
}

.widget-user .widget-user-image {
    left: 50%;
    margin-left: -45px;
    position: absolute;
    top: 80px;

    width: 90px;
}

.card .nav.flex-column:not(.nav-sidebar) > li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    margin: 0;
}

.widget-user-header h3 h5 {
    color: #fff !important;
    font-weight: bolder;
}

.widget-user .card-footer {
    padding-top: 30px;
}

.widget-user-image img {
    border: 4px solid #fff;
    height: auto;
    width: 90px;
    border-radius: 50%;
}

.description-block > .description-header {
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    padding: 0;
}

.description-block {
    font-size: 13px;
    display: block;
    margin: 10px 0;
    text-align: center;
}

.button-b {
    position: absolute;
    right: 0;
    top: 5px;
    width: 52px;
}

.button-b button {
    display: block;
    background-color: #000;
    color: #fff;
    font-size: 10px;
    width: 100%;
    border: none;
    margin: 4.5px 1px;
    padding: 1px 0;
    letter-spacing: 0.5px;
}

.button-b button.confirm {
    background: #0a8a50;
}

.button-b button.delete {
    background: #f54f4f;
}

.button-b button:focus {
    outline: none;
}

.button-b button:hover {
    opacity: 0.8;
}

.list-box {
    float: left;
    width: 100%;
    height: 300px;
    overflow-y: auto; /* vertical scrolling */
    overflow-x: hidden; /* prevent horizontal scroll */
}


.dropdown-content .button i {
    font-size: 11px;
}

button.delete-i i {
    font-size: 11px !important;
}

button.delete-i {
    background: #f54f4f;
    width: auto;
    float: right;
    padding: 6px 8px;
    text-align: center;
    margin: 7px 0;
}

.pull-right {
    right: 12px;
    top: 16px;
}

.pull-right span {
    background: #f54f4f;
    padding: 0px 6px 3px;
    width: 24px !important;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    border-radius: 4px;
}

.pull-right span i {
    font-size: 10px !important;
    color: #fff !important;
}

.pull-right span.hide-b {
    background: #374a74;
}

li.nav-item-work {
    right: 0;
    top: 5px;
}

.modal-dialog {
    width: 100%;
    top: 47px;
    max-width: inherit;
    padding: 0 82px 0 82px;
}

.modal-content {
    margin: 0 auto !important;
    width: 200% !important;
    padding: 0 !important;
}

.frd-slide-list-item {
    position: relative;
}

.frd-slide-list-item label {
    position: absolute;
    top: 0;
    right: 0;
}

.post-img-box {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
    gap: 10px;
}

ul.post-img-box li {
    max-height: 300px;
}

ul.post-img-box li img {
    float: left;
    max-width: 100%;
    min-width: 100%;
    height: 100%;
}

ul.post-img-box.image-3-sec {
    display: flex;
    flex-wrap: wrap;
}

ul.post-img-box.image-3-sec li:not(:first-child) {
    flex: 1;
}

ul.post-img-box.image-3-sec li:nth-child(1) {
    width: 100%;
}

ul.post-img-box.image-4-sec {
    display: flex;
    flex-wrap: wrap;
}

ul.post-img-box.image-4-sec li:not(:first-child) {
    flex: 1;
}

ul.post-img-box.image-4-sec li:nth-child(1) {
    width: 100%;
}

.col-sm-6.col-lg-6.col-md-6,
.col-3 {
    padding-left: 7px;
    padding-right: 7px;
}

.col-8 {
    padding-left: 7px;
    padding-right: 7px;
}

.profile-incomplet {
    display: block !important;
    width: 100%;
    text-align: center;
}

.profile-incomplet ul.list-group {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
    display: inline-block !important;
    text-align: left;
}

.profile-incomplet ul li {
    display: inline-block;
    background: #ffd9dc;
    margin: 5px 0;
    border: 1px solid #ff8793;
    border-radius: 32px;
    padding: 0 12px;
    width: 100%;
    position: relative;
    padding-right: 20px;
    padding-bottom: 3px;
    height: 23px;
    line-height: 17px;
}

.profile-incomplet ul li .dipay-flex2 {
    text-align: left;
}

.profile-incomplet ul li span.badge.badge-danger.badge-pill {
    font-size: 8px !important;
    margin: 0 !important;
    display: inline-block !important;
    padding: 0 !important;
    height: 15px;
    width: 15px;
    line-height: 16px;
    font-size: 6px !important;
    text-align: center;
    background: none;
    position: absolute;
    top: 2px;
    right: 3px;
}

.profile-incomplet ul li span.knob-label.float-left {
    float: none !important;
}

.profile-incomplet ul li span.knob-label.float-left {
    font-size: 10px !important;
    font-weight: bold;
    color: #323232;
    letter-spacing: 0.5px;
}

.pai-chart {
    border-right: 1px solid #ccc;
}

ul.todo-list {
    padding: 0;
    margin: 0;
    width: 100%;
}

ul.todo-list li {
    border-radius: 2px;
    background-color: #f8f9fa;
    border-left: 3px solid #374a74;
    color: #495057;
    margin-bottom: 12px;
    padding: 7px 10px;
    position: relative;
    font-size: 13px;
    cursor: pointer;
}

ul.todo-list li .tools {
    position: absolute;
    right: 11px;
    top: 10px;
    opacity: 0;
    visibility: hidden;
    transition: 500ms all ease-in-out 0s;
}

ul.todo-list li:hover .tools {
    opacity: 1;
    visibility: visible;
    transition: 500ms all ease-in-out 0s;
}

.card-header .card-title {
    float: left;
}

.frd-list-head {
    /* float: right; */
    width: auto;
    margin-bottom: 0;
}

.frd-cover {
    float: left;
    width: 100%;
    height: 68px;
    overflow: hidden;
}

.frd-cover img {
    float: left;
    width: 100%;
}

.btn {
    background-color: #374a74 !important;
    border: none;
    margin-bottom: 0;
    color:#fff;
}

.btn:hover {
    background-color: #7c5ac2 !important;
}

p.coommemnt-con.show-read-more a {
    word-wrap: break-word;
}

.find-friend-box {
    float: left;
    width: 100%;
}

.find-frind-icon {
    display: inline-block;
    height: 60px;
    width: 60px;
    background: #374a74;
    color: #fff;
    text-align: center;
    line-height: 69px;
    border-radius: 100%;
    margin-bottom: 15px;
}

.find-frind-icon svg {
    height: 25px;
    width: 25px;
}

.find-frind-icon p.text-muted.small {
    text-align: center;
    margin-bottom: 8px;
}

.find-friend-box p.text-muted.small {
    text-align: center;
    line-height: 17px;
    margin: 4px 0 7px;
}

.find-friend-box .badge.badge-primary {
    width: 100%;
    padding: 8px 0;
    letter-spacing: 0.2px;
    margin: 2px 0;
}

.find-friend-box button#connect-facebook {
    background: #38529a;
    border: none;
}

.find-friend-box button#connect-linkedin {
    border: none;
    background: #0073b1;
}

.frd-slide-list-item p {
    font-size: 12px;
    color: #545454;
    margin-top: 5px;
    margin-bottom: 10px;
}

.people-you-may-btn {
    float: left;
    width: 100%;
}

.people-you-may-btn a {
    display: inline-block;
    text-align: center;
}
.people-you-may-btn .add-friend-btn{
    width: 100%;
}
.people-you-may-btn .add-friend-btn button {
    background: #374a74;
    border: none;
    padding: 6px 12px;
    line-height: 17px;
    align-items: center;
    display: flex;
    width: 100%;
}


.people-you-may-btn .add-friend-btn button svg {
    margin-right: 0;
}

.people-you-may-btn .add-friend-btn button:hover {
    background: #7c5ac2;
}

.people-you-may-btn .add-friend-btn button:focus {
    outline: none;
}

.people-you-may-btn .cancel-profile button {
    background: #df4f5d;
    border: none;
    padding: 6px 12px;
    line-height: 17px;
    align-items: center;
    display: flex;
}

.people-you-may-btn .cancel-profile button:hover {
    background: #bb2f3c;
}

.people-you-may-btn .cancel-profile button:focus {
    outline: none;
}

.friend-remove-btn {
    background: #ffabab;
    border: none;
    padding: 6px 7px;
    line-height: 17px;
    align-items: center;
    display: flex;
    color: #992f2f;
}

#moreServicesModal .frd-slide-list {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

#moreServicesModal .frd-slide-list .frd-slide-list-item {
    width: 24.1%;
}

#moreServicesModal .frd-slide-list .frd-slide-list-item span {
    margin-top: 0;
}

.frd-slide-list-item a.btn.btn-primary {
    padding: 5px 15px;
    font-size: 12px;
    border: none;
}

.card.comming-soon-sec {
    background-image: linear-gradient(to right, #7c5ac1, #001f56);
    overflow: hidden;
    padding: 0 12px;
    position: relative;
}

.birth-day-user-img {
    float: left;
    width: 100%;
}

.birth-day-user-img span {
    width: 80px;
    height: 94px;
    border-radius: 11%;
    background: #000;
    overflow: hidden;
    display: inline-block;
    float: left;
    border: 3px solid #9e88df;
}

.user-birthday-box {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 15px;
    align-items: center;
}

.birth-day-user-img {
    float: left;
    width: 95px;
    position: relative;
}

.user-title-box {
    width: 100%;
    padding-left: 18px;
}

.card.comming-soon-sec p {
    color: #fff !important;
    font-weight: normal;
    float: left;
    width: 100%;
    margin-top: 0 !important;
}

.user-birthday-box i.fas.fa-birthday-cake.me-2 {
    position: absolute;
    right: 23px;
    top: -7px;
    color: #fff;
    background: #ffffff40;
    height: 40px;
    width: 40px;
    border-radius: 100%;
    font-size: 18px;
    text-align: center;
    line-height: 36px;
    box-shadow: 0px 6px 0px 2px #fff;
}

.user-title-box h3 {
    color: #fff !important;
    font-size: 18px;
    letter-spacing: 1px;
}

.user-title-box h3 span {
    display: block;
    font-size: 30px;
}

.comming-soon-sec i.fa-regular.fa-share-from-square {
    position: absolute;
    right: 21px;
    bottom: -12px;
    color: #0e2662;
    background: #ffffff;
    height: 30px;
    width: 30px;
    border-radius: 100%;
    font-size: 13px;
    text-align: center;
    line-height: 32px;
}

.recom-product-img {
    height: 150px;
    background: #000;
    float: left;
    width: 100%;
}

.recom-product-img a {
    display: inline-block;
    height: 100%;
}

.recom-product-img img {
    max-height: 100%;
    min-height: 100%;
    object-fit: contain;
    max-width: 100%;
}

.job-detail-box {
    min-height: 86vh;
    padding-top: 0;
    position: relative;
    display: flex;
    align-items: center;
}

.job-detail-box:after {
    position: absolute;
    content: "";
    left: 0;
    bottom: -46px;
    background: url(http://localhost/indsen_lat/indsen_latest/assets/img/jobs/job-bg.png)
        center bottom;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
    background-size: 29%;
}

.job-card {
    position: relative;
    z-index: 111;
    text-align: left !important;
    float: left;
    width: 100%;
    padding-left: 75px !important;
}

.job-card i {
    position: absolute;
    left: 0;
    top: 0;
}

.job-card-box {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.job-card-box-left {
    float: left;
    width: 70%;
}

.job-card-box-right {
    float: right;
    width: 30%;
}

.job-title {
    text-align: center;
    margin-bottom: 20px;
}

.job-title h2 span {
    display: block;
}

.job-title h2 {
    font-size: 28px;
    color: #182032;
}

.job-title h2 span {
    font-size: 23px;
    color: #485264;
}

.pro-file2 {
    float: none;
    height: 85px;
    width: 85px;
}

.job-detail-box .container-fluid {
    position: relative;
    z-index: 111;
}

.step-status ul {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
}

.step-status ul li {
    text-align: center;
    width: 25%;
    position: relative;
}

.step-status ul li::after {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 2px;
    width: 100%;
    background: #ccc;
    content: "";
}

.step-status ul li span {
    height: 35px;
    width: 35px;
    background: #fff;
    border-radius: 100%;
    border: 1px solid #d7d7d7;
    line-height: 33px;
    font-weight: bold;
    display: inline-block;
    position: relative;
    z-index: 111;
    font-size: 13px;
}

.step-status ul li:last-child::after {
    display: none;
}

.card-header.step-status {
    padding: 6px 0;
    border-top: 3px solid #7c5ac2;
}

.step-status ul li.active-step span {
    background: #000;
    color: #fff !important;
}

.position-absolute {
    position: absolute !important;
    left: 50%;
    bottom: -13%;
    transform: translate(-50%, 0);
}

img.beta {
    width: 53px;
    position: absolute;
    left: 9px;
    top: 0;
}

.find-friend-box .card-body {
    padding: 1rem;
}

.find-friend-box button#connect-facebook,
.find-friend-box button#connect-linkedin {
    letter-spacing: 0.1px;
    font-weight: normal;
}

.find-friend-box button#connect-facebook .mr-1 {
    margin-right: 0.15rem !important;
}

.add-f-btn-box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 10px;
}

.people-you-may-btn button {
    width: 35px;
    text-align: center;
}

.people-you-may-btn button {
    padding: 0 !important;
    height: 29px;
    text-align: center !important;
    justify-content: center;
    vertical-align: middle;
}

.re-pro {
    padding: 0;
}

.cg-box {
    padding: 0 8px;
}

.pymk-box {
    padding: 0 8px;
}

.to-do-main {
    margin-top: 16px;
    margin-bottom: 16px;
}

div#modal-user-list .col-3 {
    flex: 0 0 14%;
    max-width: 14%;
}

/******** End Soumya Csss(18-01-25)*************/

.tablecss {
    font-size: 13px;
}

.status-line {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-width: 800px;
    margin: auto;
    font-size: 13px;
    color: #333;
}

.status-line .icon {
    font-size: 1rem;
    color: #555;
}

.status-line span {
    margin: 0 0.3rem;
}

.highlight {
    font-weight: bold;
    color: #007bff;
}

/******** End Subham Css(24-04-25)*************/
/* Santosh Css */
#wishlistControlsRow {
    background-color: #f8f9fa;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}

#backToMainBtn {
    transition: all 0.3s ease;
}

#backToMainBtn:hover {
    background-color: #6c757d;
    border-color: #6c757d;
}

#showWishlistBtn {
    background-color: #ff6b6b;
    border-color: #ff6b6b;
    transition: all 0.3s ease;
}

#showWishlistBtn:hover {
    background-color: #ff5252;
    border-color: #ff5252;
}

#wishlistContainer {
    margin-top: 20px;
    border-top: 1px solid #eee;
    padding-top: 20px;
}

.wishlist-heart {
    float: right;
}

.wishlist-heart .wishlist-btn {
    color: #fff;
    background: rgba(0, 0, 0, 0.3);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.wishlist-heart .wishlist-btn:hover {
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
}

.wishlist-heart .wishlist-btn i.fas {
    color: #ff0000;
}

.wishlist-heart .wishlist-btn i.text-danger {
    color: #ff0000 !important;
}

.select2-container {
    z-index: 1060 !important;
    /* Higher than modal z-index */
}

/* Ensure modal has proper z-index */
.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1040 !important;
}

/* Fix for Select2 in Bootstrap 5 modals */
.select2-dropdown {
    z-index: 1061 !important;
}

/* Adjust modal padding if needed */
.modal-body {
    padding: 20px;
}

.alert {
    padding: 10px;
    background: color #289745;
    color: black;
    opacity: 1;
    transition: opacity 0.6s;
    margin-bottom: 10px;
    font-weight: 500;
    /* height: 600px;
    width: 800px; */
}

.alert.warning {
    background-color: #ff9800;
}

.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

.closebtn:hover {
    color: black;
}

.plans-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    max-width: 1200px;
    /* margin: auto; */
    margin: 0px 20px;
}


.plan-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.3s ease, border-color 0.3s ease,
        background-color 0.3s ease;
    border: 2px solid transparent;
    position: relative;
}

.plan-card:hover {
    transform: translateY(-5px);
}

.plan-card.selected {
    border-color: #4caf50;
    background-color: #f0fff4;
}

.plan-header {
    background: #4caf50;
    color: white;
    padding: 15px;
    text-align: center;
    font-size: 20px;
}

.plan-body {
    padding: 20px;
}

.plan-body p {
    margin: 10px 0;
    color: #666;
    display: flex;
    align-items: center;
}

.plan-body p i {
    margin-right: 10px;
    color: #4caf50;
}

.features-heading {
    margin-top: 20px;
    font-weight: bold;
    color: #333;
    font-size: 1.2rem;
    margin-bottom: 10px;
}

.features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.features-list li {
    margin: 5px 0;
    display: flex;
    align-items: center;
    color: #666;
    font-size: 14px;
}

.features-list li i {
    margin-right: 10px;
}

.features-list li.available i {
    color: #4caf50;
    /* Green for available features */
}

.features-list li.unavailable i {
    color: #e74c3c;
    /* Red for unavailable features */
}

.plan-footer {
    text-align: center;
    padding: 15px;
    background: #f9f9f9;
    border-top: 1px solid #ddd;
}

.plan-footer button {
    background-color: #4caf50;
    color: white;
    border: none;
    padding: 6px 16px;
    border-radius: 5px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.plan-footer button:hover {
    background-color: #45a049;
}

.plans-container input[type="radio"] {
    display: none;
}

/* Fix for modal z-index issue */
.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1040 !important;
}

.post__date,
.post__location {
    margin-left: 5px;
    font-style: italic;
}

.image-container {
    position: relative;
    display: inline-block;
    margin: 10px;
}

.image-container img {
    width: 150px;
    height: 150px;
    object-fit: cover;
    border-radius: 8px;
}

.delete-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: red;
    color: white;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.delete-btn:hover {
    background-color: darkred;
}

.form-controls {
    width: 100%;
}

/* .upload-area {
    width: 100%;
    max-width: 370px;
    height: 260px;
    border: 2px dashed #4caf50;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    cursor: pointer;
    margin: 50px auto;
    transition: background-color 0.3s;
} */

.upload-area {
    width: 100%;
    max-width: 370px;
    height: 185px;
    border: 2px dashed #4caf50;
    justify-content: center;
    align-items: center;
    text-align: center;
    cursor: pointer;
    margin: 45px auto;
    transition: background-color 0.3s;
    padding: 40px;
}

.upload-area.dragover {
    background-color: #e0f7e0;
}
.upload-area h2 {
    font-size: 28px;
}
.upload-area h2,
.upload-area p {
    color: #4caf50;
}

.image-preview {
    display: flex;
    flex-wrap: wrap;
    /* justify-content: center; */
    margin-top: 20px;
}

/* .image-preview img {
    width: 150px;
    height: 150px;
    object-fit: cover;
    margin: 10px;
    border: 2px solid #ccc;
    border-radius: 10px;
} */

.image-preview img {
    width: 96px;
    height: 96px;
    object-fit: cover;
    margin: 6px;
    border: 2px solid #ccc;
    border-radius: 10px;
}

.expire-message.red {
    color: red;
    font-weight: 500;
    font-size: 12px;
}

.expire-message.black {
    color: black;
    font-weight: 500;
    font-size: 11px;
}

.pagination-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

#wishlistContainer {
    margin-top: 20px;
    border-top: 1px solid #eee;
    padding-top: 20px;
}

#showWishlistBtn {
    background-color: #ff6b6b;
    border-color: #ff6b6b;
    transition: all 0.3s ease;
}

#showWishlistBtn:hover {
    background-color: #ff5252;
    border-color: #ff5252;
}

.block-header-wrap {
    padding: 15px;
}

.filter-display .form-control,
.w-search .form-control {
    width: 200px;
    margin-right: 15px;
    height: 38px;
}

.blog-post .block-left {
    width: 25%;
    overflow: hidden;
    padding: 5px;
}

.blog-post .block-right {
    width: 75%;
}

.blog-post .post-category {
    bottom: auto;
    right: auto;
    left: 15px;
    top: 10px;
}

.blog-post-v3 .block-left img {
    min-height: 1px;
}

.cat-bg {
    background: #fff;
    border-radius: 3px;
    border: 1px solid #182032;
    font-weight: 500;
    margin-right: 10px;
}

.author-date i {
    color: #f28920;
}

.block-right .btn-readmore {
    font-size: 14px;
}

.blog-post .post-title:hover {
    text-decoration: none;
}

.full-width-wrap {
    float: right;
}

.imagelist-wrap {
    width: 100%;
    height: 170px;
    overflow: hidden;
    display: table-cell;
    vertical-align: middle;
}

.blog-post .author-date {
    float: left;
}

.expire-message {
    float: right;
}

.block-right h3 {
    width: 100%;
    float: left;
}

.block-right h3 .post-title {
    margin-bottom: 0;
}

.user-footer {
    display: block;
    text-align: center;
}

.user-footer h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
}

.user-footer h5 {
    margin-top: 5px;
    font-size: 13px;
    color: #f28920;
}

.card-body .nav-marginbottom {
    margin-bottom: 15px;
}

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

.tabprvwrap .tab-pane {
    height: 300px;
    overflow: hidden;
    text-align: center;
}

#nextBtn, #prevBtn {
    top: 39% !important;
    color: #fff;
    background-color: #000;
}

.tabprvwrap .tab-pane img {
    width: auto;
    height: 100%;
}

.thumlainul li a {
    width: 110px;
    height: 110px;
    background: #f5f5f5;
    text-align: center;
    display: block;
    overflow: hidden;
}

.thumlainul li a img {
    width: auto;
    height: 100%;
    max-width: 1px;
}

table#posted_joblist {
    font-size: 13px;
}

/* kamakshya */
.post-content.block-right.talkspacelist {
    width: 100% !important;
}

/* kamakshya css end */

ul.post-img-box.image-5-sec {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

ul.post-img-box.image-5-sec li.post-img {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
}

/* Top 2 images */
ul.post-img-box.image-5-sec li.post-img:nth-child(1),
ul.post-img-box.image-5-sec li.post-img:nth-child(2) {
    width: calc(50% - 2px);
    height: 160px;
}

/* Bottom 3 images */
ul.post-img-box.image-5-sec li.post-img:nth-child(3),
ul.post-img-box.image-5-sec li.post-img:nth-child(4),
ul.post-img-box.image-5-sec li.post-img:nth-child(5) {
    width: calc(33.333% - 2.66px);
    height: 120px;
}

/* Image styling */
ul.post-img-box.image-5-sec li.post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 6px;
}

/* +X more overlay */
.more-click-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-decoration: none;
    z-index: 2;
}

.more-overlay {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    border-radius: 6px;
}

.more-click-layer:hover .more-overlay {
    background: rgba(0, 0, 0, 0.7);
}

li.profile-step.sucess {
    border: 1px solid #215d2b !important;
    background: #c8e7da !important;
}

.d-flex.flex-wrap.gap-2 {
    margin-top: 10px;
}
span.feeling_text {
    font-size: 14px;
    color: #5c5a5a;
}


.social-post-footer {
    font-family: Arial, sans-serif;
    border-top: 1px solid #e5e5e5;
    padding: 10px 15px;
    background-color: #fff;
}

.post-stats {
    /* display: flex; */
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #555;
    margin-bottom: 10px;
}

.post-stats .likes {
    /* display: flex; */
    align-items: center;
    gap: 6px;
}

.post-stats .like-icon {
    color: #1877f2;
    font-size: 16px;
}

.post-stats .comments-shares span {
    margin-left: 15px;
}

.post-actions {
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-top: 1px solid #e5e5e5;
    padding-top: 8px;
    margin: 0;
    list-style: none;
    padding-left: 0;
}

.post-actions li {
    flex: 1;
    text-align: center;
}

.post-actions a {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    padding: 6px 0;
    font-size: 15px;
    color: #555;
    text-decoration: none;
    transition: background 0.2s;
}

.post-actions a:hover {
    background-color: #f0f2f5;
    border-radius: 6px;
}

.post-actions i {
    font-size: 16px;
}

.post-actions li.active i {
    color: #1877f2;
}
span.postlistmsg {
    font-size: 14px;
    margin-left: 10px;
    color: darkmagenta;
    font-weight: 600;
}

/* Modal 2-column Layout */
.svc-modal-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

/* Left: Service Grid */
.svc-modal-left {
  flex: 1 1 35%;
}

.svc-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: flex-start;
}

/* Right: About Section */
.svc-modal-right {
  flex: 1 1 60%;
  background: #f9f9f9;
  padding: 20px;
  border-radius: 12px;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

/* Service Box */
.svc-box {
  width: 150px;
  height: 150px;
  position: relative;
}

.svc-img-wrap {
  width: 100%;
  height: 100%;
  border: 2px solid #ccc;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  background: #fff;
  transition: all 0.3s ease;
}

/* Hide checkbox */
.svc-img-wrap input[type="checkbox"] {
  display: none;
}

/* Image */
.svc-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Check Icon */
.svc-check-icon {
  position: absolute;
  top: 8px;
  right: 8px;
  background: #00c9a7;
  color: #fff;
  font-size: 10px;
  padding: 6px;
  border-radius: 50%;
  display: none;
  z-index: 2;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 20px;
}

/* Selected State */
.svc-box.svc-selected .svc-img-wrap {
  border: 3px solid transparent;
  background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #f43b47, #453a94);
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.svc-box.svc-selected .svc-check-icon {
  display: block;
}

.seen-status {
  color: green;
  font-size: 50%;
  top: 15px;
  position: relative;
  left: 5px;
}

.cu-pro-pic {
  display: none;
}
 .page-cover-img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-bottom: 1px solid #eee;
}
.frd-slide-list-item .page-buttons .page-follow-btn {
    font-size: 10px;
}
#exampleModalCenter .modal-header .close {
    width: 25px;
    height: 25px;
    top: 63%;
    font-size: 14px;
    right: 20px!important;
}
.close {
    font-size: 14px!important;
}
.pupup-close-bnt span {
    font-size: 14px!important;
}
.border-bottom .btn-icon:hover i {
    color: #fff!important;
}
.page-name {
    font-size: 12px;
    margin-top: 10px;
    font-weight: 600;
    color: #333;
}
.page-buttons .btn {
    font-size: 0.75rem;
    padding: 4px 10px;
    border-radius: 0px;
    background: #374a74;
    border: 1px solid #374a74;
}
.page-content {
    padding: 0px 10px 0;
}



/* login page responsive start gouri*/
@media only screen and (min-width: 320px) and (max-width:768px) {
  
.login-form-page {
    top: 0 !important;
    transform: translate(0px, 0px) !important;
    left: 0px !important;
}

  .carousel-inner {
    display: none;
  }

 
  .log-m {
    top: -640px !important;
  } 

.footer-lang {
    max-width: 31% !important;
}
.footer-links {
    max-width: 100% !important;
}
.foot-m {
    flex-wrap: nowrap;
}
.reg-m {
    top: -687px !important;
    width: 100% !important;
}
}

.iti {
    display: block !important;
    background: #E8F0FE;
}
.register-box input[type="submit"] {
    margin-top: 0px !important;
    padding: 10px;
    color: white;
}

div#update_password_tip {
    border-radius: 5px;
    display: block;
    font-size: 12px;
    text-align: center;
    position: absolute;
    background: #2F558E !important;
    left: 90% !important;
    top: 304px !important;
    width: 281px !important;
    height: 114px !important;
    padding: 7px 10px;
    color: #fff;
}
.length_rule,.alpha_rule,.combi_rule,.number_rule {
    color: white !important;
}
#update_password_tip::after {
    content: "\f0d9";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    width: 40px;
    position: absolute;
    top: 40px !important;
    left: -10px !important;
    font-size: 30px;
    color: #2f558e !important;
}
/* dashboard right side*/
.card-d {
    height: 220px !important;
    overflow-y: scroll;
    /* scrollbar-color: #f28920 #d9ddd9; */
}
.dm {
    align-items: flex-start !important;
}
.weather-card .weather-desc {
    margin-bottom: -16px !important;
}
.weather-icon {
    height: 60px;
    margin-top: -9px;
}
.wth {
    display: block !important;
}
#weather-icon img {
    height: 83px !important;
    width: 93px !important;
}
@media only screen and (min-width: 320px) and (max-width:768px) {
    #feels-like {
    margin-top: 0px;
}
}

.service-card.selected::after {
    padding: 9px 9px !important;
}

.svc-check-icon {
    margin-top: -4px !important;
}
/* .fa-check:before {
    content: "\f00c";
    position: relative;
    top: -6px;
    left: -2px;
} */
.modal-header .close {
    margin: auto !important;
}
.sel {
    z-index: 10;
    color: #fff;
    margin-top: -99px;
    margin-right: 10px;
}
/* .card-header {
    background-color: #fff !important;
} */
.frd-list-head a {
    color: #374a74 !important;
} */
.frd-list-head a:hover {
    color: #f9a321 !important;
}
.visitor-photo {
 padding: 0 10px !important;
}
.page-may-tital h4 {
    font-family: "Roboto", serif !important;
}
@media only screen and (min-width: 320px) and (max-width:768px) {
    .card-d {
        margin-top: 10px;
        /* width: 248px; */
        height: 170px !important;
        overflow-y: scroll;
        scrollbar-color: #f28920 #d9ddd9;
    }
    .weather-card .weather-desc {
    font-size: 14px !important;
    font-weight: 500;
}
    .service-card {
        height: auto o !important;
    }

.card-title {
    font-size: 11px !important;
}

.frd-list-head .work-btn {
    font-size: 9px !important;
}
    .frd-slide-list-item {
        float: left;
        width: auto!important;
    }


    /* .item-work .work-btn {
        display: block !important;
        margin-top: -64px;
        padding: 2px;
    } */
   .beta {
    display: none !important;
   }
   .search-bar {
    margin-top: -46px;
    width: 59px;
   }
   .fa-user:before {

    display: none;
}
.fa-cog:before, .fa-gear:before {
    display: none;
}




}


.services-grid {
    display: flex !important;
    gap: 20px;
    width: -webkit-fill-available;
}
.service-card {
    height: 100px !important;
    display: block !important;
    background: #f28920 !important;
}
.service-card img {
    padding: 0px !important;
}
.service-card.selected::after {
    top: 8px !important;
    right: 3px !important;
    background-color: green !important;
}
/* .fa-check:before {
    content: "\f00c";
    position: relative;
    top: -95px;
    left: 71px;
    color: #f1f0f0;
    z-index: 4;
} */
/* modal content */
.modal-content {
    width: 100% !important;
}
/* .btn {
    background-color: #212c46 !important;
} */




.social-post-footer {
    font-family: Arial, sans-serif;
    border-top: 1px solid #e5e5e5;
    padding: 10px 15px;
    background-color: #fff;
    clear: both;
}

.post-stats {
    /* display: flex; */
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #555;
    margin-bottom: 10px;
}

.post-stats .likes {
    display: flex;
    align-items: center;
    gap: 6px;
}

.post-stats .like-icon {
    color: #1877f2;
    font-size: 16px;
}

.post-stats .comments-shares span {
    margin-left: 15px;
}

.post-actions {
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-top: 1px solid #e5e5e5;
    padding-top: 8px;
    margin: 0;
    list-style: none;
    padding-left: 0;
}

.post-actions li {
    flex: 1;
    text-align: center;
}

.post-actions a {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    padding: 6px 0;
    font-size: 15px;
    color: #555;
    text-decoration: none;
    transition: background 0.2s;
}

.post-actions a:hover {
    background-color: #f0f2f5;
    border-radius: 6px;
}

.post-actions i {
    font-size: 16px;
}

.post-actions li.active i {
    color: #1877f2;
}
span.postlistmsg {
    font-size: 14px;
    margin-left: 10px;
    color: darkmagenta;
    font-weight: 600;
}

/* Modal 2-column Layout */
.svc-modal-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

/* Left: Service Grid */
.svc-modal-left {
  flex: 1 1 35%;
}

.svc-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: flex-start;
}

/* Right: About Section */
.svc-modal-right {
  flex: 1 1 60%;
  background: #f9f9f9;
  padding: 20px;
  border-radius: 12px;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

/* Service Box */
.svc-box {
  width: 150px;
  height: 150px;
  position: relative;
}

.svc-img-wrap {
  width: 100%;
  height: 100%;
  border: 2px solid #ccc;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  background: #fff;
  transition: all 0.3s ease;
}

/* Hide checkbox */
.svc-img-wrap input[type="checkbox"] {
  display: none;
}

/* Image */
.svc-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Check Icon */
.svc-check-icon {
  position: absolute;
  top: 8px;
  right: 8px;
  background: #00c9a7;
  color: #fff;
  font-size: 10px;
  padding: 6px;
  border-radius: 50%;
  display: none;
  z-index: 2;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 20px;
}

/* Selected State */
.svc-box.svc-selected .svc-img-wrap {
  border: 3px solid transparent;
  background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #f43b47, #453a94);
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.svc-box.svc-selected .svc-check-icon {
  display: block;
}

.seen-status {
  color: green;
  font-size: 50%;
  top: 15px;
  position: relative;
  left: 5px;
}

.cu-pro-pic {
  display: none;
}
 .page-cover-img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-bottom: 1px solid #eee;
}
.frd-slide-list-item .page-buttons .page-follow-btn {
    font-size: 10px;
}
#exampleModalCenter .modal-header .close {
    width: 25px;
    height: 25px;
    top: 63%;
    font-size: 14px;
    right: 20px!important;
}
.close {
    font-size: 14px!important;
}
.pupup-close-bnt span {
    font-size: 14px!important;
}
.border-bottom .btn-icon:hover i {
    color: #fff!important;
}
.page-name {
    font-size: 12px;
    margin-top: 10px;
    font-weight: 600;
    color: #333;
}
.page-buttons .btn {
    font-size: 0.75rem;
    padding: 4px 10px;
    border-radius: 0px;
    background: #374a74;
    border: 1px solid #374a74;
}
.page-content {
    padding: 0px 10px 0;
}
.float-left {
    height: 55px;
    width: 55px;
    position: relative;
}
#weather-icon img {
    height: 85px !important;
    width: 85px !important;
    position: absolute;
    max-width: inherit;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.weather-card .feels-like {
    font-size: 13px;
    opacity: 0.9;
    margin-bottom: 0;
    background: rgba(0, 0, 0, 0.13);
    border-radius: 56px;
    padding: 2px 0;
    letter-spacing: 1px;
}
.weather-card .weather-desc {
    font-size: 14px;
    font-weight: 500;
    margin: 0 !important;
    color: #2f587a;
}
.weather-card .last-updated {
    text-align: center;
    font-size: 0.75rem;
    margin-top: 0;
    opacity: 0.9;
    color: #2f587a;
}
.weather-card .card-body {
    text-align: center;
    padding: 0.5rem 0;
    padding-bottom: 0;
}
.add-f-btn-box .float-left {
    height: inherit;
}
.weather-card {
    background: url(../img/weather/sky-img.jpg);
    border-radius: 8px;
    color: #fff;
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-size: 100% 100%;
}
.d-flex.align-items-center.gap-3 {
    gap: 10px;
}
.rounded-circle {
    float: left;
}
.d-flex.flex-wrap.gap-2 {
    gap: 7px;
}
.np-post-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 16px;
    border: none;
    border-radius: 25px;
    font-size: 12px;
    font-weight: 500;
    background: #f5f5f5;
    color: #333;
    transition: all 0.2s ease;
    cursor: pointer;
    letter-spacing: 0.3px;
}
.np-post-btn img {
    width: 18px;
    height: 18px;
}
    .np-input-field {
        flex-grow: 1;
        background: #f5f8fa;
        padding: 12px 20px;
        border-radius: 12px;
        font-size: 14px;
        text-decoration: none;
        transition: background 0.3s;
        display: block;
    }

    .np-input-field:hover {
        background: #eef3f7;
        color: #333;
    }
.visitor-item.d-flex.align-items-center.p-2.border-bottom {
    padding: 12px 0 !important;
    position: relative;
}
.visitor-info.flex-grow-1 h6 {
    font-size: 13px;
    font-weight: normal;
    line-height: 18px;
}
.visitor-info.flex-grow-1 h6 span {
    display: block;
    font-size: 11px;
    font-style: italic;
    font-weight: 400;
}
small.text-muted {
    background: #e3f2fd;
    color: #1565c0 !important;
    font-weight: bold;
    font-size: 10px !important;
    display: inline-block;
    padding: 3px 7px 4px;
    border-radius: 53px;
    position: absolute;
    right: 16px;
    top: 17px;
    font-style: italic;
    letter-spacing: 0.3px;
}
.card.profile-visitors-sec.card-d {
    padding: 10px 15px;
}
/* .frd-list-head a {
    color: #374a74 !important;
} */
.cancel-profile button {
    width: 100% !important;
    padding: 0 8px 0 7px !important;
    gap: 4px;
    margin-left: -2px;
}
.contan-frd-list.cg-box .col-md-3.col-sm-6.mb-4 {
    padding: 0;
}
.contan-frd-list.cg-box .row{
    gap: 10px;
}
label.buy_sell-form-control-label {
    margin-left: 18px;
}

button.btn.btn-primary.fuel-btn {
    margin: 4px 0px;
}

/* kartik css */

.buy-sell-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.profile-sec {
    display:flex;
    justify-content: space-between;
}
.slider-sec {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
i.fa-solid.fa-phone {
    margin-right: 7px;
}

.card-sec {
    min-height: 260px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
    overflow: hidden;
}

span.close-button {
    width: 100%;
    /* float: inline-end; */
    justify-content: end;
    display: flex;
    color: #fff;
}

.profile-details {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.select2-container--default .select2-selection--single {
    height: 40px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px !important;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    margin-top: 6px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    top: 70%;
}

.card.about-section {
    border-top: 3px solid #afb9d2;
}

.card {
    border-top: 3px solid #afb9d2;
}
button.btn.btn-success.btn-sm.custom-btn {
    margin-right: 8px;
}

.card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.friends-section {
    display: flex;
    align-items: center;
}

ul.setting-profile-menu li h3 {
    color: #485264;
}


.friends-img a img.profile-photo-lg {
    border-radius: 50%;
}

/* responsive */
/* home page section */

@media(max-width:1024px) {
    .search-bar {
    width: 20% !important;
}
.visitor-info small {
    color: #777;
    font-size: 12px;
    display: block;
    margin-top: -15px;
}

small.text-muted {
    font-size: 8px !important;
    right: 3px;
    top: 14px;
}
svg.bi.bi-person-plus {
    width: 26px;
}

.container.slider-container {
    width: 545px !important;
}
button#callRequestBtn {
    font-size: 9px;
}
button#sendSmsBtn {
    font-size: 9px;
    margin-right: 5px;
}
button#shareBtn {
    font-size: 9px;
}

.card.profile-visitors-sec.card-d {
    width: 235px;
    margin-left: 29px;
}

.weather-card {
    width: 160px;
}

}

@media(max-width:920px) {
    .search-bar {
    width: 30% !important;
    margin-left: 35px;
}

.container.slider-container {
    width: 480px !important;
}
.menu-dropdown {
    display: none;
}
.menu-box .nav-item {
    min-width: 0px;
}
.weather-card .feels-like {
    font-size: 9px !important;
    opacity: 0.9;
    margin-bottom: 4px;
    margin-top: 40px !important;
    padding: 2px;
}
.weather-card .location {
    font-weight: 600;
    font-size: 13px !important;
}

}


@media(max-width:920px) {
    .weather-card {
    width: 300px;
}
.card.profile-visitors-sec.card-d {
    width: 300px;
    margin-left: 0px;
}
}

@media(max-width:768px){
    .search-bar {
    margin-left: 20px;
    margin-top:-2px;
}
.menu-box {
    width: 100%;
    float: right;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menu-box ul li {
    padding: 0px;
}

.menu-dropdown {
    display: none;
}
.search-bar {
    display: none;
}
li.nav-item--feed.profile-img-box {
    margin-left: 350px;
}

}
/* Full width sidebar for small screens */
@media (max-width: 768px) {
    .sidebar--small-icons {
        position: fixed;
        top: 60px; /* adjust based on your header height */
        left: 0;
        /* width: 25%; */
        width: 250px;
        border-right: 1px solid #ddd;
        height: 100%;
        background-color: #fff;
        z-index: 9999;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        overflow-y: auto;
        padding: 15px 0;
    }

    

    .sidebar--small-icons.active {
        transform: translateX(0);
    }

    .sidebar--small-icons ul {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .sidebar--small-icons ul li a,
    .sidebar--small-icons ul li form a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        font-size: 16px;
        color: #333;
        text-decoration: none;
    }

    .sidebar--small-icons ul li a.active {
        background-color: #f0f0f0;
        border-radius: 4px;
    }
    button#sidebarToggle {
    background-color: #374a74;
    padding: 6px 10px;
    color: #fff;
    position: absolute;
    top: 10px;
    left: 81px;
}
.fixed-sidebar-left {
    position: unset;
    
}
.home-detile-box .container-fluid {
    padding-left: 10px;
    padding-right: 10px;
}
div#sidebar-right {
    display: none;
}
}

@media(max-width:670px) {
    .search-bar {
    width: 30% !important;
    margin-left: 20px;
}
.menu-dropdown {
    display: none;
}
.header-menu.li.wallet-balance-container {
     display: none;
}

li.nav-item--feed.profile-img-box {
    margin-left: 150px;
}

}


@media(max-width:580px) {
    .menu-dropdown {
        display: none;
    }
    .search-bar {
    display: none;
}

li.nav-item--feed.profile-img-box {
    margin-left: 90px;
}
.modal-dialog {
    width: 100%;
    top: 58px;
    max-width: inherit;
    padding: 0 15px 0 15px;
}
.svc-box {
    width: 120px;
    height: 120px;
    position: relative;
}
.modal-header h4 {
    font-size: 14px;
    
}
.prof-nam-b .fa-caret-down {
    position: absolute;
    right: 16px;
    top: 13px;
}
.menu-box ul li i {
    font-size: 14px;
}
}


@media(max-width:550px) {

   li.nav-item--feed.profile-img-box {
    margin-left: 45px;
}
.modal-dialog {
    width: 100%;
    top: 58px;
    max-width: inherit;
    padding: 0 15px 0 15px;
}
.svc-box {
    width: 120px;
    height: 120px;
    position: relative;
}
.modal-header h4 {
    font-size: 14px;
}
.prof-nam-b .fa-caret-down {
    position: absolute;
    right: 16px;
    top: 13px;
}

.menu-box ul li i {
    font-size: 14px;
}
.item-work .work-btn {
    margin-top: 7px;
}
}




@media(max-width:480px) {
    .menu-dropdown {
        display: none;
    }
    li.nav-item--feed.profile-img-box {
    margin-left: -41px;
}
span.nav-item__name {
    font-size: 10px;
    text-transform: capitalize;
}
.nav-item-work .nav-item__title {
    font-size: 10px;
}
.item-work .work-btn {
    margin-top: 8px;
}
button#sidebarToggle {
    background-color: #374a74;
    padding: 1px 7px;
    color: #fff;
    position: absolute;
    top: 18px;
    left: 78px;
}
.modal-dialog {
    width: 100%;
    top: 58px;
    max-width: inherit;
    padding: 0 15px 0 15px;
}
.svc-box {
    width: 120px;
    height: 120px;
    position: relative;
}
.modal-header h4 {
    font-size: 14px;
}
.prof-nam-b .fa-caret-down {
    position: absolute;
    right: 16px;
    top: 13px;
}
.menu-box ul li i {
    font-size: 14px;
}
}



@media(max-width:390px) {
    .menu-dropdown {
        display: none;
    }
    li.nav-item--feed.profile-img-box {
    margin-left: -41px;
}
span.nav-item__name {
    font-size: 10px;
    text-transform: capitalize;
}
.nav-item-work .nav-item__title {
    font-size: 10px;
}
.item-work .work-btn {
    margin-top: 8px;
}
.sidebar--small-icons {
    width: 30%;
    
}
button#sidebarToggle {
    background-color: #374a74;
    padding: 1px 7px;
    color: #fff;
    position: absolute;
    top: 18px;
    left: 78px;
}
.modal-dialog {
    width: 100%;
    top: 58px;
    max-width: inherit;
    padding: 0 15px 0 15px;
}
.svc-box {
    width: 120px;
    height: 120px;
    position: relative;
}
.modal-header h4 {
    font-size: 14px;
}
.prof-nam-b .fa-caret-down {
    position: absolute;
    right: 16px;
    top: 13px;
}
.menu-box ul li i {
    font-size: 14px;
}
}

@media(max-width:360px) {
    li.nav-item--feed.profile-img-box {
    margin-left: -56px;
}
button#sidebarToggle {
    background-color: #374a74;
    padding: 1px 7px;
    color: #fff;
    position: absolute;
    top: 18px;
    left: 78px;
}
.modal-dialog {
    width: 100%;
    top: 58px;
    max-width: inherit;
    padding: 0 15px 0 15px;
}
.svc-box {
    width: 120px;
    height: 120px;
    position: relative;
}
.modal-header h4 {
    font-size: 14px;
}
.prof-nam-b .fa-caret-down {
    position: absolute;
    right: 16px;
    top: 13px;
}
.menu-box ul li i {
    font-size: 14px;
}
.item-work {
    float: left;
    width: 100%;
    display: none;
}
li.nav-item--feed.profile-img-box {
    margin-left: 70px;
}
}

/* Base Sidebar Styles */
.fixed-sidebar-left {
    background-color: #fff; /* or your desired background */
    transition: all 0.3s ease-in-out;
}