.transition-fade {
    transition: .4s;
    opacity: 1;
}
html.is-animating .transition-fade{
    opacity: 0;
}

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
}
html {
    width: 100%;
    height: 100%;
}
body {
    width: 100%;
    min-height: 100vh;
    position: relative;
    color: #646061;
    background-color: #ff2b2b;
    font-size: 14px;
    font-weight: 400;
    font-family: 'Poppins' ,sans-serif;
    background: rgb(255,43,43);
    background: linear-gradient(155deg, rgba(255,43,43,1) 0%, rgba(255,65,65,1) 35%);
}
.outerwrapper {
    background: rgb(255,43,43);
    background: linear-gradient(155deg, rgb(251, 32, 32) 0%, rgb(255, 65, 65) 35%);
    padding-top: 80px;
}
::selection {
  background: #393939; /* WebKit/Blink Browsers */
  color: #fff;
}
::-moz-selection {
  background: #393939; /* Gecko Browsers */
  color: #fff;
}
a,
a:visited {
    color: #c0110f;
    text-decoration: none;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
a:hover {
    color: #393939;
    text-decoration: none;
}
strong {
    font-weight: 500;
}
button, .button,
button:visited, .button:visited {
    background: #d41e23;
    background: rgb(255,57,64);
    background: -webkit-linear-gradient(rgba(255,57,64,1) 0%, rgba(232,46,56,1) 47%, rgba(221,5,27,1) 53%, rgba(171,0,7,1) 100%);
    background: -o-linear-gradient(rgba(255,57,64,1) 0%, rgba(232,46,56,1) 47%, rgba(221,5,27,1) 53%, rgba(171,0,7,1) 100%);
    background: linear-gradient(rgba(255,57,64,1) 0%, rgba(232,46,56,1) 47%, rgba(221,5,27,1) 53%, rgba(171,0,7,1) 100%);
    color: #fff;
    position: relative;
    border-radius: 4px;
    text-align: center;
    font-family: 'Poppins';
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 18px 25px 18px 25px;
    line-height: 1;
    border: none;
}
button:hover, .button:hover {
    filter: brightness(110%);
}
.button:not(.outline):focus,
button:not(.outline):focus {

}
.button.outline,
button.outline {
    border-color: #d41e23;
    color: #d41e23;
    background: transparent;
}
.button.outline:hover,
button.outline:hover {
    border-color: #d41e23;
    color: #ffffff;
    background: #d41e23;
}
.button[disabled],
.button.disabled,
button[disabled],
button.disabled {
    opacity: 0.2;
    color: rgba(255, 255, 255, 0.7);
    cursor: not-allowed;
}
.button.disabled:hover,
button.disabled:hover {
    color: rgba(255, 255, 255, 0.7);
}
.button.white,
button.white {
    border-color: #fff;
    background: #fff;
    color: #d41e23;
}
.button.white:hover,
button.white:hover {
    border-color: #fff;
    color: #d41e23;
    background: #fff;
}
.button.grey,
button.grey {
    filter: grayscale(100%);
}
.button.grey:hover,
button.grey:hover {
    filter: grayscale(100%) brightness(130%);
}
.button.lgrey,
button.lgrey {
    filter: grayscale(100%) brightness(160%);
}
.button.lgrey:hover,
button.lgrey:hover {
    filter: grayscale(100%) brightness(185%);
}
.button.sub,
button.sub {
    font-size: 15px;
    padding: 15px 23px 15px 23px;
}
button .caret.right,
.button .caret.right {
    margin-right: -8px;
}
button .caret.left,
.button .caret.left {
    margin-right: 0px;
    margin-left: -8px;
}
.button.sub,
button.sub {
    font-size: 14px;
    padding: 13px 17px 12px 17px;
    min-height: 0;
}

.button.upgrade {
    width: 100%;
}

form {
    margin: 0;
}
.form-item {
    margin-bottom: 20px;
}
.form-item:last-child {
}
.form-item .text {
    color: #d41e23;
}
.form .buttons {
    margin-top: 25px;
}
input, textarea, select, #card-element {
    border-radius: 4px;
    height: 47px;
    border: none;
    padding: 0 33px 0 21px;
    font-size: 13px;
    border: 1px solid #d2d2d2;
    transition: all ease-in-out .2s;
    max-width: 100%;
}
input[type="number"] {
    padding: 0 21px 0 21px;
}
select {

}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #d4d4d4;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #d4d4d4;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #d4d4d4;
}
:-moz-placeholder { /* Firefox 18- */
  color: #d4d4d4;
}
.fielderror {
    position: relative;
}
.errormsg {
    font-size: 11px;
    color: #eb3957;
    margin-left: 5px;
    position: absolute;
    top: 3px;
    right: 0px;
}
.unitfield label {
    margin-bottom: 7px;
}
.unitfield input {
    display: inline-block;
}
.formlabel {
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    padding: 1px;
    background-color: #f7f7f7;
    border: 13.5px solid #f7f7f7;
    transition: all ease-in-out .2s;
    border-radius: 0 4px 4px 0;
    font-weight: 500;
    color: #7c7c7c;
    font-size: 14px;
    border-right-width: 9px;
    border-left-width: 9px;
}
input:focus+.formlabel {
    background-color: #ffebeb;
    border-color: #ffebeb;
}

textarea {
    height: 194px;
    padding-top: 13px;
}
label {
    margin-bottom: 10px;
    font-weight: 600;
    font-family: 'Poppins';
    font-size: 15px;
}
label input, label textarea, label select {
    margin-top: 3px;
}

label p {
    text-transform: none;
}

label.radio,
label.checkbox {
    display: inline-flex;
    position: relative;
    padding-left: 55px;
    min-height: 40px;
    align-items: center;
    margin-right: 25px;
    margin-bottom: 0;
    cursor: pointer;
}
label.radio input,
label.checkbox input {
    width: 1px;
    height: 1px !important;
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 0 !important;
    margin: 0;
}
label.radio > span,
label.checkbox > span {
    width: 40px;
    height: 40px;
    border: 1px solid #d2d2d2;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 6;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: all .2s linear;
    text-align: center;
}
label.radio > span {}
label.radio > span:before,
label.checkbox > span:before {
    font-size: 19px;
    content: "\f00c";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    transition: all .2s linear;
    color: #f7f7f7;
}
label.checkbox > span:before {
    margin-left: 2px;
}
label.radio input:checked+span,
label.checkbox input:checked+span {
    background-color: #ff373d;
    background: linear-gradient(rgba(255,57,64,1) 0%, rgba(232,46,56,1) 47%, rgba(221,5,27,1) 53%, rgba(171,0,7,1) 100%);
}
label.radio input:checked+span:before,
label.checkbox input:checked+span:before {
    color: #fff;
}

label.radio input[disabled]+span+p {
    opacity: .3;
}

select, textarea, input:not([type="submit"]), #card-element, label.radio > span, label.checkbox > span {
    box-shadow: 0 0 0 3px rgba(247, 247, 247, 0.5);
}
textarea:focus, input:not([type="submit"]):focus, #card-element:focus-within, label.radio > span:focus-within, label.checkbox > span:focus-within {
    box-shadow: 0 0 0 3px rgb(254, 235, 235);
    border-color: #d41e23;
}

.fielderror textarea,
.fielderror input:not([type="submit"]),
.fielderror #card-element,
.fielderror label.radio > span,
.fielderror label.checkbox > span,
label.radio.fielderror > span,
label.checkbox.fielderror > span {
    border-color: #e93958;
    background-color: #ffeeee;
}

ol li,
ul li,
p {
    line-height: 1.6;
    margin-bottom: 15px;
    font-size: 14px;
    -ms-word-break: normal;
    -ms-word-wrap: normal;
    word-break: normal;
    color: #5c677a;
    font-weight: 400;
    letter-spacing: 0.2px;
}
p:last-child {
    margin-bottom: 0;
}
ol li,
ul li {
    margin-bottom: .7em;
    line-height: 1.4em;
}

img {
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear;
    -webkit-transform: translateZ(0);
}

h1, h2, h3, h4 {
    font-family: 'Poppins';
    color: #292424;
    margin-bottom: 23px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -0.1px;
}
h1, .h1 {
    font-size: 34px;
    font-weight: 500;
    margin-bottom: 13px;
}
h2, .h2 {
    font-size: 18px;
    font-weight: 600;
}
h3, .h3 {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.4;
}
h4, .h4 {
}

.subtitle {
    margin-bottom: 13px;
    font-weight: 600;
    font-size: 17px;
}

hr {
    width: 57px;
    height: 0px;
    display: block;
    margin: -5px auto 34px auto;
    border: none;
    border-bottom: 5px solid #393939;
    display: none;
}
hr.white {
    border-color: #fff;
}

.msg {
    display: block;
    margin-bottom: 20px;
    color: #fff;
    padding: 16px 20px;
    font-weight: 500;
    text-align: center;
    font-size: 15px;
    border-radius: 3px;
    font-family: 'Poppins';
    letter-spacing: 0.1px;
}
.msg a {
    color: #fff;
    text-decoration: underline;
}
.msg.success {
    background-color: #23e07c;
}
.msg.error {
    background-color: #ea3958;
}
.msg.info {
    background-color: #39a0ea;
}



.msg.upgradenow a {
    text-decoration: none;
}

.flexcont {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 6;
    transition: all .2s linear;
}

.flexcont .inner {
    padding: 40px 20px;
    text-align: center;
}
.flexcont .inner h3 {
    margin-bottom: 2px;
    font-weight: 500;
    color: #fff;
}

.wrapper {
    width: 1100px;
    max-width: 90%;
}
.wrapper.wsmall {
    width: 700px;
}

.hidden {
    display: none;
}

.label {
    padding: 5px 9px 4px 9px;
    border-radius: 2px;
    background-color: #d41e23;
    color: #ffffff;
    font-weight: 500;
    font-family: 'Poppins';
    letter-spacing: 0.4px;
    font-size: 14px;
    position: relative;
    z-index: 2;
}
.label.small {
    padding: 2px 7px 0px 7px;
    font-size: 0.8em;
}

.loading {
    position: relative;
}
.loading:before {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    width: 15px;
    height: 15px;
    background: rgba(0,0,0,0);
    border-radius: 50%;
    margin: -7.5px 0 0 -7.5px;
    animation: load 3s ease-in-out infinite;
    z-index: 5;
}
@keyframes load {
  0% {box-shadow:15px 15px 0 0 #393939, -15px 15px 0 0 #393939, -15px -15px 0 0 #393939;}
  8% {box-shadow:15px -15px 0 0 #393939, -15px 15px 0 0 #393939, -15px -15px 0 0 #393939;}
  17% {box-shadow:15px -15px 0 0 #393939, 15px 15px 0 0 #393939, -15px -15px 0 0 #393939;}
  25% {box-shadow:15px -15px 0 0 #393939, 15px 15px 0 0 #393939, -15px 15px 0 0 #393939;}
  33% {box-shadow:-15px -15px 0 0 #393939, 15px 15px 0 0 #393939, -15px 15px 0 0 #393939;}
  42% {box-shadow:-15px -15px 0 0 #393939, 15px -15px 0 0 #393939, -15px 15px 0 0 #393939;}
  50% {box-shadow:-15px -15px 0 0 #393939, 15px -15px 0 0 #393939, 15px 15px 0 0 #393939;}
  58% {box-shadow:-15px 15px 0 0 #393939, 15px -15px 0 0 #393939, 15px 15px 0 0 #393939;}
  67% {box-shadow:-15px 15px 0 0 #393939, -15px -15px 0 0 #393939, 15px 15px 0 0 #393939;}
  75% {box-shadow:-15px 15px 0 0 #393939, -15px -15px 0 0 #393939, 15px -15px 0 0 #393939;}
  83% {box-shadow:15px 15px 0 0 #393939, -15px -15px 0 0 #393939, 15px -15px 0 0 #393939;}
  92% {box-shadow:15px 15px 0 0 #393939, -15px 15px 0 0 #393939, 15px -15px 0 0 #393939;}
  100% {box-shadow:15px 15px 0 0 #393939, -15px 15px 0 0 #393939, -15px -15px 0 0 #393939;}
}

.grecaptcha-badge {
    display: none;
}

.bodywrapper {
    display: flex;
    min-height: calc(100vh - 80px);
    justify-content: flex-end;
}

.white-popup-block {
    background-color: #fff;
    padding: 35px;
    width: 680px;
    margin: 20px auto;
    max-width: 100%;
    border-radius: 2px;
    position: relative;
}
.white-popup-block iframe {
    width: 100%;
    min-width: 400px;
}
#onboarding .white-popup-block {
    width: 900px;
    /* text-align: left; */
}
#onboarding .white-popup-block p {
    line-height: 1.48;
}

.introw {
    margin-bottom: 35px;
}

h1 .info,
h2 .info,
h3 .info {
    width: 30px;
    height: 30px;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    padding: 0 0 0px 0;
    border-radius: 50%;
    vertical-align: middle;
    position: relative;
    top: -4px;
    border: 2px solid #d41e23;
    color: #d41e23;
}
h2 .info,
h3 .info {
    top: -1px;
    width: 20px;
    height: 20px;
    font-size: 11px;
}

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

.innerwrapper {
    background-color: #f7f7f7;
    padding: 29px 35px;
    width: 100%;
    background-color: #f5f8f9;
    position: relative;
    box-shadow: inset 0px 40px 30px -54px rgba(0, 0, 0, 0.18);
}
.innerwrapper .help {
    position: fixed;
    bottom: 13px;
    right: 23px;
    border-radius: 50%;
    width: 45.95px;
    height: 45.95px;
    color: #170705;
    background-color: #e6302a;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30;
    font-size: 24px;
    font-family: 'Poppins';
    box-shadow: 0 6px 30px -10px #29242473;
    font-weight: 600;
    padding: 3px 0 0 2px;
    display: none;
}

aside+.innerwrapper {
    width: calc(100% - 140px);
}

.innerwrapper .stats {
    display: flex;
    justify-content: space-between;
    background-color: #ffffff;
    margin-bottom: 53px;
}
.innerwrapper .stats .leftStats {
    padding-left: 14px;
}
.innerwrapper .stats .leftStats,
.innerwrapper .stats .rightStats {
    display: flex;
    align-items: center;
}
.innerwrapper .stats .leftStats > *,
.innerwrapper .stats .rightStats > * {
    display: inline-block;
}
.innerwrapper .stats .checkin {
    padding-right: 14px;
}
.innerwrapper .stats .checkin .button {
    font-size: 16px;
    padding: 14px 23px;
}
.innerwrapper .stats .macro {
    display: inline-block;
    padding: 14px 25px 12px 25px;
    text-align: center;
    border-left: 1px solid #29242417;
}
.innerwrapper .stats .macros {
    border-right: 1px solid #29242417;
}
.innerwrapper .stats .macro .value {
    color: #292424;
    font-family: 'Poppins';
    font-weight: 500;
    font-size: 22px;
    margin-bottom: 1px;
    line-height: 1;
}
.innerwrapper .stats .macro .value em {
    font-style: normal;
}
.innerwrapper .stats .macro .value span {
    font-size: 16px;
}
.innerwrapper .stats .macro .value span.caret {
    font-size: 25px;
    margin-right: -12px;
    position: relative;
    left: -5px;
}
.innerwrapper .stats .macro .value span.caret.gained {

}
.innerwrapper .stats .macro .value span.caret.lost {

}
.innerwrapper .stats .macro strong {
    color: #898586;
    font-size: 13px;
    line-height: 1;
    text-transform: uppercase;
    font-family: 'Poppins';
}
aside #user a {
    display: block;
    padding: 23px 25px 17px 25px;
    background-color: #3b3435;
}
aside #user a h3 {
    font-weight: 500;
    color: #fff;
    font-size: 18px;
    margin-bottom: 2px;
}
aside #user a p {
    color: #7a7676;
}


.innerwrapper .wave {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    display: none;
}
.innerwrapper .wave svg {
    display: block;
    width: 100%;
    height: 360px;
    margin-bottom: -60px;
}

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

.mm-menu {
    background-color: #2e3437;
}
.mm-listview>li>a, .mm-listview>li>span {
    color: #fff;
    font-size: 18px;
    padding: 20px 10px 20px 20px;
    font-weight: 500;
}
.mm-listview>li>a span.icon {
    display: inline-block;
    margin-right: 10px;
    font-weight: 400;
}
.mm-listview>li:not(.mm-divider):after {
    background-color: rgba(255,255,255,0.09);
}

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

header {
    display: flex;
    padding: 20px;
    background-color: #fff;
    align-items: center;
    justify-content: space-between;
    min-height: 80px;
    box-shadow: 0px 20px 30px -33px rgba(0, 0, 0, 0.26);
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 60;
}
body.touring header {
    position: absolute;
}

header .leftheader {
    display: flex;
    align-items: center;
}

header a.logo {
    display: block;
    height: 45px;
    text-align: center;
    position: relative;
    top: -3px;
}
header a.logo img {
    display: inline-block;
    max-height: 100%;
}
header a.label.vacationmode {
    margin-left: 20px;
    color: #fff;
}

header .rightheader {
    display: flex;
    align-items: center;
}


header nav ul li {
    display: inline-block;
    margin: 0;
}
header nav ul li a:visited,
header nav ul li a {
    display: inline-block;
    padding: 4px 0 0 28px;
    color: #292424;
    font-weight: 600;
    font-size: 16px;
}
header #user {
    border-left: 2px solid #ff2b2b;
    display: flex;
    height: 100%;
    align-items: center;
    position: relative;
    padding: 0 0px 0 36px;
    text-align: right;
    margin-left: 45px;
}
body.realplus header #user {
    border-color: #292424;
}

header #user a.user {
    display: none;
}
header #user a.details {
    display: inline-block;
    margin-right: 10px;
}
header #user h3 {
    margin-bottom: 0px;
    font-size: 17px;
    font-weight: 600;
    color: #6d727a;
}
header #user p {
    color: #c1c1c1;
    font-size: 13px;
    font-weight: 500;
}
header .dropper {
    position: relative;
}
header .dropper .arrow {
    display: inline-block;
    margin-left: 11px;
    font-size: 19px;
    color: #d4d5d7;
}
header .dropper .arrow i {
    transition: all ease-in-out .2s;
}
header .drop {
    min-width: 240px;
    position: absolute;
    top: 100%;
    right: 0px;
    padding-top: 20px;
    z-index: 20;
    box-shadow: -2px 5px 18px -6px #0000000a;
    border-radius: 0 0 4px 4px;
    max-height: 0;
    transition: max-height ease-in-out .2s;
    overflow: hidden;
    text-align: center;
    pointer-events: none;
    opacity: 0;
}
header .drop > * {
    display: block;
    padding: 18px 22px 14px 27px;
    font-size: 14px;
    color: #292424;
    border-bottom: 1px solid #f3f8f9;
    background-color: #fff;
    font-weight: 500;
    text-align: left;
}
header .drop > *:first-child {
    box-shadow: inset 0px 40px 30px -54px rgba(0, 0, 0, 0.48);
}
header .drop a:hover {
    color: #d41e23;
}
header .drop a:last-child {
}
header .dropper.dropped .drop,
header .dropper:hover .drop {
    max-height: 2000px;
    pointer-events: all;
    opacity: 1;
}
header .dropper.dropped .arrow i,
header .dropper:hover .arrow i {
    transform: rotate(180deg);
}

header .drop.macros {
    padding-top: 30px;
}
header .drop.macros > * {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
header .drop.macros .value {
    display: inline-block;
    color: #6f757e;
}

header .navlink {
    display: block;
    font-size: 50px;
    line-height: 1;
    height: 37px;
    position: relative;
    color: #2f3438;
}
header .navlink span {
    position: relative;
    top: -6px;
    left: -17px;
}

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

aside {
    width: 140px;
    min-height: calc(100vh - 80px);
    position: relative;
    z-index: 25;
    justify-content: space-between;
    left: 0;
    top: 0px;
    bottom: 0;
    z-index: 40;
    background: rgb(186,29,30);
    background: linear-gradient(90deg, rgba(186,29,30,1) 0%, rgba(217,26,27,1) 35%, rgba(222,29,30,1) 50%, rgba(217,26,27,1) 65%, rgba(186,29,30,1) 100%);
}
body.plus aside {
    background: linear-gradient(90deg, rgb(41, 36, 36) 0%, rgb(56, 51, 51) 35%, rgb(59, 55, 55) 50%, rgb(60, 54, 54) 65%, rgb(41, 36, 36) 100%);
}
aside,
aside * {
    -webkit-transform: unset !important;
    transform: unset !important;
}
aside nav ul {
    position: relative;
    list-style: none;
    margin-top: 10px;
}
aside nav ul li {
    display: block;
    position: relative;
    z-index: 10;
    margin-bottom: 0;
    padding: 16px 0;
}
aside nav ul li a:visited,
aside nav ul li a {
    display: block;
    padding: 0px 6px;
    color: rgba(255, 255, 255, 0.5);
    font-family: 'Poppins';
    letter-spacing: 0.3px;
    font-weight: 600;
    font-size: 15px;
    position: relative;
    line-height: 1.1;
    text-align: center;
}
aside nav ul li a:before {
    position: absolute;
    left: -10px;
    height: 100%;
    top: 0;
    bottom: 0;
    width: 5px;
    border-radius: 0 3px 3px 0;
    background-color: #fff;
    content: '';
    opacity: 0;
    transition: .2s ease-in-out all;
    box-shadow: 0px 0px 18px 3px rgba(255, 255, 255, 0.25);
}
aside nav ul li:hover a,
aside nav ul li.active a {
    color: white;
    text-shadow: 0 0 7px rgba(255, 255, 255, 0.24);
}
aside nav ul li:hover a:before,
aside nav ul li.active a:before {
    opacity: 1;
    left: 0;
    color: white;
}
aside nav ul li span.icon {
    display: block;
    font-size: 25px;
    margin-bottom: 14px;
}
aside nav ul li span.label {
    position: absolute;
    top: -10px;
    left: 50%;
    border-radius: 50px;
    font-size: 12px;
    padding: 6px 5px 4px 6px;
    line-height: 1;
    min-width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}
aside nav ul li i.mpicon {

}
aside nav ul li i.fa {
    position: absolute;
    top: 12px;
    right: 11px;
    font-size: 22px;
    color: #fff;
    height: 40px;
    line-height: 40px;
    width: 40px;
    text-align: center;
    cursor: pointer;
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
}
aside nav ul li:last-child {
}
aside nav ul li .drop {
    margin: 0;
    display: none;
}
aside nav ul li .drop li {
    display: block;
    width: 100%;
    padding-left: 15px;
    background-color: #3b3435;
}
aside nav ul li .drop li:before {
    opacity: 0.04;
}
aside nav ul li .drop li a,
aside nav ul li .drop li a:visited {
    display: block;
    padding: 22px 40px 20px 9px;
    background-color: #3b3435;
    font-size: 16px;
}
aside nav ul li .drop li.current > a,
aside nav ul li .drop li a:hover {
    color: #ffffff;
}
aside nav ul li .drop li:last-child a {
}
aside nav ul li.toggleActive > .drop,
aside nav ul li.active > .drop {
    display: block;
}
aside nav ul li.toggleActive > i.fa,
aside nav ul li.active > i.fa {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

aside .sidebar-footer {
    text-align: center;
    padding: 19px 0 8px 0;
    display: flex;
    flex-direction: column;
}
aside .sidebar-footer a {
    display: block;
}
aside .sidebar-footer img {
    height: 34px;
}
aside .sidebar-footer .fbgroup .icon {
    width: 70px;
    display: inline-block;
    padding: 3px;
    border-radius: 2px;
}
aside a.button.logout {
    position: absolute;
    bottom: 22px;
    left: 35px;
    right: 35px;
}

aside a.navlink {
    display: none;
    z-index: 10;
    float: right;
    margin-top: 20px;
    width: 35px;
    height: 29px;
    position: relative;
    border-bottom: 5px solid #fff;
}
aside a.navlink:after {
    content: "";
    position: absolute;
    top: 0;
    height: 17px;
    width: 100%;
    border-top: 5px solid #fff;
    border-bottom: 5px solid #fff;
}

aside nav ul.other-icons {
    padding-top: 18px;
    border-top: 1px dotted rgba(255, 255, 255, 0.32);
    margin-top: 11px;
}
aside nav ul.other-icons li {
    padding: 13px 0;
    text-align: left;
}
aside nav ul.other-icons li a,
aside nav ul.other-icons li a:visited {
    color: #fff;
    padding-left: 13px;
    text-align: left;
}
aside nav ul.other-icons li span.icon {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}

.popup {
    padding: 30px;
    background-color: #f7f7f7;
    width: 900px;
    max-width: calc(100% - 30px);
    margin: 30px auto;
    position: relative;
    border-radius: 4px;
}
.popup a {
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
}

p.vacation {
    background-color: #3b3435;
    text-align: center;
    padding: 13px;
    margin-bottom: 40px;
    color: #ffffff;
    font-weight: 500;
}
p.vacation a {
    display: inline-block;
    padding: 7px 13px;
    line-height: 1;
    background-color: #fff;
    font-family: 'Poppins';
    margin-left: 13px;
    font-size: 14px;
    border-radius: 20px;
}

.pagination {
    text-align: center;
}
.pagination a,
.pagination a:visited {
    border-radius: 0;
    color: #313439;
}
.pagination a:hover {
    border-color: transparent;
}
.pagination a.disabled {
    opacity: .4;
}
.pagination a.current {
    color: #ee1f26;
}

.table {
    color: #6d727a;
}
.table .thead {
}
.table .thead .th {
    font-weight: 600;
    font-family: 'Poppins';
    padding: 0px 10px 14px 10px;
}
.table .thead .th:first-child {
    padding-left: 0;
}
.table .thead .th:last-child {
    padding-right: 0;
}


.table .tbody .tr {
    margin: 0;
    border-top: 1px dotted #ebebeb;
}
.table .tbody .tr .td {
    padding: 16px 10px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.table .tbody .tr .td:first-child {
    padding-left: 0;
}
.table .tbody .tr .td:last-child {
    padding-right: 0;
}

.table .tbody .tr:last-child .td {
    padding-bottom: 0;
}

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

.tabs {
    display: flex;
}
.tabs a {
    display: inline-block;
    padding: 20px;
    text-transform: uppercase;
    width: 100%;
    text-align: center;
    border-right: 1px solid #f7f7f7;
    border-bottom: 1px solid #f7f7f7;
    font-family: 'Poppins';
    letter-spacing: 1px;
    font-weight: 700;
    color: #2d2e2f;
    background-color: #eeeeee;
}
.tabs a:last-child {
    border-right: none !important;
}
.tabs a:hover {
    border-right: 1px solid #eeee;
    border-bottom: 1px solid #f7f7f7;
}
.tabs a.active {
    color: #d41e23;
    border-bottom-color: #fff;
    background-color: #fff;
}

.tabContents .tab {
    display: none;
}
.tabContents .tab.active {
    display: block;
}

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

.white-popup-block {
    text-align: center;
}
.white-popup-block .buttons:not(:first-child) {
    margin-top: 30px;
}
.white-popup-block .buttons:not(.row) .button {
    margin: 0 5px;
}
#cancelmodal.white-popup-block {
    text-align: left;
}
#cancelmodal .reason_text {
    margin-bottom: 11px;
}

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

section {
    padding: 0;
    position: relative;
    background-color: #ffffff;
    margin-bottom: 2.7vw;
    box-shadow: 0px 40px 30px -54px rgba(0, 0, 0, 0.48);
    border-radius: 8px;
}
section a,
section a:visited {
    display: inline-block;
    position: relative;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    transition: all .2s linear;
}
section a:hover {
    border-color: #393939;
}

section.buttons {
    padding: 0;
    background: none;
    box-shadow: none;
    margin-top: 31px;
}
section.buttons .button {
    box-shadow: 0px 1px 3px 0px #0000000d;
    text-shadow: 0 0 7px rgba(255, 255, 255, 0.23);
}
section.tabSection {
    padding: 0;
}

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

section.infopanel {
    padding: 0;
}
section.infopanel .infoheader {
    padding: 21px 21px 16px 21px;
    border-bottom: 1px solid #eee;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
section.infopanel .infoheader > *:first-child {
    margin-bottom: 0;
    margin-right: auto;
}
section.infopanel .infoheader .meta {
    color: #959595;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    margin-left: auto;
    padding-left: 20px;
}

section.infopanel .infoheadertabs {
    background-color: #f5f8f9;
    flex-wrap: nowrap;
}
section.infopanel .infoheadertabs .infoheader {
    border-radius: 8px 8px 0 0;
    background-color: rgba(0, 0, 0, 0.03);
    margin-right: 6px;
    transition: background .2s ease-in-out;
    cursor: pointer;
    padding-left: 63px;
    position: relative;
    flex-grow: 1;
    width: auto;
}
section.infopanel .infoheadertabs .infoheader h2 {
    font-size: 16px;
}
section.infopanel .infoheadertabs .infoheader:before {
    content: "\f00c";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    top: 12px;
    left: 13px;
    color: #ededed;
    font-size: 20px;
    background-color: #fafafa;
    border-radius: 3px;
    width: 35px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 3px rgb(247, 247, 247);
}
section.infopanel .infoheadertabs .infoheader.active:before {
    color: #ffffff;
    background-color: #ff373d;
    background: linear-gradient(rgba(255,57,64,1) 0%, rgba(232,46,56,1) 47%, rgba(221,5,27,1) 53%, rgba(171,0,7,1) 100%);
}
section.infopanel .infoheadertabs .infoheader:hover {
    background-color: #fbfbfb;
}
section.infopanel .infoheadertabs .infoheader.active {
    background-color: #fff;
}
section.infopanel .infoheadertabs .infoheader:last-child {
    margin-right: 0;
}
section.infopanel .infoheadertabs .infoheader.cancel {
    width: 80px;
}


section.infopanel.expandable .infobody .inner,
section.infopanel .infobody {
    padding: 25px 21px;
}
section.infopanel .row {
}
section.infopanel .col {
}
section.infopanel .col:nth-child(1),
section.infopanel .col:nth-child(2),
section.infopanel .col:nth-child(3),
section.infopanel .col:nth-child(4) {
}
section.infopanel.statlist .apps {
    margin-bottom: 18px;
}
section.infopanel.statlist .apps .button {
    padding: 12px 12px 13px 12px;
}
section.infopanel.statlist .apps .button .icon {
    font-size: 20px;
}
section.infopanel.statlist .days_per_week .value {
    font-size: 15px;
}
section.infopanel.statlist .days_per_week .radios {
    display: flex;
    justify-content: space-between;
}
section.infopanel.statlist .days_per_week label.radio,
section.infopanel.statlist .days_per_week label.checkbox {
    margin-right: 0;
    padding-left: 45px;
    min-height: 35px;
}
section.infopanel.statlist .days_per_week label.radio > span,
section.infopanel.statlist .days_per_week label.checkbox > span {
    width: 35px;
    height: 35px;
}

section.infopanel.statlist .form-item {
    margin-bottom: 0;
}
section.infopanel.statlist .macros {
    margin-bottom: 28px;
}
section.infopanel.statlist strong {
    font-size: 14px;
    font-family: 'Poppins';
    font-weight: 500;
    letter-spacing: 0.3px;
    margin-bottom: 9px;
    display: block;
    color: #d41e23;
    line-height: 1.2;
    margin-top: 4px;
}
section.infopanel.statlist strong a {
    border-bottom: 1px dotted #dc1c1d;
    line-height: 1;
}
section.infopanel.statlist .value {
    font-size: 17px;
    font-family: 'Poppins';
    font-weight: 600;
    line-height: 1;
    color: #6d727a;
}
section.infopanel.statlist .value span {
    font-size: 17px;
}

section.infopanel.macros a.button {
    /* width: 100%; */
    /* white-space: nowrap; */
}
section.infopanel.macros .checkin {
    text-align: right;
}
section.infopanel.macros .checkin a.button.flash {
    -webkit-animation: CTAGlow 3.7s infinite;
    -moz-animation:    CTAGlow 3.7s infinite;
    -o-animation:      CTAGlow 3.7s infinite;
    animation:         CTAGlow 3.7s infinite;
}
/* animation */
@-webkit-keyframes CTAGlow {
    0% { -webkit-box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    20% { -webkit-box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    40% { -webkit-box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    60% { -webkit-box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    85% { -webkit-box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    100% { -webkit-box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
}
@-moz-keyframes CTAGlow {
    0% { -moz-box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    20% { -moz-box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    40% { -moz-box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    60% { -moz-box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    85% { -moz-box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    100% { -moz-box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
}
@-o-keyframes CTAGlow {
    0% { box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    20% { box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    40% { box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    60% { box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    85% { box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    100% { box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
}
@keyframes CTAGlow {
    0% { box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    20% { box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    40% { box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
    60% { box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    85% { box-shadow: 0 0 20px 3px #d41e2300; text-shadow: 0 0 20px rgba(255,255,255,0); }
    100% { box-shadow: 0 0 20px 3px #d41e23ab; text-shadow: 0 0 20px #ffffff; }
}

section.infopanel.macros .percent {
    position: absolute;
    bottom: 3px;
    left: 3px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 3px);
}
section.infopanel.macros .percent > div {
    display: inline-block;
    background-color: #d41e23;
    height: 10px;
    border-right: 2px solid #fff;
}
section.infopanel.macros .percent .carbs {
    background-color: #ff7372;
}
section.infopanel.macros .percent .fat {
    background-color: #ffb7b7;
}

section.infopanel.expandable .infoheader {
    cursor: pointer;
}
section.infopanel.expandable .infoheader .exphandle {
    display: inline-flex;
    position: relative;
    width: 32px;
    height: 32px;
    min-height: 30px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #d41e23;
    padding: 0;
}
section.infopanel.expandable .infoheader .exphandle:before {
    display: inline-block;
    content: "\f067";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    transition: transform .2s ease-in-out;
}
section.infopanel.expandable .infobody {
    max-height: 0;
    overflow: hidden;
    padding: 0;
    transition: height ease-in-out .2s;
}
section.infopanel.expandable .infoheader:hover .exphandle:before {
    transform: rotate(90deg);
}
section.infopanel.expandable.expanded .infobody {
    max-height: 2000px;
}
section.infopanel.expandable.expanded .infoheader .exphandle:before {
    content: "\f068";
}

section.infopanel.chartpanel .infobody,
section.infopanel.tablepanel .infobody {
    min-height: 200px;
    position: relative;
}
section.infopanel.chartpanel .infobody > div,
section.infopanel.tablepanel .infobody > div {
    background-color: #fff;
    position: relative;
    z-index: 5;
}

@keyframes spinner {
  to {transform: rotate(360deg);}
}

section.infopanel.chartpanel .infobody:before,
section.infopanel.tablepanel .infobody:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin-top: -20px;
  margin-left: -10px;
  border-radius: 50%;
  border: 2px solid #ccc;
  border-top-color: #333;
  animation: spinner .6s linear infinite;
}

section.infopanel.tablepanel .photos {
}
section.infopanel.tablepanel .photos .row {
    width: 100%;
}
section.infopanel.tablepanel .photos .photo {
    min-height: 70px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
section.infopanel.tablepanel .photos .photo.photo-empty {
    opacity: .3;
}
section.infopanel.tablepanel .photos.gender-male .photo.photo-front {
    background-image: url('../img/placeholder-front-male.png');
}
section.infopanel.tablepanel .photos.gender-male .photo.photo-side {
    background-image: url('../img/placeholder-side-male.png');
}
section.infopanel.tablepanel .photos.gender-male .photo.photo-back {
    background-image: url('../img/placeholder-back-male.png');
}
section.infopanel.tablepanel .photos.gender-female .photo.photo-front {
    background-image: url('../img/placeholder-front-female.png');
}
section.infopanel.tablepanel .photos.gender-female .photo.photo-side {
    background-image: url('../img/placeholder-side-female.png');
}
section.infopanel.tablepanel .photos.gender-female .photo.photo-back {
    background-image: url('../img/placeholder-back-female.png');
}
section.infopanel.tablepanel .photo a {
    display: block;
}
section.infopanel.tablepanel .photo a img {
    display: block;
}

section.white-popup-block.infopanel .infoheader {
    padding: 26px 32px 21px 32px;
}
section.white-popup-block.infopanel .infobody {
    padding: 32px;
}
section.white-popup-block.infopanel .modalMessage p {
    font-weight: 500;
    font-size: 17px;
}
section.white-popup-block.infopanel .statlist .calories,
section.white-popup-block.infopanel .statlist .macro {
    font-size: 17px;
}

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

section.user {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
section.user a {
    display: block;
}
section.user h3 {
    margin-bottom: 4px;
}
section.user p {
    color: #d41e23;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    width: 80%;
    display: inline-block;
}
section.user span {
    font-size: 15px;
}

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

section.goal .days .value {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 13px 0 0 0;
}
section.goal .days .value span {
    display: inline-block;
    height: 20px;
    border: 1px solid #ece4e6;
    margin-left: 4px;
    flex-grow: 1;
    border-radius: 2px;
    background-color: #ece4e6;
}
section.goal .days .value span.active {
    background-color: #d41e23;
    border-color: #d41e23;
}
section.goal .checkin {
    display: flex;
    align-items: center;
    justify-content: center;
}
section.goal .goal .value {
    font-size: 27px;
}

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

section.userGuide {
}
section.userGuide a {
    display: block;
    margin-bottom: 10px;
}
section.userGuide a i.fa {
    color: #000000;
    display: inline-block;
    margin-right: 5px;
}
section.userGuide .retour,
section.userGuide .toolkit {
    margin-top: 15px;
}

#userguide section.userGuide.infopanel.expandable .exphandle {
    display: none;
}
#userguide section.userGuide.infopanel.expandable .infoheader {
    cursor: normal;
}
#userguide section.userGuide.infopanel.expandable .infobody {
    max-height: 2000px !important;
}

#toolkitPopup {
    text-align: left;
}
#toolkitPopup .intro {
    margin-bottom: 20px;
}
#toolkitPopup .intro h2 {
    font-size: 28px;
}
#toolkitPopup .products {
    margin-bottom: 30px;
    position: relative;
     padding: 0 25px;
}
#toolkitPopup .products .product {
    padding: 15px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
}
#toolkitPopup .products .product .col {
    display: flex;
    align-self: center;
    justify-content: center;
}
#toolkitPopup .products .product .image {
    margin-bottom: 20px;
    height: 230px;
    text-align: center;
}
#toolkitPopup .products .product .image img {
    max-height: 100%;
    display: inline-block;
}
#toolkitPopup .products .product .text h3 {
    margin-bottom: 4px;
    font-size: 16px;
    line-height: 1.4;
}
#toolkitPopup .products .product .buy {
    text-align: center;
    width: 100%;
    margin-top: 20px;
}
#toolkitPopup .products .owl-carousel .owl-item {
    display: flex;
}
#toolkitPopup .products .owl-carousel .owl-stage {
    display: flex;
}
#toolkitPopup .products .owl-carousel .owl-controls {
    bottom: inherit;
    top: 50%;
}
#toolkitPopup .products .owl-carousel .owl-controls .owl-next,
#toolkitPopup .products .owl-carousel .owl-controls .owl-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #e6302a;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 8px 20px -18px rgb(0, 0, 0);
    font-size: 20px;
    color: #fff;
    overflow: visible;
    z-index: 30;
}
#toolkitPopup .products .owl-carousel .owl-controls .owl-next {
    padding: 0 0 0 4px;
    right: -45px;
}
#toolkitPopup .products .owl-carousel .owl-controls .owl-prev {
    padding: 0 4px 0 0;
    left: -45px;
}

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

.miniList section {
    cursor: pointer;
    padding: 0;
    margin-bottom: 15px;
}
.miniList section .infobody a {
    display: block;
    margin-bottom: 16px;
    cursor: pointer;
}
.miniList section .image {
    position: relative;
    border-radius: 3px;
    overflow: hidden;
}
.miniList section .image img {
    display: block;
}
.miniList section .details {
    padding: 0 0 0 7px;
}
.miniList section .details .meta {
    color: #717479;
    font-size: 13px;
    line-height: 1;
}
.miniList section .details h4 {
    font-size: 15px;
    margin-bottom: 6px;
    color: #5c677a;
}
.miniList section a:hover .details h4 {
    color: #d41e23;
}
.miniList section.latestVideo .image:before {
    content: "\f04b";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 50px;
    color: #fff;
    z-index: 10;
    opacity: .5;
    transition: .2s ease-in-out opacity;
}
.miniList section.latestVideo a:hover .image:before {
    opacity: .75;
}

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

.explanation.infopanel .infobody {
    padding-top: 0;
}
.explanation .col {
    margin-top: 20px;
}

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

.filter {
    margin-bottom: 30px;
}
.filter select {
    height: 45px;
    border: 1px solid #e8e8e8;
}

.empty {
    text-align: center;
    padding: 40px;
    font-size: 20px;
    color: #bfbfbf;
}

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

section.videoListing {
}
section.videoListing .details {
}
section.videoListing .details h3 {
    margin-bottom: 6px;
}
section.videoListing .details .meta {
    margin-bottom: 10px;
}
section.videoListing .details .readmore {
    color: #d41e23;
    font-weight: 500;
    display: inline-block;
    margin-left: 5px;
}
section.videoListing .details .description p {
    display: none;
}
section.videoListing .details .description p:first-child {
    display: inline;
}
section.videoListing .details .description .readmore {
    display: inline-block;
}
section.videoListing .image {
    position: relative;
}
section.videoListing .image:before {
    content: "\f04b";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 70px;
    color: #fff;
    z-index: 10;
    opacity: .9;
}
section.videoListing .image img {
    display: block;
}

section.videoPlayer {
    padding: 0;
}
section.videoPlayer .video-container {
    margin-bottom: 0;
}
section.videoDescription {

}



#videos p.meta {
    margin-top: -20px;
    color: #777;
}
#videos .videoImage {
    margin-bottom: 30px;
}



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

section.articleListing {
}
section.articleListing .details {
}
section.articleListing .details h3 {
    margin-bottom: 6px;
}
section.articleListing .details .meta {
    margin-bottom: 10px;
}
section.articleListing .details .readmore {
    color: #d41e23;
    font-weight: 500;
    display: inline-block;
    margin-left: 5px;
}
section.articleListing .details .description {
    margin-bottom: 15px;
}
section.articleListing .details .description p {
    display: none;
}
section.articleListing .details .description p:first-child {
    display: inline;
}
section.articleListing .details .description .readmore {
    display: inline-block;
}
section.articleListing .image img {
    display: block;
}

#articles p.meta {
    margin-top: -20px;
    color: #777;
}
#articles .articleImage {
    margin-bottom: 30px;
}
#recipes section.articleListing .image {
    margin-bottom: 20px;
}
#recipes section.articleListing .buttons {
    display: flex;
    flex-wrap: wrap;
}
#recipes section.articleListing .buttons .button {
    flex-grow: 1;
}


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

.blockCategories .row {
    justify-content: space-evenly;
}
.blockCategories .row.auto {
    flex-wrap: wrap;
}
section.blockCategory {
    text-align: center;
    padding: 14px 20px;
    box-shadow: 0px 18px 30px -30px rgba(0, 0, 0, 0.16);
    align-items: center;
    justify-content: center;
    min-width: 14%;
    margin-bottom: 20px;
}
#articles section.blockCategory {
    min-width: 20%;
}
section.blockCategory:hover {
    box-shadow: 0px 18px 30px -30px rgba(0, 0, 0, .5);
}
section.blockCategory a {
    display: block;
    align-items: center;
    justify-content: flex-start;
}
#videos section.blockCategory {
    padding: 24px 20px;
}
#videos section.blockCategory a .icon {
    height: 80px;
}
section.blockCategory a .icon {
    height: 30px;
    text-align: center;
    display: block;
    margin-bottom: 10px;
    font-size: 33px;
}
section.blockCategory a .icon img {
    max-height: 100%;
    display: inline-block;
}
section.blockCategory a .image {
    width: 90px;
    height: 100%;
    font-size: 54px;
    margin-right: 14px;
}
section.blockCategory a .info {
    display: block;
    width: 100%;
}
section.blockCategory a .info h3 {
    font-size: 15px;
    color: #222;
    margin-bottom: 7px;
}
section.blockCategory a .info h3:last-child {
    margin-bottom: 0;
}
section.blockCategory a .info p {
    font-size: 12px;
}

section.questions .question {
    margin-bottom: 20px;
}
section.questions .question h4 {
    color: #222;
    text-transform: none;
    margin-bottom: 0;
}

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

section.progressChart {
}

.chart-wrapper {
    padding: 20px;
}

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

section.goal {
    text-align: center;
    display: block;
    padding: 30px 25px;
}
section.goal h4 {
    margin-bottom: 10px;
}
section.goal p {
    margin-bottom: 20px;
}

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

section.highlow .infobody {
    max-height: 5000px;
    transition: all .2s ease-in-out;
}
section.highlow[data-tab="cancel"] .infobody {
    opacity: .3;
    filter: blur(3px);
    max-height: 300px;
    overflow: hidden;
}
section.highlow .table .tbody .day,
section.highlow .table .thead {
    padding: 0;
}
section.highlow .table .tbody .tr .td, section.highlow .table .thead .th {
    padding: 20px 20px;
    border-bottom: 1px solid #eee;
    font-size: 15px;
}
section.highlow .highlowtab .table .tbody .tr .td, section.highlow .table .thead .th {
    cursor: pointer;
}
section.highlow .table .thead .th.date,
section.highlow .table .tbody .tr .td.date {
    text-align: left;
}
section.highlow .highlowtab .day.disabled {
    pointer-events: none;
    background-color: #f7f7f7;
    color: #d4d4d4;
}
section.highlow .highlowtab .day .arrows {
    font-size: 20px;
    padding-right: 0px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
section.highlow .highlowtab .day .arrows .caret {
    display: none;
}
section.highlow .highlowtab .day .arrows .caret:before {
    transform: scale(3);
    position: relative;
    top: -7px;
    display: -webkit-inline-box;
}
section.highlow .highlowtab .day .arrows .caret.up {
    color: #ffffff;
}
section.highlow .highlowtab .day .arrows .caret.down {
    color: #d8d8d8;
}
section.highlow .highlowtab .day:hover,
section.highlow .highlowtab .day[data-high="true"] {
    background-color: #d41e23;
    color: white;
    font-weight: 500;
}
section.highlow .highlowtab .day.high .arrows .caret.up {
    display: block;
}
section.highlow .highlowtab .day:not(.high):not(.low):hover .arrows .caret.up {
    display: block;
    opacity: 1;
    color: white;
}
section.highlow .highlowtab .day.high .arrows .caret.down {
    display: none;
}

section.highlow .highlowtab .day.low .arrows .caret.up {
    display: none;
}
section.highlow .highlowtab .day.low .arrows .caret.down {
    display: block;
}

section.highlow div.highLowSlider {
    margin-top: 30px;
}
section.highlow div.highLowSlider button,
section.highlow div.highLowSlider .button {
    width: 100%;
}

section.highlow .sametab .day td {
    text-align: center;
}
section.highlow .sametab .irs .irs-slider {
    cursor: pointer;
}
section.highlow .sametab .irs .irs-slider:hover {
    filter: brightness(110%);
}
section.highlow .sametab .irs .irs-min,
section.highlow .sametab .irs .irs-max {
    visibility: visible !important;
    margin-top: -3px;
}
section.highlow .sametab .irs .irs-single {
    display: none;
}

/***** WORKOUTS *********************************/

.workouts {
    /*margin-top: 35px;*/
}
.workouts .infopanel .daterow.infoheader {
    padding: 17px 21px 18px 21px;
}
.workouts .daterow h3 {
    margin-bottom: 0;
    position: relative;
    bottom: -1px;
    color: #292423;
    font-size: 18px;
}
.workouts .daterow a {
    font-size: 23px;
    display: inline-block;
    margin-right: 0 !important;
    line-height: 1;
    color: #292323;
}
.workouts .daterow a:first-child i {
    transform: scaleX(-1);
}

.workouts section.workout {
    display: block;
}
.workouts section.workout:nth-child(2n) {
}
.workouts section.workout .infoheader {
    border: none;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}
.workouts section.workout .infoheader > * {
    margin-bottom: 0;
    margin-right: 0 !important;
}

.workouts section.workout .infoheader .name {
    padding: 0 20px;
    flex-grow: 1;
    display: block;
}
.workouts section.workout .infoheader .name.video-name h2 {
    border-bottom: 1px dotted #000;
}
.workouts section.workout .infoheader .details {
    display: flex;
    align-items: center;
    white-space: nowrap;
}
.workouts section.workout .infoheader .details p {
    margin-left: 10px;
    display: inline-block;
    margin-bottom: 0;
    padding: 7px 10px 6px 10px;
    border-radius: 15px;
    background-color: #a0aebe;
    text-align: center;
    color: white;
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
}
.workouts section.workout .infoheader .details p:before {
    margin-right: 20px;
    content: "\2014";
    opacity: .25;
    display: none;
}
.workouts section.workout .infoheader .details p:first-child:before {
    display: none;
}
.workouts section.workout .infoheader {
    position: relative;
}
.workouts section.workout .infobody {
    border-top: 1px solid #eee;
}
.workouts section.workout h2 {
    margin-bottom: 0;
    display: inline-block;
    font-size: 16px;
    vertical-align: middle;
    line-height: 1.4;
}
.workouts .daterow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 17px 19px;
}

.workouts .sets {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #eee;
}
.workouts .sets:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
.workouts .sets .setheadings {
    text-align: center;
    border-bottom: 1px dotted #eee;
    margin-bottom: 12px;
    padding-bottom: 7px;
    color: #9f9f9f;
}
.workouts .sets .set {
    margin-bottom: 7px;
    position: relative;
    text-align: center;
}
.workouts .sets .set:last-child {
    margin-bottom: 0;
}
.workouts .sets .set:before {
    content: '';
    position: absolute;
    top: calc(50% - 1px);
    left: 0;
    right: 0;
    border-bottom: 1px dotted #eee;
    display: none;
}
.workouts .sets .set .col {
}
.workouts .sets .set strong {
    color: #000;
}
.workouts .sets .set .set_num strong {
    display: inline-block;
}
.workouts .instructions .video-container {
    border-radius: 3px;
    overflow: hidden;
    background-color: #eee;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg width='44' height='44' viewBox='0 0 44 44' xmlns='http://www.w3.org/2000/svg' stroke='%23a0aebe'%3E%3Cg fill='none' fill-rule='evenodd' stroke-width='2'%3E%3Ccircle cx='22' cy='22' r='1'%3E%3Canimate attributeName='r' begin='0s' dur='1.8s' values='1; 20' calcMode='spline' keyTimes='0; 1' keySplines='0.165, 0.84, 0.44, 1' repeatCount='indefinite' /%3E%3Canimate attributeName='stroke-opacity' begin='0s' dur='1.8s' values='1; 0' calcMode='spline' keyTimes='0; 1' keySplines='0.3, 0.61, 0.355, 1' repeatCount='indefinite' /%3E%3C/circle%3E%3Ccircle cx='22' cy='22' r='1'%3E%3Canimate attributeName='r' begin='-0.9s' dur='1.8s' values='1; 20' calcMode='spline' keyTimes='0; 1' keySplines='0.165, 0.84, 0.44, 1' repeatCount='indefinite' /%3E%3Canimate attributeName='stroke-opacity' begin='-0.9s' dur='1.8s' values='1; 0' calcMode='spline' keyTimes='0; 1' keySplines='0.3, 0.61, 0.355, 1' repeatCount='indefinite' /%3E%3C/circle%3E%3C/g%3E%3C/svg%3E");
}

.workouts section.workout .icon {
    width: 39px;
    height: 39px;
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 50%;
    margin-right: 10px;
    background-color: #2584f0;
    line-height: 1;
    font-size: 15pt;
    padding-bottom: 3px;
    text-align: center;
    border: 3px solid transparent;
    position: relative;
    flex-shrink: 0;
}
.workouts section.workout .icon.note {
  background-color: #F9BF3B;
}
.workouts section.workout .icon.warmup {
  background-color: #D64541;
}
.workouts section.workout .icon.cooldown {
  background-color: #81CFE0;
}
.workouts section.workout .icon.lift,
.workouts section.workout .icon.tag {
  background-color: #6C7A89;
}
.workouts section.workout .icon.circuit {
  background-color: #F89406;
}
.workouts section.workout .icon.cardio {
  background-color: #59ABE3;
}
.workouts section.workout .icon.health {
  background-color: #F64747;
}
.workouts section.workout .icon.science {
  background-color: #9b59b6;
}
.workouts section.workout .icon.video {
  background-color: #e74c3c;
}
.workouts section.workout .icon.break {
  background-color: #34495e;
}
.workouts section.workout .icon.rest {
  background-color: #16a085;
}
.workouts section.workout .icon.progression {
  background-color: #446CB3;
}
.workouts section.workout .icon.group:before {
    content: attr(data-group);
    position: absolute;
    top: -9px;
    right: -8px;
    background-color: #0cd28b;
    width: 20px;
    height: 20px;
    color: white;
    z-index: 10;
    border-radius: 50%;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-weight: 600;
    padding-top: 2px;
}
.workouts section.workout .icon.group_A,
.workouts section.workout .icon.group_J,
.workouts section.workout .icon.group_S {
    border-color: #00d68b;
}
.workouts section.workout .icon.group_A:before,
.workouts section.workout .icon.group_J:before,
.workouts section.workout .icon.group_S:before {
    background-color: #00d68b;
}

.workouts section.workout .icon.group_B,
.workouts section.workout .icon.group_K,
.workouts section.workout .icon.group_T {
    border-color: #0ab3cd;
}
.workouts section.workout .icon.group_B:before,
.workouts section.workout .icon.group_K:before,
.workouts section.workout .icon.group_T:before {
    background-color: #0ab3cd;
}

.workouts section.workout .icon.group_C,
.workouts section.workout .icon.group_L,
.workouts section.workout .icon.group_U {
    border-color: #f36dab;
}
.workouts section.workout .icon.group_C:before,
.workouts section.workout .icon.group_L:before,
.workouts section.workout .icon.group_U:before {
    background-color: #f36dab;
}
.workouts section.workout .icon.group_D,
.workouts section.workout .icon.group_M,
.workouts section.workout .icon.group_V {
    border-color: #f3ea6d;
}
.workouts section.workout .icon.group_D:before,
.workouts section.workout .icon.group_M:before,
.workouts section.workout .icon.group_V:before {
    background-color: #f3ea6d;
}

.workouts section.workout .icon.group_E,
.workouts section.workout .icon.group_N,
.workouts section.workout .icon.group_W {
    border-color: #f3a96d;
}
.workouts section.workout .icon.group_E:before,
.workouts section.workout .icon.group_N:before,
.workouts section.workout .icon.group_W:before {
    background-color: #f3a96d;
}

.workouts section.workout .icon.group_F,
.workouts section.workout .icon.group_O,
.workouts section.workout .icon.group_X {
    border-color: #f3716d;
}
.workouts section.workout .icon.group_F:before,
.workouts section.workout .icon.group_O:before,
.workouts section.workout .icon.group_X:before {
    background-color: #f3716d;
}

.workouts section.workout .icon.group_G,
.workouts section.workout .icon.group_P,
.workouts section.workout .icon.group_Y {
    border-color: #6de1f3;
}
.workouts section.workout .icon.group_G:before,
.workouts section.workout .icon.group_P:before,
.workouts section.workout .icon.group_Y:before {
    background-color: #6de1f3;
}

.workouts section.workout .icon.group_H,
.workouts section.workout .icon.group_Q,
.workouts section.workout .icon.group_Z {
    border-color: #c389f5;
}
.workouts section.workout .icon.group_H:before,
.workouts section.workout .icon.group_Q:before,
.workouts section.workout .icon.group_Z:before {
    background-color: #c389f5;
}

.workouts section.workout .icon.group_I,
.workouts section.workout .icon.group_R {
    border-color: #f5898b;
}
.workouts section.workout .icon.group_I:before,
.workouts section.workout .icon.group_R:before {
    background-color: #f5898b;
}

/***** GOALS *********************************/

.setting.goals {
    padding: 0;
}
.setting.goals .goaltype {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35px !important;
    cursor: pointer;
}
.setting.goals .goaltype h3 {
    font-size: 20px;
    margin-bottom: 10px;
    text-align: center;
    display: block;
    width: 100%;
}
.setting.goals .goaltype .infoheader {
    border: none;
}
.setting.goals .goaltype .infobody {
    width: 100%;
    border-top: 1px solid #eee;
}
.setting.goals .goaltype .button {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    background-color: #f3f8f9;
    border-color: transparent;
}
.setting.goals .goaltype .button:hover {
    background-color: transparent;
    border-color: transparent;
}
.setting.goals .goaltype:hover .button,
.setting.goals .goaltype.active .button {
    background-color: #d41e23;
    color: #fff !important;
}
.setting.goals .goaltype .button span.sLabel {
    display: none;
}
.setting.goals .goaltype:not(.active) .button {
    box-shadow: none;
    filter: saturate(0) brightness(178%);
}
.setting.goals .goaltype:not(.active) .button span {
    opacity: .5;
}
.setting.goals .goaltype:hover {
}
.setting.goals .goaltype.active .button span.sLabel {
    display: block;
}
.setting.goals .goaltype.active .button span.uLabel {
    display: none;
}
section.goaltabs .goaltab {
    display: none;
    padding: 25px;
    background-color: #ecf0f1;
    border-radius: 0 0 6px 6px;
    margin-bottom: 25px;
}
section.goaltabs .goaltab.active {
    display: block;
}
section.goaltabs .goal {
    padding: 27px 29px;
    margin-bottom: 25px;
    opacity: .75;
    background-color: white;
}
section.goaltabs .goal:last-child {
    margin-bottom: 0;
}
section.goaltabs .goal:hover,
section.goaltabs .goal.active {
    opacity: 1;
}
section.goaltabs .maintenance {
    margin-bottom: 0;
    margin-top: 20px;
}
section.tbr_calendar .goal.form-item label.radio,
section.goaltabs .goal.form-item label.radio {
    display: flex;
    padding-left: 65px;
    align-items: center;
}
section.goaltabs .goal.form-item label.radio strong {
    display: block;
    margin-bottom: 0;
    font-size: 22px;
    letter-spacing: 0.6px;
}

section.infopanel.pagetabs {
    margin: -28px -35px 30px -35px;
    border: 10px solid #fff;
    border-bottom: none;
    border-radius: 0;
}
.msg+section.infopanel.pagetabs {
    margin-top: 2px;
}
section.infopanel.pagetabs .infoheadertabs {
    background-color: #fff;
}
section.infopanel.pagetabs .infoheadertabs .infoheader {
    padding: 23px;
    justify-content: center;
    border-bottom: none;
    border-radius: 10px 10px 0 0;
    background-color: #ffffff;
    cursor: pointer;
}
section.infopanel.pagetabs .infoheadertabs .infoheader h2 {
    width: 100%;
    text-align: center;
    font-size: 18px;
    color: #9ca2af;
    cursor: pointer;
}
section.infopanel.pagetabs .infoheadertabs .infoheader:hover {
    background-color: #fcfcfc;
}
section.infopanel.pagetabs .infoheadertabs .infoheader:hover h2 {
    color: #333;
}
section.infopanel.pagetabs .infoheadertabs .infoheader:before {
    display: none;
}
section.infopanel.pagetabs .infoheadertabs .infoheader.active {
    background-color: #f4f8f9;
}
section.infopanel.pagetabs .infoheadertabs .infoheader.active h2 {
    color: #000;
}
section.infopanel.pagetabs .infoheadertabs .infoheader:not(.active):first-child {
    border-bottom-right-radius: 10px;
}
section.infopanel.pagetabs .infoheadertabs .infoheader:not(.active):last-child {
    border-bottom-left-radius: 10px;
}


section.tbr_calendar .goal .full_description {
    max-height: 0;
    padding: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
}
section.tbr_calendar .goal .full_description p {
    margin: 20px 0 0 0;
}
section.tbr_calendar .goal .full_description p strong {
    display: block;
    color: #000;
    margin-bottom: 5px;
}
section.tbr_calendar .goal input:checked ~ .full_description {
    max-height: 5000px;
    transition: max-height 1s ease-in-out;
}
section.tbr_calendar .goal.form-item label.radio {
    display: block;
    margin-left: 0;
    padding-left: 0;
}
section.tbr_calendar .goal.form-item label.radio h3 {
    margin-bottom: 20px;
    padding-top: 10px;
    padding-left: 57px;
}
section.tbr_calendar .goal.form-item label.radio h3 .plus-image {
    display: inline-block;
    display: none;
    margin-left: 20px;
    height: 15px;
}
section.tbr_calendar .goal.form-item label.radio h3 .plus-image img {
    display: block;
    max-height: 100%;
}

section.goaltabs .goal.form-item p {
    text-transform: none;
}
section.goaltabs .goal.form-item .description {
    margin-top: 10px;
    margin-bottom: 14px;
}
section.goaltabs .goal.form-item .description:last-child {
    margin-bottom: 0;
}
section.goaltabs .goal.form-item .description p {
    font-size: 15px;
}
section.goaltabs .goal.form-item p.expected,
section.goaltabs .goal.form-item p.example {
    margin-top: 11px;
    margin-bottom: 0;
    font-size: 15px;
}
section.goaltabs .goal.form-item p.expected strong,
section.goaltabs .goal.form-item p.example strong {
    font-weight: 500;
    color: #000;
}
section.goaltabs .weight-slider.form-item .currentWeight {
    left: calc(50% - 35.5px);
    opacity: .65;
}
section.tbr_calendar .empty,
section.tbr_calendar .goal {
    display: none;
}
section.tbr_calendar .empty.active,
section.tbr_calendar .goal.active {
    display: block;
}
section.tbr_calendar .goal.plus {
    position: relative;
}
section.tbr_calendar .goal.plus:before {
    position: absolute;
    content: 'plus';
    right: 4px;
    top: 6px;
    text-transform: uppercase;
    font-weight: 600;
    color: white;
    background-color: #f50002;
    padding: 6px 10px 5px 10px;
    line-height: 1;
    border-radius: 15px;
    letter-spacing: 0.7px;
}
section.tbr_calendar .goal.plus.plusUpgrade label {
    opacity: 0.2;
    pointer-events: none;
}
section.tbr_calendar .goal.plus.plusUpgrade .plusUpgradeLink
/*, section.tbr_calendar .goal.plus:after*/ {
    position: absolute;
    content: 'Coming Soon';
    display: flex;
    align-items: center;
    justify-content: center;
    top: calc(50% - 24px);
    left: calc(50% - 70px);
    font-size: 15px;
    font-weight: 500;
    width: 140px;
    text-align: center;
    height: 60px;
    border-radius: 40px;
    background-color: rgb(225, 234, 235);
    line-height: 1.15;
    padding: 0 40px;
    z-index: 10;
    color: #282323;
}

section.tbr_calendar .goal.plus.plusUpgrade:after {
    display: none;
}
section.tbr_calendar .goal.plus.plusUpgrade .plusUpgradeLink {
    content: 'Upgrade';
    cursor: pointer;
}

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

.recipeImage {
    position: relative;
    margin-bottom: 30px;
    border-radius: 4px;
    overflow: hidden;
    min-height: 60px;
}
.recipeImage img {
    display: block;
    width: 100%;
}
.recipeImage .recipeMacros {
    position: absolute;
    bottom: 10px;
    right: 10px;
    left: 10px;
    display: flex;
    justify-content: flex-end;
    z-index: 20;
}
.recipeImage .recipeMacros:first-child {
    bottom: 0px;
    right: 0px;
    left: 0px;
}
.recipeImage .recipeMacros .macro {
    display: inline-block;
    padding: 10px;
    background-color: #ffffff;
    color: #d41e23;
    font-family: 'Poppins';
    font-size: 20px;
    margin-left: 6px;
    line-height: 1;
    position: relative;
    font-weight: 600;
    width: 25%;
    border-radius: 4px;
}
.recipeImage .recipeMacros .macro:first-child {
    margin-left: 0;
}
.recipeImage .recipeMacros .macro span {
    font-size: 15px;
    display: inline-block;
    margin-left: 2px;
}
.recipeImage .recipeMacros .macro strong {
    font-size: 13px;
    display: block;
    margin-top: 6px;
    color: #3b3435;
}

.recipeIngredients strong {
    display: inline-block;
}

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

section.search {
}
section.search .form-item {
    margin-bottom: 0;
    overflow: hidden;
}
section.search .form-item input {
    border-radius: 3px 0 0 3px;
    height: 53.5px;
    border-right: none;
}
section.search .form-item button {
    width: 100%;
    font-size: 20px;
    padding-top: 14.5px;
    padding-left: 0;
    padding-right: 0;
    border-radius: 0 3px 3px 0;
}

/*** CHECKIN ***************************************************/

section.checkin #weight {
    width: calc(100% - 60px);
}
section.checkin .compliance-slider {
    padding-top: 10px;
}
section.checkin .adv-toggle {
    display: flex;
    align-items: flex-end;
}
section.checkin .adv-toggle a span.add-label { display: block; }
section.checkin .adv-toggle a span.remove-label { display: none; }
section.checkin .adv-toggle a.adv-visible span.add-label { display: none; }
section.checkin .adv-toggle a.adv-visible span.remove-label { display: block; }
section.checkin .adv-toggle .icon {
    margin-right: 7px;
    margin-left: -7px;
}
section.checkin .advanced {
    display: none;
}

section.checkin .act-toggle {
    display: flex;
    align-items: flex-end;
}
section.checkin .act-toggle a span.add-label { display: block; }
section.checkin .act-toggle a span.remove-label { display: none; }
section.checkin .act-toggle a.act-visible span.add-label { display: none; }
section.checkin .act-toggle a.act-visible span.remove-label { display: block; }
section.checkin .act-toggle .icon {
    margin-right: 7px;
    margin-left: -7px;
}
section.checkin .actual {
    display: none;
}
section.checkin .actual.actual_daily {
    margin-bottom: 20px;
}
section.checkin .actual.actual_daily .col-type {
    display: flex;
    align-items: center;
    justify-content: flex-end;

}
section.checkin .actual.actual_daily .col-input {
    width: calc(14.2% - 3%);
    margin-bottom: 0;
    padding: 10px 0;
}
section.checkin .actual.actual_daily .col-input input {
    width: 100%;
}
section.checkin .actual.actual_daily .actual_days strong {
    text-align: center;
    display: block;
    margin-bottom: 0px;
}

section.images input[type="file"] {
    width: 0;
    height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    display: inline-block;
    position: absolute;
}
section.images label {
    text-align: center;
}
section.images label+label {
    margin-bottom: 0;
    position: relative;
}
section.images label .flexcont .inner {
    position: relative;
    padding: 0;
    border-radius: 4px;
    overflow: hidden;
}
section.images label .flexcont .inner .progress {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background-color: #f20e0e;
    display: none;
    z-index: 4;
    transition: .05s ease width;
}
section.images label .flexcont .inner .button {
    width: 150px;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
}
section.images label .flexcont .inner .button strong {
    position: relative;
    z-index: 5;
    font-weight: 600;
}
section.images .image-preview {
    background-size: contain;
    width: 100%;
    height: 310px;
    background-repeat: no-repeat;
    background-position: center;
    transition: opacity .2s ease-in-out;
}
section.images .front .image-preview.gender-male {
    background-image: url('../img/placeholder-front-male.png');
}
section.images .side .image-preview.gender-male {
    background-image: url('../img/placeholder-side-male.png');
}
section.images .back .image-preview.gender-male {
    background-image: url('../img/placeholder-back-male.png');
}
section.images .front .image-preview.gender-female {
    background-image: url('../img/placeholder-front-female.png');
}
section.images .side .image-preview.gender-female {
    background-image: url('../img/placeholder-side-female.png');
}
section.images .back .image-preview.gender-female {
    background-image: url('../img/placeholder-back-female.png');
}
section.images .uploadcont {
    transition: opacity .2s ease-in-out;
}
section.images .uploadcont.uploading {
    opacity: .7;
    pointer-events: none;
}
section.images .uploadcont.uploading .flexcont .inner .progress {
    display: block;
}
section.images .uploadcont.uploaded .button {
    opacity: .5;
    transition: .2s ease-in-out opacity;
}
section.images .uploadcont.uploaded .button:hover {
    opacity: 1;
}

section.macros_table .td em {
    display: block;
    flex-basis: 100%;
    margin-top: 4px;
    opacity: .5;
}

/*** previewing ***************************************************/

body.previewing .stats,
body.previewing aside {
    display: none;
}
body.previewing aside+.innerwrapper {
    width: 100%;
}
body.previewing {
    padding-top: 64px;
}
body.previewing:before {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #d41e23;
    padding: 20px;
    font-family: 'Poppins';
    font-size: 30px;
    text-align: center;
    content: 'Previewing';
    z-index: 20;
    color: #fff;
}

/*** TRANSFORMATION IMAGE **************************************/

#transformationpic {
    background-color: #f5f8f9;
}

.transgen .options {
    margin-bottom: 30px;
}

/*** ACCOUNT ***************************************************/

body.loggedout header .rightheader {
    width: auto;
}
body.loggedout header .leftheader {
    display: none;
}
body.login#account .innerwrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}
body.login#account .innerwrapper .msg {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    max-width: 100%;
    z-index: 5;
}
body.login#account .innerwrapper a.logo {
    height: 60px;
    display: block;
    text-align: center;
    margin-bottom: 25px;
}
body.login#account .innerwrapper a.logo img {
    max-height: 100%;
}
section.login {
    width: 600px;
    padding: 45px;
    max-width: calc(100%);
    margin: 0 auto;
}
section.login .buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 40px;
}

#ob .innerwrapper {
    padding-top: 120px;
}
#ob .logo {
    position: relative;
    z-index: 500;
}
#ob .stats.obstats {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 20;
}
#ob .stats:first-child {
    display: none;
}
#ob .physique img {
    max-height: 200px;
}

body.notsubscribed .rightStats,
body.notsubscribed .vacation {
    display: none;
}

.introjs-tooltiptext h3 {
    margin-bottom: 15px;
}


.chatCol {
    /* display: flex; */
    position: relative;
    min-height: 700px;
}
section.chat {
    /* height: calc(100% - 45px); */
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
section.chat .infobody {
    padding: 0;
    height: calc(100% - 60px);
    display: flex;
    flex-direction: column;
}

section.chat .chatFilter {
    border-radius: 4px 4px 0 0;
    /* overflow: hidden; */
}
section.chat .chatFilter .filter {
    height: 49px;
    position: relative;
    cursor: pointer;
    margin: 0;
}
section.chat .chatFilter .filter input {
    position: absolute;
    top: 0;
    left: 10px;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: 0;
    z-index: 4;
    opacity: 0;
}
section.chat .chatFilter .filter input:after {
    display: none;
}
section.chat .chatFilter .filter span {
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #eee;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    border-right: 1px solid #fff;
    transition: all .2s ease-in-out;
    cursor: pointer;
}
section.chat .chatFilter .filter span em {
    width: 17px;
    height: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 9px;
    border-radius: 2px;
    background-color: rgba(255, 255, 255, 0.1);
    padding-top: 1px;
    margin-right: -21px;
    background-color: rgba(255, 255, 255, 0.9607843137254902);
    color: #292424;
    font-size: 12px;
    position: absolute;
    top: 15px;
    right: 35px;
}
section.chat .chatFilter .filter span em:before {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f00d";
}
section.chat .chatFilter .filter:last-child span {
    border: none;
}
section.chat .chatFilter .filter input:checked+span {
    background: linear-gradient(rgba(255,57,64,1) 0%, rgba(232,46,56,1) 47%, rgba(221,5,27,1) 53%, rgba(171,0,7,1) 100%);
    color: #fff;
}
section.chat .chatFilter .filter input:checked+span em:before {
    content: "\f00c";
}
section.chat .chatFilter .filter:hover span {
    filter: brightness(1.05);
}
section.infopanel .status {
    padding: 11px 15px;
    text-align: left;
    background-color: #1a8ef1;
    display: flex;
    align-items: center;
    justify-content: center;
}
section.infopanel .status:before {
    content: "\f086";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    margin-right: 16px;
    font-size: 25px;
    color: #fff;
}
section.infopanel .status.offline {
    background-color: #ff9134;
}
section.infopanel .status.online .textOffline,
section.infopanel .status.offline .textOnline {
    display: none;
}
section.infopanel .status.online .textOnline,
section.infopanel .status.offline .textOffline {
    display: block;
}

section.infopanel .status p {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
    line-height: 1.4;
}
section.chat .chatWindow {
    /* height: 600px; */
    overflow: auto;
    padding: 20px 20px 0px 20px;
    border-radius: 5px 5px 0 0;
    background-color: #ffffff;
    /* max-height: calc(100vh - 270px); */
    flex-grow: 1;
}
section.chat .chatWindow .messages .line {
    text-align: center;
    position: relative;
    margin-bottom: 10px;
}
section.chat .chatWindow .messages .line.hideDate {
    margin-bottom: 1px;
}
section.chat .chatWindow .messages .line.client {
    text-align: right;
}
section.chat .chatWindow .messages .line.trainer {
    text-align: left;
}
section.chat .chatWindow .messages .line p {
    position: relative;
    border-radius: 5px;
    margin-bottom: 0;
    background-color: #fff;
    padding: 10px 14px;
    display: inline-block;
    text-align: left;
}
section.chat .chatWindow .messages .line span.date {
    display: block;
    font-size: 11px;
    font-weight: 500;
    color: #c0c0c0;
    margin-top: -3px;
}
section.chat .chatWindow .messages .line span.date strong {
    color: #5c5c5c;
    display: inline-block;
    margin-right: 0px;
    font-weight: 600;
}
section.chat .chatWindow .messages .line.hideDate span.date {
    display: none;
}
section.chat .chatWindow .messages .line.client p {
    background-color: #dd1c1e;
    color: #fff;
}
section.chat .chatWindow .messages .line.trainer p {
    background-color: #f4f8f9;
    color: #000;
}
section.chat .chatWindow .messages .line.change p {
    background-color: #292424;
}
section.chat .chatWindow .messages .line.checkin .macros {
    margin-bottom: 1px;
    width: auto;
    display: inline-flex;
    min-width: 300px;
}
section.chat .chatWindow .messages .line.checkin .macros .macro {
    display: inline-block;
    padding: 11px 10px 10px 10px;
    background-color: #eee;
    border-right: 1px dotted #fff;
    flex-grow: 1;
}
section.chat .chatWindow .messages .line.checkin .macros .macro:first-child {
    border-radius: 6px 0 0 6px;
}
section.chat .chatWindow .messages .line.checkin .macros .macro:last-child {
    border-radius: 0 6px 6px 0;
}
section.chat .chatWindow .messages .line.checkin .macros .macro strong {
    text-align: center;
    display: block;
    line-height: 1;
    margin-bottom: 6px;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 0.5px;
    color: #a5a5a5;
}
section.chat .chatWindow .messages .line.checkin .macros .macro span {
    text-align: center;
    display: block;
    line-height: 1;
    font-weight: 500;
    font-size: 16px;
}
section.chat .chatWindow .messages .line.checkin .macros .macro span em {
    font-style: normal;
    font-size: 12px;
}
section.chat .enterMessage form {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    background-color: #ffffff;
    padding: 10px;
    border-radius: 0 0 5px 5px;
    border-top: 1px solid #eee;
}
section.chat .enterMessage textarea {
    height: 50px;
    margin-right: 10px;
    flex-grow: 1;
    box-shadow: none;
    border: none;
    background-color: white;
    border: 1px solid #eee;
    box-shadow: inset 0 1px 4px -2px rgba(0, 0, 0, 0.08), 0 -1px 1px #FFF, 0 1px 0 #FFF;
}
section.chat .enterMessage button {
    width: 100px;
}

section.coach {
    min-height: 300px;
}
section.coach .image .img {
    border-radius: 50%;
    overflow: hidden;
    background-color: #f4f8f9;
    border: 5px solid #f4f8f9;
}
section.coach .image .img img {
    display: block;
}
section.coach .text h3 {
    margin-bottom: 9px;
    font-size: 20px;
}

section.trainer_message textarea {
    height: 100px;
}

/**** Plus Page Options *********************************/

section.options .form-item > p {
    font-weight: 500;
    color: #292424;
}
section.options .option {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: space-between;
}
section.options .option label.radio,
section.options .option label.checkbox {
    margin-right: 4px;
    padding-left: 51px;
    /* flex-grow: 1; */
}
section.options .form-item.days label {
    margin: 35px 0 0 0;
    padding-left: 40px;
}
section.options .form-item.days label p {
    font-weight: 600;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #f6f6f6;
    font-size: 12px;
    line-height: 1;
    color: #222;
    padding-top: 2px;
    position: absolute;
    top: -40px;
    left: 4px;
}
section.options .form-item.days label input:checked+span+p {
    /* background-color: #ffe2e3; */
    /* color: #fff; */
}

/**** END Plus Page Options *********************************/

.plans {
    padding: 0;
}
.plans section.title {
    text-align: center;
    padding: 0;
    background: none;
    margin-bottom: 0px;
}
.plans section.title .plan {
    text-align: center;
    padding: 17px 15px 14px 15px;
    border-left: 1px solid #f4f8f9;
    background-color: #fff;
    border-bottom: 1px solid #f8f8f8;
}
.plans section.title .plan.basic {
    border-left: none;
    border-radius: 5px 0 0 0;
}
.plans section.title .plan.training,
.plans section.title .plan.plus {
    border-radius: 0 5px 0 0;
}
.plans section.title .plan h2 {
    font-size: 26px;
    margin-bottom: 10px;
}
.plans section.features {
    background-color: #fff;
    border-radius: 0;
    margin-top: 0;
    padding: 0;
    margin-bottom: 0;
}
.plans section.features .head {
    align-items: center;
    border-bottom: 1px solid #f8f8f8;
    background-color: #f8fbfb;
}
.plans section.features .head h3 {
    margin: 0;
    font-size: 20px;
}
.plans section.features .text {
    padding: 17px 15px 14px 20px;
    /* background-color: #ecf2f354; */
    background-color: #f8fbfb;
}
.plans section.features .plan {
    text-align: center;
    padding: 17px 15px 14px 15px;
    border-left: 1px solid #f4f8f9;
    background-color: white;
}
.plans section.features .plan.training .button,
.plans section.features .plan.basic .button {
    background: #868686;
    color: #292424;
}
.plans section.features .plan.plus {
    color: #c30110;
}
.plans section.features .feature {
    border-bottom: 1px solid #f4f8f9;
}
.plans section.features .feature:last-child {
}
.plans section.features .feature i.fa.disable {
    opacity: 0.1;
}

body.upsell,
#upsell {
    text-align: center;
}
#upsell header,
#upsell footer,
#upsell aside {
    display: none;
}
#upsell .bodywrapper {
    min-height: 100vh;
}
#upsell .outerwrapper {
    padding: 0;
}
#upsell .innerwrapper {
    width: 100%;
    background-image: url('../img/ob_bg.jpg');
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
    background-color: #000000;
}
#upsell .innerwrapper:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #232323;
    opacity: 0.85;
    z-index: 1;
}
#upsell .wrapper {
    margin: 0 auto;
    position: relative;
    z-index: 4;
}

body.upsell h1,
#upsell h1 {
    background-color: #e72b35;
    color: white;
    padding: 18px 14px 14px 14px;
    font-size: 32px;
    line-height: 1;
    border-radius: 5px;
    font-weight: 600;
}
body.upsell section,
#upsell section {
    padding: 35px 80px;
}
body.upsell section h2,
#upsell section h2 {
    font-size: 25px;
    margin-bottom: 14px;
}

body.upsell section h2+h2,
#upsell section h2+h2 {
    font-size: 35px;
}

body.upsell section ul,
#upsell section ul {
    text-align: left;
    margin: 32px 0 13px 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
body.upsell section ul li,
#upsell section ul li {
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 15px;
    padding-left: 58px;
    position: relative;
    min-height: 45px;
    display: flex;
    align-items: flex-start;
    line-height: 1.5;
    width: 48%;
}
body.upsell section ul li:before,
#upsell section ul li:before {
    position: absolute;
    left: 0;
    top: -5px;
    content: "\f00c";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    background-color: #f0323a;
    font-size: 23px;
    line-height: 1;
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
#countdown {
    margin-bottom: 25px;
}
#countdown .time {
    display: inline-block;
    margin: 0 5px;
}
#countdown span {
    display: flex;
    padding-top: 4px;
    background: #222;
    line-height: 1;
    font-size: 28px;
    color: #fff;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    border: 5px solid #444;
}
#countdown strong {
    display: block;
    width: 100%;
    margin-top: 3px;
    text-transform: uppercase;
}
body.upsell .button.cta,
#upsell .button.cta {
    padding: 16px 25px;
}
body.upsell .button.cta+p.small {
    margin-top: 10px;
    font-size: 11px;
}
body.upsell .button.cta p,
#upsell .button.cta p {
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    line-height: 1.3;
    padding: 0px 9px;
}
body.upsell .button.cta p strong,
#upsell .button.cta p strong {
    font-size: 16px;
    display: block;
    font-weight: 400;
}
body.upsell .decline,
#upsell .decline {
    text-align: center;
}
body.upsell .decline a,
#upsell .decline a {
    color: #ffffff;
}
body.upsell .transformations,
#upsell .transformations {
    margin: 45px 0 25px 0;
}
body.upsell .transformations .transformation,
#upsell .transformations .transformation {
    margin-bottom: 20px;
}
body.upsell .transformations .transformation img,
#upsell .transformations .transformation img {
    display: block;
}

body.plus section.goaltabs .goaltab {
    background-color: #f4f6f7;
}
body.plus #transformationpic,
body.plus section.infopanel.pagetabs .infoheadertabs .infoheader.active,
body.plus .innerwrapper {
    background-color: #ecf1f1;
    background: rgb(245,250,250);
    background: radial-gradient(circle, #f3f7f8 30%, #dce7e7 100%);
    background-attachment: fixed;
}

fieldset[disabled="disabled"] {
    padding: 0;
    margin: 0;
    border: none;
    opacity: .5;
    pointer-events: none;
}

.infopanel.notice .infobody {
    min-height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    text-align: center;
}
.infopanel.notice .infobody .inner {
    width: 500px;
    max-width: 100%;
}
.infopanel.notice .infobody .icon {
    height: 70px;
    margin-bottom: 17px;
}
.infopanel.notice .infobody .icon img {
    display: inline-block;
    max-height: 100%;
}



.infopanel.buy_training .infobody {
    display: flex;
    /*align-items: center;*/
    justify-content: space-between;
}
.infopanel.buy_training .infobody h3 {
    margin-bottom: 5px;
}
.infopanel.buy_training .infobody .image {
    background-size: cover;
    background-image: url('../img/plustraining.jpg');
    background-repeat: no-repeat;
    background-position: center;
    min-height: 300px;
    width: 400px;
    border-radius: 5px;
}

.infopanel.buy_training .infobody .button {
    margin-top: 20px;
}


section.userGuide a.userGuideItem {
    display: flex;
    align-items: center;
}
section.userGuide a.userGuideItem .image {
    width: 100px;
    margin-right: 10px;
    flex-shrink: 0;
}
section.userGuide a.userGuideItem .image img {
    display: block;
    border-radius: 3px;
}
section.userGuide a.userGuideItem h4 {
    font-size: 14px;
    margin-bottom: 4px;
    color: #d51e23;
    line-height: 1.4;
}
section.userGuide a.userGuideItem p.description {
    font-size: 12px;
    margin-top: 0px;
}

#measurementsModal .modalMessage .measurement {
    padding: 15px 0;
    background-color: #f7f7f7;
    border-radius: 3px;
}
#measurementsModal .modalMessage .measurement strong {
    font-size: 16px;
    font-weight: 600;
    display: block;
    text-align: center;
    margin-bottom: 3px;
}
#measurementsModal .modalMessage .measurement p {
    font-size: 15px;
    font-weight: 400;
    display: block;
    text-align: center;
}


.calendar_category {
    margin: 28px -21px 21px -21px;
    padding: 16px 21px;
    background: #3a3737;
}
.calendar_category:first-child {
    margin-top: -25px;
}
.calendar_category h4 {
    color: #ffffff;
    margin: 0;
    font-size: 1.1rem;
}