@green        : #7ac143;
@blue         : #0096dd;

.notice {
    margin-left: 0;
}

.cursor-grab() {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

.transition() {
    -webkit-transition: .2 ease all;
    transition: .2s ease all;
}

.clear() {
    clear:both;
    float: left;
}

.font(@size: 16px, @weight: inherit, @family: Arial) {
    font-family: @family;
    font-weight: @weight;
    font-size: @size;
}

#wpwrap {
    background: #ececec;
}

.stachethemes-admin-style-flexbox {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stachethemes-admin-wrapper {
    .font(16px, 400);
    width: 100%;
    float: left;
    clear:both;

    #wp-description-wrap {
        float: left;
        width: 100%;
    }

    div,
    span,
    p {
        color:#202020;
    }

    * {
        box-sizing: border-box;
        text-transform: none;
        text-decoration: none;
    }


    .stachethemes-admin-section-box {
        width: 50%;
        float: left;
    }

    .stachethemes-admin-button-no-clear {
        clear: none !important;
        margin-left: 10px;
    }

    .stachethemes-admin-button {
        .font(12px, 700);
        line-height: 1.2;
        color:#fff;
        background: @green;
        padding: 18px 20px;
        border:none;
        border-radius: 4px;
        text-transform: uppercase;
        .transition;
        cursor: pointer;
        .clear;

        &:hover {
            background: @green + #111;
        }
    }

    .stachethemes-admin-button-a {
        .stachethemes-admin-button;
        text-decoration: none;
    }

    .blue-button {
        background: @blue;

        &:hover {
            background: @blue + #111;
        }
    }

    .small-button {
        .font(12px, 400);
        line-height: 1.2;
        padding: 9px 10px;
        text-transform: none;
    }

    .plus-button {

        position: relative;
        padding-left: 45px;

        &:before {
            color: #fff;
            content: "\f067";
            float: left;
            font-family: Font Awesome\ 5 Free;
            font-size: 25px;
            left: 15px;
            position: absolute;
            top: ~"calc(50% - 14px)";
        }
    }

    h1,h2,h3,h4,h5,h6 {
        .clear;
        font-weight: 400;
        line-height: 1.2;
        width: 100%;
        margin:0;
    }

    h1 {
        background: #202020;
        color:#fff;
        padding: 20px;
        border-radius: 4px;
        margin: 20px 0;
        .clear;
        margin-bottom: 0;
        width: ~"calc(100% - 20px)";
    }

    h1 {font-size: 19px;}
    h2 {.font(19px, 700); border-bottom: 1px solid #e3e3e3; padding-bottom: 20px; }
    h3 {font-size: 18px;}
    h4 {font-size: 16px;}
    h5 {font-size: 16px;}
    h6 {font-size: 16px;}

    .stachethemes-admin-textarea {
        height: 200px;
        line-height: 1.6;
        padding: 10px;
        border-radius: 4px;
        width: 600px;
        max-width: 100%;
        margin-bottom: 20px;
        border: 1px solid #e3e3e3 !important;
        background: #f8f8f8;
        resize: both;
        .font(16px, 300);
        .clear;
        box-shadow: none;
    }

    input[type="file"] {
        clear:both;
        float: left;
    }

    .stachethemes-admin-input {

        margin-left: 0;

        &:not([type="file"]):not([type="checkbox"]) {
            height: 50px;
            line-height: 50px;
            padding: 0 10px;
            border-radius: 4px;
            width: 400px;
            max-width: 100%;
            margin-bottom: 20px;
            background: #f8f8f8 !important;
            border: 1px solid #e3e3e3 !important;
            box-shadow: none;
            background: #ececec;
            .font(15px, 400);
            .clear;
            margin-right: 0;
        }

        &[multiple] {
            height: auto !important;
        }
        
        &[name="wc_product_list"] {
            margin-bottom: 0 !important;
        }
    }

    .stachethemes-admin-checkbox {
        .clear;
        margin: 16px 0;
    }

    .stachethemes-admin-checkbox-label {
        .font(15px, 600);
        float: left;
        line-height: 50px;
        margin-left: 10px;
        color:#666;
    }

    .stachethemes-admin-select {
        .stachethemes-admin-input;
        padding: 0 5px;

        option {
            padding: 10px;
        }

        optgroup {
            padding-top: 10px;
        }
    }


    .stachethemes-admin-colorpicker {
        width: 50px;
        min-width: 50px;
        height: 50px;
        border-radius: 4px;
        margin-bottom: 20px;
        font-size: 0;
        cursor: pointer;    
        border: 1px solid #e3e3e3 !important;
        /*.clear;*/
        margin-right: 10px;
        float: left;
    }

    .stachethemes-admin-info {
        width: 100%;
        .font(14px, 700);
        color:#666;
        .clear;

        i {
            font-size: 16px;
            color:#c5c5c5;
            position: relative;
            top:1px;
            margin-left: 2px;
        }
    }

    .stachethemes-admin-section {
        margin-top: 20px;
        background: #fff;
        float: left;
        width: ~"calc(100% - 20px)";
        padding: 50px;
        border-radius: 4px;

        .term {
            padding: 10px 10px;
            background: #fff;
            border: 1px solid rgba(0,0,0,0.1);
            color:#202020;
            float: left;
            font-size: 12px;
            margin-right: 5px;
            border-radius: 3px;
            margin-top: 10px;
            line-height: 1;
            cursor:default;
            > i {
                float: left;
                margin-right: 5px;
                color:inherit;
            }

            a {
                color: #bf1f1f;
                float :right;
                margin-left: 5px;
                font-size: 12px;

                i {
                    color:inherit;
                }
            }
        }
    }

    .stachethemes-admin-msg-notice {
        background: @green;
        .font(16px, 400);
        width: ~"calc(100% - 20px)";
        color:#fff;
        padding: 20px;
        border-radius: 4px;
        margin-bottom: 0;
        .clear;
        cursor: pointer;
    }

    .stachethemes-admin-msg-attention {
        .stachethemes-admin-msg-notice;
        background: @blue;

        a {
            font-weight: bold;
            text-decoration: underline;
            color:inherit;
        }

        cursor: default;
    }


    .stachethemes-admin-msg-error {
        .stachethemes-admin-msg-notice;
        background: #d64e07;
    }

    .stachethemes-admin-section-flex {
        display: flex;
        max-width: 100%;
        width: 400px;
        .clear;

        select {
            margin-left: 10px;
            min-width: 75px;
        }

    }

    .stachethemes-admin-clear {
        .clear;
    }

    .stachethemes-admin-section-step {
        float: left;
        width: 100%;
        display: none;
    }

    .stachethemes-admin-add-image {
        .stachethemes-admin-button;
        width: 100px;
        height: 100px;
        clear:none;
        background: none;
        border:1px solid #ececec;
        color:#202020;
    }

    .stachethemes-admin-add-image:hover {
        color: @green;
        border-color: @green;
        background: none;
    }

    .stachethemes-admin-image-container {
        width: 100px;
        height: 100px;
        border-radius: 4px;
        overflow: hidden;
        float: left;
        margin-right: 10px;
        position: relative;
        margin-bottom: 10px;
    }

    ul[data-single="1"] li {
        margin:0;
    }

    .stachethemes-admin-image-container img {
        width: 100px;
        height: 100px;
        float: left;
        .cursor-grab();
    }

    .stachethemes-admin-image-container i {
        display: none;
        position: absolute;
        width: 30px;
        height: 30px;
        top:0;
        right: 0;
        font-size: 35px;
        color: #d64e07;
        cursor: pointer;
    }

    .stachethemes-admin-image-container:hover i {
        display: block;
    }

    .stachethemes-admin-step-separate {
        width: 100%;
        float: left;
        border-top: 1px solid #e3e3e3;
        margin-bottom: 20px;
    }

    .stachethemes-admin-section-step-checkpoints {
        display: flex;
        justify-content: space-between;
        width: 100%;
        .clear;
    }

    .stachethemes-admin-section-step-checkpoints li {
        float: left;
        width: 100%;
        height: 30px;
        position: relative;
    }

    .stachethemes-admin-section-step-checkpoints li::after {
        background: #ececec;
        content: "";
        height: 4px;
        left: 15px;
        position: absolute;
        top: ~"calc(50% - 2px)";
        width: 100%;
        z-index: 0;
    }

    .stachethemes-admin-section-step-checkpoints li:last-child::after {
        display: none;
    }

    .stachethemes-admin-section-step-checkpoints li p {
        width: 30px;
        height: 30px;
        border-radius: 100%;
        background: #ececec;
        color:#999;
        text-align: center;
        line-height: 30px;
        margin:0;
        position: relative;
        z-index: 1;
        .transition;
    }

    .stachethemes-admin-section-step-checkpoints li:last-child {
        width: 30px;
    }

    .stachethemes-admin-section-step-checkpoints li:first-child p,
        .stachethemes-admin-section-step-checkpoints li.complete p,
        .stachethemes-admin-section-step-checkpoints li.complete::after,
        .stachethemes-admin-section-step-checkpoints li.complete + li p 
        {
        background: @blue;
        color:#fff;
    }

    .stachethemes-admin-section-step-checkpoints li.complete {
        cursor: pointer
    }

    .stachethemes-admin-section-step-checkpoints li.complete p:hover  {
        background: @green;
    }

    .stachethemes-admin-section-nobg {
        background: none;
        padding: 0;
    }

    .stachethemes-admin-tabs-list {
        width: 100%;
        .clear;
        margin-bottom: 0;
        position: relative;
        top: 15px;
        margin-top: 10px;
    }

    .stachethemes-admin-tabs-list li {
        margin-top: 5px;
        float: left;
        background: #f6f6f6;
        margin-right: 5px;
        padding: 15px 20px;
        border-radius: 4px;
        margin-bottom: 0;
        position: relative;
        .font(12px, 700);
        text-transform: uppercase;
        cursor: pointer;
    }

    .stachethemes-admin-tabs-list li::after {
        content: "";
        background: #fff;
        position: absolute;
        width: 100%;
        height: 20px;
        top: 100%    ;
        left:0;
        display: none;
    }

    .stachethemes-admin-tabs-list li.active {
        border-radius: 6px 6px 0 0;
        background: #fff;
    }

    .stachethemes-admin-tabs-list li.active::after {
        display: block;
    }

    .stachethemes-admin-section-tab {
        display: none;
    }


    .stec-list-bulk {

        + .stec-list { margin:0; }

        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 6px;
        margin:0;
        margin-top: 20px;
        height: 60px;

        div {
            margin:0;
            margin-left: 20px;

            form {
                float: left;

                .export-all-items:hover i,
                    .export-all-items:hover p {
                    color: #0096dd;
                }

                button {
                    float: left;
                    background: none;
                    border:none;
                    cursor: pointer;

                    p,i {
                        .transition;
                    }

                    &:hover i,
                        &:hover p {
                        color:#d64e07;
                    }

                }
            }

            input {
                float: left;
                margin:0;
                line-height: 1;
            }

            p {
                color:#666;
                float: left;
                margin:0;
                line-height: 1.5;
                .font(12px, 600);
                margin-left: 10px;
                i {
                    color:#666;
                    margin-right: 10px;
                    font-size: 16px;
                    float: left;
                    margin-left: 20px;
                }
            }
        }
    }

    .stec-list {

        margin:0;
        margin-top: 20px;

        width: 100%;
        .clear;


        li {
            list-style: none !important;
            height: 60px;
            width: 100%;
            display: flex;
            align-items: center;
            padding: 0 6px;
            border-radius: 4px;
            justify-content: space-between;

            .clear;

            .calinfo {
                input[type="checkbox"] {
                    float: left;
                    margin-left: 20px;
                    margin-right: 20px;
                    margin-top:0;
                }

                display: flex;
                align-items: center;
            }

            .title {
                text-indent: 10px;
                float: left;
                .font(14px);
                color:#202020;

                &.no-indent {
                    text-indent: 0;
                }
                a {
                    float: left;
                    color: inherit;
                    transition: none;
                    &:hover {
                        color:#0096dd;
                    }
                }

                .fa-map-marker-alt {
                    color:inherit;
                    margin-right: 5px;
                }
            }

            .color {
                border-radius: 4px;
                float: left;
                height: 46px;
                width: 46px;

                i {
                    width: 100%;
                    text-align: center;
                    color:#fff;
                    font-size: 20px;
                    line-height: 46px;
                }
            }

            .ctrl {

                display: none;

                > ul {
                    float: left;
                    margin:0;
                    padding:0;

                    > li {
                        position: relative;

                        ul {
                            min-width: 200px;
                            background: #fff;
                            position: absolute;
                            top:56px;
                            right:0;
                            border-radius: 4px;

                            li {
                                height: auto;
                                a {
                                    width: 100%;
                                }
                            }
                        }

                        &:hover {

                            ul {
                                display: block;
                            }
                        }
                    }

                    li {
                        margin:0;
                        padding:0;

                        ul {
                            a {
                                margin:0;
                            }
                        }
                    }

                    ul {
                        display: none;
                    }
                }

                a {
                    float: left;
                    .font(12px, 700);
                    text-transform: uppercase;
                    margin-left: 6px;
                    background: #fff;
                    border-radius: 4px;
                    padding: 0 20px;
                    height: 46px;
                    line-height: 46px;
                }
            }
        }

        li:hover {
            background: #6d6e70;

            .title {
                color:#fff;
            }

            .ctrl {

                display: flex;
                justify-content: space-between;
                align-items: center;

                a {
                    color:#202020;
                    .transition;
                }

                a:hover {
                    background:@green;
                    color:#fff;
                }
            }

        }

    }

    .stachethemes-admin-flex-head {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 6px 6px 6px 20px;
    }

    .stachethemes-admin-section-custom-head h2 {
        color:#fff;
        width: auto;
    }

    /* Schedule */

    .add-schedule-timespan {
        margin-top: 20px;
        margin-bottom: 20px;
        background: @blue;
        padding-left: 45px;
        position: relative;
    }

    .add-schedule-timespan:hover {
        background: @blue + #111;
    }

    .add-schedule-timespan::before {
        color: #fff;
        content: "\f067";
        float: left;
        font-family: Font Awesome\ 5 Free;
        font-size: 25px;
        left: 15px;
        position: absolute;
        top: ~"calc(50% - 14px)";
    }

    .stachethemes-admin-schedule-timespan {
        width: 100%;
        margin-top: 20px;
        .clear;
        border-radius: 4px;
        border: 1px solid #ececec;
    }

    .stachethemes-admin-schedule-timespan:hover {
        border: 1px solid @blue;
    }

    .stachethemes-admin-schedule-toggle-wrap {
        padding: 20px;
    }

    .stachethemes-admin-schedule-timespan-head {
        padding: 6px;
        padding-left: 20px;
        border-bottom: 1px solid #ececec;
        .clear;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .stachethemes-admin-schedule-timespan-title span {
        .font(12px, 700);
        text-transform: uppercase;
    }

    .stachethemes-admin-schedule-timespan-remove {
    }

    .stachethemes-admin-schedule-toggle-btn {
    }

    /* Guests */

    .add-guests-guest {
        margin-top: 20px;
        margin-bottom: 20px;
        background: @blue;
        padding-left: 45px;
        position: relative;
    }

    .add-guests-guest:hover {
        background: @blue + #111;
    }

    .add-guests-guest::before {
        color: #fff;
        content: "\f067";
        float: left;
        font-family: Font Awesome\ 5 Free;
        font-size: 25px;
        left: 15px;
        position: absolute;
        top: ~"calc(50% - 14px)";
    }

    .stachethemes-admin-guests-guest {
        width: 100%;
        margin-top: 20px;
        .clear;
        border-radius: 4px;
        border: 1px solid #ececec;
    }

    .stachethemes-admin-guests-guest:hover {
        border: 1px solid @blue;
    }

    .stachethemes-admin-guests-toggle-wrap {
        padding: 20px;
    }

    .stachethemes-admin-guests-guest-head {
        padding: 6px;
        padding-left: 20px;
        border-bottom: 1px solid #ececec;
        .clear;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .stachethemes-admin-guests-guest-title span {
        .font(12px, 700);
        text-transform: uppercase;
    }

    .stachethemes-admin-section-flex-guest-social {
        display: flex;
        max-width: 400px;
        width: 100%;
        .clear;
    }

    .stachethemes-admin-section-flex-guest-social select {
        width: 150px;
    }

    .stachethemes-admin-section-flex-guest-social input {
        width: 100%;
        margin-left: 10px;
    }

    .stachethemes-admin-guests-social-remove {
        color:#c5c5c5;
        font-size: 30px;
        float: right;
        width: 30px;
        height: 30px;
        line-height: 50px;
        margin-left: 10px;
        cursor: pointer;
        .transition;

        &:hover {
            color: #d64e07;
        }
    }

    .add-guests-soclink {
        margin-bottom: 20px;
        position: relative;
        padding-left: 55px;

        &:before {
            color: #202020;
            content: "\f234";
            float: left;
            font-family: Font Awesome\ 5 Free;
            font-size: 25px;
            left: 15px;
            position: absolute;
            top: ~"calc(50% - 14px)";
            .transition;
        }

        &:hover:before {
            color:@green;
        }
    }

    .link-button {
        padding-left:0;
        padding-right: 0;
        text-transform: none;
        background: none;
        color:@blue;
        &:hover {
            background: none;
            color:@blue + #333;
        }
    }

    .light-btn {
        background: none;
        border: 1px solid #ececec;
        color:#202020;
        min-width: 120px;

        &:hover {
            background: none;
            border-color: @green;
            color: @green;
        }
    }

    .uninvite-user {
        &:hover {
            color:#d64e07;
            border-color:#d64e07;
        }
    }

    .light-btn.expand {
        display: none;
    }

    .light-btn.expand:hover,
        .light-btn.collapse:hover {
        border-color: @green;
        color: @green;
        background: none;
    }

    .light-btn.delete:hover {
        border-color: #d64e07;
        color: #d64e07;
        background: none;
    }

    .stachethemes-admin-schedule-collapse {

        .light-btn {
            display: block;
        }

        .light-btn.collapse {
            display: none;
        }

        .stachethemes-admin-schedule-toggle-wrap {
            display: none;
        }

        .stachethemes-admin-schedule-timespan-head {
            border:none;
        }
    }

    .stachethemes-admin-guests-collapse {

        .light-btn {
            display: block;
        }

        .light-btn.collapse {
            display: none;
        }

        .stachethemes-admin-guests-toggle-wrap {
            display: none;
        }

        .stachethemes-admin-guests-guest-head {
            border:none;
        }
    }

    .stachethemes-admin-separator {
        clear: both;
        float: left;
        margin-top: 20px;
        width: 100%;
    }

    .stachethemes-admin-section-tab {
        width: 100%;
        .clear;
    }

    /* organizer */

    .stec-admin-new-organizer {
        .status {
            display: none;
        }

        border-bottom: 1px solid rgba(0,0,0,0.1);
        padding-bottom: 30px;
        width: 100%;
        float: left;

    }

    .stachethemes-admin-section-flex-organizer-social {
        display: flex;
        max-width: 400px;
        width: 100%;
        .clear;
    }

    .stachethemes-admin-section-flex-organizer-social select {
        width: 150px;
    }

    .stachethemes-admin-section-flex-organizer-social input {
        width: 100%;
        margin-left: 10px;
    }

    .stachethemes-admin-organizers-social-remove {
        color:#c5c5c5;
        font-size: 30px;
        float: right;
        width: 30px;
        height: 30px;
        line-height: 50px;
        margin-left: 10px;
        cursor: pointer;
        .transition;

        &:hover {
            color: #d64e07;
        }
    }

    .add-organizers-soclink {
        margin-bottom: 20px;
        position: relative;
        padding-left: 55px;

        &:before {
            color: #202020;
            content: "\f234";
            float: left;
            font-family: Font Awesome\ 5 Free;
            font-size: 25px;
            left: 15px;
            position: absolute;
            top: ~"calc(50% - 14px)";
            .transition;
        }

        &:hover:before {
            color:@green;
        }
    }

    /* attachments */

    .add-attachments-attachment {
        margin-top: 20px;
        margin-bottom: 20px;
        background: @blue;
        padding-left: 45px;
        position: relative;
    }

    .add-attachments-attachment:hover {
        background: @blue + #111;
    }

    .add-attachments-attachment::before {
        color: #fff;
        content: "\f067";
        float: left;
        font-family: Font Awesome\ 5 Free;
        font-size: 25px;
        left: 15px;
        position: absolute;
        top: ~"calc(50% - 14px)";
    }

    .stachethemes-admin-attachments-attachment {
        width: 100%;
        margin-top: 20px;
        .clear;
        border-radius: 4px;
        border: 1px solid #ececec;
    }

    .stachethemes-admin-attachments-attachment:hover {
        border: 1px solid @blue;
    }

    .stachethemes-admin-attachments-toggle-wrap {
        padding: 20px;
    }

    .stachethemes-admin-attachments-attachment-head {
        padding: 6px;
        padding-left: 20px;
        .clear;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .stachethemes-admin-attachments-attachment-title span {
        .font(12px, 700);
        text-transform: uppercase;
    }
    

    /* woocommerce item */

    .stachethemes-admin-woocommerce-product {
        width: 100%;
        .clear;
        border-radius: 4px;
        border: 1px solid #ececec;
        margin-top: 20px;

        &:hover {
            border-color: @blue;
        }
    }

    .stachethemes-admin-woocommerce-product-head {
        padding: 6px;
        padding-left: 20px;
        .clear;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .stachethemes-admin-woocommerce-product-title span {
        .font(12px, 700);
        text-transform: uppercase;
    }

    .desc {
        clear:both;
        .font(14px);
        float: left;
    }

    .stachethemes-admin-select + .desc,
    .stachethemes-admin-input + .desc {
        margin-top:0;
    }

    .stec-text-red {
        color:#f15e6e;
    }

    .stec-activator-status {
        display: none;


        i {
            color: inherit;
            margin-right: 5px;
        }

        span {
            color: inherit;
        }
    }

    .stec-list-sub-title,
    .stec-event-timespan {
        clear:both;
        float: left;
        font-size: 12px;
        color:#999;
    }

    .stec-list li:hover {
        .stec-list-sub-title,
        .stec-event-timespan {
            color:#fff;
        }
    }

    .stachethemes-admin-link-text {
        .font(14px, 700);
        .clear;
        margin: 10px 0;
    }

    .icon_date {
        width: 46px;
        height: 46px;
        float: left;
        line-height: 1;
        text-align: center;
        font-size: 28px;
        color:#fff;
        margin-top: 4px;

        span {
            font-size: 10px;
            text-transform: uppercase;
            color:#fff;
            width: 100%;
            float: left;
        }
    }

    .icon_image {
        width: 46px;
        height: 46px;
        background-size: cover;
        float: left;
        border-radius: 3px;
    }
}

.notice-info {
    margin: 20px 0 0;
    width: calc(100% - 20px);
    box-sizing: border-box;
}

.stec-repeater-popup-bg {
    background: #000;
    position: fixed;
    z-index: 9990;
    opacity: 0.5;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    display: none;
}

.stec-repeater-popup {
    position: fixed;
    left:  ~"calc(50% - 275px)";
    top:  ~"calc(50% - 250px)";
    display: none;
    background: #fff;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    padding: 20px;
    box-sizing: border-box;
    z-index: 9999;
    border-radius: 3px;

    th {
        vertical-align: text-top;
    }

    .stec-repeater-popup-repeat-advanced {
        display: none;
    }

    .stec-repeater-popup-exdate-datelist-template {
        display: none !important;
    }

    .stec-repeater-popup-exdate-datelist-submit-value {
        display: none;
    }

    .stec-repeater-popup-exdate-options {
        a {
            font-size: 14px;

            &.stec-remove-exdate {
                color:#f15e6e;
                opacity: 0;
            }
        }

        .stec-repeater-popup-exdate-datelist {

            margin:0;

            li {

                margin-left: 3px;
                margin-bottom: 0;

                span {
                    font-size: 14px;
                }

                &:nth-child(2) {
                    margin-top: 5px;
                }

                &:hover {
                    a {
                        opacity: 1;
                    }
                }
            }
        }
    }
}

p.stec-repeater-summary {
    width: 100%;
    .font(14px, 700);
    color:#666;
    .clear;

    span {
        color: #0096dd;
    }
}

.stec-repeater-popup {

    width: 550px;

    select {
        min-width: 100px;
    }

    tr {
        margin-bottom: 10px;
        float: left;
        clear: both;
    }  


    select,
    input {
        border:1px solid #ccc;
        box-shadow: none;
        background:#fff;
    } 

    .stec-repeater-popup-endson-options {
        span {
            align-items: center;
            clear: both;
            display: flex;
            float: left;
            line-height: 1.5;
        }
    }

    .stec-repeater-popup-repeat-on {
        span {
            line-height: 1;
            input {
                margin:0;
            }
        }
    }

    th {
        width: 150px;
        text-align: left;
    }

    .stec-repeater-popup-weekdays {
        display: none;
    }

    .stec-repeater-popup-buttons {
        margin-top: 20px;
    }

    input:disabled {
        background: #ececec;
    }

    .wp-editor-wrap {
        float: left;
        width: 100%;
        margin-bottom: 20px;
    }
    .stachethemes-admin-add-image-list {
        float: left;
    }
    .stachethemes-admin-add-image {
        margin-bottom: 20px;
    }
}

.stachethemes-admin-section-flex-margin {
    input {
        width: 100% !important;
    }

    input:not(:last-child) {
        margin-right: 10px !important;
    }

    div:not(:last-child) {
        margin-right: 10px !important;
    }
}

#wp-wc_book_create_ticket_description-wrap {
    float: left;
    width: 100%;
}

.stec-create-ticket-form-add-field-template {
    display: none !important;
}

.stec-create-ticket-form-remove-field {
    position: relative;
    top: 15px;
    cursor: pointer;
    height: 25px;

    &:hover {
        color:#f15e6e;
    }
}

.stachethemes-admin-tickets-list {
    margin-top: 70px;
    width: 100%;
    float: left;
}

.stec-ticket-list {
    input[type="checkbox"] {
        margin-right:0 !important;
        position: relative;
        top: 3px;
    }
}

select[name="wc_book_create_ticket_stop_purchase[units]"],
input[name="wc_book_create_ticket_stop_purchase[value]"] {
    width: 100px !important;
}

.stec-duplicate-select-language-back {

}
.stec-duplicate-select-language {

    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: rgba(0,0,0,0.5);
    left:0;
    top:0;

    .stec-duplicate-select-language-pop {
        position: fixed;
        top: 50%;
        left: 50%;
        margin-left: -200px;
        margin-top: -50px;
        background: #fff;
        border-radius: 3px;
        border: 1px solid #ececec;
        padding: 20px;

        .stachethemes-admin-info {
            margin-top: 0;
        }

        .stec-duplicate-select-language-close {
            position: absolute;
            right: 10px;
            top: 10px;
            cursor: pointer;

            &:hover {
                color:#f15e6e;
            }
        }
    }
}

.stec-icon-image-list {
    width: 100%;
    max-width: 800px;
    float: left;
    clear:both;

    .stachethemes-admin-add-image-list {
        margin:0;
    }
}

.stec-icons-list ul {
    width: 100%;
    max-width: 800px;
    float: left;
    clear:both;
    max-height: 207px;
    overflow-y: auto;
    margin:0;
    margin-left: -1px;

    li {
        float: left;
        width: 50px;
        height: 50px;
        border: 1px solid #ececec;
        line-height: 50px;
        text-align: center;
        color:#666;
        padding:0;
        margin:1px;
        font-size: 16px;

        &:hover {
            background-color: #ececec;
            cursor: pointer;
        }

        &.active {
            background-color: @blue;
            cursor: pointer;
            color:#fff;
        }
    }
}

.stachethemes-doc-wrapper {
    box-sizing: border-box;

    * {
        box-sizing: border-box;
    }
}

.stachethemes-doc-wrapper {
    border-radius: 4px;
    width: 100%;
}

.stachethemes-doc-wrapper h1 {
    background: #202020;
    color: #fff;
    padding: 20px;
    border-radius: 4px;
    margin: 20px 0;
    margin-bottom: 20px;
    clear: both;
    float: left;
    margin-bottom: 0;
    width: ~'calc(100% - 20px)';
    font-family: Arial;
}

.stachethemes-doc-section {
    margin-top: 20px;
    background: #fff;
    float: left;
    width: ~'calc(100% - 20px)';
    padding: 50px;
    border-radius: 4px;
}

.stachethemes-doc-section h3 {
    width: 100%;
    font-family: Arial;
    font-weight: 700;
    font-size: 17px;
    color: #666;
    clear: both;
    float: left;
    margin-bottom: 0;
}

.stachethemes-doc-section h3 a { 
    float:right;
    padding:10px 15px;
    background-color: #d42323;
    border-radius: 3px;
    color:#fff;
    text-decoration: none;
    font-size: 12px;
}

.stachethemes-doc-section h3 a:hover { 
    background-color:#bf1f1f;
}

.stachethemes-doc-section p {
    width: 100%;
    font-family: Arial;
    font-weight: 700;
    font-size: 14px;
    color: #666;
    clear: both;
    float: left;
}

.stachethemes-doc-section-left-half {
    width:40%;
    float:left;
}

.stachethemes-doc-section-left-half i {
    color:#c9c9c9;
    margin-right:5px;
}

.stachethemes-doc-section-left-half ul {
    width:90%;
    padding:20px;
    border:1px solid #eaeaea;
    border-radius: 5px;
    float:left;
    margin-top:15px;
    font-family: Arial;
    font-size: 14px;
    margin-bottom: 25px;
}

.stachethemes-doc-section-left-half li {
    list-style-type: none;	
}

.stachethemes-doc-section-left-half li a { 
    color:#0073aa;
    text-decoration: none;
}

.stachethemes-doc-section-left-half li a:hover { 
    color:#0073aa;
    text-decoration: underline;
}

.stachethemes-doc-section-right-half {
    width:60%;
    float:left;
}

.stachethemes-doc-section-right-half-row {
    clear: both;
    padding: 0px;
    margin: 0px;
}

#tools-permalinks-status {
    float: left;
    width: 100%;
    font-weight: bold;
    display: none;
}

.col {
    display: block;
    float:left;
    margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; }

.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }


.span_1_of_3 {
    width: 32.26%;

}

.span_1_of_3 img { 
    width: 100%;
    height: auto;
    float:left;
    border-radius: 5px;
}

.stec-pagination {

    border-top: 1px solid rgba(0,0,0,0.1);
    width: 100%;
    float: left;
    margin-top: 15px;
    padding-top: 30px;

    li {
        display: inline-block;

        a {
            display: block;
            background: @blue;
            color: #fff;
            border-radius: 3px;
            min-width: 30px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            font-size: 12px;

            &:hover {
                background: @blue + #111;
            }

            &.active {
                background: #000;
                &:hover {
                    background: #000;
                }
            }
        }
    }
}

.stachethemes-admin-organizers-list {
    margin-bottom: 70px;
    width: 100%;
    float: left;
}

.stachethemes-admin-attendance-list {
    margin-top: 70px;
    width: 100%;
    float: left;

    ul {
        width :100%;
        float: left;

        .stachethemes-admin-attendance-list-attendee {
            border-radius: 4px;
            width: 100%;
            float: left;

            .preview {

                width: 100%;
                float: left;
                min-height: 60px;
                padding:0 6px 0 10px;
                border-radius: 4px;
                display: flex;
                align-items: center;
                justify-content: space-between;

                > div:first-child {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;

                    input[type="checkbox"] {
                        margin-top:0;
                    }
                    span, p {
                        margin: 0;
                    }

                    p {
                        margin-left: 10px;
                    }

                    .far {       
                        border-radius: 3px;
                        color: #fff;
                        padding: 8px;
                        font-size: 24px;
                        margin-left: 8px;

                        &.fa-times-circle {
                            background: #ff4c4c;
                        }
                        &.fa-question-circle {
                            background: #fbb034;
                        }
                        &.fa-check-circle {
                            background: #a4c639;
                        }
                    }

                }

                button {
                    float: left;
                    font-family: Arial;
                    font-weight: 700;
                    font-size: 12px;
                    text-transform: uppercase;
                    margin-left: 6px;
                    background: #fff;
                    border-radius: 4px;
                    padding: 0 20px;
                    height: 46px;
                    line-height: 46px;
                    border:none;
                    display: none;
                }

            }

            &:not(.edit) {

                .preview:hover {
                    background:#6d6e70;

                    button {
                        display: block;
                        cursor: pointer;
                        .transition;

                        &:hover {
                            background: #7ac143;
                            color: #fff;
                        }
                    }

                    div:first-child { 
                        p {
                            color:#fff;
                            span,i  {
                                color:inherit;
                            }
                        }
                    }
                }

            }

            .edit {
                padding: 0 20px 20px 40px;
                overflow: hidden;
                display:none;
                > div {
                    width: 100%;
                    float: left;
                }

            }

            &.edit {
                background:#f7f7f7;
                .edit {
                    display: block;
                }

                .preview {
                    background:#0096dd;
                    border-bottom-left-radius:0;
                    border-bottom-right-radius:0;
                    div:first-child { 
                        p {
                            color:#fff;
                            span,i  {
                                color:inherit;
                            }
                        }
                    }
                }
            }

        }
    }
}

.stachethemes-admin-section {
    #db-attendees {display: none !important;}
}

.stec-icons-list li:before {
    content: none !important;
}

// jquery autocomplete 

.stachethemes-admin-autocomplete-li {
    padding: 10px !important;
    font-family: Arial;
    font-size: 12px;
    height: auto;
    overflow: hidden;

    img {
        height: 40px;
        width: 40px;
        float: left;
    }

    > div {

        width: ~'calc(100% - 50px)';
        float: right;

        > span {
            width: 100%;
            float: left;
            &:not(:last-child) {
                margin-bottom: 5px;
            }
        }
    }


    &.ui-state-focus {
        background: @blue;
        color:#fff;
        font-size: 12px;
    }
}

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

    .stachethemes-doc-section-left-half {
        width:100%;

    }
    .stachethemes-doc-section-right-half {
        width:100%;

    }
    .stachethemes-doc-section-left-half ul {
        width:100%;

    }

    .col {  margin: 1% 0 1% 0%; }
    .span_1_of_3, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; }
}