@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700;800&display=swap');
:root{
     --primary-color: #e1115f;
     --secondary-color: #DD133B;
     --gold-color: #FFD700;
     --text-color: #555555;
     --bg-color: #EFF8F8;
     --white-color: #ffffff;
     --error-color: #e74c3c;
     --error-icon-color: #c0392b;
     --success-color: #2ecc71;
     --success-icon-color: #27ae60;
     --overlay-color: #e1115d4d;
     --margin: 25px;
     --margin-sm: 10px;
     --margin-zero: 0px;
     --padding: 2.5%;
}
*{
     margin: 0px;
     padding: 0px;
     box-sizing: border-box;
     font-family: 'Open Sans', sans-serif;
     list-style: none;
}
button[title]:hover::after {
     content: attr(title);
     position: absolute;
     top: -100%;
     left: 0;
}
::-webkit-scrollbar {
     width: 1em;
}
::-webkit-scrollbar-track {
     background: var(--seondary-color);
     box-shadow: inset 0 0 6px var(--primary-color);
} 
::-webkit-scrollbar-thumb {
     background-color: var(--text-color);
}
.container{
     width: 100%;
     max-width: 100%;
     display: table;
     height: auto;
     box-sizing: border-box;
}
.overlay{
     width: 100%;
     height: inherit;
     background: var(--overlay-color);
}
.no-data{
     width: 100%;
     height: auto;
     margin: 40px auto;
     padding: 0px 1.5%;
}
.no-data h3{
     color: var(--primary-color);
}
.slick-dots{
     bottom: -30px;
}
.slick-dots li button:before {
     font-size: 12px;
}
.slick-dots li.slick-active button:before {
    color: var(--primary-color);
    font-size: 14px;
}
.button-holder{
     width: 100%;
     padding: 10px 1.25%;
}
.button{
     width: auto;
     padding: 10px;
     border-radius: 5px;
     border: none;
     text-transform: uppercase;
     font-weight: 800;
     cursor: pointer;
}
.primary{
     background: var(--secondary-color);
     color: var(--white-color);
}
.white{
     background: var(--white-color);
     color: var(--primary-color);
}
body{
     font-size: 12px;
     line-height: 22px;
     font-weight: 400;
     color: var(--text-color); 
}
h1{ font-size: 30px; line-height: 30px; font-weight: 800; color: var(--primary-color); }
h2{ font-size: 26px; line-height: 26px; font-weight: 800; color: var(--primary-color); }
h3, h4, h5, h6{ font-size: 22px; line-height: 22px; font-weight: 700; }
h4{ font-size: 20px; line-height: 20px; }
h5{ font-size: 18px; line-height: 18px; }
h6{ font-size: 16px; line-height: 16px; }
label, b, strong{ font-weight: 700; }
a{ color: var(--primary-color); text-decoration: none; }
a:hover{ color: var(--secondary-color); text-decoration: none; }
button{
     width: 100%;
     height: auto;
     padding: 10px;
     border: none;
     font-weight: 700;
     text-transform: uppercase;
     color: var(--white-color);
     background: var(--primary-color);
     cursor: pointer;
}
fieldset{ border: none; }
input[type="search"]{
     width: 100%;
     height: auto;
     padding: 10px;
     margin-bottom: 10px;
     border: 2px solid var(--bg-color);
     box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.2);
     border-radius: 5px;
}
textarea{
     width: 100%;
     height: auto;
     padding: 10px;
     border: 2px solid var(--bg-color);
     box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.2);
     border-radius: 5px;
}
form.block{
     width: 100%;
     display: table;
}
form.block fieldset{
     width: 100%;
     margin: auto;
     border: none;
     padding: 0px 1.5%;
     background: none;
     margin-bottom: 20px;
     position: relative;
}
form.block img.form_image_display{
     height: 60px;
     position: absolute;
     right: 10px;
     bottom: 32px;
     border-radius: 5px;
     box-shadow: 0px 0px 5px rgba(0,0,0,0.22);
}
form.block fieldset p{
     margin-top: var(--margin-sm);
     font-weight: 700;
}
form.block fieldset label{
     text-align: left;
     display: block;
     font-size: 14px;
     color: var(--secondary-color);
}
form.block fieldset input{
     width: 100%;
     height: auto;
     padding: 10px;
     border: 2px solid var(--bg-color);
     box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.2);
     border-radius: 5px;
}
form.block fieldset select,
form.block fieldset textarea{
     width: 100%;
     height: auto;
     padding: 10px;
     border: 2px solid var(--bg-color);
     box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.2);
     border-radius: 5px;
}
form.block fieldset input[type="file"]{
     padding: 10px 10px 9px 10px;
}
form.block fieldset div.checkbox-holder{
     width: 100%;
     height: auto;
     display: table;
     padding: 10px 0px 0px 0px;
}
form.block fieldset div.checkbox-holder input[type="radio"],
form.block fieldset div.checkbox-holder input[type="checkbox"]{
     width: 15px;
     height: 15px;
     margin-right: 5px;
     margin-top: 2.5px;
     cursor: pointer;
     float: left;
}
form.block fieldset input.custom-file-input::-webkit-file-upload-button {
     visibility: hidden;
}
form.block fieldset input.custom-file-input::before {
     content: 'Select Proposal Picture';
     display: inline-block;
     background: linear-gradient(top, var(--primary-color), var(--secondary-color));
     border: 2px solid var(--primary-color);
     border-radius: 3px;
     padding: 7px 8px;
     outline: none;
     white-space: nowrap;
     user-select: none;
     -webkit-user-select: none;
     cursor: pointer;
     color: var(--primary-color);
     font-weight: 700;
}
form.block fieldset input.custom-file-input:hover::before {
     border-color: var(--primary-color);
}
form.block fieldset input.custom-file-input:active::before {
     background: -webkit-linear-gradient(top, var(--primary-color), var(--secondary-color));
     color: var(--white-color);
}
form.block fieldset div.checkbox-holder span{
     display: inline-block;
}
form.block button[type="submit"]{
     width: 100%;
     height: auto;
     padding: 10px;
     border: none;
     font-weight: 700;
     text-transform: uppercase;
     color: var(--white-color);
     background: var(--primary-color);
}
form.block button[type="submit"]:hover{
     cursor: pointer;
     background: var(--secondary-color);
}
/* form fieldset inline styles */
form.block fieldset.inline{
     max-width: 50%;
     float: left;
     padding: 0px 1.5%;
     margin-bottom: 15px !important;
}
form.block fieldset.inline.block{
     width: 100%;
     float: none;
     max-width: 100%;
}
form.block fieldset.inline img.form_image_display{
     height: 60px;
     position: absolute;
     right: 10px;
     bottom: 0px;
     border-radius: 5px;
     box-shadow: 0px 0px 5px rgba(0,0,0,0.22);
}
form.block fieldset.inline.no-bottom-margin{
     margin-bottom: 0px !important;
}
form.block fieldset.inline.button-holder{
     clear: both;
}
/*Pagination Styles*/
#pagination {
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: center;
     justify-content: center;
     align-items: center;
}
#pagination a{
     width: 20px;
     height: 20px;
     line-height: 20px;
     background: var(--primary-color);
     color: var(--white-color);
     text-align: center;
     border-radius: 2px;
     margin: 0px 5px;
}
#pagination a:hover{
     background: var(--secondary-color);
}
/* Table Styles */
#table-holder{
     overflow: hidden;
}
/* Table Action Button */
#table-holder .table_action_buttons{
     width: 100%;
     margin-bottom: 20px;
     padding-bottom: 20px;
     border-bottom: 2px solid var(--bg-color);
     display: table;
}
#table-holder .table_action_buttons a{
     background-color: var(--primary-color);
     padding: 10px;
     color:var(--white-color);
     line-height: 14px;
     font-size: 14px;
     margin: 0px;
     float: left;
}
#table_length{
     margin-bottom: 10px;
}
table{
     width: 100%;
     text-align: center;
}
table thead{
     background: var(--primary-color);
     color: var(--white-color);
}
table tbody tr{
     background: var(--white-color);
     transition: background 0.25s ease-in-out 0s;
}
table tbody tr:hover{
     background: var(--bg-color);
}
table thead tr th,
table tbody tr td{
     padding: 5px;
     border: 1px solid var(--white-color);
     text-transform: capitalize;
}
table tbody tr td.approval_data{
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: flex-start;
     justify-content: flex-start;
     align-items: flex-start;
}
table tbody tr td i{
     margin: 5px;
}
table span{
     width: 25%;
     text-align: left;
     padding-left: 5px;
     border-left: 1px solid #ccc;
     border-bottom: 1px solid #ccc;
     display: flex;
     flex-direction: column;
     flex-wrap: wrap;
     align-content: flex-start;
     justify-content: flex-start;
     align-items: flex-start;
}
table span:last-of-type{
     border-bottom: none;
}
table span.block{
     width: 100%;
     text-align: left;
     clear: both;
     float: none;
     display: block;
}
table img{
     height: 60px;
     width: auto;
}
/* Error Style */
.error{
     width: auto;
     height: auto;
     position: fixed;
     top: auto;
     right: 0px;
     bottom: 0px;
     left: 0px;
     z-index: 100;
     background: var(--error-color);
     color: var(--white-color);
     padding: 0px;
     border-radius: 5px;
     overflow: hidden;
     box-shadow: 0px 0px 5px var(--error-color);
}
.error p{
     display: flex;
     width: auto;
     padding: 0px;
     margin: 0px;
     flex-direction: row;
     flex-wrap: nowrap;
     align-content: center;
     justify-content: space-between;
     align-items: center;
}
.error p i{
     width: 60px;
     height: 60px;
     text-align: center;
     line-height: 60px;
     font-size: 24px;
     background: var(--error-icon-color);
}
.error p i#message_close{
     width: 60px;
     height: 60px;
     text-align: center;
     line-height: 60px;
     font-size: 16px;
     background: var(--error-icon-color);
     cursor: pointer;
}
.error p span{
     padding: 0px 20px;
}
/* Success Style */
.success{
     width: 100%;
     height: auto;
     position: fixed;
     top: auto;
     right: 0px;
     bottom: 0px;
     left: 0px;
     z-index: 100;
     background: var(--success-color);
     color: var(--white-color);
     padding: 0px;
     border-radius: 5px;
     overflow: hidden;
     box-shadow: 0px 0px 5px var(--success-color);
}
.success p{
     display: flex;
     width: auto;
     padding: 0px;
     margin: 0px;
     flex-direction: row;
     flex-wrap: nowrap;
     align-content: center;
     justify-content: space-between;
     align-items: center;
}
.success p i{
     width: 60px;
     height: 60px;
     text-align: center;
     line-height: 60px;
     font-size: 24px;
     background: var(--success-icon-color);
}
.success p i#message_close{
     width: 60px;
     height: 60px;
     text-align: center;
     line-height: 60px;
     font-size: 16px;
     background: var(--success-icon-color);
     cursor: pointer;
}
.success p span{
     padding: 0px 20px;
}
#showmenu{
     line-height: 40px;
     color: var(--white-color);
     display: none;
}
#showmenu i{
     margin: 0px 10px;
}
#showmenu span{
     font-weight: 700;
     text-transform: uppercase;
}
#date-show{
     line-height: 40px;
     color: var(--white-color);
}
#date-show i{
     margin: 0px 10px;
}
#date-show span{
     font-weight: 700;
     text-transform: uppercase;
}
#closemenu{
     width: 50%;
     display: none;
     margin-left: 10px;
}
#closemenu span{
     font-weight: 700;
     text-transform: uppercase;
}
#logout{
     line-height: 40px;
     color: var(--white-color);
}
#logout a{
     color: var(--white-color);
     font-weight: 700;
     text-transform: uppercase;
}
#logout a span{
     margin: 0px 10px;
}
/* Main Index Page */
#index-wrapper{
     width: 100%;
     height: 100%;
     background-image: url('../images/wedding-bg.jpg');
     background-attachment: fixed;
     background-size: cover;
     background-position: right center;
     background-repeat: no-repeat;
}
#index-wrapper .container .left{
     width: 30%;
     height: 100vh;
     float: right;
     overflow: hidden;
     background: var(--bg-color);
     padding: 5% 2.5%;
     text-align: center;
}
#index-wrapper .container .left .logo{ width: auto; }
#index-wrapper .container .left .logo img{ width: 30%; }
#index-wrapper .container .content{
     padding: 0px 5%;
     margin-top: var(--margin);
}
#index-wrapper .container .content h1 strong{
     color: var(--gold-color);
     text-transform: uppercase;
}
#index-wrapper .container .content h3{
     margin-top: var(--margin);
     font-size: 16px;
     line-height: 28px;
}
#index-wrapper .container form.block{
     margin-top: var(--margin);
}
/*Sidebar Styles*/
#sidebar{
     width: 15vw;
     height: 100%;
     top: 0;
     left: 0;
     right: auto;
     bottom: 0;
     position: relative;
     float: left;
     background-color: var(--bg-color);
     padding-bottom: 50px;
     position: fixed;
     z-index: 9999;
}
#sidebar .profile-holder,
#sidebar .main-sidebar-menu-holder{
     width: 100%;
     height: auto;
     padding: 2.5%;
     text-align: center;
     margin-bottom: var(--margin);
}
#sidebar .profile-holder .profile-circle{
     width: 120px;
     height: 120px;
     line-height: 120px;
     font-weight: 900;
     font-size: 4em;
     margin: 20px auto;
     border-radius: 100%;
     overflow: hidden;
     color: var(--bg-color);
     background: var(--primary-color);
}
#sidebar .profile-holder .profile-circle img{
     width: inherit;
     height: inherit;
     border-radius: 100%;
}
#sidebar .profile-holder h4{
     margin-bottom: 5px;
}
#sidebar .profile-holder a{
     font-size: 12px;
}
#sidebar .main-sidebar-menu-holder{
     text-align: left;
     padding: 0%;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul{
     width: 100%;
     height: inherit;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu{
     width: 100%;
     position: relative;
     border-bottom: 1px solid;
     border-bottom-color: var(--secondary-color);
     transition: background 0.25s ease-in-out 0s;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu span{
     width: 100%;
     font-weight: 700;
     text-transform: uppercase;
     color: var(--secondary-color);
     cursor: pointer;
     padding: 10px;
     display: block;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu:hover{
     background-color: var(--secondary-color);
     border-bottom: 1px solid;
     border-bottom-color: var(--secondary-color);
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu:hover span{
     color: var(--white-color);
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu.active{
     background-color: var(--secondary-color);
     border-bottom: 1px solid;
     border-bottom-color: var(--secondary-color);
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu.active span{
     color: var(--white-color);
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu .submenu{
     width: 100%;
     background: var(--error-icon-color);
     display: none;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu .submenu ul{
     width: 100%;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu .submenu ul li{
     width: 100%;
     position: relative;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu .submenu ul li a{
     color: var(--white-color);
     display: block;
     padding: 2.5% 20px;
}
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu .submenu ul li a i{ width: 20px; text-align: center; }
#sidebar .main-sidebar-menu-holder ul.main-sidebar-menu-ul li.has-submenu .submenu ul li:hover{
     background: var(--secondary-color);
}
#sidebar .copyrights{
     position: absolute;
     bottom: 0;
     text-align: center;
     width: 100%;
     line-height: 40px;
     font-size: 10px;
}
/* Action Bar Starts */
#action-bar{
     width: 85vw;
     height: 40px;
     background: var(--primary-color);
     float: right;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: center;
     justify-content: space-between;
     align-items: center;
}
/* Banner Starts */
#banner{
     width: 85vw;
     height: 150px;
     background: url('../images/banner-bg.jpg');
     background-repeat: no-repeat;
     background-size: cover;
     float: right;
     text-align: center;
}
#banner .container{
     width: 100%;
     height: inherit;
     padding: 2.5%;
}
#banner h1{
     color: var(--white-color);
     display: table-cell;
     vertical-align: middle;
     text-transform: uppercase;
}
/* Main Content Starts Here */
#main-content{
     width: 85vw;
     float: right;
}
#main-content .container{
     width: 100%;
     height: inherit;
     padding: 2.5%;
}
/*List View Styles*/
#list-view{
     width: 100%;
}
#list-view li{
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: center;
     justify-content: space-between;
     align-items: stretch;
     margin-bottom: 20px;
     padding: 15px;
     border-radius: 5px;
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.15);
     background: var(--bg-color);    
}
#list-view li textarea{
     margin-top: 10px;
}
#list-view li .user-data-holder{
     width: calc((100%)/(6));
}
#list-view li .user-data-holder .user-data{
     width: 100%;
}
#list-view li .user-data-holder .user-data strong{
     color: var(--primary-color);
     display: block;
}
#list-view li .user-data-holder .user-data span{
     display: block;
     text-transform: capitalize;
}
#list-view li .user-data-holder .user-data span a{
     margin-right: 10px;
}
#list-view li .user-data-holder .user-data span img{
     height: 100px;
}
/* Loader Style Starts */
#main-content .container .loader{
     width: 100%;
     text-align: center;
}
#main-content .container .loader i{
     font-size: 20px;
     margin-left: 10px;
}
/* Proposals Style Starts */
.filters{
     width: 100%;
     height: auto;
     padding: 0px 1.5%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: center;
     justify-content: flex-start;
     align-items: center;
     margin-bottom: 20px;
}
.filters a{
     background: var(--primary-color);
     margin-right: 10px;
     color: var(--white-color);
     padding: 10px;
     font-weight: 700;
     text-transform: uppercase;
}
#main-content .container #proposals_holder{
     width: 100%;
}
#main-content .container #proposals_holder #proposal_content_holder{
     width: 100%;
}
#proposal{
     width: 97.5%;
     height: auto;
     padding: 20px;
     margin: 1.25%;
     border-radius: 10px;
     background: var(--bg-color);
     box-shadow: 0px 0px 5px rgb(0 0 0 / 20%);
     overflow: hidden;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: flex-start;
     justify-content: space-between;
     align-items: flex-start;
}
#proposal .left{
     width: 20%;
     /*float: left;*/
     height: auto;
     margin-bottom: 10px;
     overflow: hidden;
}
#proposal .left h6{
     color: var(--secondary-color);
     margin-bottom: 10px;
}
#proposal .left img{
     width: 100%;
}
#proposal .left .proposal_user_details{
     width: 100%;
     height: auto;
     margin-bottom: 10px;
}
#proposal .left .proposal_user_details p{
     width: 100%;
     font-weight: 700;
}
#proposal .left .proposal_user_details i{
     width: 20px;
     text-align: left;
}
#proposal .left #proposals_action_buttons{
     width: 100%;
     height: auto;
     margin-bottom: 5px;
     overflow: hidden;
}
#proposal .left #proposals_action_buttons button{
     position: inherit;
     width: 40px;
     height: 40px;
     line-height: 40px;
     padding: 0px;
     text-align: center;
}
#proposal .left #proposals_action_buttons button a{
     display: block;
     color: var(--white-color);
}
#proposal .right{
     width: 80%;
     padding: 0px 1.25%;
     /*float: right;*/
}
#proposal .right span{
     /*width: calc((100%)/(2));*/
     width: 100%;
     float: left;
     text-align: left;
     padding: 2px 5px;
     margin-bottom: 5px;
     text-transform: capitalize;
     border-bottom: 2px solid var(--primary-color) !important;
     color: var(--text-color);
}
#proposal .right span:nth-child(1n){
     border-left: 1px solid var(--text-color);
}
#proposal .right span strong{
     width: 50%;
     float: left;
}
#proposal .right span.block{
     width: 100%;
     border-bottom: none;
}
#proposal .right span.block strong{
     display: block;
     float: none;
}
#proposal .right textarea#profile_data_copy_target{
     border: none;
     display: block;
     clear: both;
}
/*Recommended Profiles*/
#recommended_profiles{
     width: 100%;
     padding: 0px 1.5%;
}
/*Proposal Carousel*/
.proposal_carousel{
     width: 100%;
     max-width: 80vw;
}
.proposal_carousel .carousel_holder{
     width: 100%;
     max-width: 100%;
}
.proposal_carousel .carousel_holder .proposal_holder #proposal{
     margin: 0px;
     width: 100%;
}
.proposal_carousel .carousel_holder .proposal_holder #proposal .left .proposal_user_details{
     margin-top: 10px;
}
.proposal_carousel .carousel_holder .proposal_holder #proposal .right{
    width: 80%;
    padding: 0px 1.25%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
    align-items: flex-start;
}
#main-content .container #proposals_holder #pagination-holder{
     width: 100%;
     text-align: center;
     border-radius: 10px;
     padding: 10px;
     margin-top: 30px;
}
#main-content .container #proposals_holder #pagination-holder #pagination{
     list-style: none;
     width: 100%;
}
#main-content .container #proposals_holder #pagination-holder #pagination li{
     display: inline-block;
     margin: 0px 5px;
}
#main-content .container #proposals_holder #pagination-holder #pagination li a{
     display: block;
     font-size: 16px;
     text-align: center;
     width: 30px;
     height: 30px;
     line-height: 30px;
     border-radius: 5px;
     background-color: var(--primary-color);
     color: var(--white-color);
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
     font-weight: 700;
}
#main-content .container #proposals_holder #pagination-holder #pagination li a:hover{
     background-color: var(--bg-color);
     color: var(--text-color);
}
/* Affidavit Style Starts */
#affidavit{
     width: 100%;
     height: 100vh;
     max-height: 100vh;
     overflow: hidden;
     overflow-y: auto;
     padding: 15%;
     position: fixed;
     z-index: 9999;
     background: var(--primary-color);
     color: var(--white-color);
}
#affidavit h4{
     width: 100%;
     margin-bottom: 20px;
}
#affidavit p{
     font-size: 16px;
     line-height: 28px;
}
#affidavit button{
     background: var(--white-color);
     margin-top: var(--margin);
}
/* Dashboard Styles */
#main-content .container .dashboard_widgets_holder{
     width: 100%;
     overflow: hidden;
     display: table;
}
#main-content .container .dashboard_widgets_holder .widget{
     width: 30%;
     padding: 2.5%;
     margin: 1.5%;
     float: left;
     position: relative;
     background-color: var(--primary-color);
     color: var(--white-color);
     border-radius: 10px;
}
#main-content .container .dashboard_widgets_holder .widget h3{
     font-size: 4em;
     margin-top: 10px;
     margin-bottom: 15px;
}
#main-content .container .dashboard_widgets_holder .widget p{
     font-size: 14px;
     font-weight: 700;
}
#main-content .container .dashboard_widgets_holder .widget i{
     position: absolute;
     top: 15px;
     right: 15px;
     font-size: 7em;
     filter: opacity(0.25);
}
#main-content .container .dashboard_widgets_holder .widget .button-holder{
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: space-between;
     align-items: center;
     align-content: center;
}
#main-content .container .dashboard_widgets_holder .widget .button-holder a{
     width: 46%;
     margin: 0px 1% 10px 1%;
     display: block;
}
/* Dashboard Title */
#main-content .container .dashboard_title{
     width: 100%;
     padding: 20px 1.5%;
}
#main-content .container .dashboard_title h4{
     text-transform: uppercase;
     padding-bottom: 20px;
     border-bottom: 3px solid var(--bg-color);
}
/*Search Page Style Starts*/
#main-content .container .search_holder{
     width: 100%;
     padding: 0px 1.5%;
     display: table;
}
#main-content .container .search_sidebar{
     width: 20%;
     min-height: 100vh;
     float: left;
     border-radius: 5px;
     background: var(--bg-color);
}
#main-content .container .search_sidebar .search_filters{
     width: 100%;
     padding: var(--margin-sm) var(--margin);
}
#main-content .container .search_sidebar .search_filters .ui-slider-horizontal .ui-slider-range{
     background: var(--primary-color);
}
#main-content .container .search_sidebar .search_filters .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{
     background: var(--primary-color);
}
#main-content .container .search_sidebar .search_filters h4{
     color: var(--primary-color);
     font-size: 14px;
     text-transform: uppercase;
     font-weight: 700;
     margin-top: var(--margin-sm);
     margin-bottom: var(--margin-sm);
     padding-bottom: var(--margin-sm);
     border-bottom: 2px solid var(--white-color);
}
#main-content .container .search_sidebar .search_filters input[type="number"]{
     width: 50%;
     height: auto;
     padding: 10px;
     border: 2px solid var(--bg-color);
     box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.2);
     border-radius: 5px;
     float: left;
}
#main-content .container .search_sidebar .search_filters .checkbox-holder{
     width: 100%;
     height: auto;
     padding: 5px;
     border-radius: 5px;
     max-height: 100px;
     overflow: hidden;
     overflow-y: auto;
}
#main-content .container .search_sidebar .search_filters h5{
     font-size: 14px;
     line-height: 28px;
     color: var(--primary-color);
}
#main-content .container .search_sidebar .search_filters .checkbox-holder label{
     width: 100%;
     display: block;
     font-size: 12px;
}
#main-content .container .search_sidebar .search_filters .checkbox-holder label span{
     margin-left: 5px;
     text-transform: capitalize;
}
#main-content .container .search_content{
     width: 78%;
     float: right;
}
/*Gallery Styles*/
#main-content .container #gallery_preview{
     width: 100%;
     padding: 20px 1.5%;
}
#main-content .container #gallery_preview .gallery-group{
     width: 100%;
}
#main-content .container #gallery_preview .gallery-group .gallery-title{
     width: 100%;
     border-bottom: 2px solid #eee;
     padding-bottom: 20px;
     margin-bottom: 20px;
     color: var(--primary-color);
     text-transform: uppercase;
}
#main-content .container #gallery_preview .gallery_image_holder {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
}
#main-content .container #gallery_preview .image{
     width: 19%;
     float: left;
     position: relative;
     overflow: hidden;
     border-radius: 10px;
     margin: 0px 0.5% 20px 0.5%;
     cursor: pointer;
}
#main-content .container #gallery_preview .image img{
     height: 200px;
     margin: auto;
}
#main-content .container #gallery_preview .image h5{
     color: var(--white-color);
     background: var(--primary-color);
     font-size: 14px;
     margin-top: var(--margin-sm);
     padding: var(--margin-sm);
}
#main-content .container #gallery_preview .image h5 small{
     display: block;
     font-size: 12px;
}
#main-content .container #gallery_preview .image a.button-primary{
     position: absolute;
     top: auto;
     left: auto;
     bottom: 0px;
     right: 0px;
     z-index: 100;
     padding: 8px 10px;
     color: var(--white-color);
     background: var(--secondary-color);
}
/*Stories Styles*/
#stories{
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: flex-start;
     align-items: stretch
     padding: 20px 1.5%;
}
#stories .story{
     width: 30%;
     padding: 2%;
     margin: 1.5%;
     overflow: hidden;
     border-radius: 5px;
     box-shadow: 0px 0px 5px rgb(0 0 0 / 22%);
}
#stories .story .story_col_holder{
     width: 100%;
     display: flex;
     flex-wrap: nowrap;
     align-content: center;
     justify-content: space-between;
     align-items: stretch;
     flex-direction: row;
     border-bottom: 2px solid var(--primary-color);
     margin-bottom: var(--margin);
}
#stories .story .story_col_holder .story_col{
     width: 50%;
     display: flex;
     flex-direction: column;
     flex-wrap: wrap;
     align-content: stretch;
     justify-content: space-between;
     align-items: stretch;
     padding-right: 10px;
}
#stories .story .story_col_holder .story_col:last-of-type{
     padding-right: 0px;
     padding-left: 10px;
}
#stories .story .story_col_holder .story_col .story_image{
     width: 100%;
}
#stories .story .story_col_holder .story_col .story_image img{
     width: 100%;
}
#stories .story .story_col_holder .story_col .story_content{
     width: 100%;
}
#stories .story .story_col_holder .story_col .story_content h6{
     color: var(--text-color);
     font-size: 12px;
     margin-bottom: 10px;
}
#stories .story .story_col_holder .story_col .story_content h6 strong{
     color: var(--primary-color);
     display: block;
}
#stories .story .story_content{
     width: 100%;
}
#stories .story .story_content h6{
     color: var(--text-color);
     font-size: 14px;
     margin-bottom: 10px;
}
#stories .story .story_content h6 strong{
     color: var(--primary-color);
}
#stories .story .story_content p{
     margin-bottom: 10px;
}
#stories .story .story_content a{
     background: var(--primary-color);
     color: var(--white-color);
     font-weight: 600;
     text-transform: uppercase;
     padding: var(--margin-sm);
     display: inline-block;
     border-radius: 5px;
}
/*Add city Page Styles*/
.country_wise_city_list{
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: flex-start;
     justify-content: space-between;
     align-items: stretch;
     padding: 0% 1.5%;
}
.country_wise_city_list .city_list {
     width: calc((96%)/(4));
     padding: 1%;
     margin-right: 1%;
     margin-bottom: 30px;
     background: var(--bg-color);
     height: 400px;
     max-height: 400px;
     overflow: hidden;
     overflow-y: auto;
}
.country_wise_city_list .city_list h4{
     font-size: 1em;
     color: var(--secondary-color);
     border-bottom: 1px solid var(--secondary-color);
     margin-bottom: 10px;
     padding-bottom: 10px;
     text-transform: uppercase;
}
.country_wise_city_list .city_list .list-holder {
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: flex-start;
     justify-content: space-between;
     align-items: flex-start;
}
/*Complain Box*/
#complain_holder {
    width: 100%;
    height: auto;
    padding: 0px 1.5%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
}
#complain_holder .complain{
     width: calc((96%)/(2));
     margin-bottom: 20px;
     margin-right: 1%;
     margin-left: 1%;
     padding: 20px;
     background: var(--bg-color);
}
#complain_holder .complain ul{
     width: 100%;
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: flex-start;
     align-items: flex-start;
}
#complain_holder .complain ul li{
     width: calc((100%)/(2));
}
#complain_holder .complain ul li strong{
     display: block;
     margin-bottom: 0px;
     color: var(--primary-color);
}
#complain_holder .complain ul li a{
     background: var(--primary-color);
     color: var(--white-color);
     padding: 10px;
     border-radius: 5px;
     display: inline-block;
}
/*Guidelines*/
#guidelines {
    width: 100%;
    padding: 0px 1.5%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: flex-start;
}
#guidelines .video{
     width: calc((96%)/(2));
     margin: 10px 1%;
}
#guidelines .video iframe{
     width: 100%;
     height: 350px;
}
#guidelines .video h5{
     background: var(--primary-color);
     color: var(--white-color);
     padding: 5px 10px;
}
/* Responsive Starts */
@media only screen and (max-width: 1024px){
     #showmenu{
          display: block;
     }
     #date-show{
          display: none;
     }
     #index-wrapper{
         background: var(--white-color);
     }
     #main-content .container .dashboard_widgets_holder .widget i{
          font-size: 5em;
     }
     .container .left .logo img {
         width: 120px;
     }
     #index-wrapper .container .left {
         width: 100%;
         height: 100vh;
         float: none;
         overflow: hidden;
         background: var(--bg-color);
         padding: 5% 2.5%;
         text-align: center;
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
         align-content: stretch;
         justify-content: space-evenly;
         align-items: stretch;
     }
     .copyrights{
          width: 100%;
     }
     /*Sidebar*/
     #sidebar{
          width: 100%;
          height: auto;
          z-index: 9999;
          left: -100%;
     }
     #sidebar .main-sidebar-menu-holder{
          max-height: 50vh;
          overflow: hidden;
          overflow-x: hidden;
          overflow-y: auto;
     }
     /*Action Bar*/
     #action-bar{
          width: 100%;
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          align-content: center;
          justify-content: space-between;
          align-items: center;
     }
     /*Banner*/
     #banner{
          width: 100%;
     }
     /*Main Content*/
     #main-content{
          width: 100%;
     }
     #main-content .container .dashboard_widgets_holder .widget{
          width: 100%;
     }
     form.block fieldset.inline{
          width: 100%;
          max-width: 100%;
     }
     /*List View Styles*/
     #list-view li .user-data-holder{
          width: calc((100%)/(2));
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          flex-wrap: wrap;
          align-content: center;
          align-items: center;
     }
     #list-view li .user-data-holder .user-data{
          width: 50%;
     }
     /*Add city Page Styles*/
     .country_wise_city_list .city_list {
         width: calc((97%)/(3));
         padding: 3%;
         margin-right: 1%;
     }
     /*Proposals*/
     #proposal .left {
          width: 100%;
          float: none;
          margin-bottom: 20px;
     }
     #proposal .right {
         width: 100%;
         padding: 0px 1.25%;
         float: none;
     }
     #proposal .right span:nth-child(1n) {
         border-left: none;
     }
     #proposal .right span {
         width: 100%;
         float: none;
         display: flex;
         flex-direction: row;
         flex-wrap: wrap;
         align-content: center;
         justify-content: flex-start;
         align-items: center;
     }
     /*Search Style*/
     #main-content .container .search_sidebar {
         width: 100%;
         height: auto;
         float: none;
     }
     #main-content .container .search_content {
         width: 100%;
         float: none;
         margin-top: 30px;
     }
     #table-holder {
         width: 95vw;
         overflow: hidden;
     }
     table tr td span {
         width: 100%;
         float: none;
         text-align: left;
         padding-left: 5px;
          border-left: none; 
         border-bottom: 2px solid #ccc;
         display: flex;
         flex-direction: row;
         flex-wrap: wrap;
         align-content: stretch;
         justify-content: space-between;
         align-items: center;
     }
     #main-content .container.gallery{
          display: block;
     }
     #main-content .container #gallery_preview .image {
         width: 48%;
         float: left;
         position: relative;
         overflow: hidden;
         border-radius: 10px;
         margin: 0px 1% 20px 1%;
         cursor: pointer;
     }
     #stories .story{
          width: 100%;
     }
     #main-content .container .search_sidebar .search_filters .checkbox-holder label {
         width: 50%;
         display: inline-block;
         font-size: 12px;
         float: left;
         overflow-wrap: break-word;
     }
}
@media only screen and (max-width: 767px){
     /*List View Styles*/
     #list-view li .user-data-holder{
          width: calc((100%)/(1));
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          flex-wrap: wrap;
          align-content: center;
          align-items: center;
     }
     #list-view li .user-data-holder .user-data{
          width: 50%;
     }
     /*Add city Page Styles*/
     .country_wise_city_list .city_list {
         width: calc((100%)/(1));
         padding: 5% 10%;
         margin-right: 0px;
     }
     /*Complain Box*/
     #complain_holder .complain{
          width: calc((100%)/(1));
          margin-bottom: 20px;
          margin-right: 0%;
          margin-left: 0%;
          padding: 20px;
     }
     /*Guidelines*/
     #guidelines .video{
          width: calc((100%)/(1));
          margin: 10px 0%;
     }
     #guidelines .video iframe{
          width: 100%;
          height: calc((100vh)/(4));
     }
}


/*asad//*/

.info-inner-wrap {
    margin-top: 30px;
    background-color: #EFF8F8;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.75);
-webkit-box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.75);
cursor:pointer;
}
.info-namebox {
 
    padding: 10px 0px;
    border-top: 1px dashed #e1115f;
    margin-top: 5px;
}
.info-inner-wrap h6 {
    color: #e1115f;
    font-weight: 600;
}

.info-namebox .fas {
    margin-right: 5px;
}

.space {
    padding: 10px;
}

.filter{
    background-color:#eff8f8;
    box-shadow: 0px 0px 5px rgb(0 0 0 / 20%);
    border-radius: 2px;
}


input.btn.reset {
    background-color: #E1115F;
    color: #fff;
}

.sear {
    background-color: #ed6f9e;
    color: #fff;
}
.list{
    padding:0px 0px 0px 0px !important;
    margin-top: 10px;
}
.bootstrap-select  button[title]:hover::after {
    content: attr(title);
    position: absolute;
    top: -100%;
    left: 0;
	display:none;
}

p.detail-info {
    /*min-height: 100px !important;*/
    max-height: 100px !important;
    overflow: hidden !important;
}


/*.info-inner-wrap img {*/
/*    max-height: 273px;*/
/*    overflow: hidden;*/
/*}*/

.space2 {
    padding: 5px;
}

.model-left{
    width: 100% !important;
    /* float: left; */
    height: auto !important;
    margin-bottom: 10px !important;
    overflow: hidden !important;
}

.model-right{
    width: 100% !important;
    padding: 0px 1.25% !important;
   
}

.m-btn{
    width: 49% !important;
}

.m-close {
    /* width: 50%; */
    display: inline-block !important;
    width: 10% !important;
    padding: 2px !important;
    
}
span.p-country {
    width: 100% !important;
}

.item.active img{
    width:100% !important;
}
.item img{
    width:100% !important;
}

.item.active{
    width:100% !important;
    
}

.actives a {
    background-color: #E1115F !important;
    color: #fff!important;
}


.myhide{
    display:none !important;
}

.myblock{
    display:block !important;
}

/*.info-inner-wrap img {*/
/*height: 220px !important;*/
/*    overflow: hidden !important;*/
/*    min-height: 220px !important;*/
    
/*}*/


.samisize {
height: 250px !important;
    overflow: hidden !important;
    /*min-height: 220px !important;*/
    
}

.info-namebox > :first-child{
    min-height:40px !important;
    height:40px !important;
    overflow:hidden !important;
}
button.btn.btn-info.my-toggle {
    display: inline;
    width: auto;
    background-color: #e1115f;
}
.bootstrap-select.btn-group .dropdown-toggle .filter-option {
        line-height: 25px;
    height: -webkit-fill-available;
    max-height: 22px;
}
.rejected{
    background-color: #f6eff8; pointer-events: none; position:relative;
}
.rejected>div{
opacity: 0.7;-webkit-filter: blur(2px); -moz-filter: blur(2px); -o-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px); 
}
.rejected:after{
position:absolute; top:0; left:0; width:100%; min-height:100%; content:""; background-image:url(../images/rejected.png); background-repeat:no-repeat; background-size:contain; background-position:center; z-index:1;
}
.pending{
    background-color: #c2f587; position:relative;
}
.pending>div{
opacity: 0.7; 

}
.pending:after{
position:absolute; top:0; left:0; width:100%; min-height:100%; content:""; background-image:url(../images/pending.png); background-repeat:no-repeat; background-size:contain; background-position:center; z-index:1;
}

/*match*/
.heart-space-dk{
    margin-top:100% !important;
}

.int-col h3 {
    margin: 6px;
}
.row.int-shadow {
    /* padding: 10px; */
    margin: 0px !important;
    background-color: aliceblue;
    padding: 20px;
}

.imgtime::before{
content: "";
    background-color: #000000;
    color: red;
    font-weight: bold;
    width: 100px;
    height: 10px;
    top: 12px;
    left: 0;
    z-index:0;
    position: absolute;
    border-radius: 20px;
}

.imgtime::after{
content: "";
    background-color: #000000;
    color: red;
    font-weight: bold;
    width: 100px;
    height: 10px;
    top: 12px;
    right: 0;
    z-index: 0;
    position: absolute;
    border-radius: 20px;
}

#action-bar {
 padding-left:10px;   
}
.pink{
        background-color: #e1115f;
        color:#ffffff;
}
.bg-int{
background-color: aliceblue;
    padding: 20px;
    margin-left: 10px;
    margin:0px !important;
}

/*btn*/
.mylabel-g {
    width: 100%;
    background-color: #5cb85c;
    color: #fff;
}
.mylabel-g:hover {
    color: #fff !important;
}

.mylabel-r{
     width: 100%;
    background-color: #E1115F;
    color: #fff;
}

.mylabel-r:hover{
    color: #fff !important;
}

.mylabel-b{
      width: 100%;
    background-color: #337ab7;
    color: #fff; 
}
.mylabel-b:hover{
    color: #fff !important;
}


/*btn end///*/

/**
 * ----------------------------------------
 * animation shadow-drop-center
 * ----------------------------------------
 */
 .pink , .btn-primary , .btn-success {
	-webkit-animation: shadow-drop-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: shadow-drop-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
 
 
 
@-webkit-keyframes shadow-drop-center {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
            box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
  }
}
@keyframes shadow-drop-center {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
            box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.35);
  }
}



/*786 chat*/
.widget-area {
background-color: #fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0 0 16px rgba(0, 0, 0, 0.05);
-moz-box-shadow: 0 0 16px rgba(0, 0, 0, 0.05);
-ms-box-shadow: 0 0 16px rgba(0, 0, 0, 0.05);
-o-box-shadow: 0 0 16px rgba(0, 0, 0, 0.05);
box-shadow: 0 0 16px rgba(0, 0, 0, 0.05);
float: left;
margin-top: 30px;
padding: 25px 30px;
position: relative;
width: 100%;
}
.status-upload {
background: none repeat scroll 0 0 #f5f5f5;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
float: left;
width: 100%;
}
.status-upload form {
float: left;
width: 100%;
padding-bottom: 8px;
}
.status-upload form textarea {
background: none repeat scroll 0 0 #fff;
border: medium none;
-webkit-border-radius: 4px 4px 0 0;
-moz-border-radius: 4px 4px 0 0;
-ms-border-radius: 4px 4px 0 0;
-o-border-radius: 4px 4px 0 0;
border-radius: 4px 4px 0 0;
color: #777777;
float: left;
font-family: Lato;
font-size: 14px;
height: 142px;
letter-spacing: 0.3px;
padding: 20px;
width: 100%;
resize:vertical;
outline:none;
border: 1px solid #F2F2F2;
}

.status-upload ul {
float: left;
list-style: none outside none;
margin: 0;
padding: 0 0 0 15px;
width: auto;
}
.status-upload ul > li {
float: left;
}
.status-upload ul > li > a {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
color: #777777;
float: left;
font-size: 14px;
height: 30px;
line-height: 30px;
margin: 10px 0 10px 10px;
text-align: center;
-webkit-transition: all 0.4s ease 0s;
-moz-transition: all 0.4s ease 0s;
-ms-transition: all 0.4s ease 0s;
-o-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
width: 30px;
cursor: pointer;
}
.status-upload ul > li > a:hover {
background: none repeat scroll 0 0 #606060;
color: #fff;
}
.status-upload form button {
border: medium none;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
color: #fff;
float: right;
font-family: Lato;
font-size: 14px;
letter-spacing: 0.3px;
/*margin-right: 9px;*/
margin-top: 9px;
padding: 6px 15px;
}
.dropdown > a > span.green:before {
border-left-color: #2dcb73;
}
.status-upload form button > i {
margin-right: 7px;
}


/*chat img//*/

.msg-img img {
    height: 120px;
    width: 120px;
    border-radius:50%;
}

.left-msg {
    padding: 10px;
    background: antiquewhite;
    margin-left: 20px;
    margin-right: 20px;
}

.col-12.right-msg {
    margin-left: 20px !important;
    margin-right: 20px !important;
        padding: 10px;
}

/*.tr2 {*/
/*    background-color: #f9f2f1 !important;*/
/*}*/



/*notify start//*/

/*#action-bar {*/
/*   background-color:#000 !important;*/
/*}*/
  

/*notify end//*/

.my2 {
    position: absolute !important;
    bottom: 0px !important;
    z-index: 9999 !important;
    opacity: 1 !important;
}

/*box//*/


/*box///*/