/* This stylesheet is used to style the public-facing components of the plugin. */
input#mark-attendance {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}
div#comments-table {
    margin-top: 20px;
}
div#ui-datepicker-div{
    /*top: 390px !important;*/
}
div.date-filter {
    width: 100%;
}
div.date-filter input[type="submit"] {
    padding-top: 5px;
    padding-bottom: 5px;
    background: #4CAF50;
}
div.dataTables_filter {
    margin-bottom: 10px;
}
div.dataTables_filter input,
div.date-filter input[type="text"] {
    height: 36px;
    /*margin-right: 50px;*/
    margin-left: 10px;
    padding: 0px 0px 0px 10px;
}
#free_eventContent td {
    padding: 0px;
}
#free_eventContent .free_label {
    font-weight: bold;
}
#free_users {
    list-style: none;
}
#wdm-snackbar {
    visibility: hidden;
    min-width: 250px;
    margin-left: -125px;
    background-color: #7bb54e;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 16px;
    position: fixed;
    z-index: 1;
    left: 50%;
    bottom: 30px;
    font-size: 17px;
}

#wdm-snackbar.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;} 
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;} 
    to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

.wdm-total-count {
    border-width: 0px;
    vertical-align: middle;
    width: unset;
}
.wdm-total-count td{
    border: 0px;
    padding: 0px 10px;
}
.wdm-level-filter-title {
    width: 50px;
    padding-top: 1%;
    padding-right: 1%;
    display: inline-block;
}
.hide-time {
    display: none !important;
}
td#userLevel {
    text-transform: capitalize;
}
.vc-attn-table-cell p {
    margin-bottom: 0px;
}
.user-classes{
    /*display:table;*/
    width:100%;
}
.user-classes-thead,
.vc-attn-table-heading,
.vc-cmnt-table-heading {
    display: table-row-group;
    font-weight: bold;
    background: #4CAF50;
    font-weight: 700;
    color: white;
}

.user-classes-tr,
.vc-attn-table-row,
.vc-cmnt-table-row {
    display: table-row;
}
.user-classes-td,
.vc-attn-table-head,
.vc-cmnt-table-head,
.vc-attn-table-cell,
.vc-cmnt-table-cell {
    display: table-cell;
    border-width: thin;
    vertical-align: middle;
    padding: 4px;
    text-align: center;
    border-bottom: 1px solid #9cffa1;
}
.classes-user-join-button{
    display: block;
    background: #4caf50;
    padding: 5px;
    text-align: center;
    border-radius: 2px;
    color: white !important;
}
.user-classes-tbody .user-classes-td{
    border-bottom: 1px solid #9cffa1;
}
.user-classes-tbody{
    display: table-row-group;
}
.user-classes-tbody > .user-classes-tr:nth-child(odd) {
    background-color: #f2f2f2
}
.user-classes-tbody > .user-classes-tr{
    border-bottom: 1px solid black;
}
.user-classes-tbody > .user-classes-tr:hover{
    background: #ddd;
}
.user-classes-caption {
    border: 1px solid #3fff3e;
    caption-side: bottom;
    background: #fefefe;
    /*display: table-caption;*/
    padding: 10px 0px;
}
.user-classes-caption > td {
    text-align: center;
}
.classes-user-list{
    list-style: none;
    margin: unset;
}
.inactive {
    pointer-events: none;
    cursor: default;
}
#wdm-container-calendar {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
#calendar {
    width: 65%;
}
#calendar-list {
    width: 35%;
}
.fc-head-container.fc-widget-header {
    background-color: #CDCDCD;
}
.fc-row.fc-widget-header > table {
    margin:0%;
}
.fc-day-header.fc-widget-header.fc-sun {
    background-color: #E88C2F;
}
.fc-day-header.fc-widget-header.fc-sat {
    background-color: #66BAD8;
}
.fc-day.fc-widget-content{
    background-color: #FFECB0;
}

#calendar-list .fc-toolbar.fc-header-toolbar {
    margin-bottom: 34px
}
#calendar .fc-scroller.fc-day-grid-container{
    overflow-y: hidden !important;
}
#calendar-list .fc-scroller {
    height: 434px !important;
}
.fc-event-container {
    margin-left:auto;
    margin-right:auto;
    height:auto;
    width:auto;
}
.fc-event-container > .fc-event.fc-start.fc-end.wdm-event {
    float:left !important;
    cursor: pointer;
}
.fc-bg .wdm-day {
    cursor: pointer;
    background-color: silver;
}

div.wdm-sections {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 1%;
    border: 1px solid #BBCCDD;
    margin-bottom: 2%;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    background-color:#edf3f6;
    border-radius: 4px;
}

#wdm-week-container .hide-ck {
    display: none;
}

.wdm-time-btn {
    border-radius: 14px;
    background-color: #d1d5d9;
    border: none;
    color: white;
    padding: 8px 12px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin: 4px 2px;
    cursor: pointer;
}

.btn-active {
    opacity: 1 !important;
}
.btn-inactive {
    color: black !important;
    background: #9B9C9F !important;
    opacity: 0.5 !important;
}

.fc-agenda-slots td div {
    height: 500px !important;
}
.fc-slats table{
    height: 500px;
}

.wdm-all-filter > label,
.wdm-level-filter-business > label,
.wdm-level-filter-daily > label,
.wdm-type-filter > label {
    border-radius: 3px;
    padding: 6px 10px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    overflow: hidden;
    cursor: pointer;
}
.wdm-level-filter{
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.wdm-level-filter label {
    color: white;
}

.wdm-type-filter > label {
    background-color: #bfbfbf;
    color: #1d1b1b;
}
.wdm-type-filter{
    padding-right: 20px;
}
.wdm-level-filter-business,
.wdm-level-filter-daily{
    margin: 0px 10px
}
#eventContent {
    max-height: 330px !important;
}
.level-basic {
    background-color: #42b547;
}
.fc-event-container > .fc-event.fc-start.fc-end.level-super {
    background-color: #009406;
}

.vc-week-class-desc, .vc-week-class-desc td, .vc-week-class-desc tr{
    border: 0px;
}
.vc-week-class-desc td {
    padding: 5px;
    width: 35%;
}
#vc_class_note{
    /*color: #CC0006;*/
}
.vc-hidden{
    display: none;
}
.ui-widget-header {
    background: #7bb54e;
    border: 0;
    color: #fff;
    font-weight: normal;
}
.ui-widget-content {
    background: #F9F9F9;
    border: 1px solid #c5c5c5;
    color: #222222;
}
.ui-dialog{
    width: 350px !important;
    padding: 0px;
    z-index: 9999 !important;
    position: fixed !important;
}
.ui-widget-overlay{
    background: red;
}

.wdm_success_message {
    border-left: 5px solid #4caf50;
    border-top: 1px solid #00ff00;
    border-right: 1px solid #00ff00;
    border-bottom: 1px solid #00ff00;
    background-color: #ffffff;
    padding: 5px 0px 5px 15px;
    margin-top: 5px;
    margin-bottom: 10px;
    position: relative;
}
.wdm_message_lable {
    color: #000000;
    width: 98%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.wdm_enroll_warning_message {
    border-left: 5px solid #ff5722;
    border-top: 1px solid #ff5722;
    border-right: 1px solid #ff5722;
    border-bottom: 1px solid #ff5722;
    background-color: #ffffff;
    padding: 5px 0px 5px 15px;
    margin-top: 5px;
    margin-bottom: 10px;
    position: relative;
}
.wdm_hide_message {
    display: none;
}
i.fa.fa-times-circle.wdm_msg_dismiss {
    float: right;
    cursor: pointer;
    position: absolute;
    right: 5px;
    top: 5px;
}
.ui-widget-overlay
{
    opacity: .50 !important;
    filter: Alpha(Opacity=50) !important;
    background-color: rgb(50, 50, 50) !important;
}
#vc-week-nav{
    margin: 10px;
}
#vc-week-nav-next{
    margin: 0px 5px;
    float: right;
}
.vc-bc-hidden{
    display: none !important;
}

.vc-table {
    /*display: table;*/
    width: 100%;
    /*table-layout: fixed;*/
    text-align: center;
}
.vc-table-cal {
    display: table;
    table-layout: fixed;
}
.vc-table-heading .vc-table-row {
    display: table-row !important;
}
.vc-table-row {
    display: table-row;
}
.vc-table-heading {
    display: table-header-group;
    background-color: #ddd;
}
.vc-table-cell, .vc-table-head {
    display: table-cell;
    padding: 2px;
    border-right: 1px solid #ffffff;
    background-color: #5D7886;
    color: #fff;
}
.vc-table-heading {
    display: table-header-group;
    background-color: #ddd;
}
.vc-table-foot {
    display: table-footer-group;
    font-weight: bold;
    background-color: #ddd;
}
.vc-table-body {
    display: table-row-group;
}
.vcclass_btn{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.vc-table-head.sat {
    background: #4DADDC;
}
.vc-table-head.sun {
    background: #DD5512;
}

.vc-table-row:nth-of-type(odd) .vc-table-cell {
    background-color: #E3EDF1;
}
.vc-table-row:nth-of-type(even) .vc-table-cell {
    background-color: #C7D9E0;
}

.vc-table-row:nth-of-type(odd) .vc-table-cell:first-of-type {
    background-color: #c2cdd3;
    color: #3B3B4D;
}
.vc-table-row:nth-of-type(even) .vc-table-cell:first-of-type {
    background-color: #93a5ae;
    color: #3B3B4D;
}
.vc-table-cell input {
    font-size: 11px;
    white-space: normal;
    font-weight: 400;
    text-transform: capitalize;
}
#vc-week-nav {
    overflow: auto;
}



.wdm-type-filter label[for=open],
.wdm-type-filter label[for=reservable],
.wdm-type-filter label[for=restricted],
.wdm-type-filter label[for=unrestricted] {
    color: black;
    margin: 0px;
    background: -webkit-linear-gradient(#e1e1e1,#e6e5e4,#afafaf);
    background: linear-gradient(#e1e1e1,#e6e5e4,#afafaf);
}

.business_beginner, .business_beginner:hover, .business_beginner:focus, .business_beginner:active {
    color: #fff !important;
    background: #29B6F6 !important;
    border: 1px solid #4f819a;
}
.business_basic, .business_basic:hover,.business_basic:focus,.business_basic:active {
    background: #03A9F4 !important;
    color: #fff !important;
    border: 1px solid #355d6f;
}
.business_advanced, .business_advanced:hover, .business_advanced:active, .business_advanced:focus {
    background: #0288D1 !important;
    color: #fff !important;
    border: 1px solid #335467;
}
.business_super, .business_super:hover, .business_super:active, .business_super:focus {
    background: #01579B !important;
    color: #fff !important;
    border: 1px solid #001221;
}

.business_all, .business_all:hover, .business_all:active, .business_all:focus {
    background: #F9AC49 !important;
    color: #fff !important;
    border: 1px solid #001221;
}
.business_25, .business_25:hover, .business_25:active, .business_25:focus {
    background: #ed3d11 !important;
    color: #fff !important;
    border: 1px solid #1e1f1d;
}
.daily_entry,
.daily_beginner, .daily_beginner:hover, .daily_beginner:active, .daily_beginner:focus {
    background: #9CCC65 !important;
    color: #fff !important;
    border: 1px solid #5d793d;
}
.daily_basic, .daily_basic:hover, .daily_basic:active, .daily_basic:focus {
    background: #7CB342 !important;
    color: #fff !important;
    border: 1px solid #435034;
}
.daily_advanced, .daily_advanced:hover, .daily_advanced:active, .daily_advanced:focus {
    background: #558B2F !important;
    color: #fff !important;
    border: 1px solid #41463b;
}

.daily_super, .daily_super:hover, .daily_super:active, .daily_super:focus {
    background: #33691E !important;
    color: #fff !important;
    border: 1px solid #1e1f1d;
}

.daily_all, .daily_all:hover, .daily_all:active, .daily_all:focus {
    background: #F9AC49 !important;
    color: #fff !important;
    border: 1px solid #1e1f1d;
}
.daily_asp, .daily_asp:hover, .daily_asp:active, .daily_asp:focus {
    background: #A824E5 !important;
    color: #fff !important;
    border: 1px solid #1e1f1d;
}
.daily_aspj, .daily_aspj:hover, .daily_aspj:active, .daily_aspj:focus {
    background: #A17C3E !important;
    color: #fff !important;
    border: 1px solid #1e1f1d;
}
.daily_25, .daily_25:hover, .daily_25:active, .daily_25:focus {
    background: #ed3d11 !important;
    color: #fff !important;
    border: 1px solid #1e1f1d;
}

.reservable {
    position: relative;
}

.reservable:before {
    content: "";
    position: absolute;
    display: block;
    z-index: 10;
    width: 23px;
    height: 12px;
    top: -3px;
    right: auto;
    left: -10px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    overflow: hidden;
    background: yellow;
}
.restricted {
    position: relative;
}
.restricted:after {
    content: "";
    position: absolute;
    display: block;
    z-index: 10;
    width: 8px;
    height: 21px;
    top: -6px;
    right: 0;
    bottom: 10px;
    left: auto;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    overflow: hidden;
    background: red;
}

.wdm-all-container-time label, .wdm-all-container label {
    border-radius: 3px;
    border: none;
    padding: 7px 28px;
    text-align: center;
    display: inline-block;
    font-size: 15px;
    margin: 4px 2px;
    cursor: pointer;
    margin-right: 30px;
}

.vcclass_btn{
    clear: both;
    margin: 1px 0px;
    padding: 5px;
    border-radius: 5px;
}
.buttontext {
    width: 105px;
    overflow: hidden;
    white-space: normal;
    display: block;
    text-overflow: ellipsis;
    color: white;
}
div#attendance-form {
    border: 2px solid #dddddd;
    border-radius: 3px;
    padding: 3%;
    margin: auto;
    width: 60%;
}

div.attn-form-display{
    display: none;
}
.attendance-form-row label {
    margin-right: 10%;
}
/*arrow styling week calendar*/
#vc-week-nav-prev,#vc-week-nav-next
{
    background-color: #f5f5f5;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    color: #333;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    border: 1px solid #dddddd;
    border-radius:4px;
    font-size:0;
    padding:0 10px;
}

.wdm-next:after,.wdm-prev:after
{
    font-weight: bold;
    font-size: 34px;
    top: -7%;
    position:relative;
}
.wdm-prev:after
{
    content: "\02039";
}
.wdm-next:after
{
    content: "\0203A";
}

span.wdm-next,span.wdm-prev,span.wdm-next:focus,span.wdm-prev:focus
{
    position: relative;
    top: -2.85px;
    margin: 3px;
    vertical-align: middle;
    display: inline-block;
    height: 22px;
    line-height: 30px;
    font-size: 30px;
    text-align: center;
    overflow: hidden;
    font-family: "Courier New", Courier, monospace;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*-------------------------------------Loading Gif via CSS----------------------------------------------------*/
.wdm-display
{
    display:block;
}
.wdm-hide
{
    display:none;
}
.wdm-loading-gif
{
    position: absolute;
    top: 0;
    display: none;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    z-index: 999;
}
.wdm-loading-gif:before
{
    content: "";
    background: rgba(0,0,0,0.4);
    width: 100%;
    height: 100%;
    display: block;
}

#floatingBarsG{
    position: fixed;
    width: 60px;
    height: 75px;
    margin: auto;
    top: -26%;
    right: 0;
    left: 0;
    bottom: 0;
}

.blockG{
    position:absolute;
    background-color:rgb(255,255,255);
    width:10px;
    height:23px;
    border-radius:8px 8px 0 0;
    -o-border-radius:8px 8px 0 0;
    -ms-border-radius:8px 8px 0 0;
    -webkit-border-radius:8px 8px 0 0;
    -moz-border-radius:8px 8px 0 0;
    transform:scale(0.4);
    -o-transform:scale(0.4);
    -ms-transform:scale(0.4);
    -webkit-transform:scale(0.4);
    -moz-transform:scale(0.4);
    animation-name:fadeG;
    -o-animation-name:fadeG;
    -ms-animation-name:fadeG;
    -webkit-animation-name:fadeG;
    -moz-animation-name:fadeG;
    animation-duration:1.2s;
    -o-animation-duration:1.2s;
    -ms-animation-duration:1.2s;
    -webkit-animation-duration:1.2s;
    -moz-animation-duration:1.2s;
    animation-iteration-count:infinite;
    -o-animation-iteration-count:infinite;
    -ms-animation-iteration-count:infinite;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-iteration-count:infinite;
    animation-direction:normal;
    -o-animation-direction:normal;
    -ms-animation-direction:normal;
    -webkit-animation-direction:normal;
    -moz-animation-direction:normal;
}

#rotateG_01{
    left:0;
    top:27px;
    animation-delay:0.45s;
    -o-animation-delay:0.45s;
    -ms-animation-delay:0.45s;
    -webkit-animation-delay:0.45s;
    -moz-animation-delay:0.45s;
    transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
}

#rotateG_02{
    left:8px;
    top:10px;
    animation-delay:0.6s;
    -o-animation-delay:0.6s;
    -ms-animation-delay:0.6s;
    -webkit-animation-delay:0.6s;
    -moz-animation-delay:0.6s;
    transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
}

#rotateG_03{
    left:25px;
    top:3px;
    animation-delay:0.75s;
    -o-animation-delay:0.75s;
    -ms-animation-delay:0.75s;
    -webkit-animation-delay:0.75s;
    -moz-animation-delay:0.75s;
    transform:rotate(0deg);
    -o-transform:rotate(0deg);
    -ms-transform:rotate(0deg);
    -webkit-transform:rotate(0deg);
    -moz-transform:rotate(0deg);
}

#rotateG_04{
    right:8px;
    top:10px;
    animation-delay:0.9s;
    -o-animation-delay:0.9s;
    -ms-animation-delay:0.9s;
    -webkit-animation-delay:0.9s;
    -moz-animation-delay:0.9s;
    transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
}

#rotateG_05{
    right:0;
    top:27px;
    animation-delay:1.05s;
    -o-animation-delay:1.05s;
    -ms-animation-delay:1.05s;
    -webkit-animation-delay:1.05s;
    -moz-animation-delay:1.05s;
    transform:rotate(90deg);
    -o-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
}

#rotateG_06{
    right:8px;
    bottom:7px;
    animation-delay:1.2s;
    -o-animation-delay:1.2s;
    -ms-animation-delay:1.2s;
    -webkit-animation-delay:1.2s;
    -moz-animation-delay:1.2s;
    transform:rotate(135deg);
    -o-transform:rotate(135deg);
    -ms-transform:rotate(135deg);
    -webkit-transform:rotate(135deg);
    -moz-transform:rotate(135deg);
}

#rotateG_07{
    bottom:0;
    left:25px;
    animation-delay:1.35s;
    -o-animation-delay:1.35s;
    -ms-animation-delay:1.35s;
    -webkit-animation-delay:1.35s;
    -moz-animation-delay:1.35s;
    transform:rotate(180deg);
    -o-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    -moz-transform:rotate(180deg);
}

#rotateG_08{
    left:8px;
    bottom:7px;
    animation-delay:1.5s;
    -o-animation-delay:1.5s;
    -ms-animation-delay:1.5s;
    -webkit-animation-delay:1.5s;
    -moz-animation-delay:1.5s;
    transform:rotate(-135deg);
    -o-transform:rotate(-135deg);
    -ms-transform:rotate(-135deg);
    -webkit-transform:rotate(-135deg);
    -moz-transform:rotate(-135deg);
}



@keyframes fadeG{
    0%{
        background-color:rgb(0,0,0);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}

@-webkit-keyframes fadeG{
    0%{
        background-color:rgb(0,0,0);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}
/*---------------------------loading gif via CSS --end-----------------------------------------------------------------------------*/

label[for=all-types] {
    background: -webkit-gradient( linear,left top, left bottom,from(#b48857),to(#7d3209));
    background: -webkit-linear-gradient( #b48857,#7d3209);
    background: linear-gradient( #b48857,#7d3209);
    color: #fff;
    border: 1px solid #46312c;
}
label[for=business_4] {
    background: -webkit-gradient(linear,left top, left bottom,from(#02659e),color-stop(#002d7e),to(#001a70));
    background: -webkit-linear-gradient(#02659e,#002d7e,#001a70);
    background: linear-gradient(#02659e,#002d7e,#001a70);
    border: 1px solid #020632;
}
label[for=business_3]{
    background: -webkit-gradient(linear,left top, left bottom,from(#2c94c6),color-stop(#1362b1),to(#105aaa));
    background: -webkit-linear-gradient(#2c94c6,#1362b1,#105aaa);
    background: linear-gradient(#2c94c6,#1362b1,#105aaa);
    border: 1px solid #333f79;
}
label[for=business_2]{
    background: -webkit-gradient(linear,left top, left bottom,from(#49bbf3),color-stop(#2aa3ee),to(#1998e3));
    background: -webkit-linear-gradient(#49bbf3,#2aa3ee,#1998e3);
    background: linear-gradient(#49bbf3,#2aa3ee,#1998e3);
    border: 1px solid #084ecd;
}
label[for=daily_1]{
    background: -webkit-gradient(linear,left top, left bottom,from(#aad45c),color-stop(#89c530),to(#73b816));
    background: -webkit-linear-gradient(#aad45c,#89c530,#73b816);
    background: linear-gradient(#aad45c,#89c530,#73b816);
    border: 1px solid #4ca618;
}
label[for=daily_2] {
    background: -webkit-gradient(linear,left top, left bottom,from(#b3de6a),to(#9ed640));
    background: -webkit-linear-gradient(#b3de6a,#9ed640);
    background: linear-gradient(#b3de6a,#9ed640);
    border: 1px solid #99c254;
}
label[for=daily_3] {
    background: -webkit-gradient(linear,left top, left bottom,from(#aad460),color-stop(#8ec534),to(#73ba12));
    background: -webkit-linear-gradient(#aad460,#8ec534,#73ba12);
    background: linear-gradient(#aad460,#8ec534,#73ba12);
    border: 1px solid #3d910c;
}
label[for=daily_4] {
    background: -webkit-gradient(linear,left top, left bottom,from(#8db44c),color-stop(#659d25),to(#5a9714));
    background: -webkit-linear-gradient(#8db44c,#659d25,#5a9714);
    background: linear-gradient(#8db44c,#659d25,#5a9714);
    border: 1px solid #34610b;
}
label[for=business_1] {
    background: -webkit-gradient(linear,left top, left bottom,from(#53bced),color-stop(#2aa4eb),to(#1197ea));
    background: -webkit-linear-gradient(#53bced,#2aa4eb,#1197ea);
    background: linear-gradient(#53bced,#2aa4eb,#1197ea);
    border: 1px solid #066cdb;
}
.wdm-time-btn:not(first-of-type).btn-active {
    background-color: #778899;
    color: #fff;
}
.wdm-time-btn {
    color: #9B9C9F;
}
.wdm-time-btn {
    opacity: 1;
}
.btn-active {
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2),inset 0 5px 30px rgba(0, 0, 0, 0.2);
}
#vc-attn-table .wdm-comments-list > ul,
#vc-cmnt-table .wdm-comments-list > ul {
    margin: 0;
    overflow: auto;
    /*overflow-y: scroll;*/
    /*max-height: 100px;*/
    list-style-type: none;
}
.wdm-comments-list {
    text-align: left;
    padding-left: 20px;
}
.attendance-form-row {
    margin-bottom: 10px;
}
.wdm-vc-select{
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #8ffd7c;
    border-radius: 4px;
    box-sizing: border-box;
    background: white;
}
.wdm-vc-select-filter {
    padding: 5px 10px;
    margin: 5px;
    display: inline-block;
    border: 1px solid #c7c5c5;
    border-radius: 4px;
    box-sizing: border-box;
    background: white;
}
.wdm-vc-filter-label {
    font-weight: bold;
}
#comments-section:hover,
#comments-section:focus,
#comments-section:active,
#comments-section,
#remarks-section:hover,
#remarks-section:focus,
#remarks-section:active,
#remarks-section {
    width: 100%;
    padding: 12px 20px;
    box-sizing: border-box;
    border: 1px solid #8ffd7c;
    border-radius: 4px;
    background-color: white;
    resize: none;
    margin: 10px 0px;
}

#submit_comment{
    background: #7bb54e;
}
#attendance-form label{
    font-weight: bold;
}
.wdm-comments-list ul{
    /*max-height: 250px;*/
    overflow: hidden;
    overflow-y:scroll;
}
.wdm-comment-filter,
.wdm-comment-section,
.wdm-remarks-section{
    padding: 10px;
    margin: 10px 0px;
}
#wdm-section-3 ul{
    list-style-type: none;
    margin: auto;
    padding: 0;
    overflow: hidden;

}
#wdm-section-3 li {
    float: left;
    margin: 0px 10px;
    /*background-color: #02d40a;*/
}
#wdm-section-3 li:hover,
#wdm-section-3 li:focus,
#wdm-section-3 li:active
{
    float: left;
    margin: 0px 10px;
    /*background-color: #009806;*/
}

/*#wdm-section-3 li a {
    display: block;
    color: white;
    text-align: center;
    padding: 8px;
    text-decoration: none;
}*/
.wdm-vcbc-class-disabled{
    pointer-events: none;
    cursor: default;
    background: #8bcc8c;
}

.wdm-ftr-enable:hover,
.wdm-ftr-enable:focus,
.wdm-ftr-enable:active,
.wdm-ftr-enable{
    margin: 4px 0px;
    background: green !important;
    padding: 8px !important;
    font-size: 15px;
    border-radius: 5px;
    border: 1px solid #0b6905 !important;
}
.wdm-ftr-disable:active,
.wdm-ftr-disable:focus,
.wdm-ftr-disable:hover,
.wdm-ftr-disable{
    margin: 4px 0px;
    padding: 8px !important;
    background: #5e5e5f !important;
    font-size: 15px;
    border-radius: 3px;
    border: 1px solid #464646 !important;
}

@media only screen and (max-width:1020px)
{
    .vcclass_btn,.buttontext
    {
        width:100%;
    }
}
@media only screen and (max-width:620px)
{
    .vcclass_btn,.buttontext
    {
        white-space: normal;
        font-size: 12px;
        padding: 1px;
    }
}

@media only screen and (max-width:512px)
{
    .wdm-level-filter-business, .wdm-level-filter-daily
    {
        margin:0 1px;
    }
    .wdm-all-filter > label, .wdm-level-filter-business > label, .wdm-level-filter-daily > label, .wdm-type-filter > label
    {
        /*font-size:12px;*/
    }
    div.wdm-sections
    {
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
    }
    .wdm-all-filter
    {
        text-align:center;
    }
}





.wdm-loading-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	background: rgba(0, 0, 0, 0.73);
	z-index: 999;
}

.wdm-cssload-loader {
	width: 49px;
	height: 49px;
	border-radius: 50%;
	margin: 3em;
	display: inline-block;
	position: relative;
	vertical-align: middle;
}

.wdm-cssload-loader {
	width: 49px;
	height: 49px;
	border-radius: 50%;
	display: inline-block;
	vertical-align: middle;
	background-color: rgb(15,189,35);
	z-index: 999;
	position: fixed;
	margin: auto;
	top: 0%;
	right: 0;
	left: 0;
	bottom: 0;
}
.wdm-cssload-loader,
.wdm-cssload-loader:before,
.wdm-cssload-loader:after {
	animation: 1.15s infinite ease-in-out;
		-o-animation: 1.15s infinite ease-in-out;
		-ms-animation: 1.15s infinite ease-in-out;
		-webkit-animation: 1.15s infinite ease-in-out;
		-moz-animation: 1.15s infinite ease-in-out;
}
.wdm-cssload-loader:before,
.wdm-cssload-loader:after {
	width: 100%; 
	height: 100%;
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 0;
}

.wdm-cssload-loader:before,
.wdm-cssload-loader:after {
		content: "";
}

.wdm-cssload-loader:before {
	content: '';
	border: 10px solid white;
	top: -10px;
	left: -10px;
	animation-name: cssload-animation;
		-o-animation-name: cssload-animation;
		-ms-animation-name: cssload-animation;
		-webkit-animation-name: cssload-animation;
		-moz-animation-name: cssload-animation;
}



@keyframes cssload-animation {
	0% { transform: scale(0); }
	100% { transform: scale(1); }
}

@-o-keyframes cssload-animation {
	0% { -o-transform: scale(0); }
	100% { -o-transform: scale(1); }
}

@-ms-keyframes cssload-animation {
	0% { -ms-transform: scale(0); }
	100% { -ms-transform: scale(1); }
}

@-webkit-keyframes cssload-animation {
	0% { -webkit-transform: scale(0); }
	100% { -webkit-transform: scale(1); }
}

@-moz-keyframes cssload-animation {
	0% { -moz-transform: scale(0); }
	100% { -moz-transform: scale(1); }
}

.vc-attn-table-cell ul{
    list-style: none;
    margin: unset;
    text-align: left;
}