/*=================================================================
    Dashboard Style 
================================================================*/
/*-------------------- Dashboard Style: Dashboard-----------------*/
.dashboard{
    padding-top:70px !important;
}
.dashboard .form-control {
    background: #eceff5;
    border: 1px solid #eceff5;
}
.dashboard-bg {
    background:#ffffff;
    box-shadow:0 2px 6px rgba(0,0,0,.05);
    -webkit-box-shadow:0 2px 6px rgba(0,0,0,.05);
    padding: 0;
}
#dashboard-menu li>a {
    padding: 12px 15px;
    color: #5f6e82;
    transition: all ease 0.4s;
    border-bottom: 1px dashed #e2e9f3;
}
#dashboard-menu li>a i {
    margin-right: 10px;
}
#dashboard-menu li.active>a {
    color: #337ab7;
}
#dashboard-menu li>a:hover, #dashboard-menu li>a:focus {
    background: #ffffff;
    color: #337ab7;
}
#dashboard-menu li ul {
    background:#eef2f7;
}
#dashboard-menu li ul li a{
    padding-left:25px;
    font-size:13px;
}
.dashboard-title {
    margin: 0;
    padding: 5px 0;
    font-size: 22px;
    font-weight: 600;
}
div#profile-div {
    overflow: hidden;
    max-width: 302px;
}
label {
    font-weight: 500;
}
.arrow {
    float: right;
    line-height: 20px;
}
.fa.arrow:before {
    content: "\f104";
}
.active > a > .fa.arrow:before {
    content: "\f107";
}
@media (min-width: 768px){
.sidebar-collapse.collapse {
    display: block!important;
    height: auto!important;
    padding-bottom: 0;
    overflow: visible!important;
}
}
.navbar-nav>li.dash-link>a {
    font-weight: 600 !important;
}
.navbar-nav>li.dash-link>a img{
    margin-right:12px;
}
.navbar-heading h5 { padding-top:10px; padding-left : 10px; }
/*---------- Dashboard Style: Dashboard Profile ----------*/
.profile-wrapper {
    padding: 40px 0;
    text-align: center;
}
.profile-wrapper-thumb {
    max-width: 120px;
    margin: 0 auto;
    display: table;
    padding: 8px;
    position: relative;
    background: rgb(238, 242, 247);
    border-radius: 50%;
}
.profile-wrapper h4 {
    font-size: 17px;
    font-weight: 500;
}
span.dashboard-user-status {
    position: absolute;
    right: 0px;
    top: 50%;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.5);
}


/*----------- Dashboard Style: Recent Booking -----------*/
.ground {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
}
.ground-list {
    -ms-touch-action: auto;
    touch-action: auto;
    overflow: hidden!important;
    -ms-overflow-style: none;
}
.ground-single-list {
    -webkit-box-align: center;
    align-items: center;
}
.ground-single-list {
    padding: 16px 10px;
    border-bottom: 1px solid #eaeff5;
}
.ground>* {
    margin: 0 6px;
}
.ground-single-list a {
    position: relative;
}
.ground-avatar {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 100%;
    background-color: #f5f6f7;
    text-transform: uppercase;
    color: #677897;
}
.ground-content {
    -ms-flex: 1;
    flex: 1;
}
.btn-circle-40 {
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
}
.ground-content h6{
    margin-bottom:0;
}
.btn-bs-file input[type="file"] {
    display: inline-block;
}
label.btn-bs-file.btn {
    width: 100%;
    background: #fbfdff;
    border: 1px solid #e8eef1;
}

/*----------- Dashboard Style: Inbox -----------*/
.inbox-message ul {
    padding: 0;
    margin: 0;
}
.inbox-message ul li {
    list-style: none;
    position: relative;
    padding: 15px 20px;
    border-bottom: 1px solid #e8eef1;
}
.inbox-message ul li:hover, .inbox-message ul li:focus {
    background: #eff6f9;
}
.inbox-message .message-avatar {
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
}
.message-avatar img {
    display: inline-block;
    width: 54px;
    height: 54px;
    border-radius: 50%;
}
.inbox-message .message-body {
    margin-left: 0px;
    font-size: 15px;
    color:#62748F;
}
.message-body-heading h5 {
    font-weight: 600;
    display:inline-block;
    color:#62748F;
    margin: 0 0 7px 0;
    padding: 0;
}
.message-body h3 span {
    border-radius: 50px;
    line-height: 14px;
    font-size: 12px;
    color: #fff;
    font-style: normal;
    padding: 4px 10px;
    margin-left: 5px;
    margin-top: -5px;
    font-size: 13px;
    padding-left: 22px;
    padding-right: 22px;
    padding-top: 7px;
    padding-bottom: 7px;    
}
.message-body h3 span.pending{
    background:#e61b55; 
}
.message-body h3 span.important{
    background:#dd2027; 
}
.message-body h3 span.approved{
    background:#2196f3; 
}
.message-body-heading span {
    float: right;
    color:#62748F;
    font-size: 14px;
}
.messages-inbox .message-body p {
    margin: 0;
    padding: 0;
    line-height: 27px;
    font-size: 15px;
}

.message-body-heading i {font-size:15px;}

/*------------ Dashboard Style: Add Listing ----------*/

.fs-title {
    font-size: 15px;
    text-align:center;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.fs-subtitle {
    font-weight: normal;
    font-size: 13px;
    text-align:center;
    margin-bottom: 20px;
    margin-top: 0;
}

.custom-file {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 50px;
    margin-bottom: 0;
}
.custom-file-input {
    min-width: 14rem;
    max-width: 100%;
    height: calc(2.25rem + 2px);
    margin: 0;
    opacity: 0;
}
[role=button], a, area, button, input:not([type=range]), label, select, summary, textarea {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}
.cf-input{
    position:relative;
    height:50px;
    margin-bottom: 10px;
}
.custom-file-control {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 5;
    height: 50px;
    padding: 1.375rem 0.75rem;
    line-height: 1.5;
    color: #495057;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}
.custom-file-control:before {
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    z-index: 6;
    display: block;
    height: 50px;
    padding: 1.375rem 1.75rem;
    line-height: 1.5;
    color: #495057;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: 0 .25rem .25rem 0;
}
.custom-file-control:before {
    content: "Browse";
}
.custom-file-control:after {
    content: "Choose Logo...";
}
input[type="hidden" i], input[type="image" i], input[type="file" i] {
    -webkit-appearance: initial;
    background-color: initial;
    cursor: default;
    padding: initial;
    border: initial;
}
ul.add-amenities {
    margin: 0;
    padding: 0;
    display:table;
}
ul.add-amenities li{
    list-style:none;
    margin-bottom: 5px;
}
ul.add-amenities li {
    list-style: none;
    width: 33.3333%;
    display: inline-block;
}


@keyframes animateright {
    from {
        right: -300px;
        opacity: 0
    }
    to {
        right: 0;
        opacity: 1
    }
}

button.w3-bar-item.w3-button.w3-large {
    border: none;
    width: 100%;
    padding: 10px 10px;
    font-size: 16px;
    color: #fff;
    text-align: left;
}

ul#styleOptions {
    margin: 20px 0;
    padding: 0
}

.title-logo {
    padding: 20px 12px
}

.title-logo h4 {
    font-size: 17px;
    margin: 5px 0
}

ul#styleOptions li {
    list-style: none;
    display: inline-block;
    margin: 5px 3px;
}

a.cl-box {
    width:30px;
    height:30px;
    border-radius: 5px;
    display: block;
    margin: 0 auto;
}
.w3-sidebar .cl-red{
background:#ee1c25;
}
.w3-sidebar .cl-green{
background:#10aa08;
}
.w3-sidebar .cl-blue{
background:#0066ff;
}
.w3-sidebar .cl-default{
background:#f4511e;
}
.w3-sidebar .cl-pink{
background:#ff3a72;
}
.w3-sidebar .cl-purple{
background:#6356fd;
}
.w3-sidebar {
    /* height: 100%; */
    width: 270px;
    background-color: #fff;
    position: fixed!important;
    top: 50%;
    z-index: +2000;
    overflow: auto;
    -webkit-box-shadow: 0 2px 10px 0 #d8dde6;
    box-shadow: 0 2px 10px 0 #d8dde6;
}
.w3-bar-item .ti-close {
    float: right;
    text-align: right;
    display: table;
    background: rgba(255,255,255,.2);
    padding: 10px;
    border-radius: 50%;
    font-size: 12px;
}
.user-box {
    padding: 50px 0;
}
.profile-img {
    padding: 5px;
    border: 1px solid #e8edef;
    width: 120px;
    border-radius: 50%;
    display: table;
    margin: 0 auto;
}
.profile-img img {
    max-width: 100px;
    margin: 5px;
    border-radius: 50%;
}
.profile-text {
    text-align: center;
    color: #74839e;
}
.profile-text h4 {
    margin: 10px 0;
}
.profile-text a {
    width: 35px;
    height: 35px;
    margin: 5px;
    display: inline-block;
    line-height: 39px;
    border-radius: 50px;
}
.user-box ul.nav.nav-tabs {
    background:#ffffff;
    border: none;
    margin: 15px 0;
}
.user-box ul.nav.nav-tabs li {
    width: 33.3333%;
}
.user-box ul.nav.nav-tabs li a {
    border: none;
    border-radius: 0;
    text-align: center;
    margin-right: 0;
}

.notify {
    position: relative;
    top: -22px;
    right: -9px;
}
.notify .heartbit {
    position: absolute;
    top: -20px;
    right: -4px;
    height: 25px;
    width: 25px;
    z-index: 10;
    border: 5px solid #1cc100;
    border-radius: 70px;
    -moz-animation: heartbit 1s ease-out;
    -moz-animation-iteration-count: infinite;
    -o-animation: heartbit 1s ease-out;
    -o-animation-iteration-count: infinite;
    -webkit-animation: heartbit 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.notify .point {
    width: 6px;
    height: 6px;
    border-radius: 30px;
    background-color:#1cc100;
    position: absolute;
    right: 6px;
    top: -10px;
}
input[type="file"] {
    display : none;
}
@-webkit-keyframes heartbit {
    0% {
        -webkit-transform: scale(0);
        opacity: 0
    }
    25% {
        -webkit-transform: scale(.1);
        opacity: .1
    }
    50% {
        -webkit-transform: scale(.5);
        opacity: .3
    }
    75% {
        -webkit-transform: scale(.8);
        opacity: .5
    }
    to {
        -webkit-transform: scale(1);
        opacity: 0
    }
}

@media only screen  and (max-width : 768px) {
    .message-body-heading span, .approved, .pending,.message-body h3 span {
        float:none;
        margin-top:20px;
        margin-left:0px;
        clear:both;
    }

}

@media only screen  and (max-width : 500px) {
    .message-body-heading span, .approved, .pending,.message-body h3 span {
        /*float:left;*/
    }
    .message-body .btn {
        margin-top : 5px;
    }
}