/* Default tab style */

.woo-chatbot-tabs {

    position: relative;

    overflow: hidden;

    margin: 0 auto;

    width: 100%;

    font-weight: 300;

    font-size: 1.25em;

}

/* Nav */

.woo-chatbot-tabs nav {

    width: 25%;

    display: block;

    float: left;

}

.woo-chatbot-tabs nav ul {

    position: relative;

    margin: 0 auto;

    padding: 0;

    list-style: none;

}

.woo-chatbot-tabs nav ul li {

    position: relative;

    border-bottom: 1px solid #4d565f;

    z-index: 1;

    display: block;

    margin: 0;

    text-align: left;

    -webkit-flex: 1;

    -moz-flex: 1;

    -ms-flex: 1;

    flex: 1;

}

.woo-chatbot-tabs nav a {

    position: relative;

    display: block;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    line-height: 2.5;

    text-decoration: none;

    /*padding: 10px 20px;*/

}

.woo-chatbot-tabs nav a span {

    vertical-align: middle;

    font-size: 0.75em;

}

.woo-chatbot-tabs nav li.tab-current a {

    color: #74777b;

}

.woo-chatbot-tabs nav a:focus {

    outline: none;

}

/* Content */

.content-wrap {

    position: relative;

    width: 75%;

    display: block;

    float: left;

    min-height: 600px;

}

.content-wrap section {

    display: none;

    margin: 0 auto;

    padding: 1em;

    max-width: 1200px; /*text-align: center;*/

}

.content-wrap section.content-current {

    display: block;

}

.top-section .row {

    padding-top: 15px;

    padding-bottom: 15px;

}

.woo-chatbot-lng-items .row, #woo-chatbot-language-section .row {

    padding-top: 2px;

    padding-bottom: 2px;

    margin-bottom: 0;

}

.top-section .row .cxsc-settings-blocks {

    padding-top: 10px;

}

.content-wrap section h4 {

    margin-top: 0;

    padding-top: 0;

    font-size: 16px;

    font-weight: normal;

}

.content-wrap section.content-current input[type=checkbox] + label, .woo-chatbot-wrap label {

    font-size: 14px;

    font-weight: normal !important;

    margin-bottom: 0;

}

/* Fallback */

.no-js .content-wrap section {

    display: block;

    padding-bottom: 2em;

    border-bottom: 1px solid rgba(255, 255, 255, 0.6);

}

.no-flexbox nav ul {

    display: block;

}

.no-flexbox nav ul li {

    min-width: 15%;

    display: inline-block;

}

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

/* Flip */

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

.woo-chatbot-tabs-style-flip {

    max-width: 1200px;

}

.woo-chatbot-tabs-style-flip nav a {

    padding: 0.5em 1em;

    color: #33B0D9;

    -webkit-transition: color 0.3s;

    transition: color 0.3s;

    font-size: 18px;

}

.woo-chatbot-tabs-style-flip nav a:hover, .woo-chatbot-tabs-style-flip nav a:focus, .woo-chatbot-tabs-style-flip nav a:active, .woo-chatbot-tabs-style-flip nav li.tab-current a {

    color: #74777b;

    outline: none;

    box-shadow: none;

}

.woo-chatbot-tabs-style-flip nav a span {

    text-transform: uppercase;

    letter-spacing: 1px;

    font-weight: 700;

    font-size: 0.625em;

}

.woo-chatbot-tabs-style-flip nav a::after {

    position: absolute;

    top: 0;

    left: 0;

    z-index: -1;

    width: 100%;

    height: 100%;

    background-color: #f0f0f0;

    content: '';

    -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;

    transition: transform 0.3s, background-color 0.3s;

    -webkit-transform: perspective(900px) rotate3d(1, 0, 0, 90deg);

    transform: perspective(900px) rotate3d(1, 0, 0, 90deg);

    -webkit-transform-origin: 50% 100%;

    transform-origin: 50% 100%;

    -webkit-perspective-origin: 50% 100%;

    perspective-origin: 50% 100%;

}

.woo-chatbot-tabs-style-flip nav li.tab-current a::after {

    background-color: #fff;

    -webkit-transform: perspective(900px) rotate3d(1, 0, 0, 0deg);

    transform: perspective(900px) rotate3d(1, 0, 0, 0deg);

}

.woo-chatbot-tabs-style-flip .content-wrap {

    background: #fff;

}

.qcld_woo_chatbot_theme_box {
    margin-bottom: 20px;
}

@media screen and (max-width: 58em) {

    .woo-chatbot-tabs nav a.icon span {

        display: none;

    }

    .woo-chatbot-tabs nav a:before {

        margin-right: 0;

    }

}

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

    .woo-chatbot-tabs-style-flip nav a {

        padding: 0;

        line-height: 2;

    }

}