/*
Theme Name: Uncode
Theme URI: http://www.undsgn.com/uncode
Author: Undsgn
Author URI: http://www.undsgn.com
Description: Uncode is a pixel perfect WordPress Theme designed with terrific attention to details
Version: 1.4.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: uncode
Domain Path: /languages/
*/
.conversational-form {
    visibility: visible!important;
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 12px;
    line-height: 1.416666667;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    margin: auto;
    opacity: 0;
    will-change: opacity;
    padding: 20px;
    height: 100%;
    background: #000000;
}

.conversational-form *,
.conversational-form:after,
.conversational-form:before {
    box-sizing: border-box;
    outline: 0
}

.conversational-form:before {
    content: "";
    width: 100%;
    height: 50px;
    pointer-events: none;
    background: black;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

.conversational-form button {
    border: none;
    background: 0 0;
    margin: 0;
    padding: 0;
    outline: 0;
    -webkit-tap-highlight-color: transparent!important
}

.conversational-form menu {
    padding: 0;
    margin: 0
}

.conversational-form li,
.conversational-form ol,
.conversational-form ul {
    margin: 0;
    padding: 0
}

.conversational-form a,
.conversational-form a:active,
.conversational-form a:visited {
    color: currentColor
}

.conversational-form a,
.conversational-form button {
    cursor: pointer
}

.conversational-form .emoji {
    width: 16px;
    height: auto;
    margin: 0 4px
}

.conversational-form .conversational-form-inner {
    padding: 0 20px;
    position: absolute;
    width: 100%;
    min-height: 100%;
    max-height: 100%;
    bottom: 0;
    height: auto;
    overflow: hidden;
    margin-bottom: auto;
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-end;
    align-items: baseline
}

.conversational-form--enable-animation .conversational-form {
    transition: opacity .1875s cubic-bezier(.215, .61, .355, 1)
}

.conversational-form * {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    tap-highlight-color: rgba(255, 255, 255, 0)
}

.conversational-form--show {
    opacity: 1
}

cf-input-control-elements {
    width: auto;
    height: auto;
    overflow: hidden;
    display: block;
    position: relative;
    z-index: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    visibility: hidden;
    height: 0
}

cf-input-control-elements .cf-button {
    margin-bottom: 10px;
    display: inline-block
}

cf-input-control-elements .cf-button.hide {
    display: none
}

cf-input-control-elements.resized {
    visibility: visible;
    height: auto
}

cf-input-control-elements.one-row cf-list {
    height: auto
}

cf-input-control-elements.one-row cf-list-button {
    opacity: 0
}

cf-input-control-elements.two-row cf-list {
    white-space: normal;
    height: auto
}

cf-list,
cf-list-button {
    will-change: height
}

.conversational-form--enable-animation cf-list,
.conversational-form--enable-animation cf-list-button {
    -webkit-transition: height 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: height 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: height 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: height 375ms cubic-bezier(.215, .61, .355, 1);
    transition: height 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-input[tag-type=file] cf-list {
    cursor: default
}

cf-list {
    display: block;
    height: 0;
    cursor: move;
    white-space: nowrap
}

cf-list.disabled {
    pointer-events: none
}

.cf-button {
    background: #fff;
    cursor: pointer;
    border: 1px solid rgba(13, 131, 255, .1);
    border-radius: 24px;
    color: #1b9bfc;
    line-height: 1;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: hidden;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -o-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transform-origin: 0 100%;
    -moz-transform-origin: 0 100%;
    -o-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    transform-origin: 0 100%;
    will-change: opacity, background;
    opacity: 0
}

.cf-button>div {
    padding: 12px 24px
}

.cf-button.has-image {
    max-width: 180px
}

.cf-button>div {
    position: relative
}

.conversational-form--enable-animation .cf-button {
    -webkit-transition: opacity 0s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity 0s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity 0s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity 0s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1);
    transition: opacity 0s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1)
}

.cf-button.animate-in {
    opacity: 1;
    -ms-filter: none;
    filter: none
}

.conversational-form--enable-animation .cf-button.animate-in {
    -webkit-transition-duration: 375ms, .75s;
    -moz-transition-duration: 375ms, .75s;
    -o-transition-duration: 375ms, .75s;
    -ms-transition-duration: 375ms, .75s;
    transition-duration: 375ms, .75s;
    -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    -moz-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    -o-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    -ms-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1)
}

.conversational-form--enable-animation .cf-button.animate-in:nth-child(even) {
    -webkit-transition-delay: 50ms, 0s;
    -moz-transition-delay: 50ms, 0s;
    -o-transition-delay: 50ms, 0s;
    -ms-transition-delay: 50ms, 0s;
    transition-delay: 50ms, 0s
}

.conversational-form--enable-animation .cf-button.animate-in:nth-child(odd) {
    -webkit-transition-delay: .15s, 0s;
    -moz-transition-delay: .15s, 0s;
    -o-transition-delay: .15s, 0s;
    -ms-transition-delay: .15s, 0s;
    transition-delay: .15s, 0s
}

.cf-button.animate-in.animate-out {
    -webkit-transform-origin: 75% 100%;
    -moz-transform-origin: 75% 100%;
    -o-transform-origin: 75% 100%;
    -ms-transform-origin: 75% 100%;
    transform-origin: 75% 100%;
    opacity: 0
}

.cf-button:not(:last-child) {
    margin-right: 10px
}

.cf-button:focus,
.cf-button:hover,
.cf-button[checked=checked],
.cf-button[selected=selected] {
    background: rgba(13, 131, 255, .1)
}

.cf-button[disabled=disabled] {
    pointer-events: none
}

.cf-button[disabled=disabled].animate-in {
    opacity: .5
}

.cf-button:active {
    background: rgba(13, 131, 255, .2)
}

.cf-button .cf-image {
    width: 100%;
    height: auto;
    will-change: opacity;
    -webkit-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    opacity: 0
}

.cf-button .cf-image.loaded {
    opacity: 1;
    -ms-filter: none;
    filter: none
}

cf-radio-button.cf-button.highlight cf-radio,
cf-radio-button.cf-button:focus cf-radio,
cf-radio-button.cf-button:hover cf-radio {
    background: #1b9bfc
}

cf-radio-button.cf-button.has-image cf-checkbox {
    margin-left: 0
}

cf-radio-button.cf-button cf-radio {
    display: block;
    float: left;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #e6f3fe;
    will-change: background;
    margin-right: 10px;
    margin-left: -10px;
    position: relative
}

.conversational-form--enable-animation cf-radio-button.cf-button cf-radio {
    -webkit-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    transition: background 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-radio-button.cf-button[checked=checked] cf-radio {
    background: #1b9bfc;
    pointer-events: none
}

.cf-button.cf-checkbox-button.highlight cf-checkbox,
.cf-button.cf-checkbox-button:focus cf-checkbox,
.cf-button.cf-checkbox-button:hover cf-checkbox {
    background: #1b9bfc
}

.cf-button.cf-checkbox-button.no-text {
    padding: 12px 16px
}

.cf-button.cf-checkbox-button.no-text cf-checkbox {
    margin-right: 0;
    margin-left: 0
}

.cf-button.cf-checkbox-button.has-image cf-checkbox {
    margin-left: 0
}

.cf-button.cf-checkbox-button cf-checkbox {
    display: block;
    float: left;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    background: #e6f3fe;
    will-change: background;
    margin-right: 10px;
    margin-left: -10px;
    position: relative
}

.conversational-form--enable-animation .cf-button.cf-checkbox-button cf-checkbox {
    -webkit-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: background 375ms cubic-bezier(.215, .61, .355, 1);
    transition: background 375ms cubic-bezier(.215, .61, .355, 1)
}

.cf-button.cf-checkbox-button cf-checkbox:after {
    content: "";
    position: absolute;
    top: 2px;
    left: 1px;
    display: block;
    width: 13px;
    height: 10px;
    background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTNweCIgaGVpZ2h0PSIxMHB4IiB2aWV3Qm94PSIwIDAgMTMgMTAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjkwLjAwMDAwMCwgLTUwNS4wMDAwMDApIiBmaWxsPSIjMDA3NkZGIj4KICAgICAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoODQuMDAwMDAwLCAxMzYuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMjE2LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE4OS4wMDAwMDAsIDEzOS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPHBvbHlnb24gcG9pbnRzPSIxNy41IDE4LjUgMTYgMjAgMjAgMjQgMjkgMTUuNSAyNy41IDE0IDIwIDIxIj48L3BvbHlnb24+CiAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=");
    -webkit-background-size: 13px 10px;
    -moz-background-size: 13px 10px;
    background-size: 13px 10px;
    background-repeat: no-repeat;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    will-change: transform;
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform: scale(0, 0)
}

.conversational-form--enable-animation .cf-button.cf-checkbox-button cf-checkbox:after {
    -webkit-transition: -webkit-transform 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: -moz-transform 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: -o-transform 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: -ms-transform 375ms cubic-bezier(.215, .61, .355, 1);
    transition: transform 375ms cubic-bezier(.215, .61, .355, 1)
}

.cf-button.cf-checkbox-button[checked=checked] cf-checkbox,
.cf-button.cf-checkbox-button[selected=selected] cf-checkbox {
    background: rgba(230, 243, 254, 0)
}

.cf-button.cf-checkbox-button[checked=checked] cf-checkbox:after,
.cf-button.cf-checkbox-button[selected=selected] cf-checkbox:after {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1)
}

.conversational-form--enable-animation .cf-button.cf-checkbox-button[checked=checked] cf-checkbox:after,
.conversational-form--enable-animation .cf-button.cf-checkbox-button[selected=selected] cf-checkbox:after {
    -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
    -moz-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
    -o-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
    -ms-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
    transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

cf-options-list {
    display: block;
    width: auto
}

cf-upload-file-ui {
    display: block;
    width: 100%;
    height: 45px;
    position: absolute;
    top: 0;
    padding-right: 30px;
    color: #1b9bfc;
    opacity: 0;
    -webkit-transform: translateY(20px) rotateX(30deg);
    -moz-transform: translateY(20px) rotateX(30deg);
    -o-transform: translateY(20px) rotateX(30deg);
    -ms-transform: translateY(20px) rotateX(30deg);
    transform: translateY(20px) rotateX(30deg);
    will-change: opacity, transform
}

.conversational-form--enable-animation cf-upload-file-ui {
    -webkit-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1), -webkit-transform 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1), -moz-transform 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1), -o-transform 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1), -ms-transform 375ms cubic-bezier(.215, .61, .355, 1);
    transition: opacity 375ms cubic-bezier(.215, .61, .355, 1), transform 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-upload-file-ui.animate-in {
    opacity: 1;
    -ms-filter: none;
    filter: none;
    -webkit-transform: translateY(0) rotateX(0);
    -moz-transform: translateY(0) rotateX(0);
    -o-transform: translateY(0) rotateX(0);
    -ms-transform: translateY(0) rotateX(0);
    transform: translateY(0) rotateX(0)
}

.conversational-form--enable-animation cf-upload-file-ui.animate-in {
    -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    -moz-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    -o-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    -ms-transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1);
    transition-timing-function: cubic-bezier(.215, .61, .355, 1), cubic-bezier(.215, .61, .355, 1)
}

cf-upload-file-text {
    display: block;
    float: left;
    width: auto;
    height: 100%;
    padding-left: 40px;
    padding-right: 30px;
    padding-top: 17px;
    position: relative;
    color: currentColor;
    max-width: 50%;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden
}

cf-upload-file-text:before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 17px;
    left: 23px;
    width: 10px;
    height: 14px;
    background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAgMTQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTc1Ni4wMDAwMDAsIC01NDkuMDAwMDAwKSIgZmlsbD0iIzBEODNGRiI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNzM2LjAwMDAwMCwgMTI3LjAwMDAwMCkiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMDAwLCA0MDYuMDAwMDAwKSI+PHBvbHlnb24gcG9pbnRzPSIyMCAxNiAyNi4wMDMwNzk5IDE2IDMwIDE5Ljk5OTk0IDMwIDMwIDIwIDMwIj48L3BvbHlnb24+PC9nPjwvZz48L2c+PC9nPjwvc3ZnPg==");
    background-repeat: no-repeat;
    -webkit-background-size: 10px 14px;
    -moz-background-size: 10px 14px;
    background-size: 10px 14px
}

cf-upload-file-progress {
    display: block;
    height: 100%;
    overflow: hidden;
    position: relative;
    padding-right: 30px
}

cf-upload-file-progress:after {
    content: "";
    width: 100%;
    background: #e6f2ff;
    border-radius: 7px
}

cf-upload-file-progress cf-upload-file-progress-bar,
cf-upload-file-progress:after {
    display: block;
    height: 10px;
    position: absolute;
    top: 19px;
    z-index: 1
}

cf-upload-file-progress cf-upload-file-progress-bar {
    width: 0;
    will-change: width, border-radius;
    background: currentColor;
    z-index: 2;
    border-radius: 7px 0 0 7px
}

.conversational-form--enable-animation cf-upload-file-progress cf-upload-file-progress-bar {
    -webkit-transition: width .15s linear, border-radius 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: width .15s linear, border-radius 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: width .15s linear, border-radius 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: width .15s linear, border-radius 375ms cubic-bezier(.215, .61, .355, 1);
    transition: width .15s linear, border-radius 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-upload-file-progress cf-upload-file-progress-bar.loaded {
    border-radius: 7px 7px 7px 7px
}

cf-input {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    margin-top: 0
}

cf-input.animate-in input,
cf-input.animate-in textarea {
    -webkit-transition-delay: 0s, 0s, 0s, .4s, .4s;
    -moz-transition-delay: 0s, 0s, 0s, .4s, .4s;
    -o-transition-delay: 0s, 0s, 0s, .4s, .4s;
    -ms-transition-delay: 0s, 0s, 0s, .4s, .4s;
    transition-delay: 0s, 0s, 0s, .4s, .4s;
    opacity: 1;
    -ms-filter: none;
    filter: none;
    -webkit-transform: translateY(0) rotateX(0);
    -moz-transform: translateY(0) rotateX(0);
    -o-transform: translateY(0) rotateX(0);
    -ms-transform: translateY(0) rotateX(0);
    transform: translateY(0) rotateX(0)
}

cf-input.animate-in cf-input-button.cf-input-button {
    -webkit-transition-delay: 0s, 0s .75s;
    -moz-transition-delay: 0s, 0s .75s;
    -o-transition-delay: 0s, 0s .75s;
    -ms-transition-delay: 0s, 0s .75s;
    transition-delay: 0s, 0s .75s;
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1)
}

cf-input input {
    padding: 5px 5px 5px 15px
}

cf-input input,
cf-input textarea {
    resize: none;
    overflow: hidden;
    padding: 15px 40px 15px 15px
}

cf-input input,
cf-input textarea {
    outline: 0;
    -webkit-appearance: none;
    -webkit-touch-callout: auto!important;
    -webkit-user-select: auto!important;
    -khtml-user-select: auto!important;
    -moz-user-select: auto!important;
    -ms-user-select: auto!important;
    -webkit-user-select: auto!important;
    -moz-user-select: auto!important;
    -ms-user-select: auto!important;
    user-select: auto!important;
    border-radius: 0;
    border: none;
    -webkit-appearance: none;
    position: relative;
    z-index: 2;
    display: block;
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 12px;
    width: 100%;
    height: 45px;
    min-height: 45px;
    color: #acb2b6;
    will-change: box-shadow, background, color, transform, opacity;
    background: #fff;
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .15);
    box-shadow: 0 0 1px rgba(0, 0, 0, .15);
    opacity: 0;
    -webkit-transform: translateY(40px) rotateX(-40deg);
    -moz-transform: translateY(40px) rotateX(-40deg);
    -o-transform: translateY(40px) rotateX(-40deg);
    -ms-transform: translateY(40px) rotateX(-40deg);
    transform: translateY(40px) rotateX(-40deg)
}

cf-input input:-webkit-autofill,
cf-input textarea:-webkit-autofill {
    background-color: #fff
}

cf-input input:active,
cf-input input:focus,
cf-input textarea:active,
cf-input textarea:focus {
    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, .2);
    box-shadow: 0 0 30px rgba(0, 0, 0, .2)
}

.conversational-form--enable-animation cf-input input,
.conversational-form--enable-animation cf-input textarea {
    -webkit-transition: box-shadow .75s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1), color .75s cubic-bezier(.215, .61, .355, 1), -webkit-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s, opacity 375ms cubic-bezier(.215, .61, .355, 1) 0s;
    -moz-transition: box-shadow .75s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1), color .75s cubic-bezier(.215, .61, .355, 1), -moz-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s, opacity 375ms cubic-bezier(.215, .61, .355, 1) 0s;
    -o-transition: box-shadow .75s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1), color .75s cubic-bezier(.215, .61, .355, 1), -o-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s, opacity 375ms cubic-bezier(.215, .61, .355, 1) 0s;
    -ms-transition: box-shadow .75s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1), color .75s cubic-bezier(.215, .61, .355, 1), -ms-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s, opacity 375ms cubic-bezier(.215, .61, .355, 1) 0s;
    transition: box-shadow .75s cubic-bezier(.215, .61, .355, 1), background .75s cubic-bezier(.215, .61, .355, 1), color .75s cubic-bezier(.215, .61, .355, 1), transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s, opacity 375ms cubic-bezier(.215, .61, .355, 1) 0s
}

cf-input input:hover::-webkit-input-placeholder,
cf-input textarea:hover::-webkit-input-placeholder {
    color: #868d8f
}

cf-input input:hover::-moz-input-placeholder,
cf-input textarea:hover::-moz-input-placeholder {
    color: #868d8f
}

cf-input input:hover:-moz-input-placeholder,
cf-input textarea:hover:-moz-input-placeholder {
    color: #868d8f
}

cf-input input:hover:-ms-input-placeholder,
cf-input textarea:hover:-ms-input-placeholder {
    color: #868d8f
}

cf-input input::-webkit-input-placeholder,
cf-input textarea::-webkit-input-placeholder {
    color: currentColor
}

cf-input input::-moz-input-placeholder,
cf-input textarea::-moz-input-placeholder {
    color: currentColor
}

cf-input input:-moz-input-placeholder,
cf-input textarea:-moz-input-placeholder {
    color: currentColor
}

cf-input input:-ms-input-placeholder,
cf-input textarea:-ms-input-placeholder {
    color: currentColor
}

cf-input[disabled=disabled] {
    pointer-events: none
}

cf-input[disabled=disabled] input,
cf-input[disabled=disabled] textarea {
    background: rgba(248, 248, 248, .5)
}

cf-input[disabled=disabled] .cf-input-button {
    background: rgba(248, 248, 248, .75)
}

cf-input[error] {
    pointer-events: none
}

cf-input[error] input,
cf-input[error] textarea {
    background: #fef0f0;
    color: #fe8d84
}

cf-input[error] .cf-input-button {
    background: #fef0f0
}

cf-input[error] .cf-input-button svg polygon {
    fill: #fe8d84
}

cf-input cf-input-button.cf-input-button.loading:after,
cf-input[tag-type=file] cf-input-button.cf-input-button:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(185, 188, 190, .5);
    border-radius: 50%;
    border-left: 0;
    border-top: 0;
    -webkit-animation: cf-spin 1s linear infinite;
    -moz-animation: cf-spin 1s linear infinite;
    -o-animation: cf-spin 1s linear infinite;
    -ms-animation: cf-spin 1s linear infinite;
    animation: cf-spin 1s linear infinite;
    will-change: opacity
}

.conversational-form--enable-animation cf-input cf-input-button.cf-input-button.loading:after,
.conversational-form--enable-animation cf-input[tag-type=file] cf-input-button.cf-input-button:after {
    -webkit-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    transition: opacity 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-input[tag-type=file] cf-input-button.cf-input-button div.cf-icon-attachment {
    -webkit-transform: rotateX(0);
    -moz-transform: rotateX(0);
    -o-transform: rotateX(0);
    -ms-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
    -ms-filter: none;
    filter: none
}

cf-input[tag-type=file] cf-input-button.cf-input-button div.cf-icon-progress {
    -webkit-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -o-transform: rotateX(-90deg);
    -ms-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    opacity: 0
}

cf-input-button.cf-input-button {
    width: 29px;
    height: 29px;
    background: #fff;
    border: 1px solid #fff;
    position: absolute;
    overflow: hidden;
    right: 8px;
    bottom: 8px;
    z-index: 3;
    cursor: pointer;
    border-radius: 50%;
    will-change: background, border;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0);
    -moz-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -ms-transform: scale(0, 0);
    transform: scale(0, 0)
}

.conversational-form--enable-animation cf-input-button.cf-input-button {
    -webkit-transition: background 375ms cubic-bezier(.215, .61, .355, 1), border 375ms cubic-bezier(.215, .61, .355, 1), -webkit-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s;
    -moz-transition: background 375ms cubic-bezier(.215, .61, .355, 1), border 375ms cubic-bezier(.215, .61, .355, 1), -moz-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s;
    -o-transition: background 375ms cubic-bezier(.215, .61, .355, 1), border 375ms cubic-bezier(.215, .61, .355, 1), -o-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s;
    -ms-transition: background 375ms cubic-bezier(.215, .61, .355, 1), border 375ms cubic-bezier(.215, .61, .355, 1), -ms-transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s;
    transition: background 375ms cubic-bezier(.215, .61, .355, 1), border 375ms cubic-bezier(.215, .61, .355, 1), transform 375ms cubic-bezier(.175, .885, .32, 1.275) 0s
}

cf-input-button.cf-input-button>div {
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    will-change: transform, opacity
}

.conversational-form--enable-animation cf-input-button.cf-input-button>div {
    -webkit-transition: -webkit-transform 375ms cubic-bezier(.215, .61, .355, 1), opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: -moz-transform 375ms cubic-bezier(.215, .61, .355, 1), opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: -o-transform 375ms cubic-bezier(.215, .61, .355, 1), opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: -ms-transform 375ms cubic-bezier(.215, .61, .355, 1), opacity 375ms cubic-bezier(.215, .61, .355, 1);
    transition: transform 375ms cubic-bezier(.215, .61, .355, 1), opacity 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-input-button.cf-input-button div.cf-icon-attachment {
    -webkit-transform: rotateX(90deg);
    -moz-transform: rotateX(90deg);
    -o-transform: rotateX(90deg);
    -ms-transform: rotateX(90deg);
    transform: rotateX(90deg);
    opacity: 0;
    background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTIgMTYiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNTczLjAwMDAwMCwgLTYwNS4wMDAwMDApIiBzdHJva2U9IiMwRDgzRkYiPgogICAgICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4NC4wMDAwMDAsIDEzNi4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEuMDAwMDAwLCA0NTYuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTQ5OSwyMy4xMDkyNDM3IEw0OTksMTguOTA3NTYzIEM0OTksMTYuMjAxNjgwNyA0OTYuNzU2ODQ5LDE0IDQ5NCwxNCBDNDkxLjI0MzE1MSwxNCA0ODksMTYuMjAxNjgwNyA0ODksMTguOTA3NTYzIEw0ODksMjQuNTA0MjAxNyBDNDg5LDI2LjQzNjk3NDggNDkwLjU5MjQ2NiwyOCA0OTIuNTYxNjQ0LDI4IEM0OTQuNTMwODIyLDI4IDQ5Ni4xMjMyODgsMjYuNDM2OTc0OCA0OTYuMTIzMjg4LDI0LjUwNDIwMTcgTDQ5Ni4xMjMyODgsMTguOTA3NTYzIEM0OTYuMTQwNDExLDE3Ljc0Nzg5OTIgNDk1LjE4MTUwNywxNi44MDY3MjI3IDQ5NCwxNi44MDY3MjI3IEM0OTIuODE4NDkzLDE2LjgwNjcyMjcgNDkxLjg1OTU4OSwxNy43NDc4OTkyIDQ5MS44NTk1ODksMTguOTA3NTYzIEw0OTEuODU5NTg5LDIzLjEwOTI0MzciPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+");
    -webkit-background-size: 12px 16px;
    -moz-background-size: 12px 16px;
    background-size: 12px 16px
}

cf-input-button.cf-input-button div.cf-icon-progress {
    -webkit-transform: rotateX(0);
    -moz-transform: rotateX(0);
    -o-transform: rotateX(0);
    -ms-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
    -ms-filter: none;
    filter: none;
    background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMzBweCIgaGVpZ2h0PSIzMHB4IiB2aWV3Qm94PSIwIDAgMzAgMzAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBmaWxsPSIjMEQ4M0ZGIj4KICAgICAgICAgICAgPHBvbHlnb24gdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUuNTAwMDAwLCAxNS41MDAwMDApIHJvdGF0ZSg5MC4wMDAwMDApIHRyYW5zbGF0ZSgtMTUuNTAwMDAwLCAtMTUuNTAwMDAwKSAiIHBvaW50cz0iMjIgMTQuNjg3NSAxMi4xMTE4NzUgMTQuNjg3NSAxNi42NDk2ODc1IDEwLjE0OTY4NzUgMTUuNSA5IDkgMTUuNSAxNS41IDIyIDE2LjY0OTY4NzUgMjAuODUwMzEyNSAxMi4xMTE4NzUgMTYuMzEyNSAyMiAxNi4zMTI1Ij48L3BvbHlnb24+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=");
    -webkit-background-size: 30px 30px;
    -moz-background-size: 30px 30px;
    background-size: 30px 30px
}

cf-input-button.cf-input-button div.cf-icon-progress polygon {
    fill: #b9bcbe;
    will-change: fill
}

.conversational-form--enable-animation cf-input-button.cf-input-button div.cf-icon-progress polygon {
    -webkit-transition: fill 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: fill 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: fill 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: fill 375ms cubic-bezier(.215, .61, .355, 1);
    transition: fill 375ms cubic-bezier(.215, .61, .355, 1)
}

cf-input-button.cf-input-button:active:after {
    opacity: 0
}

cf-input-button.cf-input-button:active div {
    -webkit-transform: scale(.75, .75);
    -moz-transform: scale(.75, .75);
    -o-transform: scale(.75, .75);
    -ms-transform: scale(.75, .75);
    transform: scale(.75, .75)
}

cf-input-button.cf-input-button:focus,
cf-input-button.cf-input-button:hover {
    background: #e6f3fe;
    border: 1px solid #c6e6fe
}

cf-input-button.cf-input-button:focus:after,
cf-input-button.cf-input-button:hover:after {
    opacity: 0
}

cf-input-button.cf-input-button:focus .cf-icon-progress,
cf-input-button.cf-input-button:hover .cf-icon-progress {
    -webkit-animation: cf-arrow-up .75s cubic-bezier(.645, .045, .355, 1);
    -moz-animation: cf-arrow-up .75s cubic-bezier(.645, .045, .355, 1);
    -o-animation: cf-arrow-up .75s cubic-bezier(.645, .045, .355, 1);
    -ms-animation: cf-arrow-up .75s cubic-bezier(.645, .045, .355, 1);
    animation: cf-arrow-up .75s cubic-bezier(.645, .045, .355, 1)
}

@-moz-keyframes cf-spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes cf-spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-o-keyframes cf-spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes cf-spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-moz-keyframes cf-arrow-up {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    40% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        transform: translateY(-40px)
    }
    40.001% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px)
    }
    80% {
        -webkit-transform: translateY(-5px);
        -moz-transform: translateY(-5px);
        -o-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    90% {
        -webkit-transform: translateY(2px);
        -moz-transform: translateY(2px);
        -o-transform: translateY(2px);
        -ms-transform: translateY(2px);
        transform: translateY(2px)
    }
    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes cf-arrow-up {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    40% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        transform: translateY(-40px)
    }
    40.001% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px)
    }
    80% {
        -webkit-transform: translateY(-5px);
        -moz-transform: translateY(-5px);
        -o-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    90% {
        -webkit-transform: translateY(2px);
        -moz-transform: translateY(2px);
        -o-transform: translateY(2px);
        -ms-transform: translateY(2px);
        transform: translateY(2px)
    }
    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@-o-keyframes cf-arrow-up {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    40% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        transform: translateY(-40px)
    }
    40.001% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px)
    }
    80% {
        -webkit-transform: translateY(-5px);
        -moz-transform: translateY(-5px);
        -o-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    90% {
        -webkit-transform: translateY(2px);
        -moz-transform: translateY(2px);
        -o-transform: translateY(2px);
        -ms-transform: translateY(2px);
        transform: translateY(2px)
    }
    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes cf-arrow-up {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    40% {
        -webkit-transform: translateY(-40px);
        -moz-transform: translateY(-40px);
        -o-transform: translateY(-40px);
        -ms-transform: translateY(-40px);
        transform: translateY(-40px)
    }
    40.001% {
        -webkit-transform: translateY(40px);
        -moz-transform: translateY(40px);
        -o-transform: translateY(40px);
        -ms-transform: translateY(40px);
        transform: translateY(40px)
    }
    80% {
        -webkit-transform: translateY(-5px);
        -moz-transform: translateY(-5px);
        -o-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    90% {
        -webkit-transform: translateY(2px);
        -moz-transform: translateY(2px);
        -o-transform: translateY(2px);
        -ms-transform: translateY(2px);
        transform: translateY(2px)
    }
    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

cf-info {
    position: absolute;
    pointer-events: none;
    z-index: 0;
    left: 2px;
    top: 0;
    height: auto;
    width: 100%;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    padding-right: 20px;
    overflow: hidden;
    display: block;
    -webkit-transform: translateY(-115%);
    -moz-transform: translateY(-115%);
    -o-transform: translateY(-115%);
    -ms-transform: translateY(-115%);
    transform: translateY(-115%);
    color: #acb2b6;
    opacity: 0;
    will-change: opacity
}

cf-info.show {
    opacity: 1;
    -ms-filter: none;
    filter: none
}

.conversational-form--enable-animation cf-info.show {
    -webkit-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    transition: opacity .75s cubic-bezier(.215, .61, .355, 1)
}

cf-info strong {
    font-weight: 900
}

cf-input-control-elements.animate-in cf-list-button {
    opacity: 1;
    -ms-filter: none;
    filter: none
}

cf-input-control-elements.hide-nav-buttons cf-list-button {
    pointer-events: none
}

cf-input-control-elements.hide-nav-buttons cf-list-button:after {
    opacity: 0
}

cf-list-button {
    display: block;
    position: absolute;
    z-index: 2;
    height: calc(100% - 16px);
    width: 38px;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    will-change: opacity
}

.conversational-form--enable-animation cf-list-button {
    -webkit-transition: opacity .75s cubic-bezier(.215, .61, .355, 1) .5s;
    -moz-transition: opacity .75s cubic-bezier(.215, .61, .355, 1) .5s;
    -o-transition: opacity .75s cubic-bezier(.215, .61, .355, 1) .5s;
    -ms-transition: opacity .75s cubic-bezier(.215, .61, .355, 1) .5s;
    transition: opacity .75s cubic-bezier(.215, .61, .355, 1) .5s
}

@media only screen and (min-width:768px) {
    cf-list-button:hover:nth-child(1) {
        background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: -ms-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: linear-gradient(to left, rgba(255, 255, 255, 0) 0, #fff 75%)
    }
    cf-list-button:hover:nth-child(1):after {
        -webkit-animation: cf-arrow-left .75s cubic-bezier(.645, .045, .355, 1);
        -moz-animation: cf-arrow-left .75s cubic-bezier(.645, .045, .355, 1);
        -o-animation: cf-arrow-left .75s cubic-bezier(.645, .045, .355, 1);
        -ms-animation: cf-arrow-left .75s cubic-bezier(.645, .045, .355, 1);
        animation: cf-arrow-left .75s cubic-bezier(.645, .045, .355, 1)
    }
    cf-list-button:hover:nth-child(2) {
        background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 75%);
        background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, #fff 75%)
    }
    cf-list-button:hover:nth-child(2):after {
        -webkit-animation: cf-arrow-right .75s cubic-bezier(.645, .045, .355, 1);
        -moz-animation: cf-arrow-right .75s cubic-bezier(.645, .045, .355, 1);
        -o-animation: cf-arrow-right .75s cubic-bezier(.645, .045, .355, 1);
        -ms-animation: cf-arrow-right .75s cubic-bezier(.645, .045, .355, 1);
        animation: cf-arrow-right .75s cubic-bezier(.645, .045, .355, 1)
    }
}

cf-list-button.cf-gradient:before {
    opacity: 1;
    -ms-filter: none;
    filter: none
}

cf-list-button.active {
    pointer-events: auto
}

cf-list-button.active:after {
    opacity: 1;
    -ms-filter: none;
    filter: none
}

cf-list-button:active:after {
    -webkit-transform: scale(.75, .75);
    -moz-transform: scale(.75, .75);
    -o-transform: scale(.75, .75);
    -ms-transform: scale(.75, .75);
    transform: scale(.75, .75)
}

cf-list-button:nth-child(1) {
    left: 0
}

cf-list-button:nth-child(1):before {
    background: -webkit-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -moz-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -ms-linear-gradient(right, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: linear-gradient(to left, rgba(255, 255, 255, 0) 0, #fff 100%)
}

cf-list-button:nth-child(1):after {
    background-image: url("data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgdmlld0JveD0iMCAwIDYgMTAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTIzMC4wMDAwMDAsIC01NjcuMDAwMDAwKSIgZmlsbD0iIzBEODNGRiI+CiAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDczOC4wMDAwMDAsIDE3OC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMDAwLCAzNDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDY2LjAwMDAwMCwgMC4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPHBvbHlnb24gdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjkuMDAwMDAwLCA1NC4wMDAwMDApIHJvdGF0ZSgtMTgwLjAwMDAwMCkgdHJhbnNsYXRlKC0yOS4wMDAwMDAsIC01NC4wMDAwMDApICIgcG9pbnRzPSIyNiA1MC4xNTM4NDYyIDI3LjEyNSA0OSAzMiA1NCAyNy4xMjUgNTkgMjYgNTcuODQ2MTUzOCAyOS43NSA1NCI+PC9wb2x5Z29uPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+")
}

cf-list-button:nth-child(2) {
    right: 0
}

cf-list-button:nth-child(2):before {
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, #fff 100%)
}

cf-list-button:nth-child(2):after {
    background-image: url("data:image/svg+xml;charset=utf-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgdmlld0JveD0iMCAwIDYgMTAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTIzMC4wMDAwMDAsIC01NjcuMDAwMDAwKSIgZmlsbD0iIzBEODNGRiI+CiAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDczOC4wMDAwMDAsIDE3OC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMDAwLCAzNDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDY2LjAwMDAwMCwgMC4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPHBvbHlnb24gcG9pbnRzPSIyNiA1MC4xNTM4NDYyIDI3LjEyNSA0OSAzMiA1NCAyNy4xMjUgNTkgMjYgNTcuODQ2MTUzOCAyOS43NSA1NCI+PC9wb2x5Z29uPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+")
}

cf-list-button:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    will-change: opacity
}

.conversational-form--enable-animation cf-list-button:before {
    -webkit-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity .75s cubic-bezier(.215, .61, .355, 1);
    transition: opacity .75s cubic-bezier(.215, .61, .355, 1)
}

cf-list-button:after {
    content: "";
    display: block;
    width: 6px;
    height: 10px;
    position: absolute;
    -webkit-background-size: 6px 10px;
    -moz-background-size: 6px 10px;
    background-size: 6px 10px;
    background-repeat: no-repeat;
    top: calc(50% - 5px);
    left: calc(50% - 3px);
    opacity: 0;
    will-change: opacity
}

.conversational-form--enable-animation cf-list-button:after {
    -webkit-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -moz-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -o-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    -ms-transition: opacity 375ms cubic-bezier(.215, .61, .355, 1);
    transition: opacity 375ms cubic-bezier(.215, .61, .355, 1)
}

@-moz-keyframes cf-arrow-right {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(4px);
        -moz-transform: translateX(4px);
        -o-transform: translateX(4px);
        -ms-transform: translateX(4px);
        transform: translateX(4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(-2px);
        -moz-transform: translateX(-2px);
        -o-transform: translateX(-2px);
        -ms-transform: translateX(-2px);
        transform: translateX(-2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@-webkit-keyframes cf-arrow-right {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(4px);
        -moz-transform: translateX(4px);
        -o-transform: translateX(4px);
        -ms-transform: translateX(4px);
        transform: translateX(4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(-2px);
        -moz-transform: translateX(-2px);
        -o-transform: translateX(-2px);
        -ms-transform: translateX(-2px);
        transform: translateX(-2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@-o-keyframes cf-arrow-right {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(4px);
        -moz-transform: translateX(4px);
        -o-transform: translateX(4px);
        -ms-transform: translateX(4px);
        transform: translateX(4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(-2px);
        -moz-transform: translateX(-2px);
        -o-transform: translateX(-2px);
        -ms-transform: translateX(-2px);
        transform: translateX(-2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@keyframes cf-arrow-right {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(4px);
        -moz-transform: translateX(4px);
        -o-transform: translateX(4px);
        -ms-transform: translateX(4px);
        transform: translateX(4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(-2px);
        -moz-transform: translateX(-2px);
        -o-transform: translateX(-2px);
        -ms-transform: translateX(-2px);
        transform: translateX(-2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@-moz-keyframes cf-arrow-left {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(-4px);
        -moz-transform: translateX(-4px);
        -o-transform: translateX(-4px);
        -ms-transform: translateX(-4px);
        transform: translateX(-4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(2px);
        -moz-transform: translateX(2px);
        -o-transform: translateX(2px);
        -ms-transform: translateX(2px);
        transform: translateX(2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@-webkit-keyframes cf-arrow-left {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(-4px);
        -moz-transform: translateX(-4px);
        -o-transform: translateX(-4px);
        -ms-transform: translateX(-4px);
        transform: translateX(-4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(2px);
        -moz-transform: translateX(2px);
        -o-transform: translateX(2px);
        -ms-transform: translateX(2px);
        transform: translateX(2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@-o-keyframes cf-arrow-left {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(-4px);
        -moz-transform: translateX(-4px);
        -o-transform: translateX(-4px);
        -ms-transform: translateX(-4px);
        transform: translateX(-4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(2px);
        -moz-transform: translateX(2px);
        -o-transform: translateX(2px);
        -ms-transform: translateX(2px);
        transform: translateX(2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}

@keyframes cf-arrow-left {
    0% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    40% {
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
        opacity: 0
    }
    40.001% {
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
        opacity: 0
    }
    80% {
        -webkit-transform: translateX(-4px);
        -moz-transform: translateX(-4px);
        -o-transform: translateX(-4px);
        -ms-transform: translateX(-4px);
        transform: translateX(-4px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    90% {
        -webkit-transform: translateX(2px);
        -moz-transform: translateX(2px);
        -o-transform: translateX(2px);
        -ms-transform: translateX(2px);
        transform: translateX(2px);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        -ms-filter: none;
        filter: none
    }
}