@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600&display=swap');


@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope/Manrope-ExtraBold.woff2') format('woff2'),
        url('../fonts/Manrope/Manrope-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope/Manrope-Light.woff2') format('woff2'),
        url('../fonts/Manrope/Manrope-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope/Manrope-SemiBold.woff2') format('woff2'),
        url('../fonts/Manrope/Manrope-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope/Manrope-Medium.woff2') format('woff2'),
        url('../fonts/Manrope/Manrope-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope/Manrope-Bold.woff2') format('woff2'),
        url('../fonts/Manrope/Manrope-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope/Manrope-Regular.woff2') format('woff2'),
        url('../fonts/Manrope/Manrope-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Monument Extended';
    src: url('../fonts/MonumentExtended/MonumentExtended-Ultrabold.woff2') format('woff2'),
        url('../fonts/MonumentExtended/MonumentExtended-Ultrabold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Monument Extended';
    src: url('../fonts/MonumentExtended/MonumentExtended-Regular.woff2') format('woff2'),
        url('../fonts/MonumentExtended/MonumentExtended-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


* { outline: 0; }
body {
    line-height: 1em;
    color: #1a1a1a;
    background: #1a1a1a;
    font-family: 'Manrope', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    /*font-family: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
    font-style: normal;
    font-weight: 300;
    font-size: .9em;
}

input[type="submit"], button {
    -webkit-appearance: none;
}

p {
    margin: 0 0 25px 0;
    line-height: 1.6;
    letter-spacing: normal;
    font-size: 1rem;
    font-weight: 500;
}
p:last-child {
    margin: 0;
}

a, a:visited {
    text-decoration: underline;
    color: #1a1a1a;
}
a:hover, a:visited:hover {
    text-decoration: none;
    color: #cfff06;
}

a.btn, .btn, input[type="submit"], .submit, button, .remodal-confirm, .remodal-cancel, .remodal-neutral, .button {
    display: inline-block;
    padding: 0 25px;
    background: #cfff06;
    color: #1a1a1a;
    font-weight: 500;
    letter-spacing: -0.2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 0;
    border: none;
    font-size: 1.1em;
    text-align: center;
    height: 48px;
    display: inline-flex;
    line-height: 1;
    align-items: center;
    justify-content: center;
    /* text-transform: uppercase; */
    font-family: 'Work Sans';
    min-width: 110px;
    /* background-image: -webkit-linear-gradient(#2CADFB 2%, #0293ec 100%); */
    background-image: -o-linear-gradient(#2CADFB 2%, #0293ec 100%);
    /* background-image: linear-gradient(#2CADFB 2%, #0293ec 100%); */
    text-decoration: none;
    vertical-align: middle;
}
a.btn:hover, .btn:hover, input[type="submit"]:hover, .submit:hover, button:hover,
.remodal-confirm:hover, .remodal-cancel:hover, .remodal-neutral:hover, .button:hover {
    background: #e1ff1d;
    color: #1a1a1a;
}

a.btn.grey, .btn.grey, input[type="submit"].grey, .remodal-neutral {
    background: #EAEAEA;
    color: #1a1a1a;
}
a.btn.grey:hover, .btn.grey:hover, input[type="submit"].grey:hover, .remodal-neutralhover {
    background: #dfdfdf;
}
a.btn.btn-small, .btn.btn-small, input[type="submit"].btn-small {
    height: 30px;
    line-height: 30px;
    font-size: 0.9em;
}

a, input, .btn, .button {
    transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1em;
    margin-bottom: 18px;
    color: #1a1a1a;
    /*text-transform: uppercase;*/
    font-family: 'Work Sans';
    font-weight: 600;
    letter-spacing: -0.1px;
}
h1 {
    font-size: 2.7em;
}
h2 {
    font-size: 2.3em;
}
h3 {
    font-size: 1.5em;
}
h4 {
    font-size: 1.6em;
}

strong {
    font-weight: 600;
    /* color: #7b7b7b; */
}

.wrapper {
    width: 1500px;
    max-width: calc(100% - 40px);
    margin: 0 auto;
}

.custom-modal label,
form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    font-family: 'Work Sans';
    color: #1a1a1a;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.1;
    font-size: 0.9rem;
}
.custom-modal label.check,
.custom-modal label .sublabel,
form label.check,
form label .sublabel {
    display: block;
    font-size: 14px;
    color: #1a1a1a;
    margin-top: 8px;
    font-family: 'Manrope';
    font-weight: 500;
}
.custom-modal label.check,
form label.check {
    font-weight: 600;
    margin-top: 0;
}
.custom-modal label .sublabel.inline,
form label .sublabel.inline {
    display: inline-block;
}
.custom-modal input[type="text"],
.custom-modal input[type="number"],
.custom-modal input[type="password"],
.custom-modal input[type="email"],
.custom-modal input[type="tel"],
.custom-modal input[type="text"],
.custom-modal select,
.custom-modal textarea,
form input[type="text"],
form input[type="number"],
form input[type="password"],
form input[type="email"],
form input[type="tel"],
form input[type="text"],
form select,
form textarea {
    display: block;
    /*margin-top: 5px;*/
    width: 100%;
    height: 50px;
    line-height: 46px;
    padding: 0 12px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 0;
    border: 1px solid #DFDFDF;
    background-color: #fcfcfc;
}
.custom-modal textarea,
form textarea {
    height: 150px;
    line-height: 1.44em;
    padding: 12px;
}

.custom-modal input:focus,
.custom-modal textarea:focus,
.custom-modal select:focus,
form input:focus,
form textarea:focus,
form select:focus {
    border-color: #cfff06;
    box-shadow: 0 0 1px #cfff06 inset;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #cacaca;
    font-weight: 400;
}
::-moz-placeholder { /* Firefox 19+ */
    color: #cacaca;
    font-weight: 400;
}
:-ms-input-placeholder { /* IE 10+ */
    color: #cacaca;
    font-weight: 400;
}
:-moz-placeholder { /* Firefox 18- */
    color: #cacaca;
    font-weight: 400;
}

form .input-append {
    border-left: none !important;
}

form .units-row.checkbox.error,
form input.error,
form textarea.error,
.checkin-placeholder.error,
.error+.input-append {
    border: 1px solid #CD1414;
}
.append input {
    margin-top: 0 !important;
}

.slickheader nav_menu {
    display:none;
}

.noresults {
    text-align: center;
    margin: 50px 0;
    font-size: 17px;
    color: #C5C5C5 !important;
    border: none !important;
    background: none !important;
    line-height: 1em;
    letter-spacing: 0.5px;
    font-weight: 500;
}

.noresults.packages{
    margin: 30px 0;
}

.dateicon:before {
    content: "\f017";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    display: inline-block;
    color: #1a1a1a;
    margin-right: 4px;
    opacity: 0.3;
}

.slicknav_menu a.slicknav_btn {
    display: none;
}

.slicknav_btn {
    display: inline-block;
    right: inherit;
    top: 100px;
    right: 15px;
    border-radius: 0;
    /* background-image: linear-gradient(#2CADFB 2%, #0293ec 100%); */
    height: 30px;
    line-height: 1;
    margin: 0px;
    padding: 0;
    position: static;
    float: none;
    margin-left: 10px;
    /* background: #cfff06; */
    color: #1a1a1a;
}

div#slicknav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
div#slicknav-container .slicknav_btn {
    display: none;
}

.slicknav_btn .slicknav_icon-bar {
    background-color: #1a1a1a;
    display: block;
    width: 37px;
    height: 6px;
    /* -webkit-box-shadow: 0 1px 0 rgb(0 0 0 / 25%); */
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
    /* box-shadow: 0 1px 0 rgb(0 0 0 / 25%); */
}

body header + div.title > .wrapper {
    position: relative;
    display: flex;
    justify-content: space-between;
}

.title-button-wrapper {
    display: flex;
    align-items: center;
}

a.btn.btn-square.login-as {
    /*margin-right: 10px;*/
    transform: none;
    position: static;
}
a.btn.btn-square.login-as i {
    margin-right: 7px;
}
a.btn.btn-square.login-as span {
    margin-left: 5px;
}

.slicknav_btn.slicknav_open {
    top: 464px;
}

.level_client .slicknav_btn.slicknav_open {
    top: 333px;
}

.slicknav_menu {
    display: none;
    position: relative;
}

.table-container {
widows: 100%;
overflow: scroll;
}

.show-mobile {
    display: none;
}

.white-popup-block {
    background-color: #fff;
    padding: 30px;
    max-width: 480px;
    margin: 0 auto;
}
.white-popup-block form {
    margin-bottom: 0;
}

/***************************************************************/

table {
    width: 100%;
    border-collapse:separate;
    border-spacing: 0 5px;
    /*margin-bottom: 25px;*/
}
table thead th {
    color: #1a1a1a;
    padding: 5px 15px;
    text-align: left;
    font-weight: 600;
    /*text-transform: uppercase;*/
    font-size: 1rem;
    font-family: 'Work Sans';
}

table tbody tr {
    background: #fff;
    border-radius: 2px;
    overflow: hidden;
}
table tbody tr:nth-child(odd) {
    /* background: #f5fbff; */
}
table tbody tr td {
    padding: 8px 12px;
    vertical-align: middle;
    font-size: 0.9em;
    font-weight: 500;
}
table tbody tr td .fa-remove {
    color: #D0D0D0;
}

table .buttons {
    text-align: right;
}
table .buttons .btn {
    min-width: 0;
    padding: 0 15.25px;
    height: 42px;
    line-height: 42px;
}
table i.fa.fa-check {
    color: #1a1a1a;
    width: 22px;
    height: 22px;
    background: #cfff06;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.outerwrapper {
    background-color: #f5f5f5;
}

/***************************************************************/

header {
    position: relative;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.03);
    margin-bottom: 10px;
}

header .menu {
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
header .menu a.logo {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
header .menu a.logo img {
    display: block;
    height: 33px;
}

header .menu a{
    color: rgba(255, 255, 255, 0.36);
}

header .menu a.notifications {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.7em;
    margin-right: 5px;
}
header .menu a.settings {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.7em;
}
header .menu a.activity {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.7em;
    margin-left: 8px;
}


.title {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 22px 0 17px 0;
    background-color: #fff;
    margin-bottom: 0;
    /* box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.03); */
}
header+.title {
    margin-top: -10px;
}
.title.title_dashboard {
    /*display: none;*/
}

.title h1 {
    /*color: #FFF;*/
    font-size: 2.4em;
    font-weight: 600;
    margin: 0;
    /*height: 75px;*/
    /*line-height: 75px;*/
    text-transform: capitalize;
    display: inline-block;
}
.title h3 {
    display: none;
    margin: 0;
    color: #FFF;
    font-size: 1em;
    font-weight: 300;
    /*text-transform: capitalize;*/
}
.title p {
    display: inline-block;
    margin-left: 14px;
    font-size: 16px;
    color: #999;
    text-transform: initial;
    float: right;
    margin-top: 7px;
    margin-bottom: 0;
}

body.level_client .title.title_dashboard {
    /*display: none;*/
}

.userbar .profile a {
    flex-shrink: 0;
}
.userbar .profile img {
    vertical-align: middle;
    height: 45px;
    width: 45px;
    /* float: right; */
    /*margin: 13px 0 0 13px;*/
    margin-left: 5px;
    /* border-radius: 50%; */
    object-fit: cover;
}

.userbar .indicator{
    position: relative;
}
/*#clients .indicator{
    width: 99%;
    height: 20px;
    display: inline-block;
    position: absolute;
    top: 4px;
    right: 4px;
}*/

.indicator .online,
.indicator.online {
    background-color: #cfff06;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    bottom: 5px;
    z-index: 90;
}

.indicator .offline,
.indicator.offline {
    background-color: #ff0659;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    bottom: 5px;
    z-index: 90;
}

.profile {
    /*padding-left: 10px;*/
    /*background: rgba(255, 255, 255, 0.05);*/
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.profile .gravatar img {
    display: block;
    float: right;
    border-radius: 50%;
    margin: 8px 4px 8px 8px;
    height: 55px;
}
.profile .name {
    color: #FFF;
    margin-bottom: 3px;
    font-size: 1.3em;
    line-height: 1em;
    padding-right: 5px;
    text-transform: capitalize;
    font-family: 'Work Sans';
    font-weight: 600;
    letter-spacing: 0.3px;
    padding-top: 4px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.profile .package {
    color: #E5E5E5;
    line-height: 1em;
    padding-right: 5px;
    font-size: 0.9em;
    letter-spacing: 0.4px;
    font-weight: 500;
}

header .impersonating {
    position: fixed;
    top: 67px;
    left: -60px;
    width: 300px;
    text-align: center;
    font-weight: 600;
    font-size: 1.4em;
    text-transform: uppercase;
    background: #fff;
    transform: rotate(-45deg);
    line-height: 35px;
    height: 35px;
    letter-spacing: 1px;
    color: #222;
    z-index: 99999;
    box-shadow: 2px 2px 14px rgba(0, 0, 0, 0.05);
    opacity: 0.2;
    pointer-events: none;
}
header .bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: #6F81E1;
    background: -moz-linear-gradient(left, rgba(111,129,225,1) 0%, rgba(67,195,211,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#6F81E1), color-stop(100%,#cfff06));
    background: -webkit-linear-gradient(left, #6F81E1 0%,#cfff06 100%);
    background: -o-linear-gradient(left, rgba(111,129,225,1) 0%,rgba(67,195,211,1) 100%);
    background: -ms-linear-gradient(left, rgba(111,129,225,1) 0%,rgba(67,195,211,1) 100%);
    background: linear-gradient(to right, #6F81E1 0%,#cfff06 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6f81e1', endColorstr='#cfff06',GradientType=1 );
    display: none;
}
header .notifications {
    position: relative;
    display:inline-block;
}
header .notifications > a {
    font-size: 1.7em;
    color: #979797;
    padding: 0;
    margin-right: 8px;
    position: relative;
    cursor: pointer;
    color: rgba(255, 255, 255, 0.36);
    display: inline-block;
    vertical-align: middle;
}
header .notifications > a > i {
    line-height: 0.9em;
    height: 26.5px;
    -webkit-filter: blur(0);
}
header .notifications > a > span {
    position: absolute;
    display: inline-block;
    right: -10px;
    bottom: 25px;
    font-size: 0.4em;
    padding: 4px;
    background: #ff2786;
    line-height: 1em;
    border-radius: 3px;
    color: #fff;
    text-align: center;
}

header .notifications > a > span.hidden{
    display: none;
}
header .notifications .mynotifications {
    display: none;
    position: absolute;
    left: -5px;
    top: 65px;
    width: 310px;
    z-index: 99999;
}
header .notifications .mynotifications:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 10px 7px;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #7E7E7E rgba(0, 0, 0, 0);
    position: absolute;
    top: -10px;
    left: 10px;
}
header .notifications .mynotifications div a {
    line-height: 1em;
    font-size: 0.9em;
    padding: 12px;
    text-transform: none;
    display: block;
    color: #333;
    min-height: 42px;
    background: #fff;
    overflow: hidden;
    border-bottom: 1px solid #eeeeee;
}
header .notifications .mynotifications div.unread a:hover,
header .notifications .mynotifications div a:hover {
    background: #2dabfa;
    color: #fff;
}
header .notifications .mynotifications div.unread a:hover time,
header .notifications .mynotifications div a:hover time {
    color: #fff;
}
header .notifications .mynotifications div.unread a {
    background: #fff;
}
header .notifications .mynotifications div:first-child a {
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
}
header .notifications .mynotifications div:last-child a {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom: none;
}
header .notifications .mynotifications div.unread a span {
    /*background: #959595;*/
    font-weight: 500;
}
header .notifications .mynotifications div.nonotifications a {
    line-height: 40px;
    text-align: center;
    color: #C0C0C0;
    padding: 0;
}
header .notifications .mynotifications div a span {
    display: inline-block;
    vertical-align: middle;
    float: left;
    max-width: 77%;
    line-height: 1.3;
    margin-top: -2px;
}
header .notifications .mynotifications div a time {
    float: right;
    color: #ABABAB;
}

header .top {
    background-color: #1a1a1a;
    padding: 17px 0;
/* Rectangle 4: */
    /* background-image: -webkit-linear-gradient(#2CADFB 2%, #0293ec 100%); */
    background-image: -o-linear-gradient(#2CADFB 2%, #0293ec 100%);
    /* background-image: linear-gradient(#2CADFB 2%, #0293ec 100%); */
}
header nav {
    background: #262626;
}
header nav ul li {
    display: inline-block;
}
header nav ul li a,
header nav ul li a:visited {
    /*text-transform: uppercase;*/
    /*text-align: right;*/
    color: #ffffff;
    font-weight: 500;
    font-size: 1.1em;
    letter-spacing: 0.3px;
    padding: 21px 30px 21px 0;
    font-family: 'Work Sans';
    display: block;
    text-decoration: none;
}
header nav ul li.active a,
header nav ul li a:visited:hover,
header nav ul li a:hover {
    color: #cfff06;
}

.mfp-hide{
    display:none;
}

#modal-log-title{
    margin-bottom: 0px;
    font-size: 2em;
}

#modal-log-text > span{
    font-size: 14px;
}

#modal-log-text ul {
    list-style-type: none;
    margin-top: 20px;
}

table .table-icon{
    margin-right: 15px;
}

table time{
    display:none;
}

a.btn.red, .btn.red, input[type="submit"].red, .submit.red, button.red,
a.btn.delete, .btn.delete, input[type="submit"].delete, .submit.delete, button.delete,
.remodal-cancel:not(.remodal-neutral)
{
    background-color: #ff0659;
    color: #fff;
    /* background-image: linear-gradient(#ea2b44 2%, #c7394b 100%); */
}

a.btn.red:hover, .btn.red:hover, input[type="submit"].red:hover, .submit.red:hover, button.red:hover,
a.btn.delete:hover, .btn.delete:hover, input[type="submit"].delete:hover, .submit.delete:hover, button.delete:hover,
.remodal-cancel:not(.remodal-neutral):hover
{
    background-color: #f91c66;
}

a.btn, .btn, input[type="submit"], .submit, button, .button {
    cursor: pointer;
}

input.btn-flat.disabled {
    /* background-color: #1a1a1a; */
    /* color: #fff; */
    /* font-style: normal; */
    opacity: 0.5;
    color: #1a1a1a82;
}

/*header .menu > a {
    color: rgba(255, 255, 255, 0.36);
    display: inline-block;
    vertical-align: middle;
    font-size: 1.7em;
    margin-left: 8px;
}*/


.back-colour-cycle{
  -webkit-animation: back_color_change 10s infinite alternate;
  -moz-animation: back_color_change 10s infinite alternate;
  -ms-animation: back_color_change 10s infinite alternate;
  -o-animation: back_color_change 10s infinite alternate;
  animation: back_color_change 10s infinite alternate;
}

@-webkit-keyframes back_color_change {
    0% { background-color: #6F81E1; }
    50% { background-color: #cfff06; }
    100% { background-color: #6F81E1; }
}
@-moz-keyframes back_color_change {
    0% { background-color: #6F81E1; }
    50% { background-color: #cfff06; }
    100% { background-color: #6F81E1; }
}
@-ms-keyframes back_color_change {
    0% { background-color: #6F81E1; }
    50% { background-color: #cfff06; }
    100% { background-color: #6F81E1; }
}
@-o-keyframes back_color_change {
    0% { background-color: #6F81E1; }
    50% { background-color: #cfff06; }
    100% { background-color: #6F81E1; }
}
@keyframes back_color_change {
    0% { background-color: #6F81E1; }
    50% { background-color: #cfff06; }
    100% { background-color: #6F81E1; }
}

header .menu .active{
   color: #cfff06;
}

.colour-cycle{
  -webkit-animation: color_change 10s infinite alternate;
  -moz-animation: color_change 10s infinite alternate;
  -ms-animation: color_change 10s infinite alternate;
  -o-animation: color_change 10s infinite alternate;
  animation: color_change 10s infinite alternate;
}

.header-buttons {
    margin-top: -4px;
    margin-bottom: 0px;
    display:  flex;
}
.header-buttons i {
    display: none;
    color: #ffffff;
}
.header-buttons a.btn.active i {
    color: #1a1a1a;
}
#tab-personal .box .btn {
    /*display: flex;*/
    /*margin-bottom: 10px;*/
}
#tab-personal .box div+.btn {
    /*margin-top: 6px;*/
}
#tab-personal .box label {
    /* font-weight: 500; */
    /* line-height: 1.4em; */
    /* margin-bottom: 5px; */
}
#tab-personal .box span {
    text-align: right;
    line-height: 1.4em;
}
#tab-personal .box p {
    /*text-align: center;*/
    /* font-size: 1em; */
    font-weight: 400;
}

#tab-notes textarea{
    min-height: 450px;
}

#tab-profile .gradient {
    width: 100%;
    height: 20px;
    /*background-image: url('/assets/img/gradient.jpg');*/
    /*background-size: 100% 10px;*/
    /*background-repeat: repeat-y;*/
    background: #cfff06;
    margin-top: 0px;
}
#tab-profile .gradient .bar {
    height: 20px;
    background: #F7F7F7;
    float: right;
}
#tab-profile .item {
    /*margin-bottom: 30px;*/
}
#tab-profile .goals .item:first-child {
    margin-bottom: 20px;
}
.bigsymbol {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 0;
    margin-top: 6px;
}
li.bigsymbol {
    margin-bottom: 0;
}
.bigsymbol h4 {
  text-decoration: none;
  border: none;
  color: #A9A9A9;
  font-size: 1.1em;
  text-align: center;
  display: inline-block;
  margin-bottom: 0;
}

.bigsymbol i.fa {
    display: inline-block;
    text-align: center;
    margin: 0 auto;
    font-size: 1.25em;
}

#tab-profile .fa-check {
    color: #6F81E1;
}
#tab-profile .fa-remove {
    color: #ea2b44;
}


.box {
    background-color: #ffffff;
    padding: 25px;
    /* box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.03); */
    /* border-radius: 3px; */
    color: #1a1a1a;
}
.box:not(.end) {
    margin-bottom: 30px !important;
}
.box.bigbox {
    padding: 25px;
}

.box p {
    margin-bottom: 20px;
    color: #1a1a1a;
    font-size: 1em;
}
.box p:last-child {
    margin-bottom: 0;
}

/*.profile{
    display: block;
    width: 100%;
    height: 70px;
    float: right;
    max-width: 60%;
    padding-left: 10px;
    background: rgba(255, 255, 255, 0.05);
    text-align: left;
    cursor: pointer;
    position:relative;
}*/

.profile .fa-caret-down{
    color: #cfff06
}

.profile .gravatar{
    padding-right: 10px;
    height: 77px;
}

.profile:hover .gravatar{
    background-color: #242424;
}

.profile .drop-down{
    position: absolute;
    right: 0px;
    width: 100%;
    padding: 0px 0;
    top: 55px;
    z-index: 999;
    /*display: none;*/
    overflow: hidden;
    max-height: 0;
    transition: all .4s linear;
}

.profile:hover .drop-down{
    /*display: block;*/
    max-height: 1000px;
}

.profile .drop-down ul {
    list-style: none;
    margin-top: 20px;
    background-color: #000;
}

.send-checkin-reminder {
    float: right;
}

.drop-down li {
    line-height: 15px;
    color: #F7F7F7;
}

.drop-down li:hover {
    background-color: rgb(59, 66, 75);
}

.drop-down li.divider{
    line-height: 0;
    padding: 0;
    border-bottom: 1px solid rgb(59, 66, 75);
    margin: 0 5px;
}

header .notifications > a{
    font-size: 1.7em;
    color: #979797;
    padding: 0 15px;
    position: relative;
    cursor: pointer;
    color: rgba(255, 255, 255, 0.36);
    display: inline-block;
    vertical-align: middle;
    /*background-color: #000;*/
}

header .notifications:hover > a{
    /*background-color: #242424;*/
    color: rgba(255, 255, 255, 0.6);
}

/*header .notifications:hover .drop-down{
    display: block;
}*/

.mynotifications > div {
    position: relative;
    cursor: pointer;
}

.mynotifications > div i {
    position: absolute;
    left: 18px;
    font-size: 9px;
    color: #eee;
    top: 17px;
}
.mynotifications .unread i {
    color: #ff2886;
}

header .notifications > a > span {
right: 5px;
bottom: 20px;
}

header .notifications .mynotifications {
    display: none;
    position: absolute;
    left: 0;
    top: 37px;
    width: 350px;
    z-index: 99999;
    padding: 0px 0;
    background: #242424;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.12);
}

header .notifications .drop-down.mynotifications a,
.drop-down a {
    color: #666666;
    padding: 15px 20px 15px 25px;
    display:block;
}

header .notifications .drop-down.mynotifications a{
    padding-left: 40px;
}

img[src=""] {
    display: none;
}

header .notifications .mynotifications li{
    padding: 15px 10px 15px 50px;
    list-style: none;
}

header .notifications .mynotifications li.divider{
    padding: 0;
}

header .notifications .mynotifications div:first-child a,
header .notifications .mynotifications div:last-child a{
    border-radius: 0;
}

header .notifications .mynotifications:after{
    display: none;
}

header .notifications .mynotifications time{
    float: right;
    color: #ABABAB;
    font-size: 0.8em;
    font-style: italic;
}

#recent-notifications > div:not(.noresults) {
    padding: 12px 0;
    color: rgb(178, 178, 178);
    /* background-color: #efefef; */
    /* margin-bottom: 18px; */
    border-top: 1px solid #eee;
}
#recent-notifications > div:not(.noresults):first-child {
    border-top: none;
    padding-top: 0;
}
#recent-notifications > div:not(.noresults) a {
    /* color: #828282; */
    display: block;
    cursor: pointer;
    vertical-align: middle;
    text-decoration: none;
    font-weight: 500;
}
#recent-notifications > div:not(.noresults) a strong {
    color: #646464;
}
#recent-notifications > div:not(.noresults) a i{
      margin-right: 4px;
      color: #cfff06;
      display: inline-block;
      vertical-align: middle;
      margin-top: 1px;
  }
#recent-notifications > div:not(.noresults) a p {
    display: inline-block;
    margin-bottom: 0;
    max-width: calc(100% - 130px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    font-family: 'Work Sans';
    letter-spacing: -0.2px;
}

#recent-notifications > div:not(.noresults) span{
    font-size: 12px;
    /* font-style: italic; */
    float: right;
    color: #1a1a1a;
    margin-top: 4px;
    font-weight: 500;
}
/*#recent-notifications+a.btn {
    margin-top: 20px;
}*/

#unread-messages > a {
    padding: 18px 0 14px 0;
    display: block;
    /* background-color: rgb(252, 252, 252); */
    border-top: 1px solid #eee;
    /* margin-bottom: 5px; */
    text-decoration: none;
}
#unread-messages > a:first-child {
    border-top: none;
    padding-top: 0;
}
#unread-messages > a:last-child {
    padding-bottom: 0;
}

#unread-messages > a span.date {
    font-size: 12px;
    /* font-style: italic; */
    text-align: right;
    color: #1a1a1a;
    font-weight: 500;
}
#unread-messages > a span.user {
    color: #1a1a1a;
    font-weight: 500;
    margin-bottom: 2px;
    text-transform: capitalize;
    font-family: 'Work Sans';
    letter-spacing: -0.1px;
}
#unread-messages > a span.user strong {
    color: #646464;
}
#unread-messages > a p {
    margin-top: 8px;
    color: #767676;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#unread-messages > a p i {
    margin-right: 4px;
    color: #cfff06;
}

#unread-messages .btn {

}

#page_dashboard .checkins .box {
    text-decoration: none;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0;
    overflow: hidden;
    border: 7px solid #fff;
    margin-bottom: 10px !important;
}

#new-checkins li {
    /*background-color: rgb(252, 252, 252);*/
}
#new-checkins li a {
    display: block;
    margin-bottom: 0;
}
#new-checkins li .unit-75 {
    /*padding: 6px;*/
}
#new-checkins li .user {
    /* margin-top: 6px; */
    font-size: 1.1em;
    color: #1a1a1a;
    text-transform: capitalize;
    line-height: 1em;
    font-weight: 500;
    margin-bottom: 2px;
    letter-spacing: -0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: 'Work Sans';
}
#new-checkins li .date {
    margin-top: 0px;
    text-align: right;
    color: #1a1a1a;
    font-size: 12px;
    font-weight: 500;
}
#new-checkins li .weight {
    font-size: 1em;
    margin-top: 6px;
    color: #767676;
    text-transform: lowercase;
    font-weight: 500;
    /* opacity: 0.6; */
}
#new-checkins li .weight .lastweight {
    /* font-size: .9em; */
    color: #1a1a1a;
    /* display: inline-block; */
    /* margin-bottom: 0; */
    background-color: #cfff06;
    display: inline-block;
    margin-left: 6px;
    /* color: #fff; */
    font-weight: 500;
    font-size: 11px;
    border-radius: 2px;
    padding: 1px 5px;
}
#new-checkins li .image {
    /*float: left;*/
    height: 58px;
    width: 58px;
    border-radius: 0;
    overflow: hidden;
    position: relative;
    background-size: cover;
    background-position: center;
    margin-right: 15px;
    flex-shrink: 0;
}
#new-checkins li .image img {
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    visibility: hidden;
}
#new-checkins li .details {width: 100%;padding-right: 7px;}

.statistics {
    padding-bottom: 7px;
}
.statistics h3 {
    margin-bottom: 25px;
}
.statistics h3 span {
    color: #ddd;
    float: right;
}
.statistics .stats {
    font-size: 0.8em;
    margin-bottom: 25px;
}
.statistics .figure {
    color: #A9A9A9;
    float: right;
}
.statistics h4 {
    margin-bottom: 0;
}
.statistics .chart #myChart {
    width: 100%;
}

.numbers .number {
    text-align: center;
    /* border-right: 1px solid #eee; */
    position: relative;
}
.numbers .number:after {
/*    position: absolute;
    width: 1px;
    height: 100%;
    content: '';
    background-image: -webkit-linear-gradient(rgba(238,238,238,0.00) 0%, #000000 50%, rgba(216,216,216,0.00) 100%);
    background-image: -o-linear-gradient(rgba(238,238,238,0.00) 0%, #000000 50%, rgba(216,216,216,0.00) 100%);
    background-image: linear-gradient(rgba(238,238,238,0.00) 0%, #000000 50%, rgba(216,216,216,0.00) 100%);
    right: 0;
    top: -20px;
    bottom: -20px;
    height: calc(100% + 40px);
    opacity: .1;*/
}
.numbers .number:last-child {
    /*display: none;*/
    border: none;
}
.numbers .number .figure {
    font-size: 36px;
    display: block;
    line-height: 1;
    font-weight: 600;
    color: #cfff06;
    font-family: 'Work Sans';
}
.numbers .number .heading {
    display: block;
    font-weight: 500;
    line-height: 1;
    margin-top: 10px;
    color: #ffffff;
    letter-spacing: 0.5px;
    font-size: 12px;
}
.numbers .chart {
    padding: 0;
    position: relative;
    overflow: hidden;
}
.numbers .chart canvas {
    /* top: -9px; */
    /*    position: absolute;
    left: -11px;
     right: 0px;
    width: calc(100% + 14px) !important;
    bottom: -22px;*/
    padding: 2px 8px;
}
.numbers.financials .box:not(.chart) {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.numbers.financials .box:not(.chart) > div {
    width: 100%;
    height: 100%;
}

.progressbar {
    background: #dedede;
    height: 20px;
}
.progressbar .bar {
    background: #cfff06;
    height: 20px;
}
.progress p {
    /* margin-bottom: 25px; */
}
.progress .percentage {
    float: right;
    font-size: 23px;
    height: 120px;
    width: 120px;
    line-height: 120px;
    background: #f1f1f1;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
    color: #1a1a1a;
    font-weight: 400;
    letter-spacing: 1px;
    margin-left: 10px;
    margin-right: 5px;
    font-family: 'Work Sans';
}
.progress a.btn+a.btn {
    margin-left: 10px;
}

.subheader-button{
    /*margin-bottom: 10px;*/
}

.subheader-button h3{
    /*display: inline-block;*/
    /*margin: 0;*/
    /*line-height: 49px;*/
}

.subheader-button a.btn {
    float: right;
    /*height: 30px;*/
    /*line-height: 30px;*/
    display: inline-block;
    /*margin-top: 7px;*/
    display: none;
}
.subheader-button a.btn+a.btn {
    margin-right: 10px;
}


/*#clients > .row.gutters {
    margin-left: -15px;
}
#clients > .row.gutters > .col.client.col-3 {
    width: calc(25% - 15px);
    margin-left: 15px;
    margin-bottom: 15px !important;
}*/
#clients li.client {
    padding: 0;
    margin-bottom: 20px !important;
    border: 7px solid #fff;
}

#clients li.client a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    border-radius: 0;
    text-decoration: none;
}
#clients li.client .image {
    width: 70px;
    height: 72px;
    display: inline-block;
    overflow: hidden;
    position: relative;
    margin-right: 14px;
}
#clients li.client .image .img {
    display: block;
    height: 100%;
    border-radius: 0;
    background-size: cover;
    background-position: center;
}
#clients li.client .details {
    display: inline-block;
    width: calc(100% - 75px);
    padding-right: 10px;
}
#clients li.client .details h4 {
    border-bottom: 0;
    font-size: 17px;
    font-weight: 600;
    margin: 0 0 2px 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
    letter-spacing: 0px;
    line-height: 1.2;
    font-family: 'Manrope';
}
#clients li.client .details p {
    color: #767676;
    font-size: 0.9em;
    margin-bottom: 0px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-weight: 500;
}

/*#clients li.client:hover{
}

#clients li.client img{
}

#clients li.client a {
    display: block;
    margin-bottom: 0;
    padding: 0px;
    padding-top: 200px;
    background: #0000;
    position: relative;
}

#clients li.client a .container{
    background-color: #fff;
    padding: 15px;
    position: relative;
}

#clients li.client h4{
    border-bottom: 0;
    font-size: 1.5em;
    font-weight: 400;
    margin: 0 0 5px 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#clients li.client p{
    color: rgb(153, 153, 153);
    font-size: 1em;
    margin-bottom: 0px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#clients li.client .info{
    border-top: 1px solid #EFEFEF;
    border-bottom: 1px solid #EFEFEF;
}

#clients li.client .info .weight {
    padding: 5px 0;
}

#clients li.client .info span.value{
    color: #cfff06;
}

#clients li.client .info span.label{
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.5em;
    vertical-align: bottom;
    line-height: 10px;
}

#clients li.client .buttons{
    margin-top: 20px;
}

#clients li.client .buttons .btn{
    display: block;
    padding: 0;
    color: #FFF;
    font-weight: 300;
    letter-spacing: 0.9px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: none;
    font-size: 1em;
    text-align: center;
    height: 35px;
    line-height: 35px;
}

#clients li.client .buttons .btn.secondary{
    background-color: #cfff06;
}*/



#trainers .trainer {
    padding: 0;
    margin-bottom: 20px !important;
}

#trainers .trainer .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    border-radius: 0;
}
#trainers .trainer .image {
    width: 80px;
    height: 82px;
    display: inline-block;
    overflow: hidden;
    position: relative;
    margin-right: 20px;
    flex-shrink: 0;
}
#trainers .trainer .image .img {
    display: block;
    height: 100%;
    border-radius: 0;
    background-size: cover;
    background-position: center;
}
#trainers .trainer .details {
    display: inline-block;
    width: calc(100% - 75px);
    padding-right: 20px;
}
#trainers .trainer .details h4 {
    border-bottom: 0;
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 0px 0;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
    letter-spacing: -0.3px;
    line-height: 1.2;
}
#trainers .trainer .details p {
    color: #999;
    font-size: 0.9em;
    margin-bottom: 0px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-weight: 500;
}
#trainers .trainer .buttons {
    white-space: nowrap;
    padding-right: 16px;
}
#trainers .trainer .buttons .btn {
    min-width: auto;
    padding-right: 10px;
    padding-left: 10px;
}


@-webkit-keyframes color_change {
    0% { color: #6F81E1; }
    50% { color: #cfff06; }
    100% { color: #6F81E1; }
}
@-moz-keyframes color_change {
    0% { color: #6F81E1; }
    50% { color: #cfff06; }
    100% { color: #6F81E1; }
}
@-ms-keyframes color_change {
    0% { color: #6F81E1; }
    50% { color: #cfff06; }
    100% { color: #6F81E1; }
}
@-o-keyframes color_change {
    0% { color: #6F81E1; }
    50% { color: #cfff06; }
    100% { color: #6F81E1; }
}
@keyframes color_change {
    0% { color: #6F81E1; }
    50% { color: #cfff06; }
    100% { color: #6F81E1; }
}



/***************************************************************/

.subprogress {
    position: relative;
    z-index: 99;
    margin-top: -10px;
    /*padding: 5px;*/
    /*    background: #6F81E1;
    background: -moz-linear-gradient(left, rgba(111,129,225,1) 0%, rgba(67,195,211,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#6F81E1), color-stop(100%,#cfff06));
    background: -webkit-linear-gradient(left, #6F81E1 0%,#cfff06 100%);
    background: -o-linear-gradient(left, rgba(111,129,225,1) 0%,rgba(67,195,211,1) 100%);
    background: -ms-linear-gradient(left, rgba(111,129,225,1) 0%,rgba(67,195,211,1) 100%);
    background: linear-gradient(to right, #6F81E1 0%,#cfff06 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6f81e1', endColorstr='#cfff06',GradientType=1 );*/
    overflow: hidden;
    border-radius: 2px 2px 0 0;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.03);
}
.subprogress ul {
    margin: 0;
}
.subprogress .week {
    height: 30px;
    line-height: 30px;
    background: #ffffff;
    text-align: center;
    /*border-left: 1px solid #E4E4E4;*/
    font-size: .8em;
    color: #D0D0D0;
    overflow: hidden;
    padding: 0 30px;
    font-weight: 500;
}

.subprogress .week.done {
    background: #D5D5D5;
    border-left: none;
    /*text-indent: -100px;*/
    color: #1a1a1a;
    /*opacity: 0.3;*/
}

.subprogress .week.current {
    background: #cfff06;
}


/***************************************************************/

section {
    background-color: #f5f5f5;
    padding: 30px 0 40px 0;
    position: relative;
    z-index: 99;
    border-radius: 2px 2px 0 0;
}

.subprogress+section {
    margin-top: 0 !important;
    border-radius: 0 0 0 0;
}


section aside {
    /*background: #fff;*/
    /*padding: 20px;*/
}

section form > .message,
section > .wrapper > .message,
section > .message {
    padding: 17px;
    /* background: #F7F7F7; */
    /* margin-bottom: 20px; */
    /* font-size: 1.1em; */
    font-family: 'Manrope';
    letter-spacing: 0.4px;
    font-weight: 500;
}
section form > .message.success,
section > .wrapper > .message.success,
section > .message.success {
    /*color: #3FA634;*/
    background: #cfff06;
    color: #1a1a1a;
}
section form > .message.error,
section > .wrapper > .message.error,
section > .message.error {
    /* color: #CD1414; */
}
section form > .message p,
section > .wrapper > .message p,
section > .message p {
    margin-bottom: 9px;
}

#page_account p.error {
    color: #f03c69;
}


/***************************************************************/

.login.box {
    width: 500px;
    max-width: 100%;
    margin: 0px auto;
}
.login .forgot {
    margin-left: 18px;
    font-weight: 500;
}

/***************************************************************/

#reply textarea {
    margin-top: 0;
    height: 48px;
    line-height: 0.74em;
}
#reply input[type="submit"] {
    width: 100%;
    padding: 0;
    min-width: 0;
}
#file label.sendfile {
    background: #EAEAEA;
    display: block;
    width: 100%;
    margin: 5px 0 0 0;
    overflow: hidden;
    color: #9D9D9D;
    font-weight: 500;
    padding: 0;
    margin-top: -35px;
}
#file label.sendfile input {
    width: 1px;
    height: 1px;
    visibility: hidden;
    position: absolute;
    left: -1px;
}
#messages .nomessages {
    text-align: center;
    margin-bottom: 0;
    background: #fff;
}
#messages .nomessages i {
    color: #ddd;
    font-size: 3em;
    text-align: center;
    margin-top: 10px;
}
#messages .nomessages p {
    color: #c0c0c0;
    padding: 15px 20px 20px 20px;
}
#messages {
    max-height: 594px;
    overflow: auto;
    /*padding: 5px;*/
    margin-top: 10px;
    /* background: #f7f7f7; */
    border-radius: 5px;
}
#messages ul {
    list-style: none;
    margin: 0 10px;
    padding: 10px 0;
}
#messages ul li {
    position: relative;
    margin-bottom: 9px;
    margin-top: 10px;
}
#messages ul li:last-child {
    margin-bottom: 0;
}
#messages ul li .message {
    background: #cfff06;
    margin-left: 50px;
    margin-right: 50px;
    padding: 11px 14px;
    min-height: 40px;
    font-size: 14px;
    position: relative;
    font-family: 'Manrope';
    line-height: 1.45;
    font-weight: 500;
    border-radius: 0;
    color: #1a1a1a;
    word-wrap: break-word;
    margin-bottom: 4px;
}
#messages ul li .message a {
    color: #1a1a1a;
}

#messages ul li.trainer .message a {
    color: #fff;
}
#messages ul li.client .message a {
    color: #1a1a1a;
}

#messages ul li .message .point {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7.5px 10px 7.5px 0;
    border-color: transparent #cfff06 transparent transparent;
    position: absolute;
    top: 13px;
    left: -7px;
    z-index: 90;
}
#messages ul li img {
    position: absolute;
    left: 0;
    width: 40px;
    height: 40px;
    object-fit: cover;
}
#messages ul li .date {
    /* margin-top: 5px; */
    font-size: 0.7em;
    margin-left: 50px;
    color: #1a1a1a;
    /* height: 0; */
    /* overflow: hidden; */
    transition: height .5s ease;
    font-weight: 500;
}
#messages ul li .date span {
    text-decoration: none;
}
#messages ul li:hover .date {
    height: 14px;
}

#messages ul li .date a.delete-message {
    /* font-size: 16px; */
    margin-right: 12px;
    position: relative;
    top: -2px;
}
#messages ul li.trainer .date span {
    position: relative;
    top: -2px;
}

#messages ul li.trainer .message {
    background-color: #1a1a1a;
    color: #fff;
}
#messages ul li.trainer .message .point {
  border-width: 7.5px 0 7.5px 10px;
  border-color: transparent transparent transparent #1a1a1a;
  left: inherit;
  right: -7px;
}
#messages ul li.trainer img {
    left: inherit;
    right: 0;
}
#messages ul li.trainer .date {
    text-align: right;
    margin-left: 0;
    margin-right: 50px;
    position: relative;
}

#messages .trainer .image > a{
    display: inline-block;
    width: 40px;
    height: 40px;
    float: right;
    position: relative;
    /* border-radius: 50%; */
    overflow: hidden;
}

#messages .client .image > a {
    display: inline-block;
    width: 40px;
    height: 40px;
    float: left;
    position: relative;
    /* border-radius: 50%; */
    overflow: hidden;
}
#messages .client .image > a img {
    /* border-radius: 50%; */
}

#messages .indicator{
    display: inline-block;
    width: 0px;
    height: 40px;
    float: left;
    position: relative;
}

#messages .trainer .indicator{
    display: inline-block;
    width: 0px;
    height: 40px;
    float: right;
    position: relative;
    right: -40px;
}
#messages .trainer .image > a img {
    /* border-radius: 50%; */
}


#messages ul li.notification {
    text-align: center;
    background: none;
    margin-bottom: 14px;
}
#messages ul li.notification + li.notification {
    margin-top: -5px;
}
#messages ul li.notification a {
    text-decoration: none;
}
#messages ul li.notification .date {
    margin-left: 0;
    margin-right: 0;
    text-align: center;
    margin-top: 4px;
}
#messages ul li.notification .message {
    background: whitesmoke;
    padding: 7px 0;
    height: auto;
    min-height: 0;
    margin-left: auto;
    margin-right: auto;
    color: #333;
    width: 700px;
    max-width: 90%;
    margin-bottom: 0;
}

#messages ul li.file {
    text-align: center;
    background: none;
    position: relative;
    margin-bottom: 14px;
}
#messages ul li.file + li.file {
    margin-top: -5px;
}
#messages ul li.file .downloaded {
    position: absolute;
    color: #d8d8d8;
    right: 9px;
    top: 8px;
    z-index: 9;
}
#messages ul li.file .date {
    margin-left: 0;
    margin-right: 0;
    text-align: center;
    margin-top: 4px;
}
#messages ul li.file .message {
    background: whitesmoke;
    padding: 7px 0;
    height: auto;
    min-height: 0;
    margin-left: auto;
    margin-right: auto;
    color: #333;
    width: 700px;
    max-width: 90%;
    margin-bottom: 0;
}

#messages ul li.client+li.client,
#messages ul li.trainer+li.trainer {
    margin-top: 5px;
}
#messages ul li.client+li.client img,
#messages ul li.trainer+li.trainer img {
    /*display: none;*/
}

#messages ul li.client+li.client .indicator,
#messages ul li.trainer+li.trainer .indicator {
    /*display: none;*/
}

#messages ul li.client+li.client .message .point,
#messages ul li.trainer+li.trainer .message .point {
    /*display: none;*/
}

.filter-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btn.btn-text {
    background: none;
    color: #1a1a1a;
    width: auto;
    min-width: 0;
    padding: 0;
    height: auto;
    line-height: 1;
    /*margin-top: 7px;*/
}
.btn.btn-text:hover {
    background: none;
    color: #aed800;
}
.filter {
    float: right;
}
.filter label {
    margin-left: 4px;
    display: inline-block;
    position: relative;
    cursor: pointer;
    margin-bottom: 0;
}
.filter label input {
    width: 0;
    height: 0;
    position: absolute;
    top: 1px;
    left: 1px;
}
.filter label span {
    background: #eee;
    display: inline-block;
    font-weight: 600;
    padding: 7px 30px 7px 10px;
    border-radius: 3px;
    font-size: 13px;
    position: relative;
}
/*.filter label:hover span {
    background: #109bf1;
}*/
.filter label span:before {
    content: "\f00d";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    right: 10px;
    /* top: 0; */
    color: #212121;
    font-size: 13px;
    opacity: .1;
}
.filter label input:checked+span {
    color: #1a1a1a;
    background: #cfff06;
}
.filter label:hover input:checked+span {
    background: #e1ff1d;
}
.filter label input:checked+span:before {
    opacity: 1;
    content: "\f00c";
    color: #1a1a1a;
}
.tab .filter {
    text-align: right;
    /*height: 50px;*/
    /*line-height: 50px;*/
    /*margin-top: 6px;*/
}
.tab .filter input {
    margin-left: 4px;
}

.quickchat h3 {
    display: inline-block;
}
.quickchat .filter {
    margin-bottom: 6px;
}

.ui-slider-handle {
    background: #C2C2C2 !important;
    border: none !important;
    margin-top: -0.4em !important;
    margin-left: -0.4em !important;
    top: 50% !important;
    height: .8em !important;
    width: .8em !important;
    border-radius: 0 !important;
}
.ui-slider-range {
    background: #cfff06 !important;
    border-radius: 0 !important;
}
.ui-widget-content {
    border: none !important;
    background: #EEE !important;
    border-radius: 0 !important;
}

#ui-datepicker-div {
    border-radius: 0 !important;
    background: #FDFDFD !important;
}
.ui-datepicker-header {
    border-radius: 0 !important;
    border: none !important;
    background: #cfff06 !important;
}
.ui-datepicker .ui-datepicker-title {
    color: #1a1a1a;
    font-weight: 500;
    text-transform: uppercase;
    font-family: 'Work Sans';
    font-size: 0.8rem;
    letter-spacing: 0.9px;
    padding-top: 3px;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    background: none !important;
    border: none !important;
    top: 2px !important;
    opacity: .8;
    color: #1a1a1a;
}
.ui-datepicker .ui-datepicker-prev .ui-icon,
.ui-datepicker .ui-datepicker-next .ui-icon {
    font-size: 0;
    text-indent: 0;
    background: none !important;
    text-align: center;
    padding-top: 2px;
}
.ui-datepicker .ui-datepicker-prev .ui-icon:after {
    content: "<";
    color: #1a1a1a;
    font-size: 0.8rem;
    font-family: 'Work Sans';
}
.ui-datepicker .ui-datepicker-next .ui-icon:after {
    content: ">";
    color: #1a1a1a;
    font-size: 0.8rem;
    font-family: 'Work Sans';
}
.ui-datepicker-prev.ui-state-hover, .ui-datepicker-next.ui-state-hover {
    opacity: 1;
}
 .ui-datepicker-prev {
    left: 2px !important;
}
 .ui-datepicker-next {
    right: 2px !important;
}
.ui-datepicker-calendar tr {
    background: none;
}
.ui-widget-header .ui-icon {
    background-image: url('../img/ui-icons_1a1a1a_256x240.png') !important;
}
.ui-datepicker-calendar td .ui-state-default {
    background: #F4F4F4 !important;
    border: none !important;
    text-align: center;
    font-size: 0.9em;
    padding: 5px 0;
    font-weight: 500;
}
.ui-datepicker-calendar td .ui-state-default.ui-state-active {
    background: #cfff06 !important;
    color: #1a1a1a !important;
    font-weight: 600;
}

.package_ended p {
    font-size: 1.1em;
}

#trainer {
    position: relative;
    overflow: hidden;
    min-height: 150px;
}
#trainer .image {
    position: static;
}
#trainer .image .thumb {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 165px;
    height: 100%;
    overflow: hidden;
    background-size: cover;
    background-position: center;
}
#trainer .image .thumb img {
    visibility: hidden;
}
#trainer .image .profile {
    display: none;
    position: relative;
}
#trainer .image .indicator {
    top: 10px;
    right: 10px;
    width: 15px;
    height: 15px;
}
#trainer .bio h2 {
    color: #13aaff;
    margin-bottom: 10px;
}
#trainer .bio p {
    margin-bottom: 0;
}
#trainer .bio h4 {
    font-size: 1.3em;
    margin-bottom: 10px;
}
#trainer .contact.hide {
    display: none;
}
#trainer .contact a.skype,
#trainer .contact a.phone {
    display: block;
    font-size: 1.6em;
    text-align: center;
    margin-bottom: 14px;
    padding: 10px;
    color: #AEAEAE;
    background: #eee;
}
#trainer .contact a.phone {
    margin-bottom: 0;
}
#trainer .contact a.skype:hover,
#trainer .contact a.phone:hover {
    background: #cfff06;
    color: #fff;
}
#trainer .contact a.skype i,
#trainer .contact a.phone i {
    margin-right: 5px;
}
#trainer .contact a.skype.disabled,
#trainer .contact a.phone.disabled {
    color: #DDD !important;
}

#trainer .contact a.skype.disabled:hover,
#trainer .contact a.phone.disabled:hover {
    background: #eee !important;
    /*color: #AEAEAE !important;*/
}

/*#mycheckins > .box {
    opacity: 0.7;
}*/
#mycheckins > .box:hover {
    opacity: 1;
}
#mycheckins > .box.new {
    /*background: #F2F2F2;*/
    opacity: 1;
}
#mycheckins .col {
    /* padding: 30px; */
    /* padding-bottom: 22px; */
    text-align: center;
}
#mycheckins .info {
    padding-right: 0;
    font-size: 1.6em;
    line-height: 1em;
    vertical-align: top;
    text-align: left;
    position: relative;
}

#mycheckins .info .weight {
    margin-bottom: 19px;
    font-size: 25px;
    line-height: 1;
    font-weight: 500;
    color: #1a1a1a;
    font-family: 'Work Sans';
}
#mycheckins .info .weight span {
    /* color: #ffffff; */
    margin-left: 3px;
}
#mycheckins .info .weight .weightdiff {
    font-size: .7em;
    color: #ff2886;
    display: inline-block;
    /* margin-bottom: 2px; */
    background-color: #cfff06;
    display: inline-block;
    margin-left: 10px;
    color: #1a1a1a;
    font-weight: 500;
    font-size: 11px;
    border-radius: 2px;
    padding: 4px 5px;
    vertical-align: top;
}
#mycheckins .info .weight .weightdiff span {
    /* color: #ff2886; */
}
/*#mycheckins .info .weightdiff.lost,
#mycheckins .info .weightdiff.lost span {
    color: #54b216;
}
#mycheckins .info .weightdiff.gained,
#mycheckins .info .weightdiff.gained span {
    color: #bb1616;
}*/

#mycheckins .info .stats {
    margin-bottom: 20px;
}
#mycheckins .info .stats > div {
    margin-bottom: 10px;
}
#mycheckins .info h4 {
    margin-bottom: 6px;
    font-size: 0.75em;
    color: #9D9D9D;
    letter-spacing: 0.1px;
    border-bottom: 0;
    padding-bottom: 0;
    font-weight: 500;
}
#mycheckins .info .stats > div .gradient {
    width: 100%;
    height: 10px;
    background-image: url('/assets/img/gradient.jpg');
    background-size: 100% 10px;
    background-repeat: repeat-y;
    margin-bottom: 15px;
    background: #cfff06;
}
#mycheckins .info .stats > div .gradient .bar {
    height: 10px;
    background: #F7F7F7;
    float: right;
}
#mycheckins .info .date {
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    font-size: 15px;
    color: #1a1a1a;
    font-weight: 400;
}

#mycheckins .notes {
    margin-top: 20px;
    background-color: #fafafa;
    padding: 23px 23px;
    margin: 30px -23px -23px -23px;
    /* border-top: 1px solid #eee; */
    border-radius: 0 0 3px 3px;
}
#mycheckins .notes i {
    display: inline-block;
    vertical-align: top;
    margin-right: 5px;
    margin-top: 4px;
}
#mycheckins .notes p {
/*    display: inline-block;*/
    vertical-align: middle;
    /*white-space: nowrap;*/
    /*overflow: hidden;*/
    /*text-overflow: ellipsis;*/
    /*width: 195px;*/
    color: #777777;
    /* font-style: italic; */
    font-size: 14px;
    word-break: break-word;
}
#mycheckins .notes.view p {
    white-space: normal;
    margin-bottom: 30px;
    margin-top: 4px;
}

#mycheckins .pics {
    text-align: center;
    position: relative;
    overflow: hidden;
}
#mycheckins .pics .newribbon {
    display: none;
    background: #cfff06;
    color: #1a1a1a;
    text-align: center;
    padding: 7px 0 5px 0;
    text-transform: uppercase;
    font-family: 'Work Sans';
    font-weight: 600;
    letter-spacing: 0.2px;
    font-size: 1.4em;
    line-height: 1em;
    position: absolute;
    right: -120px;
    top: 33px;
    width: 340px;
    transform: rotate(45deg);
}

#mycheckins > .box.new .pics .newribbon {
    display: block;
}

#mycheckins .pics img {
    /*margin: 0 0 0 20px;*/
    border-radius: 3px;
    max-width: 100%;
}
#mycheckins .pics img[src*="placeholder"] {
    opacity: .2;
}

#client_weights {
  height: 200px;
  /*margin-bottom: 20px;*/
}
#client_weights .base {
    background: #fff;
}
#client_weights .data-point-label {
  color: #5C5C5C;
}
#client_weights .overlay+.data-point-label {
  margin-left: -63px;
}

.header-buttons{
    margin-bottom: 20px;
}

.header-buttons > a.btn {
    background: #1a1a1a;
    color: #ffffff;
    padding: 0 25px;
    height: auto;
    border-radius: 0;
    height: 46px;
    line-height: 45px;
    margin-left: 4px;
    padding: 0 4px;
    flex-grow: 1;
    /* background-image: -webkit-linear-gradient(#ededed 75%, #e7e7e7 100%); */
    /* border-radius: 5px 5px 0 0; */
}
.header-buttons > a.btn:first-child {
    margin-left: 0;
}
.header-buttons > a.btn:hover {
    color: #cfff06;
}

.header-buttons > a.active{
    color: #000;
    background: #ffffff;
}

.header-buttons > a.active:hover{
    color: #1a1a1a;
    /*background-color: #cfff06;*/
}

/***************************************************************/

#tab-details img.profile {
    margin-bottom: 25px;
    width: 100%;
    max-height: 200px;
    object-fit: contain;
    background: #eee;
}

#tab-details .subscription,
#tab-details .userinfo {
    /*background-color: #FCFCFC;*/
    /*padding: 20px;*/
}
#tab-details label {
    font-weight: 600;
    line-height: 1.4em;
    font-size: 1em;
}
#tab-details li span {
    text-align: right;
    line-height: 1.4em;
    color: #777878;
    font-weight: 400;
}
#tab-details .subscription a.btn {
    /* width: 49.4%; */
    font-size: 14px;
    padding: 0 0.6rem;
}
#tab-details .subscription a.btn.start {
    width: 100%;
}

#tab-details .userinfo .personal {
    margin-bottom: 15px;
}
#tab-details .userinfo .reminders input[type="submit"] {
    /*margin-bottom: 0;*/
    float: left;
}

/***************************************************************/

#settings #bio {
    height: 147px;
}
#settings .specialities {
    padding: 0;
}
#settings .specialities > div {
    margin-bottom: 10px;
}
#settings .specialities > div label {
    margin-top: 0.4rem;
    font-weight: 500;
}


/******************************** BILLING *******************************/

.nextpayment {
    text-align: center;
    padding: 30px 0;
    margin-bottom: 20px;
    background: #F7F7F7;
    font-size: 1.4em;
}
#tab-billing .dataTables_wrapper .dataTables_filter {
    top: -70px;
}
#tab-billing .dataTables_wrapper .dataTables_filter input {
    padding-left: 32px;
}

.cards {

}

/***************************************************************/

.checkin-placeholder {
    cursor: pointer;
    text-align: center;
}
.checkin-placeholder input {
    visibility: hidden;
    height: 1px;
    overflow: hidden;
    position: absolute;
    z-index: 0;
    width: 1px;
}
.checkin-placeholder span {
    position: absolute;
    /* display: block; */
    text-align: center;
    top: 36%;
    /* width: 100%; */
    /* font-family: 'Work Sans'; */
    /* text-transform: uppercase; */
    /* font-weight: 500; */
    /* letter-spacing: 0.1px; */
    font-size: 0.86rem;
    /* padding: 0 14px; */
    /* line-height: 1.2em; */
    /* opacity: .6; */
    display: flex;
    width: 100%;
}
.checkin-placeholder:hover span {
    /* color: #cfff04; */
}

.checkin-placeholder img {
    max-height: 250px;
}
.checkin-placeholder img:not(.hasimage) {
    opacity: .2;
}
.checkin-placeholder img.hasimage+span {
    display: none;
}

.checkin-form .custom-checkin-questions label {
    white-space: initial;
    line-height: 1.3;
}
.checkin-form .custom-checkin-questions label span.required {
    vertical-align: initial;
}
/*.checkin-form .custom-checkin-questions .checkbox-wrapper {
    font-weight: 400;
}*/
.checkin-form .openmeasurements {
    text-align: center;
    padding-top: 27px;
}
.checkin-form .openmeasurements a.btn {
    font-size: 0.9em;
    display: inline-block;
    padding: 0 13px;
}
.checkin-form .measurements {
    display: none;
    padding-bottom: 0px;
    border-bottom: 1px dashed #eee;
    margin-bottom: 20px;
}
.checkin-form .uploadNotes p {
    font-size: 0.9em;
    margin-bottom: 3px;
    color: #555;
}
.checkin-form .uploadNotes p strong {
    font-weight: 600;
}

/***************************************************************/

#calendar.jsCalendar {
}
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title {
    text-align: center;
    padding-bottom: 20px;
}
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title .jsCalendar-title-name {
    text-align: center;
    display: inline-block;
    font-family: 'Work Sans';
    font-size: 27px;
    vertical-align: middle;
    color: #1a1a1a;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.2px;
}
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title .jsCalendar-title-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title .jsCalendar-nav-right,
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title .jsCalendar-nav-left {
    padding: 0;
    width: 40px;
    min-width: 40px;
    height: 40px;
    line-height: 40px;
}
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title .jsCalendar-title-right {
    float: none;
    display: inline-block;
}
#calendar.jsCalendar thead tr.jsCalendar-title-row th.jsCalendar-title .jsCalendar-title-left {
    float: none;
    display: inline-block;
    vertical-align: middle;
}
#calendar.jsCalendar thead tr.jsCalendar-week-days th {
    font-family: 'Work Sans';
    padding: 10px 0px 20px 0px;
    font-weight: 600;
}
#calendar.jsCalendar tbody td {
    text-align: left;
    padding: 33px 10px 10px 0px;
    position: relative;
    vertical-align: top;
    width: calc(100% / 7);
}
#calendar.jsCalendar tbody tr:nth-child(even) td:nth-child(even) {
    /* background-color: #f5fbff; */
}
#calendar.jsCalendar tbody tr:nth-child(odd) td:nth-child(odd) {
    /* background-color: #f5fbff; */
}
#calendar.jsCalendar tbody td span.dayNum {
    font-weight: 500;
    font-family: 'Work Sans';
    font-size: 12px;
    letter-spacing: 0.5px;
    opacity: 1;
    display: block;
    margin-bottom: 4px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 10;
    background: #f5f5f5;
    border-radius: 0;
    width: 34px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* color: #fff; */
}
#calendar.jsCalendar tbody td.jsCalendar-current {/* background-color: #fff3f8 !important; */}
#calendar.jsCalendar tbody td.jsCalendar-current span.dayNum {
    color: #1a1a1a;
    background: #cfff06;
    opacity: 1;
}
#calendar.jsCalendar tbody td.jsCalendar-next span.dayNum,
#calendar.jsCalendar tbody td.jsCalendar-previous span.dayNum {
    /* color: #969696; */
    opacity: 0.3;
}
#calendar.jsCalendar tbody td .events {
    min-height: 70px;
    position: relative;
}
#calendar.jsCalendar tbody td .events .event {
    display: block;
    padding: 6px 9px;
    border-radius: 0;
    color: #1a1a1a;
    background-color: #cfff06;
    font-size: 12px;
    font-weight: 600;
    font-family: 'Work Sans';
    line-height: 1.3;
    letter-spacing: 0.1px;
    position: relative;
    z-index: 10;
    text-decoration: none;
}
#calendar.jsCalendar tbody td .events .event:hover {
    background-color: #e1ff1d;
}
#calendar.jsCalendar tbody td .events .event[data-type="reminder"]  {
    background-color: #cfff06;
    color: #1a1a1a;
}
#calendar.jsCalendar tbody td.jsCalendar-next .events,
#calendar.jsCalendar tbody td.jsCalendar-previous .events {
    opacity: .3;
}
#calendar.jsCalendar tbody td .events .event+.event {
    margin-top: 4px;
}

#page_calendar .buttons {
    text-align: right;
    margin-bottom: 20px;
}

#view-event .inner {
    position: relative;
}
#view-event .inner .date {
    position: absolute;
    top: 0;
    right: 0;
    font-weight: 500;
}
#view-event .inner h2 {
    width: calc(100% - 107px);
    margin-bottom: 18px;
    font-size: 28px;
}
#view-event .inner .client {
    display: inline-block;
    padding: 10px;
    background-color: #eee;
    color: #1a1a1a;
    margin-bottom: 21px;
    border-radius: 0;
    font-weight: 500;
    text-decoration: none;
}
#view-event .inner .client:before {
    content: "\f007";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    display: inline-block;
    margin-right: 6px;
    color: #1a1a1a;
}
#view-event .inner .buttons {
    margin-bottom: 0;
    margin-top: 10px;
}

/***************************************************************/

footer {
    background-color: #1a1a1a;
    /* background-image: -webkit-linear-gradient(#252525 2%, #121212 98%); */
    background-image: -o-linear-gradient(#252525 2%, #121212 98%);
    /* background-image: linear-gradient(#252525 2%, #121212 98%); */
    padding: 40px 30px;
    text-align: center;
}

footer .copyright {
    /*text-align: right;*/
    color: #7f7f7f63;
    /*text-transform: uppercase;*/
    /* font-family: 'Manrope'; */
    letter-spacing: 0.6px;
    padding-top: 20px;
    font-weight: 500;
    font-size: 0.8em;
}
footer .logo {

}
footer .logo img {
    height: 22px;
    opacity: 0.3;
    /* filter: grayscale(1); */
}
/***************************************************************/


.colour {
  width: 50px;
  height: 50px;
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 99;
  border-radius: 0 2px 2px 0;
}

.converted_price{
    display:none;
    width: 100%;
    text-align: center;
    border: 1px solid rgb(223, 223, 223);
    border-top: 0;
    border-radius: 1px;
    padding: 10px;
    position: absolute;
    background: white;
    z-index: 2;
}

#mycheckins.box table,
#mycheckins.box tr,
#mycheckins.box td{
    vertical-align: top;
}

#mycheckins > .box {
}
#mycheckins .col.info{
    font-size: 1em;
    color: #A9A9A9;
    overflow: hidden;
}

#mycheckins .col.info h4{
    color: #1a1a1a;
    font-size: 13px;
    margin-bottom: 6px;
}
#mycheckins .col.info .measurements {
/*    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    bottom: 0;
    background: rgba(251, 251, 251, 0.95);
    padding: 20px;
    font-size: 1.1em;
    z-index: 10;
    -moz-transition: all linear .2s;
    -webkit-transition: all linear .2s;
    transition: all linear .2s;*/
    text-align: left;
}
#mycheckins .col.info:hover .measurements {
    /*display: block;*/
    /*left: 0;*/
}
#mycheckins .col.info .measurements h3 {
    margin-bottom: 25px;
    font-size: 1.1em;
}
#mycheckins .col.info .measurements strong {
    display: block;
    color: #1a1a1a;
    margin-bottom: 7px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: left;
    line-height: 1.3;
    font-family: 'Work Sans';
    letter-spacing: 0.3px;
}
#mycheckins .col.info .measurements span {
    display: block;
    text-align: left;
    margin-bottom: 17px;
    font-weight: 400;
    color: #777878;
}
#mycheckins .col.info .measurements span .measurediff {
    background-color: #cfff06;
    display: inline-block;
    margin-left: 10px;
    color: #1a1a1a;
    font-weight: 600;
    font-size: 11px;
    border-radius: 2px;
    padding: 1px 5px;
}

.package_ended p.exchange {
    font-size: 14px;
    margin-top: 25px;
    text-align: center;
}

.package_ended .price{
    font-size: 1.3em;
    margin-bottom: 0px;
    text-align: right;
    float: right;
    margin-top: 17px;
}

.package_ended .price > div{
    /* width: 50%; */
    font-weight: 400;
    FONT-SIZE: 30px;
}

#trainers-list .trainer img{
    /* max-width: 40%; */
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

#trainers-list .trainer h4,
#trainers-list .trainer p{
    margin-bottom: 0;
    line-height: 31px;
}

label.checkin-placeholder + span.progress {
    width: 100%;
    background-color: #eeeeee;
    height: 12px;
    display: block;
    margin-bottom: 20px;
    visibility: hidden;
    position: relative;
}

label.checkin-placeholder + span.progress div.percent {
    width: 0%;
    background-color: #cfff06;
    height: 12px;
}

.pics.blocks-3 > li{
    margin-bottom: 0px;
}

.stripe-connect-banner{
    background-color: #cfff06;
    margin-bottom: 30px;
    padding: 20px;
}

.stripe-connect-banner h2 {
    /* color: #1a1a1a; */
    font-size: 1.5em;
    /* font-weight: 400; */
    margin-bottom: 10px;
}

.stripe-connect-banner p {
    color: #1a1a1a;
    margin-bottom: 1px;
    font-size: 0.9rem;
}

.stripe-connect-banner .unit-20 {
    margin-bottom: 0;
}

.stripe-connect-banner .btn.btn-big{
    color: #cfff06;
    font-size: 1.4rem;
    line-height: 1.2;
    padding: 16px;
    height: 100%;
    width: 100%;
    border-radius: 0;
    /* text-transform: uppercase; */
    font-weight: 500;
    letter-spacing: 1px;
    background: #1a1a1a;
}

.box p.stats-warning{
    /* margin: 0px -25px -7px -25px; */
    padding: 10px;
    text-align: center;
    background-color: #b70000;
    color: #fff;
    font-size: 0.86em;
    letter-spacing: 0.5px;
}

a.btn.small {
    height: 30px;
    line-height: 1;
    /*border-radius: 2px;*/
    padding: 0 14px;
    font-size: 0.85em;
    min-width: initial;
}

a.btn.medium {
    height: 34px;
    line-height: 34px;
    /*border-radius: 2px;*/
    padding: 0 15px;
    font-size: 0.9em;
    min-width: initial;
}

.modal-container{
    display: none;
}

#mailToBulk .modal {
    padding: 1.5rem;
    max-width: 800px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    box-shadow: none;
}

#mailToBulk .modal p.title {
    box-shadow: none;
    text-align: left !important;
    font-size: 24px;
    padding: 0;
    display: block;
    margin-bottom: 20px;
    font-weight: 500;
    font-family: 'Work Sans';
    line-height: 1;
}

#mailToBulk .modal label {
    /* line-height: 40px; */
}

#mailToBulk .overlay {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #cfff06eb;
    z-index: 999;
}

body header + div.title h1 + a.btn.header-nav-btn {
    float: right;
    line-height: 30px;
    height: 30px;
    padding: 0 10px;
}

.send-checkin-reminder.sent,
.send-checkin-reminder.sent:hover{
    background-color: #f5f5f5;
    color: #222;
    cursor: not-allowed;
}

.previous_subscriptions p {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 5px;
}

.previous_subscriptions .button:visited {
    /* color: white; */
}

.row.with-margin {
    margin-bottom: 1.6em;
}

#tab-resources #add {
    background-color: #f9f9f9;
    padding: 20px;
}

#tab-resources #add p.section-title {
    font-weight: 500;
    font-size: 16px;
}

#tab-resources #add input, #tab-resources #add select {
    margin-top: 8px;
}

#tab-resources #add input[type="file"] {
    margin-top: 20px;
}

#tab-resources #add label {
    /* color: #7c8092; */
}

#tab-resources #add .close {
    color: #7a7e90;
}

.box.resources {
    padding: 20px;
}

.box.resources ul {
    margin-bottom: 0;
}

.box.resources ul li {
    margin-bottom: 0;
    padding-left: 30px;
    position: relative;
    margin-top: 10px;
}

.box.resources ul li:last-child {
    /* margin-bottom: 0; */
}

.box.resources ul li:nth-child(1), .box.resources ul li:nth-child(2) {
    margin-top: 0;
}

.box.resources ul li:hover {
    background-color: #f9f9f9;
}

.box.resources ul li:hover > a:hover {
    /*color: #cfff06;*/
}

.box.resources ul li a {
    padding: 10px;
    display: block;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: 0.2px;
}
.box.resources ul li a:hover {
    color: #1a1a1a;
}
.box.resources ul li a:before {
    content: '';
}

.box.resources ul li:before {
    font-family: 'FontAwesome';
    position: absolute;
    top: 11px;
    left: 14px;
    /* transform: translate(-15px, -50%); */
    opacity: 0.25;
}

.box.resources ul li.link:before {
    content: '\f0c1';
}

.box.resources ul li.download:before {
    content: '\f019';
}

.checkin-upload label input {
    display: none;
}

.checkin-upload label {
    background-color: #f9f9f9;
    padding: 20px;
    cursor: pointer;
}

.checkin-upload label:hover {
    background-color: #f5f5f5;
}

p.package-name {
    font-size: 16px;
    text-align: right;
    margin-top: 10px;
    font-weight: 500;
}

a.button.small.change-price {
    border-radius: 30px;
    padding: 1px 6px;
    min-height: auto;
    margin: -2px 10px 0 0;
    background: #cfff06;
    color: #1a1a1a;
    font-weight: 500;
}

#change-price section label span {
    margin-bottom: 5px;
    display: block;
    text-align: left;
    border-top: 1px solid #dfdfdf;
    padding-top: 25px;
}

li.back-to-your-account {
    float: right;
}

li.back-to-your-account a {
    padding-right: 0;
    /* background-color: #e1ff1d; */
}

body header + div.title > .wrapper {
    position: relative;
}

.btn.btn-square {
    border-radius: 3px;
    height: 40px;
    line-height: 40px;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translate(0, -50%);
    padding: 0 20px;
}

.units-row.questionnaire-step {
    background-color: #f9f9f9;
    padding: 20px 10px 10px 10px;
    margin-bottom: 40px;
    position: relative;
    /*border: 1px solid #e5e6e5;*/
}

.units-row.questionnaire-step tr {
    background: transparent;
}
.units-row.questionnaire-step td {
    /* background-color: #f9f9f9; */
    padding: 5px 15px 0;
}

.units-row.questionnaire-step p.section-title {
    font-size: 1.3rem;
    font-weight: 500;
    margin-left: 15px;
    margin-bottom: 10px;
    display: inline-block;
    color: #1a1a1a;
    font-family: 'Work Sans';
    letter-spacing: -0.5px;
    line-height: 1.1;
}
.units-row.questionnaire-step p.section-title[contenteditable="true"] {
    border-bottom: 1px dotted #1a1a1a;
}

.questionnaire-step th {
    /* font-weight: 600; */
    /* padding-bottom: 0; */
    /* color: #1a1a1a; */
}

.questionnaire-step a.button {
    font-size: 13px;
    min-height: inherit;
    padding: 0 10px 3px 10px;
    border-radius: 0;
    margin-right: 5px;
    margin-top: 5px;
    background: #cfff06;
    color: #1a1a1a;
    width: 33px;
    min-width: 0;
    line-height: 1;
    height: 33px;
}

.questionnaire-step tr td:last-child {
    padding-right:0;
    white-space: nowrap;
}

.questionnaire-step a.button.red {
    background-color: #ff0659;
    color: #fff;
}

a.edit-section-title {
    font-weight: 500;
    margin-left: 9px;
    font-size: 15px;
    text-decoration: none;
    border-bottom: 2px dotted #1a1a1a40;
}

li.placeholder {
    position: absolute;
    left: 0px;
    right: 0px;
    list-style-type: none;
    height:10px;
}

li.placeholder:before {
    content: '\f0da';
    font-family: 'FontAwesome';
}

td.drag-handle {
    width: 50px;
}

.custom-modal {
    background-color: white;
    max-width: 700px;
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 2rem;
    /* border-radius: 6px; */
    /* box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.4); */
}

#add-question {
    background-color: #1a1a1af5;
}

.custom-modal p.section-title {
    /* font-size: 25px; */
    /* font-weight: normal; */
    /* color: #cfff06; */
}

.custom-modal button {
     /* font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; */
     /* font-size: 15px; */
     /* color: #fff; */
     /* background-color: #1c86f2; */
     /* border-radius: 3px; */
     /* min-height: 40px; */
     /* padding: 8px 20px; */
     /* font-weight: 500; */
     /* text-decoration: none; */
     /* cursor: pointer; */
     /* display: inline-block; */
     /* line-height: 20px; */
     /* border: 1px solid #0000; */
     /* vertical-align: middle; */
     /* -webkit-appearance: none; */
}

.custom-modal label > span {
    display: block;
    margin-bottom: 10px;
    font-weight: 400;
}

.custom-modal .error {
    display: inline-block;
    margin-right: 10px;
}

.placeholder-section {
    font-size: 1.2em;
    font-weight: 400;
    margin-left: 15px;
    margin-bottom: 10px;
    background-color: #f9f9f9;
    display: block;
    padding: 20px;
    margin: 0;
    text-align: center;
    cursor: pointer;
    margin-bottom: 40px;
}

#tab-questionnaire a.delete-step {
    font-size: 1.1rem;
    font-weight: 400;
    margin-top: 0px;
    margin-right: 3px;
    display: inline-block;
    color: #1a1a1a;
    cursor:
    pointer;
}

.placeholder-section i.fa.fa-plus {
    background-color: #cfff06;
    color: #1a1a1a;
    padding: 5px;
    border-radius: 50%;
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 21px;
    margin-right: 10px;
}

.wizard-steps.flex li {
    flex: 1;
}

.wizard-steps.flex {
    display: flex;
    flex: 1 auto;
}

.custom-questions p.question{
    margin-bottom: 6px;
    font-weight: 500;
    font-family: 'Work Sans';
    letter-spacing: 0px;
}
.custom-questions p.answer {
    /*opacity: 0.6;*/
    color: #777878;
    font-weight: 400;
}
.custom-questions p.answer.noanswer {
    opacity: .4;
}

.section-title + .section-description {
    margin-left: 15px;
    margin-bottom: 10px !important;
}

.units-row.questionnaire-step:not(.noedit) td:nth-child(2) {
    width: 62%;
}

.custom-questionnaire .field label {
    line-height: 1.5;
}

.custom-questionnaire .field fieldset {
    border: 0;
    padding: 0;
    margin: 0;
}

.custom-questionnaire .field fieldset label{
    display: inline-block;
    margin-right: 10px;
    color: #828282;
}

#questionnaire .custom {
    margin-bottom: 10px !important;
}

@media only screen and (max-width: 767px) {



}
#tab-questions h4 {
    /* color: #cfff06; */
    /* font-size: 25px; */
}

.units-row.upload-warnings > div + div > p {
    background-color: #f02c51;
    color: white;
    padding: 8px;
    font-size: .8rem;
    line-height: 1.2;
    text-align: center;
    font-weight: 500;
    border-radius: 0;
}

@media only screen and (max-width: 1085px) {
    .units-row.upload-warnings > div {
        margin: 0;
        width: 100%;
    }

    .units-row.upload-warnings > div + div {
        margin-top: 20px;
    }
}

li.move-box {
    background-color: #cfff0621;
    border: 1px solid #cfff06;
    padding: 16px;
    border-radius: 3px;
    text-align: center;
}
li.move-box.move-box-recur {
    text-align: left;
}

.move-box h2 {
    font-size: 18px;
    margin-bottom: 5px;
}

.move-box p {
    font-size: 12px;
}

li.move-box select {
    font-size: 12px;
}

.move-box a[disabled] {
    background-color: #d4d4d4;
    color: #7e8185 !important;
}


 #search-container {
            display: flex;
            justify-content: flex-end;
            position: relative;
        }

        #search {
            height: 48px;
            border-radius: 0;
            background: rgba(255, 255, 255, 0.1);
            border-color: #0b9efa;
            border: 0;
            color: white;
            opacity: .8;
            transition: all .2s linear;
            appearance: none;
        }

        #search:hover,
        #search:focus,
        #search:active {
            opacity: 1;
            background: rgba(255, 255, 255, 0.3);
        }

        #search::placeholder {
            color: white;
            opacity: 1;
        }

        #search-results {
            position: absolute;
            width: 100%;
            top: 50px;
            z-index: 1000;
            border: none;
            /* border-bottom: 0; */
            /* box-shadow: 1px -1px 18px 5px rgb(0 0 0 / 11%); */
            opacity: 0;
            /* border-radius: 5px; */
        }

        #search-results li {
            display: inline-block;
            width: 100%;
            margin: 0 !important;
            border-bottom: 1px solid whitesmoke;
            padding: 0px;
        }

        #search-results li a {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 12px;
            text-decoration: none;
        }

        #search-results li a .image {
            width: 50px;
            height: 50px;
            display: inline-block;
            overflow: hidden;
            position: relative;
            margin-right: 10px;
        }

        #search-results li a .details {
            display: inline-block;
            width: calc(100% - 65px);
        }

        #search-results li a .details h4 {
            border-bottom: 0;
            font-size: 17px;
            font-weight: 500;
            letter-spacing: 0.1px;
            margin: 0 0 2px 0px;
            padding: 0;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            text-transform: capitalize;
            line-height: 1.1;
        }

        #search-results li a .details p {
            color: #767676;
            font-size: 0.9em;
            margin-bottom: 0px;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
            font-weight: 500;
        }

        #search-results li a .image .img {
            display: block;
            height: 100%;
            /* border-radius: 50%; */
            background-size: cover;
            background-position: center;
        }

        @keyframes sp-anime {
            100% {
                transform: rotate(360deg);
            }
        }

        #search-container .cv-spinner {
            height: 100%;
            display: none;
            justify-content: center;
            align-items: center;
        }

        #search-container .cv-spinner.show {
            display: flex;
            position: absolute;
            right: 20px;
        }

        #search-container .spinner {
            width: 20px;
            height: 20px;
            border: 2px #cfff06 solid;
            border-top: 2px #ffffff solid;
            border-radius: 50%;
            animation: sp-anime 0.8s infinite linear;
        }

header .top .wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
header .top .wrapper .menu-decoy {
    display: none;
}
header .top .wrapper .searchbar {
    margin-left: 20px;
    margin-right: 20px;
    flex-grow: 1;
    flex-shrink: 0;
}
header .top .wrapper .logo {
    height: 24px;
    display: inline-block;
    flex-shrink: 0;
}
header .top .wrapper .logo img {
    max-height: 100%;
}
header .top .wrapper .userbar {
    flex-shrink: 0;
}



    .numbers.box {
        padding: 0;
        /* background: #1a1a1a; */
    }

    .numbers.box .number {
        padding: 22px 0 23px;
        border-bottom: 3px solid transparent;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-decoration: none;
        background: #1a1a1a;
        position: relative;
        /*margin: 0 0.5px;*/
    }
    .numbers.box .number:after {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        bottom: -3px;
        width: 0.5px;
        background: #f5f5f5;
    }

    .numbers.box .number small {
        position: absolute;
        top: 1rem;
        right: 1rem;
        font-weight: 700;
        color: #fff;
        font-size: 1.2rem;
        opacity: 0.4;
    }

    .numbers.box .number:last-child:after {
        display: none;
    }

    .numbers.box .number.selected {
        border-bottom-color: #cfff06;
        background: #262626;
    }

    .numbers.box .number:not(.selected):hover {
        border-bottom-color: #cfff06;
    }

    .financials .numbers.box {
        background-color: #fff;
    }
    .financials .numbers .number {
        background: #ffffff;
    }
    .financials .numbers .number .figure,
    .financials .numbers .number .heading {
        color: #1a1a1a;
    }

    .btn.small-square {
        margin-bottom: 30px;
        border-radius: 0;
        height: 40px;
        line-height: 40px;
        padding: 0 20px;
    }

    .empty {
        font-size: 29px;
        text-align: center;
        padding: 40px 0 0;
        color: #adadad;
    }

    #pagination {
        list-style-type: none;
        text-align: center;
    }

    #pagination > li {
        display: inline-block;
        margin: 0px 2px;
    }

    .page-link {
        display: inline-block;
        background: #cfff06;
        color: #1a1a1a;
        font-weight: 400;
        letter-spacing: 0.9px;
        border: none;
        text-align: center;
        font-family: 'Work Sans';
        /* background-image: linear-gradient(#2CADFB 2%, #0293ec 100%); */
        margin-bottom: 30px;
        border-radius: 3px;
        padding: 0 20px;
        height: 30px;
        line-height: 30px;
        padding: 0 10px;
        font-size: 0.9em;
        min-width: initial;
        opacity: 0.5;
        text-decoration: none;
    }

    .page-link[disabled] {
        /* background-image: linear-gradient(#cce7f7 2%, #bcc5cb 100%); */
        /* color: black; */
        cursor: not-allowed;
        filter: grayscale(1);
    }

    .page-link[disabled]:hover {
        color: black;
    }

    .page-link:hover,
    .page-link.current {
        color: #1a1a1a;
        opacity: 1;
    }

    .cv-spinner {
        height: 100%;
        display: none;
        justify-content: center;
        align-items: center;
    }

    .cv-spinner.show {
        display: flex;
    }

    .spinner {
        width: 60px;
        height: 60px;
        border: 4px #ddd solid;
        border-top: 4px #2e93e6 solid;
        border-radius: 50%;
        animation: sp-anime 0.8s infinite linear;
    }


    @keyframes sp-anime {
        100% {
            transform: rotate(360deg);
        }
    }

#clients-table .image {
    position: relative;
    width: 36px;
}

#clients-table .image .img {
    height: 36px;
    width: 36px;
    border-radius: 0;
    overflow: hidden;
    position: relative;
    background-size: cover;
    background-position: center;
    margin-right: 15px;
    flex-shrink: 0;
    background-color: #f5f5f5;
}

#clients-table .client-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
}

.empty-results {
    list-style-type: none;
    width: 100%;
}
.empty-results p {
    font-size: 1.2rem;
    text-align: center;
    font-family: 'Work Sans';
    letter-spacing: 0.2px;
    color: #d0d0d0;
    padding: 2rem 0;
}

.mark-as-unread {
    margin: 1.5rem 0;
}

#custom_link a {
    word-break: break-all;
}

.card-image {
    max-height: 2rem;
    margin-top: 5px;
}

.buy.overlay .modal-activity {
    border-radius: 0 !important;
    width: 254px !important;
    height: 254px !important;
}
.buy.overlay .loader {
    margin:  40px auto 29px !important;
    top: 0 !important;
    border-top-color: #cfff06 !important;
}
.buy.overlay .loader + p {
    font-family: 'Work Sans' !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    max-width: 180px !important;
    text-align: center !important;
    margin: -10px auto 0 auto !important;
    line-height: 1.2 !important;
}

label.checker {
    position: relative;
    padding-left: 33px;
    margin: 0;
    min-height: 24px;
    overflow: visible;
    white-space: normal;
}
label.checker input[type="radio"],
label.checker input[type="checkbox"] {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: 0;
}
label.checker p {
    position: relative;
    font-size: 0.85rem;
    font-family: 'Manrope';
    letter-spacing: 0.3px;
}
label.checker p:before {
    content: '';
    width: 24px;
    height: 24px;
    background-color: #fff;
    border: #a3a3a4 solid 1px;
    position: absolute;
    top: 0px;
    left: -33px;
    z-index: 5;
}
label.checker p:after {
    content: "\f00c";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    left: -28px;
    top: 2px;
    z-index: 7;
    font-size: 0.8rem;
    opacity: 0;
}
label.checker input[type="radio"]:checked + p:before,
label.checker input[type="checkbox"]:checked + p:before {
    background-color: #cfff06;
    border-color: #cfff06;
}
label.checker input[type="radio"]:checked + p:after,
label.checker input[type="checkbox"]:checked + p:after {
    color: #1a1a1a;
    opacity: 1;
}
label.checker:hover input[type="radio"]:not(:checked) + p:before,
label.checker:hover input[type="checkbox"]:not(:checked) + p:before {
    background-color: #f5ffd5;
}

.input-groups {
    display: flex !important;
    width: 100%;
}
.input-groups.prepend {
    flex-direction: row-reverse;
}
.input-groups input, .input-groups input {
    flex-shrink: 1 !important;
    /* width: auto !important; */
    display: inline-block !important;
    /* flex: none !important; */
    flex-grow: 1;
}
.input-groups .input-append, .input-groups .input-prepend {
    flex-shrink: 1 !important;
    background: #dfdfe017;
    border: 1px solid #dfdfdf;
    font-weight: 500;
    color: #1a1a1a7a;
    text-transform: lowercase;
    letter-spacing: 0.4px;
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    /* flex: none !important; */
    /* flex-grow: 1; */
    width: auto;
    display: inline-flex !important;
}
.input-groups input:focus+.input-append,
.input-groups input:focus+.input-prepend {
    border-color: #cfff06;
}
.input-groups input.error+.input-append,
.input-groups input.error+.input-prepend {
    border-color: #CD1414;
}

.dropzone {
    border: 1px dotted #d4d4d4;
}
.dropzone .dz-message {
    font-weight: 500;
}
.dropzone i {
    margin-right: 10px;
    opacity: .5;
}

.mfp-close:hover, .mfp-close:focus {
    background: transparent;
}

.account-buttons {
    display: flex;
    gap: 2%;
}
.account-buttons a.btn {
    width: 100%;
    font-size: 14px;
    padding: 0 1.2rem;
    margin-bottom: .4rem;
    line-height: 1.4;
    height: 3.6rem;
}

.form-buttons {
    display: flex;
    justify-content: flex-end;
}

.mobile-show {
    display: none;
}

.message.liked {
    padding-right: 50px !important;
}

.message.liked .like {
    font-size: 1.5rem;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translate(0px, -50%);
    cursor: default;
}

span.required {
    font-size: 0.8rem;
    vertical-align: super;
    color: red;
  }