html {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
    font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    color: #717171;
    background-color: transparent;
    -webkit-font-smoothing: antialiased;
    line-height: 1.42857143;
}

.b-workspace {
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: visible!important;
    height: calc(100vh - 92px);
    height: calc(100vh - 104px);
    margin: 92px auto 0;
    max-width: 6000px;
    -webkit-transition: max-width .25s ease, margin-top .25s ease;
    transition: max-width .25s ease, margin-top .25s ease
}

.b-workspace.simple-mode-transition {
    -webkit-transition: height .25s ease, max-width .25s ease, margin-top .25s ease;
    transition: height .25s ease, max-width .25s ease, margin-top .25s ease
}

body.simple-mode:not(.pw-is-preview-mode) .b-workspace {
    height: calc(100vh - 50px);
    max-width: 1280px;
    margin-top: 50px
}

#b-canvas {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: top .25s ease;
    transition: top .25s ease;
    top: 92px;
    bottom: 0;
    display: none;
    border: 1px dashed #003fff;
    border-top: none;
    border-bottom: none;
    opacity: .35
}

body.simple-mode #b-canvas {
    top: 50px
}

#pw-curtains {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0
}

#b-curtain-left,
#b-curtain-right {
    position: absolute;
    background: url(images/bg.gif) gray;
    min-height: 100%;
    top: 0;
    bottom: 0
}

.ease-curtains #b-curtain-left,
.ease-curtains #b-curtain-right {
    -webkit-transition: all 200ms ease;
    transition: all 200ms ease
}

#b-curtain-left {
    left: 0
}

#b-curtain-right {
    right: 0
}

#content-iframe {
    display: block;
    width: 100%;
    border: 0;
    pointer-events: none;
    background-color: #FFF;
    height: 100%
}

body.pw-is-preview-mode #content-iframe {
    pointer-events: all!important
}

#content-iframe::-webkit-scrollbar,
#shadows::-webkit-scrollbar {
    -webkit-appearance: none
}

#content-iframe::-webkit-scrollbar:vertical,
#shadows::-webkit-scrollbar:vertical {
    width: 7px
}

#content-iframe::-webkit-scrollbar:horizontal,
#shadows::-webkit-scrollbar:horizontal {
    height: 7px
}

#content-iframe::-webkit-scrollbar,
#content-iframe::-webkit-scrollbar-track,
#content-iframe::-webkit-scrollbar-track-piece,
#shadows::-webkit-scrollbar,
#shadows::-webkit-scrollbar-track,
#shadows::-webkit-scrollbar-track-piece {
    background: transparent url(images/transparent.png) 0 0 repeat!important
}

#content-iframe::-webkit-scrollbar-thumb,
#shadows::-webkit-scrollbar-thumb {
    border-radius: 3px
}

#content-iframe::-webkit-scrollbar-thumb {
    background: rgba(71, 71, 71, 0.7)
}

#shadows::-webkit-scrollbar-thumb {
    background: transparent url(images/transparent.png) 0 0 repeat!important
}

.pw-control-elements {
    position: absolute;
    top: 0;
    z-index: 3;
    width: 100%
}

.pw-control-elements iframe {
    border: 0;
    position: absolute
}

.sp-replacer {
    padding: 0
}

.pw-widget-library-is-open #b-panel,
.pw-widget-library-is-open #b-panel.b-preview-toggleable {
    -webkit-transform: translateX(284px);
    -ms-transform: translateX(284px);
    transform: translateX(284px);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

body.pw-is-preview-mode #b-panel {
    right: -280px
}

.b-panel {
    position: fixed;
    z-index: 988;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1), right .25s ease;
    transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1), right .25s ease;
    right: 0;
    top: 50px;
    bottom: 0;
    width: 280px;
    font-size: 1.1em;
    color: #333;
    background: #F1F2F4;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-left: #CCC 3px solid;
}

.b-panel #b-panel-inner {
    opacity: 0;
    -webkit-transition: opacity 300ms ease;
    transition: opacity 300ms ease
}

.b-panel.ready #b-panel-inner {
    opacity: 1
}

.b-panel #b-panel-inner {
    height: 100%
}

.b-panel .b-panel-widget-panes {
    height: 265px
}

.b-panel .b-panel-widget-panes .no-widgets-selected-label {
    text-align: center;
    font-size: 2em;
    font-weight: 100;
    line-height: 1.5em;
    width: 60%;
    margin: 0 auto;
    opacity: .2;
    margin-top: 88px
}

.b-panel h2,
.b-panel h3,
.b-panel ul,
.b-panel p {
    padding: 0;
    margin: 0
}

.b-panel h2.mild,
.b-panel h3.mild,
.b-panel ul.mild,
.b-panel p.mild {
    font-weight: 100;
    color: #455;
    padding: 32px;
    font-size: 18px;
    line-height: 1.6rem
}

.b-panel h3 {
    font-size: 13px
}

.b-panel h3 i {
    margin-right: 5px;
    display: inline-block;
    width: 10px
}

.b-panel h3 i:before {
    margin-left: 0
}

.b-panel h3 .right-side {
    float: right
}

.b-panel h3 button[class*="icon-"] {
    -webkit-appearance: none;
    border: 0;
    background: transparent!important;
    font-size: 13px;
    padding: 0;
    height: 24px
}

.b-panel h3 button[class*="icon-"][disabled] {
    opacity: .3
}

.b-panel ul {
    list-style-type: none
}

.b-panel fieldset {
    border: none;
    padding: 0;
    margin: 0
}

.b-panel a.underline {
    text-decoration: underline
}

.b-panel .b-panel-pane-content {
    margin: 0 11px;
    padding-bottom: 22px
}

.b-panel .bbf-field {
    margin-top: 2px;
    line-height: 22px;
    position: relative
}

.b-panel .bbf-field .bbf-editor input[type="text"] {
    height: 22px
}

.b-panel .bbf-field .bbf-editor input.select {
    width: 82px;
    height: 24px;
    text-align: left;
    padding-left: 4px;
    margin-left: -3px;
    background-color: #fff;
    border: 1px solid #eee;
    border-top-color: #c8c8c8;
    vertical-align: middle;
}

.b-panel .bbf-field .bbf-editor input.select+span {
    cursor: pointer;
    width: 20px;
    height: 20px;
    margin-left: -20px;
    margin-top: 1px;
    display: inline-block;
    vertical-align: middle;
    background-color: #f9f9f9;
    line-height: 20px;
}

.b-panel .bbf-field .bbf-editor input.select.no-suggestions {
    width: 82px;
    padding-right: 4px
}

.b-panel .bbf-field .bbf-editor input.select.no-suggestions+span {
    display: none
}

.b-panel .bbf-field .bbf-editor .bbf-color .remove {
    display: none
}

.b-panel .bbf-field .bbf-editor .bbf-color.has-color .remove {
    display: block;
    float: left;
    background: transparent;
    line-height: 20px;
    width: auto
}

.b-panel .bbf-field .bbf-editor .bbf-color.has-color .remove:before {
    content: 'X';
    vertical-align: middle;
    line-height: 20px
}

.b-panel .b-panel-row {
    position: relative;
    margin-top: 11px;
    line-height: 11px
}

.b-panel .b-panel-row input[type="text"],
.b-panel .b-panel-row .widget-tree-item-label {
    height: 22px;
    margin-top: -5.5px;
    margin-bottom: -5.5px;
    line-height: 22px;
    padding-left: 2px;
    overflow: hidden;
    white-space: nowrap
}

.b-panel .b-panel-row .widget-tree-item-label {
    text-overflow: ellipsis
}

.b-panel .b-panel-row .fitted {
    position: absolute;
    right: 40px
}

.b-panel #b-panel-mode-settings {
    background: #F1F2F4;
    background: -moz-linear-gradient(top, #F4F5F7, #EEE);
    background: -ms-linear-gradient(top, #F4F5F7, #EEE);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F5F7), to(#EEE));
    background: linear-gradient(top, #F4F5F7, #EEE);
}

.b-panel .b-panel-row-mode {
    height: 50px;
    line-height: 31px;
    padding: 8px 11px 0
}

.b-panel .b-panel-row-mode label {
    font-size: 14px;
    z-index: 1
}

.b-panel .b-panel-row-mode label.pw-label-moved-lower {
    padding-top: 2px
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle {
    text-align: left;
    line-height: 21px;
    position: relative;
    z-index: 2;
    cursor: pointer;
    width: 52px;
    height: 25px!important;
    left: 0;
    top: 0;
    font-size: 12px;
    background: #bbb;
    border-radius: 12px;
    color: #333;
    padding: 2px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    -webkit-transition: all .3s;
    transition: all .3s
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle svg {
    position: absolute;
    fill: #595959;
    height: 14px;
    right: 8px;
    top: 6px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle:after {
    content: '';
    cursor: pointer;
    height: 21px;
    width: 21px;
    font-size: 12px;
    border-radius: 10px;
    background: #fff;
    display: inline-block;
    line-height: 18px;
    text-align: center;
    position: static;
    -webkit-transition: all .3s;
    transition: all .3s
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle:hover:after {
    width: 26px;
    background-color: #fff
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle:hover svg {
    fill: #808080
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle[data-state="active"] {
    color: #535353;
    padding-left: 29px;
    background-color: #3EA5FF
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle[data-state="active"]:after {
    background: #fff
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle[data-state="active"] svg {
    fill: #3EA5FF
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle[data-state="active"]:hover {
    background-color: #7DC2FF
}

.b-panel .b-panel-row-mode .el-switch.mode-toggle[data-state="active"]:hover:after {
    width: 21px
}

.b-panel label {
    position: absolute;
    z-index: -1;
    width: 100%
}

.b-panel label.pw-label-moved-lower {
    padding-top: 4px
}

.b-panel .remove {
    line-height: 11px;
    margin-right: 5px;
    display: none;
    cursor: pointer;
    color: #757575
}

.b-panel .remove:hover {
    color: inherit
}

.b-panel .reset {
    display: inline;
    color: inherit;
    text-decoration: none
}

#b-panel,
#b-panel input {}

#b-panel input::-webkit-input-placeholder,
#b-panel textarea::-webkit-input-placeholder {
    color: #ccc;
}

#b-panel input::-moz-input-placeholder,
#b-panel textarea::-moz-input-placeholder {
    color: #ccc;
}

#b-panel input:-ms-input-placeholder,
#b-panel textarea:-ms-input-placeholder {
    color: #ccc;
}

.b-panel-tabs {
    width: 100%;
    overflow: hidden;
}

.b-panel-tabs li {
    float: left;
    color: #999;
    cursor: pointer;
    text-transform: uppercase
}

.b-panel-tabs li.b-panel-tabs-active,
.b-panel-tabs li:hover {
    color: #444
}

.b-panel-tabs li .icon img {
    vertical-align: middle;
    margin-right: .6em;
    margin-top: -3px
}

.b-panel-tabs {
    list-style-type: none
}

.b-panel-pane-header,
.b-panel-tabs li,
.b-panel-tabs li a {
    padding: 0 11px;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    color: #888;
    line-height: 40px;
}

.b-panel-tabs li {
    padding: 0 20px;
    color: #aaa;
    margin: 0 1px;
}

.b-panel-tabs li:first-child {
    /*padding-left: 11px*/
}

.b-panel-tabs li .icon {
    margin-right: -1px
}

.b-panel-tabs li a {
    text-decoration: none
}

.b-panel-tabs li:hover a,
.b-panel-tabs li a:hover {
    text-decoration: underline
}

.b-panel-pane-header {
    border-top: 1px solid #ddd;
}

.pw-panel-pane-styles>.b-panel-pane-header {
    border-top: 0;
}

.b-widget-tree>.b-panel-pane-header {
    border-top: 0;
    position: fixed;
    z-index: 1;
    width: 100%;
    background-color: #eee;
    border-bottom: 1px solid #ddd;
}

.b-panel-resizeable {
    border-top: 1px solid #DDD;
}

.b-panel-tabs li.b-panel-tabs-active,
.b-panel-tabs li.b-panel-tabs-active:hover {
    border-bottom: 3px solid #888;
    border-top: 0;
    color: #444;
}

.b-panel-tabs li:hover {
    border-bottom: 3px solid #0288F0;
    color: #0288F0;
}

.b-panel-pane-hidden .b-panel-pane-header {}

.b-scroll {
    max-height: 400px;
    overflow-y: auto;
    min-height: 0
}

.b-scroll::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, 0.05)
}

.b-scroll::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, 0.05)
}

.b-scroll::-webkit-scrollbar-track-piece {
    /*background-color: rgba(0,0,0,0.05)*/
}

.b-scroll::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.2)
}

.bbf-field input,
.bbf-field textarea {
    color: gray
}

.bbf-field.bbf-default input,
.bbf-field.bbf-default textarea,
.bbf-field.bbf-default.bbf-filled input,
.bbf-field.bbf-default.bbf-filled textarea {
    color: #7C9BBB!important
}

.bbf-field.bbf-default input::-webkit-input-placeholder,
.bbf-field.bbf-default textarea::-webkit-input-placeholder,
.bbf-field.bbf-default.bbf-filled input::-webkit-input-placeholder,
.bbf-field.bbf-default.bbf-filled textarea::-webkit-input-placeholder {
    color: #bbb
}

.bbf-field.bbf-default input::-moz-placeholder,
.bbf-field.bbf-default textarea::-moz-placeholder,
.bbf-field.bbf-default.bbf-filled input::-moz-placeholder,
.bbf-field.bbf-default.bbf-filled textarea::-moz-placeholder {
    color: #bbb
}

.bbf-field.bbf-default input:-ms-input-placeholder,
.bbf-field.bbf-default textarea:-ms-input-placeholder,
.bbf-field.bbf-default.bbf-filled input:-ms-input-placeholder,
.bbf-field.bbf-default.bbf-filled textarea:-ms-input-placeholder {
    color: #bbb
}

.bbf-field.bbf-default input::placeholder,
.bbf-field.bbf-default textarea::placeholder,
.bbf-field.bbf-default.bbf-filled input::placeholder,
.bbf-field.bbf-default.bbf-filled textarea::placeholder {
    color: #bbb
}

.bbf-field.disabled .range {
    background: #2d2d2d!important;
    pointer-events: none
}

.bbf-field.disabled .range::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: #666
}

.bbf-field.disabled .text {
    color: #666!important;
    pointer-events: none
}

.bbf-field.disabled label {
    color: #666!important
}

.bbf-field.disabled::-webkit-input-placeholder {
    color: #666!important
}

.bbf-field.disabled::-moz-placeholder {
    color: #666!important
}

.bbf-field.disabled:-ms-input-placeholder {
    color: #666!important
}

.bbf-field.disabled::placeholder {
    color: #666!important
}

.bbf-field.disabled .bbf-color {
    pointer-events: none;
    color: #666!important
}

.bbf-field.disabled .bbf-color .sp-preview {
    border: 1px solid #666
}

.bbf-field.disabled .bbf-color .no-color {
    background: url("images/no-color-disabled.png") left no-repeat;
    background-size: contain
}

.bbf-field:after {
    content: "";
    display: table;
    clear: both
}

.bbf-field.inline,
.bbf-field.inline:after {
    display: inline-block
}

.bbf-field input[type="text"],
.b-panel-row input[type="text"] {
    border: none;
    height: 22px;
    padding: 1px 0;
    background: transparent
}

.bbf-field input[type="text"][readonly],
.b-panel-row input[type="text"][readonly] {
    background-color: #f5f5f5;
}

.bbf-field input::-webkit-input-placeholder,
.b-panel-row input::-webkit-input-placeholder {
    color: #666
}

.bbf-field input::-moz-placeholder,
.b-panel-row input::-moz-placeholder {
    color: #666
}

.bbf-field input:-ms-input-placeholder,
.b-panel-row input:-ms-input-placeholder {
    color: #666
}

.bbf-field input::placeholder,
.b-panel-row input::placeholder {
    color: #666
}

.bbf-separator {
    background: #444;
    margin-left: -11px;
    margin-right: -11px;
    padding: 5.5px 11px 5.5px 24px;
    font-size: .9em;
    color: #ebebeb;
    text-transform: uppercase
}

.bbf-dd-select-list-back {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: rgba(85, 85, 85, 0.6)
}

.bbf-dd-select-list {
    height: 33px;
    color: #000
}

.bbf-dd-select-list>span,
.bbf-dd-select-list>div>span,
.bbf-dd-select-list ul li {
    display: block;
    padding: 5px;
    line-height: 23px
}

.bbf-dd-select-list>span,
.bbf-dd-select-list>div>span,
.bbf-dd-select-list ul {
    background: #eee
}

.bbf-dd-select-list>span {
    background: #eee;
    border-radius: 5px;
    cursor: pointer
}

.bbf-dd-select-list>span,
.bbf-dd-select-list>div>span {
    font-size: 16px;
    padding: 5px 13px;
    position: relative
}

.bbf-dd-select-list>span:after,
.bbf-dd-select-list>div>span:after {
    padding-right: 4px;
    position: absolute;
    top: 4px;
    right: 3px;
    content: '\f0dc';
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 25px;
    font-size: 16px
}

.bbf-dd-select-list>div {
    position: absolute;
    z-index: 8;
    top: 0;
    left: 0;
    width: 100%;
    border-radius: 5px;
    background: #313131
}

.bbf-dd-select-list-background {
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2)
}

.bbf-dd-select-list>div>span {
    border-radius: 5px 5px 0 0
}

.bbf-dd-select-list>div>span.collapsed {
    border-radius: 5px
}

.bbf-dd-select-list-focus>div {
    display: block
}

.bbf-dd-select-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 0 0 5px 5px;
    overflow: hidden
}

.bbf-dd-select-list.font-dd ul {
    border-radius: 0
}

.bbf-dd-select-list ul li {
    position: relative;
    padding: 6px 5px;
    margin: 0 0 -1px
}

.bbf-dd-select-list ul li.bbf-dd-select-list-active {
    background: #ccee99;
    z-index: 9
}

.bbf-dd-select-list ul li:hover {
    z-index: 10;
    cursor: pointer;
    background: #666
}

.bbf-dd-select-list ul li:hover:before,
.bbf-dd-select-list ul li.bbf-dd-select-list-active:before {
    background: transparent
}

.bbf-dd-select-list ul li:before {
    display: block;
    position: absolute;
    top: 0;
    left: 5px;
    right: 5px;
    content: ' ';
    height: 1px;
    background: #bbb
}

.bbf-field .bbf-dd-select-list .font-input {
    width: 100%;
    line-height: 23px;
    height: 35px;
    padding: 6px 5px;
    color: #333;
    background-color: white;
    border: 1px solid #e1e1e8;
    border-radius: 0 0 5px 5px
}

.bbf-field .bbf-dd-select-list .font-input:focus {
    outline: 0;
    border: 1px solid #ffc800
}

.bbf-field .bbf-dd-select-list .font-input.active {
    background: #ccee99;
    border: 1px solid #ccee00
}

.bbf-field .bbf-dd-select-list .font-input.active:focus {
    border: 1px solid #ee9800
}

.google-fonts>div {
    padding: 10px 5px;
    background-color: #e1e1e8
}

.google-fonts .typeahead-holder {
    position: relative;
    padding: 0;
    border-radius: 0 0 5px 5px
}

.google-fonts .typeahead-drop {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: -5px
}

.google-fonts .typeahead-drop:last-child {
    border-radius: 0 0 5px 5px
}

.b-panel-row .item-drop-element {
    cursor: ns-resize
}

.b-panel-row .item-drop-element .b-panel-widget-tree-icons {
    cursor: pointer
}

.b-panel-row .item-drop-element .b-panel-widget-tree-icons i:hover {
    color: #fff
}

.b-panel-row .item-drop-element .widget-slug-input {
    outline: none;
    color: white
}

.b-panel-row .item-drop-element .widget-slug-input:focus {
    box-shadow: none
}

.b-panel-row a {
    color: #ccc;
    text-decoration: none;
    line-height: 11px
}

.b-panel-row a:hover {
    text-decoration: underline
}

.b-panel-row:after {
    content: " ";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

.bbf-field .bbf-editor,
.b-panel-right-field {
    margin-left: 6px;
    float: right
}

.bbf-field .bbf-editor input,
.b-panel-right-field input {
    width: 82px;
    text-align: right;
    margin-right: 0
}

.bbf-field label,
.b-panel-row label {
    display: inline-block;
    width: 90px
}

.b-panel-resize {
    height: 5px;
    position: relative;
    bottom: 1px;
    cursor: row-resize
}

.b-panel-resize:hover span {
    height: 5px;
    position: relative;
    top: 1px;
    display: block;
    background: rgba(255, 255, 255, 0.2)
}

.b-panel-pane-hidden .b-panel-resize {
    display: none;
}
.panel-pane-slideshow-dynamic .b-panel-pane-hidden .b-panel-pane-content{
    display: none;
}

.bbf-field .bbf-editor input {
    width: 82px
}

.bbf-button-list {
    margin-left: 0;
    padding-left: 0;
    display: inline
}

.bbf-button-list li {
    list-style: none;
    font-size: 14px;
    width: auto!important;
    display: inline;
    margin-right: 11px;
    color: #999
}

.bbf-button-list li i {
    width: auto
}

.bbf-button-list li.selected {
    color: #3EA5FF
}

.bbf-field .bbf-center-margin .reset {
    cursor: pointer
}

.bbf-button-large {
    text-align: center
}

.bbf-button-large button {
    -webkit-appearance: none;
    background: #ededed;
    padding: 11px 13px;
    text-align: center;
    margin: 22px -2px;
    margin-left: 0;
    color: #000;
    display: block;
    position: relative;
    text-decoration: none;
    width: 100%;
    line-height: inherit;
    border: 0;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    border-radius: 5px;
    z-index: 2
}

.bbf-button-large button[disabled] {
    opacity: .5
}

.bbf-button-large button[disabled]:hover {
    background: #ededed
}

.bbf-button-large button:hover {
    background: #ddd
}

.bbf-field .bbf-color .color-icon {
    border: 1px solid white;
    height: 15px;
    width: 15px;
    padding: 0;
    margin: 0 6px 0 0;
    position: relative;
    top: 4px
}

.bbf-field .bbf-color .no-color {
    background: white url("images/no-color.png") left no-repeat;
    background-size: contain
}

.bbf-field .bbf-color .color-text {
    width: 61px
}

.sp-replacer {
    background: none;
    border: 0;
    color: #333;
    vertical-align: middle;
    margin-top: -2px
}

.sp-preview {
    width: 20px;
    height: 20px;
    border: 1px solid #fff;
    margin-right: 0
}

.sp-dd {
    display: none
}

.sp-palette-container {
    padding-right: 0;
    background-color: #444;
    border: 0
}

.sp-palette {
    max-width: 18px;
    max-height: 180px;
    overflow: hidden
}

.sp-palette .sp-thumb-el {
    border-style: none
}

.sp-palette .sp-thumb-el.sp-thumb-active {
    border-color: white;
    border-style: solid
}

.sp-palette .sp-thumb-el.sp-thumb-active .sp-thumb-inner {
    background-image: none
}

.sp-picker-container {
    background-color: #444;
    border: 0
}

.sp-container {
    border-radius: 4px;
    box-shadow: 0 0 0 5px rgba(153, 153, 153, 0.4);
    border: 0;
    z-index: 2147483647;
    overflow: hidden;
    position: fixed;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0)
}

.sp-container button {
    background: #999;
    color: #000;
    border: 0;
    text-shadow: none
}

.sp-container button:hover {
    background: #ffbf00;
    border: 0
}

.sp-container button:active {
    background: #ffbf00;
    box-shadow: inset 0 0 5px 2px #ffbf00, 0 1px 0 0 #eee;
    border: 0
}

.sp-cancel {
    color: #ccc!important
}

.sp-cancel:hover {
    color: #999!important
}

.bbf-range {
    margin-top: 0;
    margin-left: -6px
}

.bbf-range input[type="range"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    height: 11px;
    background: #bbb;
    border-radius: 3px;
    margin-top: 3px;
    margin-bottom: 3px
}

.bbf-range input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    border: none;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2)
}

.bbf-range input[type="range"]::-moz-range-thumb {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    border: none;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2)
}

.bbf-range input[type="range"]:focus::-webkit-slider-thumb {
    background: #3EA5FF
}

.bbf-range input[type="range"]:focus::-moz-range-thumb {
    background: #3EA5FF
}

.bbf-range input[type=range]::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent
}

.bbf-range input[type=range]::-moz-range-track {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent
}

.bbf-range input[type=range]::-moz-range-track {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent
}

.bbf-range input[type="text"] {
    float: right
}

.bbf-reset-breakpoint {
    margin: 10px -11px -11px;
    padding: 11px 11px 14px;
    background: #F1F2F4
}

.reset-style-breakpoint {
    display: inline-block;
    cursor: pointer;
    text-decoration: underline;
}

.reset-style-breakpoint:hover {
    color: #0288F0
}

.disabled .reset-style-breakpoint {
    pointer-events: none;
    cursor: default;
    color: #666
}

#b-panel.bbf-help {
    display: none
}

.b-panel-widget-settings .bbf-editor input {
    width: 60px;
    margin-right: 20px
}

#b-panel header:after {
    content: "";
    display: table;
    clear: both
}

#b-panel header h3 {
    float: left
}

#b-panel header .scroll-to-in-widget-tree {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    float: right;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    fill: #999
}

#b-panel header .scroll-to-in-widget-tree:hover {
    fill: #3EA5FF
}

#b-panel header .scroll-to-in-widget-tree:disabled {
    fill: #4D4D4D
}

#b-panel header .scroll-to-in-widget-tree svg {
    width: 24px;
    height: 24px;
    vertical-align: middle
}

#b-panel .b-widget-tree {
    /*border-top: 4px solid #ccc;*/
    padding: 0 0 4px;
    height: 100%
}

#b-panel .b-panel-widget-tree {
    margin: 0;
    padding: 0;
    max-height: calc(100% - 4px - 24px)
}

.b-widget-tree.b-panel-pane-hidden > .b-panel-widget-tree.b-panel-pane-content{
    display: none;
}

#b-panel .b-panel-widget-tree {
    position: relative;
    padding-top: 41px;
}

#b-panel .b-panel-widget-tree .b-panel-row {
    margin-top: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: 0
}

#b-panel .b-panel-widget-tree .widget-tree-item-label:hover {
    cursor: pointer;
    text-decoration: underline
}

#b-panel .b-panel-widget-tree .section>.widget-tree-item-content,
#b-panel .b-panel-widget-tree .section>.position-buffer {
    display: none
}

#b-panel .b-panel-widget-tree .section>ul {
    margin-left: 0
}

#b-panel .b-panel-widget-tree button {
    border: none;
    background: none;
    color: inherit;
    padding: 0
}

#b-panel .b-panel-widget-tree button:disabled {
    opacity: .4
}

#b-panel .b-panel-widget-tree .widget-tree-item-icons {
    float: right;
    margin-right: 11px;
    padding: 6px 0
}

#b-panel .b-panel-widget-tree .expand-collapse {
    margin-left: 11px;
    position: relative;
    top: -7px
}

#b-panel .b-panel-widget-tree .dropbefore {
    display: none
}

#b-panel .b-panel-widget-tree ul li:first-child>.dropbefore {
    display: block
}

#b-panel .b-panel-widget-tree .position-buffer {
    height: 2px
}

#b-panel .b-panel-widget-tree .widget-tree-item-content:hover {
    background: rgba(0, 0, 0, 0.2)
}

#b-panel .b-panel-widget-tree .widget-tree-item-content:hover .widget-tree-item-icons {
    color: #147;
    fill: #147
}

#b-panel .b-panel-widget-tree .dragging {
    background: rgba(166, 233, 255, 0.8)
}

#b-panel .b-panel-widget-tree .buffer-dragenter {
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-name: expand;
    -moz-animation-name: expand;
    animation-name: expand;
    background-color: #feca0a;
    height: 20px
}

@-webkit-keyframes expand {
    #b-panel .b-panel-widget-tree from {
        height: 5px
    }
    #b-panel .b-panel-widget-tree to {
        height: 20px
    }
}

@-moz-keyframes expand {
    #b-panel .b-panel-widget-tree from {
        height: 5px
    }
    #b-panel .b-panel-widget-tree to {
        height: 20px
    }
}

@keyframes expand {
    #b-panel .b-panel-widget-tree from {
        height: 5px
    }
    #b-panel .b-panel-widget-tree to {
        height: 20px
    }
}

#b-panel .b-panel-widget-tree .dragenter {
    background: #feca0a
}

#b-panel .b-panel-widget-tree .dragenter .name {
    color: black
}

#b-panel .b-panel-widget-tree li ul {
    margin-left: 8px
}

#b-panel .b-panel-widget-tree .b-widget-tree-type {
    width: 18px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    height: 11px;
    top: -9px
}

#b-panel .b-panel-widget-tree .b-widget-tree-type img {
    position: absolute;
    height: 16px;
    top: -2px;
    z-index: -1
}

#b-panel .b-panel-widget-tree .b-active>.widget-tree-item-content .name.not-editing {
    color: #3EA5FF
}

#b-panel .b-panel-widget-tree .name {
    white-space: nowrap;
    display: inline-block;
    position: relative;
    overflow-x: hidden;
    padding: 6px 5px
}

#b-panel .b-panel-widget-tree .name::-webkit-scrollbar {
    height: 0!important
}

#b-panel .b-panel-widget-tree .name.not-editing {
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: default
}

#b-panel .b-panel-widget-tree .name[contenteditable=true] {
    background-color: #ffd;
    border-radius: 3px
}

#b-panel .b-panel-widget-tree .name.parents-1 {
    width: 117px
}

#b-panel .b-panel-widget-tree .name.parents-2 {
    width: 109px
}

#b-panel .b-panel-widget-tree .name.parents-3 {
    width: 101px
}

#b-panel .b-panel-widget-tree .name.parents-4 {
    width: 93px
}

#b-panel .b-panel-widget-tree .name.parents-5 {
    width: 85px
}

#b-panel .b-panel-widget-tree .name.parents-6 {
    width: 77px
}

#b-panel .b-panel-widget-tree .name.parents-7 {
    width: 69px
}

#b-panel .b-panel-widget-tree .name.parents-8 {
    width: 61px
}

#b-panel .b-panel-widget-tree .name.parents-9 {
    width: 53px
}

#b-panel .b-panel-widget-tree .name.parents-10 {
    width: 45px
}

#b-panel .b-panel-widget-tree .name.parents-11 {
    width: 37px
}

#b-panel .b-panel-widget-tree .name.parents-12 {
    width: 29px
}

#b-panel .b-panel-widget-tree .name.parents-13 {
    width: 21px
}

#b-panel .b-panel-widget-tree .name.parents-14 {
    width: 13px
}

#b-panel .b-panel-widget-tree .name.parents-15 {
    width: 5px
}

#b-panel .b-panel-widget-tree .name.parents-16 {
    width: -3px
}

#b-panel .b-panel-widget-tree .name.parents-17 {
    width: -11px
}

#b-panel .b-panel-widget-tree .name.parents-18 {
    width: -19px
}

#b-panel .b-panel-widget-tree .name.parents-19 {
    width: -27px
}

#b-panel .b-panel-widget-tree .name.parents-20 {
    width: -35px
}

#b-panel .flash-highlight>.widget-tree-item-content {
    background-color: rgba(254, 202, 10, 0);
    -webkit-animation: flash-highlight 1s ease forwards;
    animation: flash-highlight 1s ease forwards
}

@-webkit-keyframes flash-highlight {
    15% {
        background-color: rgba(254, 202, 10, 0.5)
    }
    100% {
        background-color: rgba(254, 202, 10, 0)
    }
}

@keyframes flash-highlight {
    15% {
        background-color: rgba(254, 202, 10, 0.5)
    }
    100% {
        background-color: rgba(254, 202, 10, 0)
    }
}

#b-panel .b-panel-widget-tree-item.has-no-children .b-widget-tree-triangle:before {
    content: ''
}

#b-panel .b-widget-tree-triangle:before {
    margin-right: -1px
}

#b-panel button.move-up {
    display: none
}

#b-panel .icon-eye-off {
    opacity: .6
}

#b-panel .script-icon {
    font-size: 12px;
    margin: 0 .2em
}

#b-panel .script-icon:not(.has-script) {
    display: none
}

#b-panel .animation-icon {
    margin: 0 .2em;
    fill: #ccc
}

#b-panel .animation-icon svg {
    vertical-align: middle;
    display: inline-block;
    width: 17px;
    height: 8px
}

#b-panel .animation-icon:not(.has-animation) {
    display: none
}

.simple-mode #b-panel ul.b-panel-widget-tree-nodes>li>ul>li>ul {
    display: none!important
}

.simple-mode #b-panel ul.b-panel-widget-tree-nodes button.expand-collapse,
.simple-mode #b-panel ul.b-panel-widget-tree-nodes button.eye,
.simple-mode #b-panel ul.b-panel-widget-tree-nodes button.icon-trash,
.simple-mode #b-panel ul.b-panel-widget-tree-nodes button.move-up {
    visibility: hidden
}

.simple-mode #b-panel ul.b-panel-widget-tree-nodes button.move-up {
    display: inline-block
}

.simple-mode #b-panel ul.b-panel-widget-tree-nodes .script-icon,
.simple-mode #b-panel ul.b-panel-widget-tree-nodes .animation-icon {
    display: none
}

.simple-mode #b-panel ul.b-panel-widget-tree-nodes .widget-tree-item-content:hover button.eye,
.simple-mode #b-panel ul.b-panel-widget-tree-nodes .widget-tree-item-content:hover button.move-up,
.simple-mode #b-panel ul.b-panel-widget-tree-nodes .widget-tree-item-content:hover button.icon-trash {
    visibility: visible
}

.simple-mode #b-panel ul.b-panel-widget-tree-nodes>li>ul>li:first-child .widget-tree-item-content:hover button.move-up {
    visibility: hidden
}

.colorpicker {
    z-index: 10000
}

.b-panel-style-form-length {
    margin-top: 8px
}

.bbf-boxmodel {
    position: relative;
    height: 100px;
    margin-top: 33px
}

.bbf-boxmodel .box-title {
    position: absolute;
    top: -22px
}

.bbf-boxmodel .container {
    position: absolute
}

.bbf-boxmodel .container.outer {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #222
}

.bbf-boxmodel .container.outer input {
    width: 34px
}

.bbf-boxmodel .container.outer input.pos.center {
    left: 50%;
    margin-left: -17px
}

.bbf-boxmodel .container.outer input.pos.top {
    top: 0
}

.bbf-boxmodel .container.outer input.pos.right {
    right: 3px
}

.bbf-boxmodel .container.outer input.pos.middle {
    top: 50%;
    margin-top: -6px
}

.bbf-boxmodel .container.outer input.pos.bottom {
    bottom: 3px
}

.bbf-boxmodel .container.outer input.pos.left {
    left: 3px
}

.bbf-boxmodel .container.inner {
    border-radius: 4px;
    border: 1px solid #444;
    top: 15px;
    right: 43px;
    bottom: 15px;
    left: 43px;
    background: #222
}

.bbf-boxmodel .container.inner.hover {
    border: 1px solid white
}

.bbf-boxmodel .container.inner input.pos.center {
    left: 50%;
    margin-left: -17px
}

.bbf-boxmodel .container.inner input.pos.top {
    top: 0
}

.bbf-boxmodel .container.inner input.pos.right {
    right: 3px
}

.bbf-boxmodel .container.inner input.pos.middle {
    top: 50%;
    margin-top: -6px
}

.bbf-boxmodel .container.inner input.pos.bottom {
    bottom: 3px
}

.bbf-boxmodel .container.inner input.pos.left {
    left: 3px
}

.bbf-boxmodel .container.center {
    top: 33px;
    right: 77.4px;
    bottom: 33px;
    left: 77.4px;
    background: #222;
    border: 1px solid #444
}

.bbf-boxmodel .container.center:hover {
    background: #222
}

.bbf-boxmodel .container:hover {
    background: #555
}

.bbf-boxmodel .container input[type="text"]:focus {
    color: #fff
}

.bbf-boxmodel .container input.disabled {
    user-select: none;
    -webkit-user-select: none
}

.bbf-boxmodel .container .border-radius-top-left {
    nav-index: 1
}

.bbf-boxmodel .container .border-radius-top-right {
    nav-index: 2
}

.bbf-boxmodel .container .border-radius-bottom-right {
    nav-index: 3
}

.bbf-boxmodel .container .border-radius-bottom-left {
    nav-index: 4
}

.bbf-boxmodel .container .margin-top {
    nav-index: 5
}

.bbf-boxmodel .container .margin-left {
    nav-index: 6
}

.bbf-boxmodel .container .margin-bottom {
    nav-index: 7
}

.bbf-boxmodel .container .margin-right {
    nav-index: 8
}

.bbf-boxmodel .container .padding-top {
    nav-index: 9
}

.bbf-boxmodel .container .padding-left {
    nav-index: 10
}

.bbf-boxmodel .container .padding-bottom {
    nav-index: 11
}

.bbf-boxmodel .container .padding-right {
    nav-index: 12
}

.bbf-boxmodel input[type="text"] {
    display: block;
    position: absolute;
    width: 34px;
    padding: 0!important;
    margin: 0;
    line-height: 10px;
    font-size: 12px;
    font-family: Tahoma, sans-serif;
    height: 12px!important;
    border: none;
    text-align: center;
    color: #999
}

.bbf-boxmodel input[type="text"]:focus {
    box-shadow: none;
    border: none
}

.bbf-boxmodel input[type="text"].highlight {
    color: #fff!important
}

.loader {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=)
}

.loader.black {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSIjMDAwMDAwIj4KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDggMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiAKICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIHZhbHVlcz0iMDsgNDsgMDsgMCIgZHVyPSIxLjJzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjAiCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+CiAgPC9jaXJjbGU+CiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNiAwKSIgY3g9IjAiIGN5PSIxNiIgcj0iMCI+IAogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIgogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPgogIDwvY2lyY2xlPgogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiAKICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIHZhbHVlcz0iMDsgNDsgMDsgMCIgZHVyPSIxLjJzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjAuNiIKICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4KICA8L2NpcmNsZT4KPC9zdmc+Cg==)
}

.pw-panel-pane-styles ul {
    margin: 5px 0 20px
}

.pw-panel-pane-styles li {
    color: #555
}

.pw-panel-pane-styles li span {
    display: inline-block;
    padding: 5px;
    width: 85%;
    overflow: hidden;
    text-overflow: ellipsis
}

.pw-panel-pane-styles li span[contenteditable=true] {
    background-color: #ffd;
    border-radius: 3px
}

.pw-panel-pane-styles li.is-applied-to-selected-widget span {
    color: #ebc500
}

.pw-panel-pane-styles button {
    -webkit-appearance: none;
    border: none;
    background-color: transparent;
    float: right;
    color: inherit;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    padding: 5px 0
}

.pw-panel-pane-styles button:hover {
    color: #7DC2FF
}

.bbf-upgrade-link a {
    display: block;
    text-align: center;
    text-decoration: none;
    color: #00b360
}

.bbf-upgrade-link a:hover {
    color: #56d58e
}

.pw-panel-pane-classes {
    background-color: #ECEDEF
}

.pw-panel-pane-classes .style-selector header {
    padding: 7px 3px
}

.pw-panel-pane-classes .style-selector header:after {
    content: "";
    display: table;
    clear: both
}

.pw-panel-pane-classes .style-selector h3 {
    float: left;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    padding: 0;
    color: #767676
}

.pw-panel-pane-classes label {
    z-index: auto;
    position: static;
    display: block
}

.pw-panel-pane-classes .b-panel-pane-content {
    position: relative;
    padding-bottom: 12px
}

.pw-panel-pane-classes .style-controls {
    text-align: right
}

.pw-panel-pane-classes .style-controls button.new {
    background: none;
    border: none;
    padding: 0;
    height: 20px;
    font-size: 12px;
    vertical-align: middle;
    -webkit-transition: color 200ms ease;
    transition: color 200ms ease;
    text-decoration: underline;
}

.style-controls button.new[disabled],
.style-controls button.new[disabled]:hover {
    cursor: not-allowed;
    color: #ccc !important;
}

.pw-panel-pane-classes .style-controls button.new svg {
    fill: #666;
    width: 20px;
    height: 20px;
    -webkit-transition: fill 200ms ease;
    transition: fill 200ms ease
}

.pw-panel-pane-classes .style-controls button.new:hover {
    color: #0288F0
}

.pw-panel-pane-classes .style-controls button.new:hover svg {
    fill: #ccc
}

.pw-panel-pane-classes .style-dropdown-container {
    position: relative
}

.pw-panel-pane-classes .styles-dropdown-button,
.pw-panel-pane-classes .input-new {
    border-radius: 5px
}

.pw-panel-pane-classes .styles-dropdown-button,
.pw-panel-pane-classes .styles-dropdown-content button,
.pw-panel-pane-classes .input-new {
    width: 100%;
    -webkit-appearance: none;
    border: 0;
    text-align: left;
    padding: 8px;
    color: #666;
    font-size: 14px;
    line-height: 21px
}

.pw-panel-pane-classes .styles-dropdown-content button {
    background-color: transparent;
    -webkit-transition: background-color .2s ease;
    transition: background-color .2s ease
}

.styles-dropdown-button[disabled],
.styles-dropdown-button[disabled] .style-name,
.styles-dropdown-button[disabled] span{
    cursor: not-allowed;
    color: #ccc;
    background-color: #f6f6f6;
}


.pw-panel-pane-classes .styles-dropdown-button,
.pw-panel-pane-classes .input-new {
    background-color: #fafafa;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

.pw-panel-pane-classes .styles-dropdown-button input,
.pw-panel-pane-classes .input-new input {
    background: transparent;
    border: none;
    color: #666;
    font-size: 14px;
    vertical-align: middle;
    width: calc(100% - 32px);
    margin-top: -3px
}

.pw-panel-pane-classes .input-new input.new::-webkit-input-placeholder {
    color: #333
}

.pw-panel-pane-classes .input-new input.new::-moz-placeholder {
    color: #333
}

.pw-panel-pane-classes .input-new input.new:-ms-input-placeholder {
    color: #333
}

.pw-panel-pane-classes .input-new input.new::placeholder {
    color: #333
}

@-webkit-keyframes styles-error-anim {
    .pw-panel-pane-classes 0,
    30% {
        box-shadow: 0 0 0 1px #b94a48
    }
    .pw-panel-pane-classes 100% {
        box-shadow: 0 0 0 1px rgba(185, 74, 72, 0)
    }
}

@keyframes styles-error-anim {
    .pw-panel-pane-classes 0,
    30% {
        box-shadow: 0 0 0 1px #b94a48
    }
    .pw-panel-pane-classes 100% {
        box-shadow: 0 0 0 1px rgba(185, 74, 72, 0)
    }
}

.pw-panel-pane-classes .styles-error {
    -webkit-animation: styles-error-anim 3s ease-out;
    -moz-animation: styles-error-anim 3s ease-out;
    animation: styles-error-anim 3s ease-out
}

.pw-panel-pane-classes .styles-dropdown-button:hover:not([disabled]),
.pw-panel-pane-classes .styles-dropdown-content button:hover:not([disabled]) {
    background-color: #ffb;
}

.pw-panel-pane-classes .styles-dropdown-content {
    background-color: #fafafa;
    display: none;
    position: absolute;
    z-index: 2;
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
    top: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2)
}

.pw-panel-pane-classes .styles-dropdown-content .separator {
    padding: 8px;
    background-color: #121212
}

.pw-panel-pane-classes .styles-dropdown-content .separator:after {
    height: 1px;
    content: ' ';
    background-color: black;
    width: 100%;
    display: block
}

.pw-panel-pane-classes .styles-dropdown-content .select .style-name {
    max-width: calc(100% - 35px)
}

.pw-panel-pane-classes .style-icon {
    display: inline-block;
    width: 21px;
    height: 21px;
    vertical-align: middle;
    margin-right: 5px
}

.pw-panel-pane-classes .style-icon.no-style svg {
    width: 21px;
    height: 21px;
    fill: #767676
}

.pw-panel-pane-classes .style-icon.test-style {
    border-radius: 50%
}

.pw-panel-pane-classes .style-icon.test-style[style=""] {
    border: 1px solid #333
}

.pw-panel-pane-classes .style-icon.text-style {
    text-align: center;
    background: #fff;
    border-radius: 3px;
    line-height: 18px
}

.pw-panel-pane-classes .style-icon.text-style svg {
    height: 21px;
    vertical-align: middle;
    fill: inherit
}

.pw-panel-pane-classes .no-style {
    color: #767676;
    vertical-align: middle
}

.pw-panel-pane-classes .style-name {
    display: inline-block;
    vertical-align: middle;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: calc(100% - 55px);
    white-space: nowrap
}

.pw-panel-pane-classes .position-marker {
    display: inline-block
}

.pw-panel-pane-classes .position-marker svg {
    width: 20px;
    height: 20px;
    fill: #767676;
    vertical-align: top
}

.pw-panel-pane-classes .action-header .action-label {
    font-size: 14px;
    line-height: 14px;
    color: #767676
}

.pw-panel-pane-classes .action-header .cancel-action {
    font-size: 22px;
    line-height: 14px;
    float: right;
    background: none;
    border: none;
    color: #767676;
    padding-right: 0
}

.pw-panel-pane-classes .style-actions {
    display: none
}

.pw-panel-pane-classes .style-actions header {
    padding: 10px 3px
}

.pw-panel-pane-classes .action-footer {
    margin: 4px 0 0;
    text-align: right
}

.pw-panel-pane-classes .action-footer button.confirm-action {
    display: inline-block;
    border: none;
    color: #666;
    border-radius: 3px;
    font-size: 12px;
    height: 23px;
    padding: 0 8px;
    background: #F8F8F8;
    background: -moz-linear-gradient(top, #FFF, #F9F9F9);
    background: -ms-linear-gradient(top, #FFF, #F9F9F9);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#F9F9F9));
    background: linear-gradient(top, #FFF, #F9F9F9);
    border: 1px solid #CCC;
}

.pw-panel-pane-classes .action-footer button.confirm-action[disabled] {
    opacity: .5
}

.pw-panel-pane-classes .pull-right {
    float: right
}

.panel-pane-navigation.panel2 .menu-open,
.panel-pane-navigation.panel2 .menu-close {
    width: 100%;
    height: 40px;
    background-repeat: no-repeat;
    background-position: 30% 50%
}

.panel-pane-navigation.panel2 .menu-open:before {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f0c9";
}

.panel-pane-navigation.panel2 .menu-close:before {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f00d";
}

.panel-pane-navigation.panel2 .split {
    margin-top: 10px
}

.panel-pane-navigation.panel2 .split:after {
    content: "";
    display: table;
    clear: both
}

.panel-pane-navigation.panel2 .split button {
    width: 47%;
    float: left
}

.panel-pane-navigation.panel2 .split .right {
    float: right
}

.panel-pane-navigation.panel2 .sticky-toggle {
    margin-top: 15px
}


/* 删除了字体面板里背景图的设置 */

#font-panel {
    display: none;
    z-index: 998;
    width: 280px;
    height: 540px;
    position: fixed;
    max-height: 100%;
    box-shadow: 0px 3px 16px rgba(0, 0, 0, 0.2);
    border-radius: 5px 5px 2px 3px;
    padding: 0;
    background-color: #fff;
    font-size: 1em;
    font-weight: bold;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
}

#font-panel .f-header {
    height: 145px
}

#font-panel .f-upgrade {
    position: relative;
    float: none;
    clear: left;
    text-align: Center
}

#font-panel .f-upgrade a {
    color: #00b360;
    text-decoration: none
}

#font-panel .f-upgrade .icon-font-typekit {
    font-size: 16px;
    vertical-align: middle
}

#font-panel .f-handle {
    height: 40px;
    width: 280px;
    cursor: move;
    border-radius: 3px 3px 0 0;
    color: #eee;
    padding: 8px 8px 0 15px;
    color: #95a7ae;
    border-bottom: 1px solid #e5e5e5;
}

#font-panel .f-close {
    float: right;
    transition: transform 0.2s ease;
}

#font-panel .f-close:hover {
    transform: rotate(90deg);
}

#font-panel .icon-cancel:before {
    font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 22px;
    content: "×"
}

#font-panel .f-pin,
#font-panel .f-close {
    color: #4c5a5f;
    text-decoration: underline;
    cursor: pointer;
    line-height: 25px;
    font-size: 14px;
}

#font-panel .f-pin {
    color: #ccc;
}

#font-panel .f-pin .pinned {
    color: #3196F4;
}

#font-panel .f-tabs {
    height: 58px;
    margin: 0 10px;
    font-size: 1em;
    position: relative
}

#font-panel .f-tabs ul {
    margin-left: 0;
    padding-left: 0;
    display: inline
}

#font-panel .f-tabs ul li {
    margin-bottom: 11px;
    margin-right: 5px;
    cursor: pointer;
    line-height: 21px;
    background-color: #fff;
    padding: 0 8px;
    color: #999;
    list-style: none;
    display: inline;
    float: left;
    font-size: 11px;
    border-radius: 9px;
    height: 21px
}

#font-panel .f-tabs ul li.with-icon {
    padding-left: 0
}

#font-panel .f-tabs ul li.with-icon i {
    padding: 0 2px 0 0;
    vertical-align: middle;
    font-size: 1.2em;
    line-height: 1.1em
}

#font-panel .f-tabs ul li.big-icon i {
    font-size: 1.8em
}

#font-panel .f-tabs ul li.selected {
    background-color: #ddd;
    color: #333
}

#font-panel .f-search-bar {
    padding: 11px 0;
    border: 0;
    position: relative;
    background-color: #eee;
}

#font-panel .f-search-bar i.icon-search {
    color: #ddd;
    position: absolute;
    top: 10px;
    line-height: 33px;
    right: 20px;
    font-size: 17px
}

#font-panel .f-search {
    width: 255px;
    background-color: #fff;
    color: #777;
    border-radius: 5px;
    height: 33px;
    font-size: 11px;
    padding: 0 10px;
    margin: 0 10px;
    border: 0
}

#font-panel .f-search:focus {
    outline: none;
    box-shadow: none
}

#font-panel .f-fonts {
    background-color: #f8f8f8;
    top: 90px;
    overflow-y: scroll;
    left: 0;
    right: 2px;
    bottom: 0;
    position: absolute;
    border-radius: 0 0 3px 3px;
}

#font-panel .f-fonts.free {
    top: 170px
}

#font-panel .f-fonts::-webkit-scrollbar {
    width: 7px
}

#font-panel .f-fonts::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.2)
}

#font-panel .f-list,
#font-panel .f-recent {
    list-style: none;
    padding: 0;
    margin: 0
}

#font-panel .f-font {
    background-size: auto;
    height: 40px;
    margin: 0 2px 0 5px;
    border-bottom: 1px solid #ddd;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative
}

#font-panel .f-font img {
    margin-left: 17px
}

#font-panel .f-font span {
    font-size: 17pt;
    margin-left: 20px;
    padding-left: 10px;
    white-space: nowrap;
    display: inline-block;
    font-weight: normal;
    line-height: 39px
}

#font-panel .f-font i {
    position: absolute;
    line-height: 32px;
    font-size: 16px;
    top: 4px;
    color: black
}

#font-panel .f-font i.icon-star,
#font-panel .f-font i.icon-star-empty {
    background-color: #ccc;
    padding-right: 10px;
    top: 4px;
    right: 0;
    box-shadow: -8px 0 8px 1px #ccc;
    visibility: hidden
}

#font-panel .f-font i.icon-star:hover,
#font-panel .f-font i.icon-star-empty:hover {
    color: white!important
}

#font-panel .f-font i.icon-star {
    color: #aaa;
    visibility: visible;
    box-shadow: -8px 0 8px 1px #eee;
    background-color: #eee
}

#font-panel .f-font .font-provider-icon {
    line-height: 16px;
    margin-left: 4px;
    margin-top: 6px;
    opacity: .2;
    font-size: 2.2em
}

#font-panel .f-font:hover i.icon-star,
#font-panel .f-font:hover i.icon-star-empty {
    visibility: visible;
    box-shadow: -8px 0 8px 1px #ccc;
    background-color: #ccc;
    color: black
}

#font-panel .f-font:hover .font-provider-icon,
#font-panel .f-font.selected .font-provider-icon {
    opacity: 1
}

#font-panel .f-font.selected {
    background-color: #ccee99
}

#font-panel .f-font.selected i.icon-star {
    box-shadow: -8px 0 8px 1px #ffc800;
    background-color: #ffc800
}

#font-panel .f-font:hover {
    background-color: #eee;
    cursor: pointer
}

#font-panel .f-font.selected:hover {
    background-color: #ddb700
}

#font-panel .f-font.selected:hover i {
    cursor: pointer;
    background-color: #ddb700;
    box-shadow: -8px 0 8px 1px #ddb700
}

#font-panel .f-loading {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.5)
}

#font-panel .f-loading i {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 40px;
    height: 60px;
    width: 60px;
    text-align: center;
    line-height: 60px;
    margin-left: -30px;
    margin-top: -30px
}

.selected-icon {
    float: right
}

.animate-spin {
    -webkit-animation: spin 2s infinite linear;
    -moz-animation: spin 2s infinite linear;
    animation: spin 2s infinite linear;
    display: inline-block
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.b-panel-widget-panes {
    position: relative;
    padding-bottom: 160px
}

.b-panel-no-widget-selected {
    padding: 50% 0;
    font-size: 14px;
    text-align: center;
    color: #4d4d4d;
    font-weight: 500;
}

.panel2 {
    background: #F1F2F4
}

.panel2 .b-panel-pane-content {
    margin: 0;
    padding: 10px
}

.panel2 .row {
    width: 100%
}

.panel2 .row,
.panel2 .bbf-field {
    margin: 0 0 6px;
    line-height: 0
}

.panel2 .row label,
.panel2 .row .label,
.panel2 .bbf-field label,
.panel2 .bbf-field .label {
    display: inline-block;
    position: static;
    color: #444;
    fill: #444;
    line-height: 30px
}

.panel2 .row label.small,
.panel2 .row .label.small,
.panel2 .bbf-field label.small,
.panel2 .bbf-field .label.small {
    line-height: 20px
}

.panel2 .b-panel-right-field {
    margin: 0;
    left: 0;
    width: calc(50% - 2.5px);
    text-align: right
}

.panel-pane-widget-admin.panel2 .b-panel-right-field {
    width: calc(30% - 2.5px);
}

.panel-pane-widget-admin.panel2 .b-panel-right-field+label {
    width: calc(70% - 2.5px);
}

.panel2 .b-panel-right-field+label,
.panel2 .b-panel-right-field+.label {
    width: calc(50% - 2.5px)
}

.panel2 .disclaimer {
    font-size: 12px;
    line-height: 1.7em;
    color: #666
}

.panel2 .bbf-field input,
.panel2 .bbf-field textarea,
.panel2 input,
.panel2 textarea {
    background-color: #fff;
    width: 65px;
    height: 30px;
    border: 0;
    border-radius: 3px;
    text-align: left;
    padding-left: 4px;
    padding-right: 4px;
    margin: 0;
    color: #333;
    line-height: 1.4;
    border: 1px solid #EEE;
}

.panel2 .bbf-field input.small,
.panel2 .bbf-field textarea.small,
.panel2 input.small,
.panel2 textarea.small {
    height: 20px
}

.panel2 .bbf-field input:hover,
.panel2 .bbf-field input:focus,
.panel2 .bbf-field textarea:hover,
.panel2 .bbf-field textarea:focus,
.panel2 input:hover,
.panel2 input:focus,
.panel2 textarea:hover,
.panel2 textarea:focus {
    background-color: #ffe
}

.panel2 .bbf-field input::-webkit-input-placeholder,
.panel2 .bbf-field textarea::-webkit-input-placeholder,
.panel2 input::-webkit-input-placeholder,
.panel2 textarea::-webkit-input-placeholder {
    color: #404040;
    text-overflow: ellipsis!important
}

.panel2 .bbf-field input::-moz-placeholder,
.panel2 .bbf-field textarea::-moz-placeholder,
.panel2 input::-moz-placeholder,
.panel2 textarea::-moz-placeholder {
    color: #404040;
    text-overflow: ellipsis!important
}

.panel2 .bbf-field input:-ms-input-placeholder,
.panel2 .bbf-field textarea:-ms-input-placeholder,
.panel2 input:-ms-input-placeholder,
.panel2 textarea:-ms-input-placeholder {
    color: #404040;
    text-overflow: ellipsis!important
}

.panel2 .bbf-field input::placeholder,
.panel2 .bbf-field textarea::placeholder,
.panel2 input::placeholder,
.panel2 textarea::placeholder {
    color: #404040;
    text-overflow: ellipsis!important
}

.panel2 .bbf-field input:hover::-webkit-input-placeholder,
.panel2 .bbf-field input:focus::-webkit-input-placeholder,
.panel2 .bbf-field textarea:hover::-webkit-input-placeholder,
.panel2 .bbf-field textarea:focus::-webkit-input-placeholder,
.panel2 input:hover::-webkit-input-placeholder,
.panel2 input:focus::-webkit-input-placeholder,
.panel2 textarea:hover::-webkit-input-placeholder,
.panel2 textarea:focus::-webkit-input-placeholder {
    color: #4d4d4d
}

.panel2 .bbf-field input:hover::-moz-placeholder,
.panel2 .bbf-field input:focus::-moz-placeholder,
.panel2 .bbf-field textarea:hover::-moz-placeholder,
.panel2 .bbf-field textarea:focus::-moz-placeholder,
.panel2 input:hover::-moz-placeholder,
.panel2 input:focus::-moz-placeholder,
.panel2 textarea:hover::-moz-placeholder,
.panel2 textarea:focus::-moz-placeholder {
    color: #4d4d4d
}

.panel2 .bbf-field input:hover:-ms-input-placeholder,
.panel2 .bbf-field input:focus:-ms-input-placeholder,
.panel2 .bbf-field textarea:hover:-ms-input-placeholder,
.panel2 .bbf-field textarea:focus:-ms-input-placeholder,
.panel2 input:hover:-ms-input-placeholder,
.panel2 input:focus:-ms-input-placeholder,
.panel2 textarea:hover:-ms-input-placeholder,
.panel2 textarea:focus:-ms-input-placeholder {
    color: #4d4d4d
}

.panel2 .bbf-field input:hover::placeholder,
.panel2 .bbf-field input:focus::placeholder,
.panel2 .bbf-field textarea:hover::placeholder,
.panel2 .bbf-field textarea:focus::placeholder,
.panel2 input:hover::placeholder,
.panel2 input:focus::placeholder,
.panel2 textarea:hover::placeholder,
.panel2 textarea:focus::placeholder {
    color: #4d4d4d
}

.panel2 .bbf-field input[disabled],
.panel2 .bbf-field textarea[disabled],
.panel2 input[disabled],
.panel2 textarea[disabled] {
    color: #494949
}

.panel2 .bbf-field input[disabled]:hover,
.panel2 .bbf-field textarea[disabled]:hover,
.panel2 input[disabled]:hover,
.panel2 textarea[disabled]:hover {
    background-color: #fff
}

.panel2 .bbf-field input.autocomplete-open,
.panel2 .bbf-field textarea.autocomplete-open,
.panel2 input.autocomplete-open,
.panel2 textarea.autocomplete-open {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-color: #ffe
}

.panel2 .small input {
    height: 20px
}

.panel2 .small .selectbox .icon,
.panel2 .small .selectbox .dropdown {
    height: 20px
}

.panel2 .small .selectbox .dropdown {
    line-height: 20px
}

.panel2 .disabled {
    pointer-events: none
}

.panel2 button,
.panel2 input[type=submit] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px;
    color: #666;
    border-radius: 3px;
    background: #F8F8F8;
    background: -moz-linear-gradient(top, #FFF, #F9F9F9);
    background: -ms-linear-gradient(top, #FFF, #F9F9F9);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#F9F9F9));
    background: linear-gradient(top, #FFF, #F9F9F9);
    border: 1px solid #CCC;
}

.panel2 button:hover:not([disabled]),
.panel2 input[type=submit]:hover {
    color: #0080E0;
    border-color: #0080E0;
    background-color: #7DC2FF;
}

.panel2 button[disabled],
.panel2 input[type=submit][disabled] {
    color: #ddd;
    cursor: not-allowed;
}

.panel2 button[disabled]:hover,
.panel2 input[type=submit][disabled]:hover {
    background-color: #eee;
    border-color: #ccc;
}

.panel2 button.small,
.panel2 input[type=submit].small {
    height: 20px
}

.panel2 .selectbox {
    position: relative;
    width: 100%;
    max-width: 80px
}

.panel2 .selectbox input {
    width: 100%;
    padding-right: 24px
}

.panel2 .selectbox:focus input,
.panel2 .selectbox:hover input {
    background-color: #ffd
}

.panel2 .selectbox.hasIcon input {
    background-position: 0 50%;
    background-repeat: no-repeat;
    padding-left: 24px
}

.panel2 .selectbox .icon,
.panel2 .selectbox .dropdown {
    height: 30px;
    display: block
}

.panel2 .selectbox .icon {
    width: 20px;
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none
}

.panel2 .selectbox .dropdown {
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #AAA
}

.panel2 .selectbox .dropdown:hover {
    color: #000
}

.panel2 .selectbox.no-suggestions input {
    width: 65px;
    padding-right: 4px
}

.panel2 .selectbox.no-suggestions .dropdown {
    display: none
}

.panel2 .disabled .selectbox .dropdown,
.panel2 .disabled .pw-dropdown-selectbox .pw-dropdown-selectbox-toggle .caret {
    color: #ccc
}

.panel2 .disabled input,
.panel2 .disabled .pw-dropdown-selectbox .pw-dropdown-selectbox-toggle {
    background-color: #f6f6f6;
    color: #ccc
}

.panel2 .disabled .selectbox .icon,
.panel2 .disabled .bbf-color .sp-replacer {
    opacity: .3
}

.panel2 .remove {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    height: 30px;
    width: 20px;
    background: url(images/icons/big-input-x.svg) 50% 50% no-repeat
}

.panel2 .remove:hover {
    background-image: url(images/icons/big-input-x-hover.svg)
}

.panel2 .remove.small {
	display:block;
    height: 20px
}

.panel2 .el-switch {
    width: 30px;
    height: 18px!important;
    border-radius: 9px;
    background: #BBBBBB;
    margin-top: 1px;
    margin-bottom: 1px;
    padding: 0
}

.panel2 .el-switch:after {
    width: 12px;
    height: 12px;
    border-radius: 9px;
    background: #fff;
    top: 2px;
    left: 2px
}

.panel2 .el-switch:hover:after {
    background: #fff;
    left: 3px
}

.panel2 .el-switch[data-state="active"] {
    background: #3EA5FF
}

.panel2 .el-switch[data-state="active"]:after {
    background: #fff;
    left: 15px
}

.panel2 .el-switch:disabled:after {
    background: #ccc;
    left: 3px
}

.panel2 .bbf-editor {
    width: 100%;
    margin: 0
}

.panel2 .bbf-range-wrap label {
    position: absolute;
    z-index: 1;
    top: 0;
    line-height: 20px
}

.panel2 .bbf-range {
    margin: 0
}

.panel2 .bbf-range input[type="text"] {
    float: right;
    width: 20%;
    max-width: 65px;
    text-align: right
}

.panel2 .bbf-range input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    height: 5px;
    background: #5EC042;
    border: 1px solid #5EC042;
    border-radius: 3px;
    margin-top: 3px;
    margin-bottom: 3px
}

.panel2 .bbf-range input[type="range"]:hover {
    background: #32E700
}

.panel2 .bbf-range input::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 13px;
    border: #CCC 1px solid;
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5)
}

.panel2 .bbf-range input:hover::-webkit-slider-thumb,
.panel2 .bbf-range input:focus::-webkit-slider-thumb {
    background: #ffe
}

body.f-bp-color-1 .panel2 .el-switch.f-bp-color[data-state="active"]:after,
body.f-bp-color-1 .panel2 .el-switch.f-bp-color:not([data-state="active"]):hover:after {
    background-color: #fd6!important
}

body.f-bp-color-2 .panel2 .el-switch.f-bp-color[data-state="active"]:after,
body.f-bp-color-2 .panel2 .el-switch.f-bp-color:not([data-state="active"]):hover:after {
    background-color: #f96!important
}

body.f-bp-color-3 .panel2 .el-switch.f-bp-color[data-state="active"]:after,
body.f-bp-color-3 .panel2 .el-switch.f-bp-color:not([data-state="active"]):hover:after {
    background-color: #a9aaff!important
}

body.f-bp-color-4 .panel2 .el-switch.f-bp-color[data-state="active"]:after,
body.f-bp-color-4 .panel2 .el-switch.f-bp-color:not([data-state="active"]):hover:after {
    background-color: #66fcb7!important
}

body.f-bp-color-5 .panel2 .el-switch.f-bp-color[data-state="active"]:after,
body.f-bp-color-5 .panel2 .el-switch.f-bp-color:not([data-state="active"]):hover:after {
    background-color: #6cff7a!important
}

.b-panel .ui-autocomplete {
    overflow: auto;
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    min-width: 65px;
    max-height: 200px;
    background-color: #ffd;
    border-radius: 0 0 3px 3px;
    border: none;
    box-shadow: 0px 2px 6px -1px rgba(0, 0, 0, 0.3);
    cursor: default
}

.b-panel .ui-autocomplete .ui-menu-item {
    background: #fff;
    color: #666;
    padding: 5px 10px 5px 5px;
    position: relative
}

.b-panel .ui-autocomplete .ui-menu-item:last-child {
    border-radius: 0 0 3px 3px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-1 {
    padding-left: 15px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-1.with-icon {
    padding-left: 36px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-1 .icon {
    left: 15px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-2 {
    padding-left: 25px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-2.with-icon {
    padding-left: 46px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-2 .icon {
    left: 25px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-3 {
    padding-left: 35px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-3.with-icon {
    padding-left: 56px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-3 .icon {
    left: 35px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-4 {
    padding-left: 45px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-4.with-icon {
    padding-left: 66px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-4 .icon {
    left: 45px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-5 {
    padding-left: 55px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-5.with-icon {
    padding-left: 76px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-5 .icon {
    left: 55px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-6 {
    padding-left: 65px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-6.with-icon {
    padding-left: 86px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-6 .icon {
    left: 65px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-7 {
    padding-left: 75px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-7.with-icon {
    padding-left: 96px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-7 .icon {
    left: 75px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-8 {
    padding-left: 85px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-8.with-icon {
    padding-left: 106px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-8 .icon {
    left: 85px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-9 {
    padding-left: 95px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-9.with-icon {
    padding-left: 116px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-9 .icon {
    left: 95px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-10 {
    padding-left: 105px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-10.with-icon {
    padding-left: 126px
}

.b-panel .ui-autocomplete .ui-menu-item.indent-10 .icon {
    left: 105px
}

.b-panel .ui-autocomplete .ui-menu-item.with-icon {
    padding-left: 26px
}

.b-panel .ui-autocomplete .ui-menu-item .icon {
    width: 16px;
    opacity: .8;
    position: absolute;
    left: 5px;
    top: 3px
}

.b-panel .ui-autocomplete .ui-state-focus {
    margin: 0;
    background: #ffd;
    color: #456;
    border: none;
    font-weight: normal
}

.b-panel .ui-autocomplete .ui-menu-divider {
    display: none
}

.ui-helper-hidden-accessible {
    display: none
}

.panel-pane-tabs {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row
}

.panel-pane-tabs .panel-pane-tab {
    width: 100%;
    cursor: pointer;
    background: #ddd;
    color: #999;
    text-align: center
}

.panel-pane-tabs .panel-pane-tab span {
    display: block;
    height: 30px;
    line-height: 30px;
    border-left: 1px solid #bbb;
    border-right: 1px solid #bbb
}

.panel-pane-tabs .panel-pane-tab:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel-pane-tabs .panel-pane-tab:first-child span {
    border-left: 0
}

.panel-pane-tabs .panel-pane-tab:last-child {
    border-right: 0;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.panel-pane-tabs .panel-pane-tab:last-child span {
    border-right: 0
}

.panel-pane-tabs .panel-pane-tab.active {
    background: #ccc;
    color: #222;
}

.panel-pane-tabs .panel-pane-tab:not(.active):not([disabled]):hover {
    color: gray
}

.panel-pane-tabs .panel-pane-tab[disabled] {
    color: #A9A9A9;
    cursor: default
}

.panel2 {
    border-bottom: 2px solid #DDD;
}

.panel2 .sp-dd {
    display: none!important
}

.panel2 .colorpicker {
    z-index: 989
}

.panel2 .bbf-color .color-icon {
    border: 1px solid white;
    height: 15px;
    width: 15px;
    padding: 0;
    margin: 0 6px 0 0;
    position: relative;
    top: 4px
}

.panel2 .bbf-color .color-text {
    width: 61px
}

.panel2 .bbf-color .color-input {
    display: inline-block;
    position: relative;
    white-space: nowrap
}

.panel2 .bbf-color input {
    width: calc(100% - 32px);
    max-width: 85px;
    padding-right: 4px
}

.panel2 .bbf-color .no-color {
    background: url(images/icons/no-color.png) 50% 50% no-repeat
}

.panel2 .bbf-color.has-color input {
    color: #AAA;
    padding-right: 24px
}

.panel2 .bbf-color.has-color .remove {
    display: block
}

.panel2 .bbf-color.disabled {
    opacity: .3
}

.panel2 .bbf-color.disabled .bbf-color .no-color {
    background: url(images/icons/no-color-disabled.png) 50% 50% no-repeat
}

.panel2 .bbf-color.small .sp-preview {
    width: 20px;
    height: 20px;
    margin-right: 0
}

.panel2 .bbf-color.small input {
    width: calc(100% - 22px)
}

.panel2 .bbf-color.small .remove {
	display:block;
    height: 20px
}

.panel2 .sp-replacer {
    background: none;
    border: 0;
    color: #333;
    vertical-align: middle;
    padding: 0;
    margin: -2px 2px 0 0
}

.panel2 .sp-preview {
    width: 28px;
    height: 28px;
    border: 1px solid #fff;
    border-radius: 3px;
    overflow: hidden;
    margin-right: 2px
}

.panel2 .sp-preview .sp-preview-inner:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    right: 0;
    bottom: 0;
    background: url(images/icons/small_corner-white.svg) bottom left no-repeat
}

.panel2 .sp-palette-container {
    padding-right: 0;
    background-color: #444;
    border: 0
}

.panel2 .sp-palette {
    max-width: 18px;
    max-height: 180px;
    overflow: hidden
}

.panel2 .sp-palette .sp-thumb-el {
    border-style: none
}

.panel2 .sp-palette .sp-thumb-el.sp-thumb-active {
    border-color: white;
    border-style: solid
}

.panel2 .sp-palette .sp-thumb-el.sp-thumb-active .sp-thumb-inner {
    background-image: none
}

.panel2 .sp-picker-container {
    background-color: #444;
    border: 0
}

.panel2 .sp-container {
    border-radius: 4px;
    box-shadow: 0 0 0 5px rgba(153, 153, 153, 0.4);
    border: 0;
    z-index: 2147483647;
    overflow: hidden;
    position: fixed;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.panel2 .sp-container button {
    background: #999;
    color: #000;
    border: 0;
    border-radius: 3px;
    text-shadow: none
}

.panel2 .sp-container button:hover,
.panel2 .sp-container button:active {
    background: #ffbf00;
    border: 0;
    text-shadow: none
}

.panel2 .sp-cancel {
    color: #ccc!important
}

.panel2 .sp-cancel:hover {
    color: #999!important
}

.panel-pane-chart-properties .chart-types {
    width: 100%;
    *zoom: 1;
}
.panel-pane-chart-properties .chart-types:before,
.panel-pane-chart-properties .chart-types:after {
    display: table;
    content: "";
}
.panel-pane-chart-properties .chart-types:after {
    clear: both;
}
.panel-pane-chart-properties .btn-data-editor{
    width: 100%;
    line-height: 36px;
    height: 36px;
}

.chart-types .item {
    float: left;
    width: 33.33%;
    box-sizing: border-box;
    padding: 10px 0 5px;
    cursor: pointer;
}
.chart-types .item.on,
.chart-types .item:hover{
    background-color: #ec0;
}
.chart-types .item.on .chart-icon,
.chart-types .item:hover .chart-icon{
    color: #fff;
    filter: #fff;
}
.chart-types .item.on .type-name,
.chart-types .item:hover .type-name{
    color: #3EA2FF;
}
.chart-types .item .chart-icon{
    display: block;
    margin: 0 auto;
    width: 50px;
    height: 50px;

}
.chart-types .item .type-name{
    line-height: 24px;
    text-align: center;
}


.b-field-file-upload {
    display: inline-block;
    vertical-align: top;
    width: 100%
}

.b-field-file-upload .file-upload .btn.browse {
    -webkit-transition: background-color .2s ease;
    transition: background-color .2s ease;
    position: relative;
    display: inline-block;
    border-radius: 3px;
    border: 1px solid #ccc;
    background-color: transparent;
    width: 100%;
    height: 30px;
    line-height: 28px;
    padding: 0 4px;
    text-align: center;
    color: #666;
    cursor: pointer;
    background: #F8F8F8;
    background: -moz-linear-gradient(top, #FFF, #F9F9F9);
    background: -ms-linear-gradient(top, #FFF, #F9F9F9);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#F9F9F9));
    background: linear-gradient(top, #FFF, #F9F9F9);
}

.b-field-file-upload .file-upload .btn.browse:hover {
    color: #0080E0;
    border-color: #0080E0
}

.b-field-file-upload .file-upload .btn.browse.has-display-name {
    background: #333;
    border-color: #333;
    text-align: left
}

.b-field-file-upload .file-upload .btn.browse.has-display-name.can-remove {
    padding-right: 24px
}

.b-field-file-upload .file-upload .btn.browse.has-display-name:hover {
    background: #fff;
    border-color: #fff
}

.b-field-file-upload .file-upload .btn.browse .btn-label {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    display: inline-block;
    vertical-align: middle
}

.b-field-file-upload .file-upload .btn.browse svg {
    display: inline-block;
    width: 18px;
    margin-right: .6em;
    vertical-align: middle
}

.b-field-file-upload .file-upload .btn.browse:hover svg path {
    fill: #0080E0;
}

.b-field-file-upload .file-upload.small .btn.browse {
    height: 20px;
    line-height: 18px
}

.b-field-file-upload .file-upload input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

.b-field-file-upload .remove {
    display: block;
    position: absolute;
    top: 0;
    right: -1px;
    margin: 0;
    height: 30px;
    width: 20px;
    background: url(images/icons/big-input-x.svg) 50% 50% no-repeat
}

.b-field-file-upload .remove:hover {
    background-image: url(images/icons/big-input-x-hover.svg)
}

.b-field-file-upload .remove.small {
    height: 20px
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse {
    position: relative
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse:focus input,
.b-field-file-upload .file-upload.image-upload .file-url-input-browse:hover input {
    background-color: #ffd
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse input {
    width: 100%;
    padding-right: 25px
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse .browse {
    width: 20px;
    height: 30px;
    line-height: 28px;
    text-align: center;
    padding-right: 4px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    fill: #666
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse .browse:hover {
    fill: #3EA5FF
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse .browse svg {
    display: inline-block;
    vertical-align: middle;
    width: 13px
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse .remove {
    right: 20px
}

.b-field-file-upload .file-upload.image-upload .file-url-input-browse.can-remove input {
    padding-right: 40px
}

.panel2.panel-typography .b-field-text-align,
.panel2.panel-typography .b-field-font-style,
.panel2.panel-typography .b-field-font-bold,
.panel2.panel-typography .b-field-text-decoration,
.panel2.panel-typography .b-field-font-family,
.panel2.panel-typography .b-field-font-weight,
.panel2.panel-typography .b-field-font-size,
.panel2.panel-typography .b-field-line-height,
.panel2.panel-typography .b-field-letter-spacing {
    display: inline-block
}

.panel2.panel-typography .b-field-font-style,
.panel2.panel-typography .b-field-text-decoration,
.panel2.panel-typography .b-field-font-bold {
    float: right
}

.panel2.panel-typography .b-field-text-align {
    margin-left: 8px
}

.panel2.panel-typography .b-field-text-align,
.panel2.panel-typography .b-field-text-decoration {
    margin-bottom: 12px
}

.panel2.panel-typography .icon-italic::before {
    content: 'I';
    font-style: italic
}

.panel2.panel-typography .icon-underline::before {
    content: 'U';
    text-decoration: underline
}

.panel2.panel-typography .icon-bold::before {
    content: 'B';
    font-weight: 600
}

.panel2.panel-typography .b-field-font-weight,
.panel2.panel-typography .b-field-font-size,
.panel2.panel-typography .b-field-line-height,
.panel2.panel-typography .b-field-letter-spacing {
    width: calc(50% - 2.5px)
}

.panel2.panel-typography .b-field-font-family {
    width: 100%
}

.panel2.panel-typography .bbf-fontselector {
    position: relative
}

.panel2.panel-typography .bbf-fontselector:focus input,
.panel2.panel-typography .bbf-fontselector:hover input {
    background: #fff
}

.panel2.panel-typography .bbf-fontselector input {
    width: 100%;
    padding-right: 24px
}

.panel2.panel-typography .bbf-fontselector .toggle-icon {
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    color: #AAA
}

.panel2.panel-typography .bbf-fontselector .toggle-icon:hover {
    color: #3EA5FF
}

.panel2.panel-typography .b-field-font-size .icon {
    background-image: url("images/panel-icons/font-size.svg")
}

.panel2.panel-typography .b-field-font-weight {
    margin-left: 5px
}

.panel2.panel-typography .b-field-font-weight .icon {
    background-image: url("images/panel-icons/font-weight.svg")
}

.panel2.panel-typography .b-field-line-height .icon {
    background-image: url("images/panel-icons/line-height.svg")
}

.panel2.panel-typography .b-field-letter-spacing {
    margin-left: 5px
}

.panel2.panel-typography .b-field-letter-spacing .icon {
    background-image: url("images/panel-icons/letter-spacing.svg")
}

.panel2.panel-typography .b-field-color .bbf-color .color-input {
    width: 100%
}

.panel2.panel-typography .b-field-color .bbf-color input {
    max-width: none
}

.panel2.panel-typography .selectbox {
    max-width: none
}

.panel2.panel-typography .selectbox .icon {
    left: 2px
}

.panel2.panel-typography .child-class-select {
    position: relative;
    margin-bottom: 20px
}

.panel2.panel-typography .disabled .bbf-fontselector .toggle-icon {
    color: #ccc
}

.panel2.panel-typography .disabled .bbf-button-list {
    opacity: .3
}

.panel2.panel-typography .disclaimer-wrap {
    margin: 5px 0 15px
}

.panel2.panel-typography .disclaimer-wrap svg,
.panel2.panel-pane-dynamic .disclaimer-wrap svg {
    width: 20px;
    height: 20px;
    fill: #999;
    float: left;
    margin-right: 8px;
    margin-top: -2px
}

.panel2.panel-pane-dynamic .disclaimer-wrap svg {
    fill: #A184F1;
}

.panel2.panel-pane-dynamic .disclaimer {
    color: #A184F1;
}

.panel2.panel-pane-background .panel-pane-tabs {
    margin: 18px 0 12px
}

.panel2.panel-pane-background .disclaimer {
    margin: 12px 0 6px
}

.panel2.panel-pane-background .b-field-background-color,
.panel2.panel-pane-background .b-field-background-overlay-color {
    display: inline-block;
    vertical-align: top
}

.panel2.panel-pane-background .b-field-background-color .color-input,
.panel2.panel-pane-background .b-field-background-overlay-color .color-input {
    width: 100%
}

.panel2.panel-pane-background .b-field-background-color input,
.panel2.panel-pane-background .b-field-background-overlay-color input {
    max-width: none
}

.panel2.panel-pane-background .b-field-background-color,
.panel2.panel-pane-background .b-field-background-overlay-color {
    width: calc(50% - 2.5px);
    float: right
}

.panel2.panel-pane-background .selectbox {
    max-width: none
}

.panel2.panel-pane-background input {
    text-overflow: ellipsis
}

.panel-pane-slideshow.panel2 .row {
    text-align: right
}

.panel-pane-slideshow.panel2 .slide-buttons {
    margin-bottom: 12px;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row
}

.panel-pane-slideshow.panel2 .slide-buttons button {
    margin: 0 3px;
    padding: 0 9px;
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto
}

.panel-pane-slideshow.panel2 .slide-buttons button.slide-arrow {
    vertical-align: top;
    fill: #808080;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto
}

.panel-pane-slideshow.panel2 .slide-buttons button.slide-arrow svg {
    vertical-align: middle
}

.panel-pane-slideshow.panel2 .slide-buttons button.slide-arrow:hover {
    fill: #b3b3b3
}

.panel-pane-slideshow.panel2 .slide-buttons button.slide-arrow[disabled] {
    fill: #b3b3b3;
    color: #ddd;
    background-color: #eee;
    border-color: #ccc;
    cursor: not-allowed;
}

.panel-pane-slideshow.panel2 .slide-buttons button:first-child {
    margin-left: 0
}

.panel-pane-slideshow.panel2 .slide-buttons button:last-child {
    margin-right: 0
}

.panel-pane-slideshow.panel2 .slideshow-setting {
    display: inline-block
}

.panel-pane-slideshow.panel2 .slideshow-setting>* {
    vertical-align: middle
}

.panel-pane-slideshow.panel2 .slideshow-setting .el-switch {
    margin-left: 7px
}

.panel-pane-slideshow.panel2 .field-dot-color {
    display: inline-block
}

.panel-pane-slideshow.panel2 label {
    width: auto;
    float: left;
    line-height: 20px
}
.pw-null-slide{
    background: #eee;
    text-align: center;
    color: #ccc;
    line-height: 10;
}

.panel2.panel-pane-form .bbf-field {
    margin-top: 0
}

.panel2.panel-pane-form .bbf-editor input.select.no-suggestions {
    width: 100%;
    background-color: #fff;
    color: #AAA
}

.panel2.panel-pane-form .bbf-editor input.select.no-suggestions:hover,
.panel2.panel-pane-form .bbf-editor input.select.no-suggestions:focus {
    background-color: #ffd
}

.panel2.panel-pane-form .bbf-field label {
    line-height: 1;
    margin-bottom: 6px;
    width: auto
}

.panel2.panel-pane-animations.is-loading .b-panel-pane-content {
    min-height: 50px
}

.panel2.panel-pane-animations.is-loading .b-panel-pane-content:after {
    display: block;
    content: "";
    width: 100%;
    height: 40px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=) 50% 50% no-repeat
}

.panel2.panel-pane-animations .selectbox {
    max-width: none
}

.panel2.panel-pane-links .selectbox {
    max-width: none
}

.panel2.panel-pane-links input,
.panel-pane-dynamic.panel2 input {
    width: 100%
}

.panel2.panel-pane-links .bbf-color.has-color input {
    color: white
}

.panel2.panel-pane-links .anchor-select-label {
    width: calc(50% - 2.5px)
}

.panel2.panel-pane-links .anchor-select-label label,
.panel-pane-dynamic.panel2 .source-catalog-select-label label,
.panel-pane-dynamic.panel2 .articles-select-label label,
.panel-pane-links.panel2 .catalog-link-picker-ct label.small {
    width: auto
}

.panel2.panel-pane-links .anchor-select-label button,
.panel-pane-dynamic.panel2 .source-catalog-select-label button,
.panel-pane-dynamic.panel2 .articles-select-label button,
.panel-pane-links.panel2 .js-link-insite-picker {
    background: transparent;
    padding: 0;
    margin: 0;
    float: right;
    line-height: 20px;
    height: 20px;
    min-width: 20px;
    fill: #A184F1;
    color: #9771FF;
    border-color: #B397FF;
}

#b-panel-widget-listType.disabled .articles-select-label button{
    fill: #ccc;
    color: #CCC;
    border-color: #ccc;
}

.panel2.panel-pane-links .anchor-select-label button:hover,
.panel-pane-dynamic.panel2 .source-catalog-select-label button:hover,
.panel-pane-dynamic.panel2 .articles-select-label button:hover {
    fill: #0080E0
}

.panel2.panel-pane-links .anchor-select-label svg,
.panel-pane-dynamic.panel2 .source-catalog-select-label svg {
    margin-top: 1px;
    width: 19px;
    height: 19px
}

.panel-pane-dynamic .disabled .row label.small {
    color: #ccc;
}

#b-panel-base-class-editor {
    background: transparent
}

.panel2 .b-panel-css-editor,
.panel2 .b-panel-js-editor {
    color: #333;
    border-radius: 5px
}

.panel2 .b-panel-css-editor button,
.panel2 .b-panel-js-editor button {
    color: #666;
    width: 100%;
    height: 40px;
    font-size: 14px;
    line-height: 21px;
    border-radius: 5px;
    background: #F8F8F8;
    background: -moz-linear-gradient(top, #FFF, #F9F9F9);
    background: -ms-linear-gradient(top, #FFF, #F9F9F9);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#F9F9F9));
    background: linear-gradient(top, #FFF, #F9F9F9);
    border: 1px solid #CCC;
}

.panel2 .b-panel-css-editor button:hover,
.panel2 .b-panel-js-editor button:hover {
    color: #0080E0;
    border-color: #0080E0;
}

.panel2 .b-panel-css-editor {
    margin-top: 10px;
    background: transparent
}

.panel2 .b-panel-css-editor button {
    margin-bottom: 5px
}

.panel2 .b-panel-css-output {
    margin-top: 10px;
    font-size: 12px;
    overflow: hidden;
    white-space: nowrap;
    color: #505050
}

.panel2 .b-panel-css-output span {
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: 1
}

.b-popup.b-popup-css-editor,
.b-popup.b-popup-js-editor {
    font-size: 12px
}

.b-popup.b-popup-css-editor .info-notice,
.b-popup.b-popup-js-editor .info-notice {
    display: inline-block;
    color: #999;
    padding: 13px 20px 0
}

.b-popup.b-popup-css-editor .cm-s-ambiance.CodeMirror,
.b-popup.b-popup-js-editor .cm-s-ambiance.CodeMirror {
    box-shadow: none
}

.b-popup.b-popup-css-editor .CodeMirror *,
.b-popup.b-popup-js-editor .CodeMirror * {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.CodeMirror-hints {
    z-index: 33029;
    font-size: 12px
}

.CodeMirror-vscrollbar::-webkit-scrollbar,
.CodeMirror-hscrollbar::-webkit-scrollbar {
    width: 7px;
    height: 7px;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, 0.05)
}

.CodeMirror-vscrollbar::-webkit-scrollbar-track,
.CodeMirror-hscrollbar::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, 0.05)
}

.CodeMirror-vscrollbar::-webkit-scrollbar-track-piece,
.CodeMirror-hscrollbar::-webkit-scrollbar-track-piece {
    background-color: rgba(0, 0, 0, 0.05)
}

.CodeMirror-vscrollbar::-webkit-scrollbar-thumb,
.CodeMirror-hscrollbar::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(0, 0, 0, 0.2)
}

.CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
    background-color: #888
}

.panel-pane-page-meta.panel2 label {
    display: block;
    width: 100%
}

.panel-pane-page-meta.panel2 .bbf-editor,
.panel-pane-page-meta.panel2 input,
.panel-pane-page-meta.panel2 textarea {
    width: 100%
}

.panel-pane-page-meta.panel2 textarea {
    min-height: 77px;
    border: 1px solid #eee;
    border-top-color: #ccc;
    resize: none
}

.panel-pane-page-meta.panel2 .disclaimer-wrap {
    margin-top: 7px
}

.panel-pane-page-meta.panel2 .disclaimer-wrap svg {
    width: 20px;
    height: 20px;
    fill: #999;
    float: left;
    margin-right: 8px;
    margin-top: 4px
}

.panel2.panel-pane-flexbox .tabs {
    clear: both;
    margin: 6px 0 12px
}

.panel2.panel-pane-flexbox .tabs .tab {
    display: inline-block;
    width: 50%;
    cursor: pointer;
    background: #ddd;
    color: #A9A9A9;
    text-align: center
}

.panel2.panel-pane-flexbox .tabs .tab span {
    display: block;
    height: 30px;
    line-height: 30px
}

.panel2.panel-pane-flexbox .tabs .tab.active {
    background: #bbb;
    color: #666
}

.panel2.panel-pane-flexbox .tabs .tab:not(.active):hover {
    color: gray
}

.panel2.panel-pane-flexbox .tabs .tab:nth-child(2n) span {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc
}

.panel2.panel-pane-flexbox .tabs .tab:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px
}

.panel2.panel-pane-flexbox .tabs .tab:last-child {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

.panel2.panel-pane-flexbox .tabs .tab:last-child span {
    border-right: none
}

.panel2.panel-pane-flexbox .disclaimer {
    margin: 12px 0 6px
}

.panel2.panel-pane-flexbox .disclaimer svg {
    width: 20px;
    height: 20px;
    fill: #999;
    float: left;
    margin-right: 8px;
    margin-top: 4px;
    margin-bottom: 20px
}

.panel2.panel-pane-flexbox .selectbox {
    max-width: none
}

.panel2.panel-pane-image-properties .b-field-alt-text,
.panel2.panel-pane-chart-properties .b-chart-title,
.panel2.panel-pane-image-properties .b-field-title-text {
    width: 100%
}

.panel2.panel-pane-image-properties .b-field-title-text {
    min-height: 6em;
    border: none;
    resize: none
}

.panel2.panel-pane-svg-properties .b-field-fill-color,
.panel2.panel-pane-svg-properties .b-field-stroke-color {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 2.5px);
    float: right
}

.panel2.panel-pane-svg-properties .b-field-fill-color .color-input,
.panel2.panel-pane-svg-properties .b-field-stroke-color .color-input {
    width: 100%
}

.panel2.panel-pane-svg-properties .b-field-fill-color input,
.panel2.panel-pane-svg-properties .b-field-stroke-color input {
    max-width: none
}

.panel2.panel-pane-grid .weaver-grid-stretch-cells .b-panel-right-field,
.panel2.panel-pane-grid .weaver-grid-reverse .b-panel-right-field {
    width: calc(30% - 2.5px)
}

.panel2.panel-pane-grid .weaver-grid-stretch-cells label,
.panel2.panel-pane-grid .weaver-grid-reverse label {
    width: calc(70% - 2.5px)
}

.panel2.panel-pane-grid .weaver-grid-stretch-cells {
    margin-top: 10px
}

.panel2.panel-pane-grid .weaver-grid-reverse {
    margin-bottom: 10px
}

.grid-slider {
    margin-top: 22px;
    height: 30px
}

.multiSliderContainer {
    background: #fff;
    color: #aaa
}

.multiSliderContainer .multiSliderDivision {
    overflow: hidden;
    text-align: center;
    cursor: cell
}

.multiSliderContainer .multiSliderDivision span {
    display: inline-block;
    color: #B5B5B5;
    height: 30px;
    line-height: 30px
}

.multiSliderContainer .multiSliderHandler {
    -webkit-transition: background 300ms;
    transition: background 300ms;
    cursor: ew-resize;
    background: #bbb;
    width: 5px;
    height: 100%
}

.multiSliderContainer .multiSliderHandler:hover {
    background: #777;
    padding: 0 3px
}

.multiSliderContainer .multiSliderHandler.handlerOver {
    cursor: col-resize;
    background: #3EA5FF;
    padding: 0 3px
}

.preview-grid {
    height: 20px;
    margin-top: 4px
}

.panel-grid-columns {
    clear: both
}

.panel-grid-columns .preview-grid-table {
    background: #fff;
    width: calc((100% - 30px - 5px *(6 - 1)) /(6 - 1));
    height: 16px;
    position: relative;
    float: right;
    border: 1px solid #aaa;
    margin-right: 5px
}

.panel-grid-columns .preview-grid-table:first-child {
    margin-right: 0
}

.panel-grid-columns .preview-grid-table .column {
    position: absolute;
    height: 100%;
    width: 1px;
    background: #aaa
}

.panel-grid-columns .preview-grid-table:hover,
.panel-grid-columns .preview-grid-table.active {
    cursor: pointer;
    border-color: #3EA5FF
}

.panel-grid-columns .preview-grid-table:hover .column,
.panel-grid-columns .preview-grid-table.active .column {
    background: #3EA2FF
}

.panel-grid-columns .preview-grid-table.table-column-one {
    width: 30px
}

body.f-bp-color-1 .preview-grid.f-bp-color .preview-grid-table.active {
    border-color: #ebc500
}

body.f-bp-color-1 .preview-grid.f-bp-color .preview-grid-table.active .column {
    background: #ebc500
}

body.f-bp-color-2 .preview-grid.f-bp-color .preview-grid-table.active {
    border-color: #EB8900
}

body.f-bp-color-2 .preview-grid.f-bp-color .preview-grid-table.active .column {
    background: #EB8900
}

body.f-bp-color-3 .preview-grid.f-bp-color .preview-grid-table.active {
    border-color: #a9aaf1
}

body.f-bp-color-3 .preview-grid.f-bp-color .preview-grid-table.active .column {
    background: #a9aaf1
}

body.f-bp-color-4 .preview-grid.f-bp-color .preview-grid-table.active {
    border-color: #66ccb7
}

body.f-bp-color-4 .preview-grid.f-bp-color .preview-grid-table.active .column {
    background: #66ccb7
}

body.f-bp-color-5 .preview-grid.f-bp-color .preview-grid-table.active {
    border-color: #6cdf7a
}

body.f-bp-color-5 .preview-grid.f-bp-color .preview-grid-table.active .column {
    background: #6cdf7a
}

.panel-pane-shadow.panel2 .panel-pane-tabs {
    margin-bottom: 12px;
}

.pw-panel-pane-align li {
    display: inline-block;
    vertical-align: top;
    margin-right: 5px;
    position: relative;
}

.pw-panel-pane-align li:hover .submenu {
    height: 65px;
}

.pw-panel-pane-align li:last-child {
    margin-right: 0;
}

.pw-panel-pane-align .buttons {
    display: inline-block;
}

.pw-panel-pane-align button {
    margin: 0;
    border-radius: 0;
    padding: 0;
    border: 0;
    width: 30px;
    height: 30px;
    display: block;
    margin-bottom: 5px;
    background: none;
    background-color: #ddd;
}

.pw-panel-pane-align button .dynamic-fill {
    fill: #666;
    -webkit-transition: fill 200ms ease;
    transition: fill 200ms ease;
}

.pw-panel-pane-align button[disabled] {
    background-color: #e8e8e8;
}

.pw-panel-pane-align button[disabled] .dynamic-fill {
    fill: #ddd;
}

.pw-panel-pane-align button:not([disabled]):hover {
    background-color: #ec0;
}

.pw-panel-pane-align button:not([disabled]):hover:not(.active) .dynamic-fill {
    fill: #EBEBEB;
}

.pw-panel-pane-align button.active .dynamic-fill {
    fill: #EB910F;
}

.pw-panel-pane-align .corner {
    position: absolute;
    top: 0;
    pointer-events: none;
}

.pw-panel-pane-align .dimensions {
    margin-top: 20px;
}

.pw-panel-pane-align .rendered-width,
.pw-panel-pane-align .rendered-height {
    color: #444;
    font-size: 12px;
    line-height: 1.7em;
    margin: 10px 0;
    white-space: nowrap;
}

.pw-panel-pane-align .submenu {
    height: 0;
    position: absolute;
    top: 35px;
    overflow: hidden;
    -webkit-transition: height 150ms ease;
    transition: height 150ms ease;
}

.pw-panel-pane-align .rotated {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.pw-panel-pane-align .right {
    float: right;
}

.pw-panel-pane-align .section {
    width: 50%;
    display: inline-block;
}

.pw-panel-pane-align .section>* {
    display: inline-block;
    vertical-align: top;
}

.pw-panel-pane-align .section .max,
.pw-panel-pane-align .section .stretch-width,
.pw-panel-pane-align .section .stretch-height {
    margin-right: 5px;
}

.pw-panel-pane-align .section.height {
    padding-left: 19px;
}

.pw-panel-pane-align .section .input-width[disabled] {
    background-color: #ddd;
    color: #bbb!important;
}

.pw-panel-pane-align .section .input-width[disabled]::-webkit-input-placeholder {
    color: inherit;
}

.pw-panel-pane-align .section .input-width[disabled]::-moz-placeholder {
    color: inherit;
}

.pw-panel-pane-align .section .input-width[disabled]:-ms-input-placeholder {
    color: inherit;
}

.pw-panel-pane-align .section .input-width[disabled]::placeholder {
    color: inherit;
}

.pw-panel-pane-align input {
    background-color: #fff;
    color: #898989;
    width: 64px;
    height: 30px;
    border: 1px solid #eee;
    border-top-color: #ccc;
}

.pw-panel-pane-align input.small {
    width: 47px;
    height: 20px;
    padding-left: 1px;
    padding-right: 1px;
}

.pw-panel-pane-align input::-webkit-input-placeholder {
    color: gray;
}

.pw-panel-pane-align input::-moz-placeholder {
    color: gray;
}

.pw-panel-pane-align input:-ms-input-placeholder {
    color: gray
}

.pw-panel-pane-align input::placeholder {
    color: gray
}

.pw-panel-pane-align .box-models .tabs {
    /*border-top: rgba(0,0,0,0.2) solid 2px;*/
    margin-top: 2em;
    background-color: #ddd;
}

.pw-panel-pane-align .box-models .tabs li {
    width: auto;
    margin: 0
}

.pw-panel-pane-align .box-models .tabs li button {
    color: gray;
    width: auto;
    margin: 0;
    padding: .4em 1em;
    height: auto;
    background: none;
    border: 0;
    background-color: transparent;
    -webkit-transition: background-color 200ms ease;
    transition: background-color 200ms ease
}

.pw-panel-pane-align .box-models .tabs li.current button,
.pw-panel-pane-align .box-models .tabs li:hover button {
    border-bottom: 2px solid #777;
}

.pw-panel-pane-align .box-models .tab-content {
    position: relative;
    margin-top: 1px;
    padding-top: .02px;
    padding-bottom: .02px
}

.pw-panel-pane-align .box-models .tab-content .background {
    position: absolute;
    background-color: #fff;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0
}

.pw-panel-pane-align .box-model {
    margin: 10%
}

.pw-panel-pane-align .visual-box {
    border: 3px solid #ccc;
    margin: auto auto;
    height: 60px;
    position: relative;
    width: 150px
}

.pw-panel-pane-align .visual-box input {
    position: absolute;
    width: 50px;
    margin-left: -25px;
    height: 20px;
    margin-top: -10px;
    top: 0;
    left: 0;
    background-color: #ddd;
    color: #898989;
    border-radius: 3px;
    text-align: center;
    border: 1px solid #ccc;
    border-top-color: #999;
}

.pw-panel-pane-align .visual-box input.top {
    top: 0;
    left: 50%
}

.pw-panel-pane-align .visual-box input.right {
    left: 100%;
    top: 50%
}

.pw-panel-pane-align .visual-box input.bottom {
    left: 50%;
    top: 100%
}

.pw-panel-pane-align .visual-box input.left {
    left: 0;
    top: 50%
}

@-moz-document url-prefix() {
    .pw-panel-pane-align .section.height {
        padding-left: 15px
    }
}

body.f-bp-color-1 .pw-panel-pane-align button.active .dynamic-fill {
    fill: #ebc500!important
}

body.f-bp-color-2 .pw-panel-pane-align button.active .dynamic-fill {
    fill: #EB8900!important
}

body.f-bp-color-3 .pw-panel-pane-align button.active .dynamic-fill {
    fill: #a9aaf1!important
}

body.f-bp-color-4 .pw-panel-pane-align button.active .dynamic-fill {
    fill: #66ccb7!important
}

body.f-bp-color-5 .pw-panel-pane-align button.active .dynamic-fill {
    fill: #6cdf7a!important
}

.b-submenu,
.b-submenu button,
.b-submenu input,
.b-submenu select,
.b-submenu textarea {
    font-family: Tahoma, sans-serif;
    z-index: 1
}

.b-submenu ul,
.b-submenu-button {
    font-size: 12px
}

.b-submenu {
    display: none;
    position: absolute;
    padding-left: 11px
}

.b-submenu li {
    line-height: 0
}

.b-submenu ul {
    background-color: rgba(0, 0, 0, 0.8);
    margin: 0;
    list-style-type: none;
    position: relative;
    top: -35px;
    left: 13px;
    padding: 6px 0;
    border: 1px solid #333;
    border-radius: 4px
}

.b-submenu .b-submenu-button {
    width: 100%;
    height: 22px;
    color: #fff;
    border: none;
    text-align: left;
    padding-left: 11px;
    padding-right: 11px;
    white-space: nowrap;
    background-color: transparent
}

.b-submenu .b-submenu-button:hover {
    background: #666
}

.b-submenu .b-submenu-button.disabled {
    color: #999
}

.b-submenu-triangle {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid rgba(0, 0, 0, 0.8);
    top: -27px;
    left: 14px;
    border-right-color: #333;
    z-index: 2
}

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

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

@-webkit-keyframes super-rainbow {
    0% {
        background: #4775FF
    }
    20% {
        background: #A96DF5
    }
    40% {
        background: #FF4747
    }
    60% {
        background: #FFC300
    }
    80% {
        background: #6CC272
    }
    100% {
        background: #47B3A5
    }
}

@keyframes super-rainbow {
    0% {
        background: #4775FF
    }
    20% {
        background: #A96DF5
    }
    40% {
        background: #FF4747
    }
    60% {
        background: #FFC300
    }
    80% {
        background: #6CC272
    }
    100% {
        background: #47B3A5
    }
}

#pw-widget-library {
    -webkit-transition: left .25s ease;
    transition: left .25s ease
}

body.pw-is-preview-mode #pw-widget-library {
    left: -34px
}

#pw-widget-library,
body.pw-is-preview-mode #pw-widget-library.is-open {
    font-weight: 400;
    position: fixed;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 978;
    top: 50px;
    bottom: 0;
    left: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 12px
}

#pw-widget-library .b-scroll,
body.pw-is-preview-mode #pw-widget-library.is-open .b-scroll {
    max-height: none;
    overflow-y: auto
}

#pw-widget-library button,
#pw-widget-library select,
#pw-widget-library input,
#pw-widget-library textarea,
body.pw-is-preview-mode #pw-widget-library.is-open button,
body.pw-is-preview-mode #pw-widget-library.is-open select,
body.pw-is-preview-mode #pw-widget-library.is-open input,
body.pw-is-preview-mode #pw-widget-library.is-open textarea {
    font-weight: 400;
}
#pw-widget-library .group-basics button.library-widget-add{display:none;}
.pw-widget-library-toggle {
    background-color: #F5F6F8;
    color: #777;
    font-size: 14px;
    position: absolute;
    z-index: 988;
    top: 0;
    left: 0;
    width: 34px;
    height: 100%;
    cursor: pointer;
    -webkit-transition: color .15s ease;
    transition: color .15s ease;
    border-right: #CCC 3px solid;
    /*2016*/
}

.is-open .pw-widget-library-toggle {
    border-right: #eee 1px solid;
}

.pw-widget-library-toggle svg {
    margin-top: 4px;
    fill: #777;
    -webkit-transition: fill .15s ease;
    transition: fill .15s ease
}


/*
.pw-widget-library-toggle span {
    display: block;
    width: 100px;
    padding-top: 2px;
    margin: 100px 0 0 -2px;
    text-align: right;
    line-height: 34px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: 0;
    -ms-transform-origin: 0;
    transform-origin: 0 0;
}*/


/*2016*/

.pw-widget-library-toggle span.vertical-tab {
    padding: 1.1em 0.6em;
    line-height: 1.2;
    display: block;
    border-top: 1px solid #e6e6e6;
}

.pw-widget-library-toggle span.active {
    background-color: #E6E6E6;
}

.pw-widget-library-toggle span.vertical-tab:hover {
    color: #0288F0;
}

.pw-widget-library-toggle:hover {
    color: #555
}

.pw-widget-library-toggle:hover svg {
    fill: #555
}

#pw-widget-library.is-open .pw-widget-library-toggle {
    color: #555;
}

#pw-widget-library.is-open .pw-widget-library-toggle svg {
    fill: #555
}

.pw-widget-library-contents {
    position: absolute;
    z-index: 987;
    top: 0;
    bottom: 0;
    left: 34px;
    width: 284px;
    background: #F0F1F3;
    -webkit-transform: translateX(-284px);
    -ms-transform: translateX(-284px);
    transform: translateX(-284px);
    -webkit-transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1);
    border-right: #CCC 3px solid;
}

.pw-widget-library-contents .b-toolbar-content-item ul {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.pw-widget-library-contents .b-toolbar-content-item ul li {
    background-color: rgba(26, 26, 26, 0.9);
    color: #fff;
    margin-bottom: 2px;
    cursor: pointer
}

.pw-widget-library-contents .b-toolbar-content-item ul li img {
    color: #fff;
    fill: #fff;
    width: 100%
}

.pw-widget-library-contents:after {
    content: "";
    display: block;
    position: absolute;
    right: -15px;
    width: 15px;
    top: 0;
    bottom: 0;
    background: transparent!important;
    pointer-events: none
}

#pw-widget-library.is-open .pw-widget-library-contents {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

#pw-widget-library.is-open .pw-widget-library-contents:after {
    pointer-events: all
}

#pw-widget-library ul.tabs {
    display: block;
    height: 40px;
    margin: 0;
    padding: 0
}

#pw-widget-library ul.tabs li {
    display: block;
    float: left;
    margin: 0;
    padding: 0 10px;
    width: 50%;
    height: 40px;
    line-height: 40px;
    cursor: pointer;
    color: #666;
    font-size: 13px;
    -webkit-transition: color .15s ease;
    transition: color .15s ease
}

#pw-widget-library ul.tabs li span {
    vertical-align: middle
}

#pw-widget-library ul.tabs li svg {
    fill: #666;
    height: 40px;
    width: auto;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    -webkit-transition: fill .15s ease;
    transition: fill .15s ease
}

#pw-widget-library ul.tabs li:hover {
    color: #666
}

#pw-widget-library ul.tabs li:hover svg {
    fill: #666
}

#pw-widget-library ul.tabs li.active {}

#pw-widget-library ul.tabs li.active svg {
    fill: #135
}

#pw-widget-library .tab-contents {
    position: relative;
    height: calc(100% - 40px)
}

#pw-widget-library .pw-widget-library-tab-content {
    padding: 0 8px;
    height: 100%
}

#pw-widget-library .pw-widget-library-tab-content .top-actions,
#pw-widget-library .pw-widget-library-tab-content .contents {
    position: relative;
    opacity: 1;
    -webkit-transition: opacity .15s ease;
    transition: opacity .15s ease
}

#pw-widget-library .pw-widget-library-tab-content .top-actions {
    z-index: 2;
    padding: 5px 0;
}

#pw-widget-library .pw-widget-library-tab-content .contents {
    z-index: 1;
}

@-moz-document url-prefix() {
    #pw-widget-library .pw-widget-library-tab-content {
        padding: 0 5px 0 7px
    }
}

.library-widgets-group .widgets-collections {
    opacity: 1;
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease
}

.library-widgets-group.is-loading {
    min-height: 100%
}

.library-widgets-group.is-loading .widgets-collections {
    opacity: 0
}

.library-widgets-group.is-loading:before {
    position: absolute;
    display: block;
    content: "";
    top: 50%;
    left: 50%;
    margin-top: -25px;
    margin-left: -50px;
    width: 100px;
    height: 50px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=) 50% 50% no-repeat
}

.library-widgets-group .library-widgets-group-info-text {
    color: #666;
    line-height: 1.4;
    margin: 10px 0 20px 0;
    text-align: center
}

.pw-widget-library-tab-content button {
    -webkit-appearance: none;
    display: block;
    position: relative;
    cursor: pointer;
    padding: 0 10px;
    margin: 0;
    width: 250px;
    height: 30px;
    line-height: 30px;
    border: 0;
    border-radius: 2px;
    text-align: center;
    font-size: 12px;
    color: #666;
    background: #F8F8F8;
    background: -moz-linear-gradient(top, #FFF, #F9F9F9);
    background: -ms-linear-gradient(top, #FFF, #F9F9F9);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#F9F9F9));
    background: linear-gradient(top, #FFF, #F9F9F9);
    border: 1px solid #CCC;
    text-decoration: none;
    -webkit-transition: color .15s ease, backgound .15s ease;
    transition: color .15s ease, backgound .15s ease
}

.pw-widget-library-tab-content button:hover {
    color: #0080E0;
    border-color: #0080E0;
}

.pw-widget-library-tab-content button:disabled {
    color: #ccc;
    border-color: #ddd;
    background: transparent;
}

.pw-widget-library-tab-content button.library-widget-add:disabled {
    cursor: auto
}

.pw-widget-library-tab-content button.library-widget-add:disabled span.quotes {
    display: none
}

.pw-widget-library-tab-content button.library-widget-add span.selected-widget-label {
    display: inline-block;
    vertical-align: bottom;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.pw-widget-library-tab-content .library-widgets.type-button_text button.library-widget-add span.selected-widget-label,
.pw-widget-library-tab-content .library-widgets.type-button_arrow button.library-widget-add span.selected-widget-label,
.pw-widget-library-tab-content .library-widgets.type-icon_social button.library-widget-add span.selected-widget-label,
.pw-widget-library-tab-content .library-widgets.type-icon_navigation button.library-widget-add span.selected-widget-label,
.pw-widget-library-tab-content .library-widgets.type-icon_other button.library-widget-add span.selected-widget-label {
    max-width: 80px
}

.pw-widget-library-tab-content .dropdown {
    width: 250px
}
.group-premade .library-widgets,.group-premade .library-widgets>.title{
    display:none
}
.group-premade .library-widgets.type-navigation{
    display:block;
}
.library-widgets {
    margin-bottom: 20px;
}


.library-widgets button.library-widget-add {
    margin-top: 10px
}
.library-widgets button.library-widget-loadmore{
    margin-top:10px;
    display:none;
}
.group-premade .library-widgets button.library-widget-loadmore{
    display:block;
}

.library-widgets.type-images_medialibrary button.load_more,
.library-widgets.type-videos_medialibrary button.load_more {
    margin-top: 10px;
    display: none
}

.library-widgets.type-images_medialibrary .not_found,
.library-widgets.type-videos_medialibrary .not_found,
.library-widgets-group .not_found{
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 18px;
    text-align: center;
    color: #4d4d4d;
    font-weight: 500;
    display: none
}
.group-premade .library-widgets .widgets.is-loading:after,
.library-widgets.type-images_medialibrary .widgets.is-loading:after,
.library-widgets.type-videos_medialibrary .widgets.is-loading:after {
    display: block;
    content: "";
    width: 100%;
    height: 40px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=) 50% 50% no-repeat
}

.library-widgets>.title {
    color: #234
}

.library-widgets>.widgets {
    margin-left: -5px
}

.library-widgets>.widgets:after {
    content: "";
    display: table;
    clear: both
}

.library-widgets.type-one_column>.title,
.library-widgets.type-two_column>.title,
.library-widgets.type-three_column>.title,
.library-widgets.type-four_column>.title {
    color: #6d6e70
}

.library-widgets.type-one_column>.title::first-letter,
.library-widgets.type-two_column>.title::first-letter,
.library-widgets.type-three_column>.title::first-letter,
.library-widgets.type-four_column>.title::first-letter {
    color: #d0d2d3
}

.library-widget {
    position: relative;
    float: left;
    width: 120px;
    height: 95px;
    margin: 10px 5px 0;
    overflow: hidden;
}
.library-widget>.thumb-wrap{
    cursor: -webkit-grab;
    cursor: grab
}

.library-widget>.title {
    color: #767676;
    pointer-events: none;
    padding: 4px 0;
    margin-top: 3px;
    cursor: default;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    cursor: text;
    position: absolute;
    bottom: 0;
    left: 0;
}
.library-widget>.title-edit{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: none;
}
.library-widget>.title-edit > .title-input{
    width: 100%;
    border: 0 none;
    margin: 0;
    background-color: #ffb;
    border-radius: 3px;
    padding: 4px;
    font-size: 11px;
    color: #767676;

}

.library-widget:hover .library-widget-thumbnail:after {
    opacity: 1
}

.library-widget:hover .library-widget-actions {
    opacity: 1
}
.group-basics .library-widget:hover .library-widget-actions{opacity:0;}

.library-widget.newly-added .library-widget-thumbnail {
    border-color: #1cbf61;
    -webkit-transition: border-color .15s ease;
    transition: border-color .15s ease
}

.thumb-wrap {
    position: relative
}

.library-widget-thumbnail {
    position: relative;
    overflow: hidden;
    cursor: -webkit-grab;
    cursor: grab;
    width: 120px;
    height: 67px;
    background: #e8e8e8;
    border: 1px solid #ddd;
    border-radius: 2px;
    -webkit-transition: border-color 2s ease;
    transition: border-color 2s ease;
    text-align: center!important;
    font-size: 0!important
}

.library-widget-thumbnail:after {
    display: block;
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    opacity: 0;
    -webkit-transition: opacity .15s ease;
    transition: opacity .15s ease
}

.library-widget-thumbnail img {
    max-width: 100%;
    max-height: 100%;
    display: inline-block;
    vertical-align: middle
}

.library-widget-thumbnail:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

.library-widget-actions {
    position: absolute;
    z-index: 10;
    right: 0;
    bottom: 0;
    text-align: right;
    opacity: 0;
    padding: 2px;
    -webkit-transition: opacity .15s ease;
    transition: opacity .15s ease
}

.library-widget-actions:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 60px;
    height: 60px;
    background: -webkit-gradient(linear, left top, right bottom, color-stop(50%, transparent), color-stop(100%, rgba(0, 0, 0, 0.3)));
    background: -webkit-linear-gradient(-45deg, transparent 50%, rgba(0, 0, 0, 0.3) 100%);
    background: linear-gradient(135deg, transparent 50%, rgba(0, 0, 0, 0.3) 100%);
    pointer-events: none
}

.library-widget-delete,
.library-widget-edit,
.library-widget-replace {
    float: left;
    color: white;
    cursor: pointer;
    opacity: .6;
}

.library-widget-delete:hover,
.library-widget-edit:hover,
.library-widget-replace:hover {
    opacity: 1
}

.library-widgets.type-vector .library-widget:nth-child(n),
.library-widgets.type-icon_social .library-widget:nth-child(n),
.library-widgets.type-icon_navigation .library-widget:nth-child(n),
.library-widgets.type-icon_other .library-widget:nth-child(n),
.library-widgets.type-button_arrow .library-widget:nth-child(n) {
    margin-left: 0;
    margin-right: 0
}

.library-widgets.type-vector .library-widget:nth-child(3n-1),
.library-widgets.type-icon_social .library-widget:nth-child(3n-1),
.library-widgets.type-icon_navigation .library-widget:nth-child(3n-1),
.library-widgets.type-icon_other .library-widget:nth-child(3n-1),
.library-widgets.type-button_arrow .library-widget:nth-child(3n-1) {
    margin-left: 10px;
    margin-right: 10px
}

.library-widgets.type-vector .library-widget .library-widget-thumbnail,
.library-widgets.type-icon_social .library-widget .library-widget-thumbnail,
.library-widgets.type-icon_navigation .library-widget .library-widget-thumbnail,
.library-widgets.type-icon_other .library-widget .library-widget-thumbnail,
.library-widgets.type-button_arrow .library-widget .library-widget-thumbnail {
    width: 75px;
    height: 67px
}

.library-widgets.type-vector .library-widget.showing-tooltip:nth-child(n) .tooltip,
.library-widgets.type-icon_social .library-widget.showing-tooltip:nth-child(n) .tooltip,
.library-widgets.type-icon_navigation .library-widget.showing-tooltip:nth-child(n) .tooltip,
.library-widgets.type-icon_other .library-widget.showing-tooltip:nth-child(n) .tooltip,
.library-widgets.type-button_arrow .library-widget.showing-tooltip:nth-child(n) .tooltip {
    left: 67px
}

.library-widgets.type-vector .library-widget.showing-tooltip:nth-child(3n) .tooltip,
.library-widgets.type-icon_social .library-widget.showing-tooltip:nth-child(3n) .tooltip,
.library-widgets.type-icon_navigation .library-widget.showing-tooltip:nth-child(3n) .tooltip,
.library-widgets.type-icon_other .library-widget.showing-tooltip:nth-child(3n) .tooltip,
.library-widgets.type-button_arrow .library-widget.showing-tooltip:nth-child(3n) .tooltip {
    left: auto;
    right: 67px
}

.icon-font-icon-widget {
    float: left;
    cursor: -webkit-grab;
    cursor: grab;
    text-align: center;
    width: 50px;
    height: 50px;
    line-height: 50px;
    fill: #666
}

.icon-font-icon-widget:hover {
    fill: #147
}

.icon-font-icon-widget svg {
    display: inline-block;
    vertical-align: middle;
    width: 22px;
    height: 22px
}

.type-fontawesome .icon-font-icon-widget {
    fill: #777
}

.type-fontawesome .icon-font-icon-widget:hover {
    fill: #258
}

.type-linea .icon-font-icon-widget,
.type-social .icon-font-icon-widget {
    stroke: #666
}

.type-linea .icon-font-icon-widget:hover,
.type-social .icon-font-icon-widget:hover {
    stroke: #147
}

#pw-widget-library .pw-widget-library-tab-content[data-active-group="premade"] .top-actions,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="videos_medialibrary"] .top-actions,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="images_medialibrary"] .top-actions {
    min-height: 50px
}

#pw-widget-library .pw-widget-library-tab-content[data-active-group="icons"] .top-actions {
    height: 10px;
}

#pw-widget-library .pw-widget-library-tab-content[data-active-group="videos_medialibrary"] .contents,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="images_medialibrary"] .contents {
    height: calc(100% - 50px)
}
#pw-widget-library .pw-widget-library-tab-content[data-active-group="premade"] .contents{
    height: calc(100% - 90px)
}

#pw-widget-library .pw-widget-library-tab-content[data-active-group="icons"] .contents,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="imported_library"] .contents,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="basics"] .contents {
    height: calc(100% - 20px)
}

#pw-widget-library .pw-widget-library-tab-content[data-active-group="premade"] .widget-search,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="videos_medialibrary"] .widget-search,
#pw-widget-library .pw-widget-library-tab-content[data-active-group="images_medialibrary"] .widget-search {
    display: block
}
#pw-widget-library .pw-widget-library-tab-content .widget-search .search-premade-dropdown{
    display:none;
}
#pw-widget-library .pw-widget-library-tab-content[data-active-group="premade"] .widget-search .search-premade-dropdown{
    display:block;
}

.widget-search {
    display: none;
    width: 250px;
    margin: 5px 0 0
}

.widget-search input.search-input {
    text-align: left;
    color: #ccc;
    -webkit-appearance: none;
    display: block;
    background: #fff url("images/widget-library/search-icon.svg") no-repeat left 10px center;
    background-size: 16px 16px;
    padding: 0 10px 0 30px;
    margin: 0;
    width: 250px;
    height: 30px;
    line-height: 30px;
    border: 1px solid #ddd;
    border-radius: 2px;
    font-size: 12px;
    color: #b3b3b3;
    -webkit-transition: color .15s ease, backgound .15s ease;
    transition: color .15s ease, backgound .15s ease
}
.widget-search .search-premade-dropdown{width:250px;height:30px;margin-top:5px;background:#eee;}
.pw-widget-library-tab-content .dropdown-gray button:hover{border:1px solid #ddd;color:#777}

.widget-search input.search-input:hover {
    background-color: #ffe
}

.widget-search input.search-input:disabled {
    color: #ddd;
    background: #eee
}

.clone-library {
    z-index: 5000!important;
    display: block;
    opacity: .7
}

.clone-library .library-widget-thumbnail {
    border: none
}

.clone-library .library-widget-actions {
    display: none!important
}

#b-top-bar {
    width: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: fixed;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    top: 0;
    height: 50px;
    z-index: 1008;
    -webkit-transition: top .25s ease;
    transition: top .25s ease;
    -webkit-transform: translate3d(0, 0, 0);
    background: #F1F2F4;
    border-bottom: #CCC 3px solid;
}

#pw-top-bar-title .saving {
    display: none;
    min-width: 100px;
    line-height: initial;
    text-align: left;
    color: #999;
    vertical-align: middle;
}

body.pw-is-preview-mode #pw-top-bar-title {
    left: 0;
    right: 0
}

body.saving #b-top-bar #pw-top-bar-title {
    /*    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJ3aGl0ZSI+CiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwIgogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPgogIDwvY2lyY2xlPgogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTYgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiAKICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIHZhbHVlcz0iMDsgNDsgMDsgMCIgZHVyPSIxLjJzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjAuMyIKICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4KICA8L2NpcmNsZT4KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI0IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+CiAgPC9jaXJjbGU+Cjwvc3ZnPgo=);
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=);
*/
}

body.saving #b-top-bar #pw-top-bar-title .title {
    opacity: 0
}

body.saving #b-top-bar #pw-top-bar-title .saving {
    display: inline-block;
}

body.saving #b-top-bar #pw-top-bar-title .saving:after {
    overflow: hidden;
    display: inline-block;
    vertical-align: bottom;
    -webkit-animation: ellipsis steps(4, end) 900ms infinite;
    animation: ellipsis steps(4, end) 900ms infinite;
    content: "\2026";
    width: 0;
    font-size: 20px;
    line-height: 20px;
    margin: 0 0 5px 2px;
}

#pw-top-bar-logo {
    position: absolute;
    width: 120px;
    height: 50px;
    top: 0;
    left: 0;
    line-height: 50px
}

#pw-top-bar-logo img {
    display: inline-block;
    vertical-align: middle;
    height: 15px;
    width: auto;
    margin-left: 13px
}

@-webkit-keyframes ellipsis {
    to {
        width: 1.25em
    }
}

@keyframes ellipsis {
    to {
        width: 1.25em
    }
}

@-webkit-keyframes show-hide {
    5% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    45% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(5px);
        -ms-transform: translateY(5px);
        transform: translateY(5px)
    }
}

@keyframes show-hide {
    5% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    45% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(5px);
        -ms-transform: translateY(5px);
        transform: translateY(5px)
    }
}

@-webkit-keyframes hide-show {
    5% {
        opacity: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    45% {
        opacity: 0;
        -webkit-transform: translateY(5px);
        -ms-transform: translateY(5px);
        transform: translateY(5px)
    }
    50% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes hide-show {
    5% {
        opacity: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px)
    }
    45% {
        opacity: 0;
        -webkit-transform: translateY(5px);
        -ms-transform: translateY(5px);
        transform: translateY(5px)
    }
    50% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

#b-top-bar-actions {
    position: absolute;
    left: 120px;
    /* 201608 */
    left: 10px;
    top: 0;
    font-size: 11px
}


/* 201608 */

#pw-top-bar-logo {
    display: none;
}

#b-top-bar-actions .actions-list,
#b-top-bar-actions .actions-list-item {
    display: block;
    margin: 0;
    padding: 0
}

#b-top-bar-actions .actions-list-item {
    position: relative;
    float: left;
    /*width: 50px;*/
    margin: 0 8px;
    height: 50px;
    line-height: 50px
}

#b-top-bar-actions .actions-list-item .action {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    line-height: initial;
    text-decoration: none;
    text-align: center;
    color: #666;
    font-size: 14px;
    cursor: pointer;
    -webkit-transition: color .2s ease;
    transition: color .2s ease
}

#b-top-bar-actions .actions-list-item .action:hover {
    color: #0288F0
}

#b-top-bar-actions .actions-list-item .action.take-snapshot,
#b-top-bar-actions .actions-list-item.active .action {
    color: #0288F0
}

#b-top-bar-actions .actions-list-item .icon {
    display: inline-block;
    vertical-align: middle;
}

#b-top-bar-actions .actions-list-item .action-name {
    display: inline-block;
}

#b-top-bar-actions .svg-icon {
    fill: #455;
    -webkit-transition: fill .2s ease;
    transition: fill .2s ease
}

#b-top-bar-actions .svg-icon svg {
    display: inline-block
}

#b-top-bar-actions .action.take-snapshot .svg-icon,
#b-top-bar-actions .action:hover .svg-icon,
#b-top-bar-actions .actions-list-item.active .action .svg-icon {
    fill: #0288F0
}

#b-top-bar-actions .disabled .action,
#b-top-bar-actions .disabled .action:hover {
    color: #55585e
}

#b-top-bar-actions .disabled .svg-icon,
#b-top-bar-actions .disabled .action:hover .svg-icon {
    fill: #55585e
}

#b-top-preview-bar .edit {
    display: none
}

#b-top-preview-bar.active .preview {
    display: none
}

#b-top-preview-bar.active .edit {
    display: block
}

#b-top-bar-actions #b-top-preview-bar.active .action {
    color: #455
}

#b-top-bar-actions #b-top-preview-bar.active .action .svg-icon {
    fill: #455
}

#b-top-bar-actions #b-top-preview-bar.active .action:hover {
    color: #0288F0
}

#b-top-bar-actions #b-top-preview-bar.active .action:hover .svg-icon {
    fill: #0288F0
}

#pw-top-bar-title {
    margin: 0 auto;
    height: 50px;
    width: 250px;
    max-width: 250px;
    text-align: center;
    line-height: 50px;
    font-size: 14px;
    top: 0;
    /* left: 550px;
    right: 280px; */
    right:10px;
    position: absolute;
    -webkit-transition: left .25s ease, right .25s ease;
    transition: left .25s ease, right .25s ease
}

#pw-top-bar-title .ellipsis {
    display: inline-block;
    max-width: 200px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

#pw-top-bar-title .title {
    max-width: 100%;
    display: inline-block;
    vertical-align: middle;
    line-height: initial;
    color: #455;
    cursor: pointer;
    -webkit-transition: color .2s ease, opacity .15s ease;
    transition: color .2s ease, opacity .15s ease
}

#pw-top-bar-title .title:hover {
    color: #0288F0
}

#pw-top-bar-title .title span,
#pw-top-bar-title .title i {
    vertical-align: middle
}

#pw-top-bar-title.active .title {
    color: #0288F0
}

.top-bar-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 280px;
    height: 50px;
    line-height: 50px
}

.topbar-logout-link .user-display-name {
    -webkit-transition: none;
    transition: none;
    opacity: 0
}

.topbar-logout-link:hover .user-display-name {
    -webkit-transition: opacity .15s ease;
    transition: opacity .15s ease;
    opacity: 1
}

#pw-top-bar-user {
    display: block;
    float: right;
    height: 50px;
    line-height: 50px;
    margin-right: 20px
}

#pw-top-bar-user .profile-btn {
    display: inline-block;
    color: #455;
    cursor: pointer;
    -webkit-transition: color .2s ease;
    transition: color .2s ease
}

#pw-top-bar-user .profile-btn:hover {
    color: #0288F0
}

#pw-top-bar-user.active .profile-btn {
    color: #0288F0
}

#pw-top-bar-user .profile-icon {
    display: inline-block;
    position: relative
}

#pw-top-bar-user .profile-icon img {
    display: inline-block;
    vertical-align: middle;
    border-radius: 50%;
    width: 30px;
    height: 30px
}

#b-top-bar [data-action="snapshots"] svg #arrow {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transition-duration: 0;
    transition-duration: 0;
    -webkit-transform-origin: 10px 10px;
    -ms-transform-origin: 10px 10px;
    transform-origin: 10px 10px
}

#b-top-bar [data-action="snapshots"].take-snapshot svg #arrow {
    -webkit-transform: rotate(-360deg);
    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transition-property: -webkit-transform, transform;
    transition-property: -webkit-transform, transform;
    -webkit-transition-duration: .4s;
    transition-duration: .4s
}

#b-top-bar #pw-top-bar-user>.submenu {
    left: auto;
    right: 10px;
    transform: none
}

#b-top-bar .submenu {
    width: 240px;
    background-color: #2c2c2c;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    padding: 20px 0;
    display: none;
    overflow: hidden;
    line-height: 30px;
    font-size: 11px;
    box-shadow: -1px 2px 2px rgba(16, 16, 16, 0.3)
}

#b-top-bar .submenu a,
#b-top-bar .submenu button {
    text-decoration: none
}

#b-top-bar .submenu .upgrade-message {
    color: #455
}

#b-top-bar .submenu .actions-header {
    background-color: #444;
    color: #ccc;
    padding-left: 2rem;
    font-size: 11px;
    text-transform: uppercase;
    height: 30px;
    line-height: 30px
}

#b-top-bar .submenu .actions-header.first {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

#b-top-bar .submenu .actions {
    padding: 0;
    margin: 0
}

#b-top-bar .submenu .actions li {
    /*height: 33px;*/
    display: block;
    padding: 0
}

#b-top-bar .submenu .actions li.separated {
    margin-top: 20px
}

#b-top-bar .submenu .actions li.green a:not([disabled]),
#b-top-bar .submenu .actions li.green button:not([disabled]) {
    color: #1cbf61
}

#b-top-bar .submenu .actions li.green a:not([disabled]):hover,
#b-top-bar .submenu .actions li.green button:not([disabled]):hover {
    color: #56d58e
}

#b-top-bar .submenu .actions li i {
    padding: 0 2px;
    color: #666
}

#b-top-bar .submenu .actions li i.pad-right {
    padding-right: 6px
}

#b-top-bar .submenu .actions li i.right {
    float: right
}

#b-top-bar .submenu .actions li i.published {
    color: #3EA5FF
}

#b-top-bar .submenu .actions li input {
    width: 65%;
    text-overflow: ellipsis;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    outline: 0;
    background: transparent;
    color: inherit
}

#b-top-bar .submenu .actions li button,
#b-top-bar .submenu .actions li a {
    padding: 0 30px;
    height: 100%;
    width: 100%;
    background: transparent;
    border: none;
    color: #c8c8c8;
    outline: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: inherit;
    text-align: left
}

#b-top-bar .submenu .actions li button.topbar-logout-link,
#b-top-bar .submenu .actions li a.topbar-logout-link {
    text-overflow: clip
}

#b-top-bar .submenu .actions li button.topbar-logout-link:hover,
#b-top-bar .submenu .actions li a.topbar-logout-link:hover {
    text-overflow: ellipsis
}

#b-top-bar .submenu .actions li button[disabled],
#b-top-bar .submenu .actions li a[disabled] {
    color: #666
}

#b-top-bar .submenu .actions li button:not([disabled]):hover,
#b-top-bar .submenu .actions li a:not([disabled]):hover {
    color: #f3f3f3;
    background-color: #323232
}

#b-top-bar .submenu .actions li button:not([disabled]) i:hover,
#b-top-bar .submenu .actions li button:not([disabled]) i.published:hover,
#b-top-bar .submenu .actions li a:not([disabled]) i:hover,
#b-top-bar .submenu .actions li a:not([disabled]) i.published:hover {
    color: #3EA5FF
}

.button {
    display: block;
    background-color: #1cbf61;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 3px;
    width: 100%;
    color: white;
    padding: 15px;
    -webkit-transition: background-color .25s ease;
    transition: background-color .25s ease;
    outline: 0;
    height: auto;
    line-height: 1
}

.button:hover {
    background-color: #56d58e
}

@media all and (max-width: 1370px) {
    body.pw-is-preview-mode #pw-top-bar-title,
    #pw-top-bar-title {
        -webkit-transition: none;
        transition: none;
        /* left: 540px;
        right: auto; */
        margin: 0;
        text-align: left;
        padding: 0 30px
    }
}

@media all and (max-width: 800px) {
    body.pw-is-preview-mode #pw-top-bar-title,
    #pw-top-bar-title {
        /* left: 186px */
    }
    #b-top-bar-actions .action-export-list-item,
    #b-top-bar-actions .action-publish-list-item {
        display: none
    }
}

@media all and (max-width: 450px) {
    #pw-top-bar-title .title,
    #pw-top-bar-user {
        display: none
    }
    #b-top-bar-actions {
        left: auto;
        right: 0
    }
}

#pw-top-bar-mode-settings {
    display: none!important
}

.top-bar-panel-buttons {
    display: none!important
}

html[class*="b-break-"] #b-top-bar-breakpoints .submenu .actions .breakpoint-populate {
    display: block
}

body.pw-is-preview-mode #b-top-bar-breakpoints .submenu {
    display: none!important
}

body.pw-is-preview-mode #pw-top-bar-breakpoints-wrap {
    left: 0!important;
    right: 0!important;
    min-width: 0
}

#pw-top-bar-breakpoints-wrap {
    top: 50px;
    right: 0;
    left: 0;
    min-width: 1104px;
    z-index: 968;
    position: fixed
}

body.simple-mode:not(.pw-is-preview-mode) #pw-top-bar-breakpoints-wrap {
    pointer-events: none
}

body.simple-mode:not(.pw-is-preview-mode) #b-top-bar-breakpoints {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%)
}

#b-top-bar-breakpoints {
    background-color: #f1f1f2;
    height: 42px;
    line-height: 24px;
    width: 100%;
    -webkit-transition: transform .25s ease;
    transition: transform .25s ease
}

#b-top-bar-breakpoints.color-1 .active .b-breakpoint-width {
    color: #ebc500
}

#b-top-bar-breakpoints.color-1 .active:before,
#b-top-bar-breakpoints.color-1 .active:after {
    background: #ebc500
}

#b-top-bar-breakpoints.color-1 .active .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-1 .active .pw-breakpoint-triangles:after {
    border-left-color: #ebc500
}

#b-top-bar-breakpoints.color-1 .b-breakpoint-icon {
    color: #ebc500
}

#b-top-bar-breakpoints.color-1 .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-1 .pw-workspace-triangles:after {
    border-left-color: #ebc500
}

#b-top-bar-breakpoints.color-1.colorize .b-breakpoint-icon {
    color: #897200
}

#b-top-bar-breakpoints.color-1.colorize .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-1.colorize .pw-workspace-triangles:after {
    border-left-color: #897200
}

#b-top-bar-breakpoints.color-1 .colorize,
#b-top-bar-breakpoints.color-1 .active.colorize,
#b-top-bar-breakpoints.color-1 .opaque.colorize {
    background: #ebc500
}

#b-top-bar-breakpoints.color-1 .colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-1 .active.colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-1 .opaque.colorize .b-breakpoint-width {
    color: #897200
}

#b-top-bar-breakpoints.color-1 .colorize:before,
#b-top-bar-breakpoints.color-1 .colorize:after,
#b-top-bar-breakpoints.color-1 .active.colorize:before,
#b-top-bar-breakpoints.color-1 .active.colorize:after,
#b-top-bar-breakpoints.color-1 .opaque.colorize:before,
#b-top-bar-breakpoints.color-1 .opaque.colorize:after {
    background: #897200
}

#b-top-bar-breakpoints.color-1 .colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-1 .colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-1 .active.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-1 .active.colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-1 .opaque.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-1 .opaque.colorize .pw-breakpoint-triangles:after {
    border-left-color: #897200
}

#b-top-bar-breakpoints.color-2 .active .b-breakpoint-width {
    color: #ef90ea
}

#b-top-bar-breakpoints.color-2 .active:before,
#b-top-bar-breakpoints.color-2 .active:after {
    background: #ef90ea
}

#b-top-bar-breakpoints.color-2 .active .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-2 .active .pw-breakpoint-triangles:after {
    border-left-color: #ef90ea
}

#b-top-bar-breakpoints.color-2 .b-breakpoint-icon {
    color: #ef90ea
}

#b-top-bar-breakpoints.color-2 .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-2 .pw-workspace-triangles:after {
    border-left-color: #ef90ea
}

#b-top-bar-breakpoints.color-2.colorize .b-breakpoint-icon {
    color: #af50aa
}

#b-top-bar-breakpoints.color-2.colorize .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-2.colorize .pw-workspace-triangles:after {
    border-left-color: #af50aa
}

#b-top-bar-breakpoints.color-2 .colorize,
#b-top-bar-breakpoints.color-2 .active.colorize,
#b-top-bar-breakpoints.color-2 .opaque.colorize {
    background: #ef90ea
}

#b-top-bar-breakpoints.color-2 .colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-2 .active.colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-2 .opaque.colorize .b-breakpoint-width {
    color: #af50aa
}

#b-top-bar-breakpoints.color-2 .colorize:before,
#b-top-bar-breakpoints.color-2 .colorize:after,
#b-top-bar-breakpoints.color-2 .active.colorize:before,
#b-top-bar-breakpoints.color-2 .active.colorize:after,
#b-top-bar-breakpoints.color-2 .opaque.colorize:before,
#b-top-bar-breakpoints.color-2 .opaque.colorize:after {
    background: #af50aa
}

#b-top-bar-breakpoints.color-2 .colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-2 .colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-2 .active.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-2 .active.colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-2 .opaque.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-2 .opaque.colorize .pw-breakpoint-triangles:after {
    border-left-color: #af50aa
}

#b-top-bar-breakpoints.color-3 .active .b-breakpoint-width {
    color: #a9aaf1
}

#b-top-bar-breakpoints.color-3 .active:before,
#b-top-bar-breakpoints.color-3 .active:after {
    background: #a9aaf1
}

#b-top-bar-breakpoints.color-3 .active .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-3 .active .pw-breakpoint-triangles:after {
    border-left-color: #a9aaf1
}

#b-top-bar-breakpoints.color-3 .b-breakpoint-icon {
    color: #a9aaf1
}

#b-top-bar-breakpoints.color-3 .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-3 .pw-workspace-triangles:after {
    border-left-color: #a9aaf1
}

#b-top-bar-breakpoints.color-3.colorize .b-breakpoint-icon {
    color: #6667ae
}

#b-top-bar-breakpoints.color-3.colorize .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-3.colorize .pw-workspace-triangles:after {
    border-left-color: #6667ae
}

#b-top-bar-breakpoints.color-3 .colorize,
#b-top-bar-breakpoints.color-3 .active.colorize,
#b-top-bar-breakpoints.color-3 .opaque.colorize {
    background: #a9aaf1
}

#b-top-bar-breakpoints.color-3 .colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-3 .active.colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-3 .opaque.colorize .b-breakpoint-width {
    color: #6667ae
}

#b-top-bar-breakpoints.color-3 .colorize:before,
#b-top-bar-breakpoints.color-3 .colorize:after,
#b-top-bar-breakpoints.color-3 .active.colorize:before,
#b-top-bar-breakpoints.color-3 .active.colorize:after,
#b-top-bar-breakpoints.color-3 .opaque.colorize:before,
#b-top-bar-breakpoints.color-3 .opaque.colorize:after {
    background: #6667ae
}

#b-top-bar-breakpoints.color-3 .colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-3 .colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-3 .active.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-3 .active.colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-3 .opaque.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-3 .opaque.colorize .pw-breakpoint-triangles:after {
    border-left-color: #6667ae
}

#b-top-bar-breakpoints.color-4 .active .b-breakpoint-width {
    color: #66ccb7
}

#b-top-bar-breakpoints.color-4 .active:before,
#b-top-bar-breakpoints.color-4 .active:after {
    background: #66ccb7
}

#b-top-bar-breakpoints.color-4 .active .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-4 .active .pw-breakpoint-triangles:after {
    border-left-color: #66ccb7
}

#b-top-bar-breakpoints.color-4 .b-breakpoint-icon {
    color: #66ccb7
}

#b-top-bar-breakpoints.color-4 .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-4 .pw-workspace-triangles:after {
    border-left-color: #66ccb7
}

#b-top-bar-breakpoints.color-4.colorize .b-breakpoint-icon {
    color: #408173
}

#b-top-bar-breakpoints.color-4.colorize .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-4.colorize .pw-workspace-triangles:after {
    border-left-color: #408173
}

#b-top-bar-breakpoints.color-4 .colorize,
#b-top-bar-breakpoints.color-4 .active.colorize,
#b-top-bar-breakpoints.color-4 .opaque.colorize {
    background: #66ccb7
}

#b-top-bar-breakpoints.color-4 .colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-4 .active.colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-4 .opaque.colorize .b-breakpoint-width {
    color: #408173
}

#b-top-bar-breakpoints.color-4 .colorize:before,
#b-top-bar-breakpoints.color-4 .colorize:after,
#b-top-bar-breakpoints.color-4 .active.colorize:before,
#b-top-bar-breakpoints.color-4 .active.colorize:after,
#b-top-bar-breakpoints.color-4 .opaque.colorize:before,
#b-top-bar-breakpoints.color-4 .opaque.colorize:after {
    background: #408173
}

#b-top-bar-breakpoints.color-4 .colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-4 .colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-4 .active.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-4 .active.colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-4 .opaque.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-4 .opaque.colorize .pw-breakpoint-triangles:after {
    border-left-color: #408173
}

#b-top-bar-breakpoints.color-5 .active .b-breakpoint-width {
    color: #6cdf7a
}

#b-top-bar-breakpoints.color-5 .active:before,
#b-top-bar-breakpoints.color-5 .active:after {
    background: #6cdf7a
}

#b-top-bar-breakpoints.color-5 .active .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-5 .active .pw-breakpoint-triangles:after {
    border-left-color: #6cdf7a
}

#b-top-bar-breakpoints.color-5 .b-breakpoint-icon {
    color: #6cdf7a
}

#b-top-bar-breakpoints.color-5 .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-5 .pw-workspace-triangles:after {
    border-left-color: #6cdf7a
}

#b-top-bar-breakpoints.color-5.colorize .b-breakpoint-icon {
    color: #43924c
}

#b-top-bar-breakpoints.color-5.colorize .pw-workspace-triangles:before,
#b-top-bar-breakpoints.color-5.colorize .pw-workspace-triangles:after {
    border-left-color: #43924c
}

#b-top-bar-breakpoints.color-5 .colorize,
#b-top-bar-breakpoints.color-5 .active.colorize,
#b-top-bar-breakpoints.color-5 .opaque.colorize {
    background: #6cdf7a
}

#b-top-bar-breakpoints.color-5 .colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-5 .active.colorize .b-breakpoint-width,
#b-top-bar-breakpoints.color-5 .opaque.colorize .b-breakpoint-width {
    color: #43924c
}

#b-top-bar-breakpoints.color-5 .colorize:before,
#b-top-bar-breakpoints.color-5 .colorize:after,
#b-top-bar-breakpoints.color-5 .active.colorize:before,
#b-top-bar-breakpoints.color-5 .active.colorize:after,
#b-top-bar-breakpoints.color-5 .opaque.colorize:before,
#b-top-bar-breakpoints.color-5 .opaque.colorize:after {
    background: #43924c
}

#b-top-bar-breakpoints.color-5 .colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-5 .colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-5 .active.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-5 .active.colorize .pw-breakpoint-triangles:after,
#b-top-bar-breakpoints.color-5 .opaque.colorize .pw-breakpoint-triangles:before,
#b-top-bar-breakpoints.color-5 .opaque.colorize .pw-breakpoint-triangles:after {
    border-left-color: #43924c
}

#b-top-bar-breakpoints .b-top-bar-breakpoint {
    font-family: Tahoma, sans-serif;
    background: transparent;
    display: block;
    position: relative;
    height: 42px;
    margin-top: -42px;
    font-size: 11px;
    margin: 0 auto;
    text-align: left;
    border: none;
    padding: 0;
    background: #f1f1f2;
    -webkit-transition: background-color .15s linear;
    transition: background-color .15s linear
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.b-breakpoint_-1 .b-breakpoint-width,
#b-top-bar-breakpoints .b-top-bar-breakpoint.b-breakpoint_-1 .pw-breakpoint-triangles,
#b-top-bar-breakpoints .b-top-bar-breakpoint.empty.b-breakpoint_-1 .b-breakpoint-width,
#b-top-bar-breakpoints .b-top-bar-breakpoint.empty.b-breakpoint_-1 .pw-breakpoint-triangles {
    opacity: 1!important
}

#b-top-bar-breakpoints .b-top-bar-breakpoint:hover .b-breakpoint-width {
    opacity: 1
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.opaque {
    background-color: rgba(255, 255, 255, 0.2);
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.opaque:before,
#b-top-bar-breakpoints .b-top-bar-breakpoint.opaque:after {
    height: 24px;
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.colorize:before,
#b-top-bar-breakpoints .b-top-bar-breakpoint.colorize:after,
#b-top-bar-breakpoints .b-top-bar-breakpoint.active:before,
#b-top-bar-breakpoints .b-top-bar-breakpoint.active:after {
    height: 42px;
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.active {
    background: white url(images/rule_x.gif) no-repeat left bottom;
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.active .b-breakpoint-width {
    opacity: 1
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.active i {
    display: block
}

#b-top-bar-breakpoints .b-top-bar-breakpoint:before,
#b-top-bar-breakpoints .b-top-bar-breakpoint:after {
    display: block;
    background: #ccc;
    height: 42px;
    width: 1px;
    content: '';
    position: absolute;
    top: 0;
    -webkit-transition: background-color .15s linear;
    transition: background-color .15s linear
}

#b-top-bar-breakpoints .b-top-bar-breakpoint:before {
    left: -1px
}

#b-top-bar-breakpoints .b-top-bar-breakpoint:after {
    right: -1px
}

#b-top-bar-breakpoints .b-top-bar-breakpoint:disabled {
    opacity: .1
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.empty .b-breakpoint-width {
    opacity: 0
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.empty .pw-breakpoint-triangles {
    opacity: 0
}

#b-top-bar-breakpoints .b-top-bar-breakpoint.empty:hover .b-breakpoint-width,
#b-top-bar-breakpoints .b-top-bar-breakpoint.empty.active .b-breakpoint-width {
    opacity: 1
}

#b-top-bar-breakpoints .b-top-bar-breakpoint b {
    display: block
}

.b-top-bar-breakpoint-wrap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0
}

.pw-breakpoint-triangles,
.pw-workspace-triangles {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: 1;
    pointer-events: none;
    -webkit-transition: opacity .15s linear;
    transition: opacity .15s linear
}

.pw-breakpoint-triangles:before,
.pw-breakpoint-triangles:after,
.pw-workspace-triangles:before,
.pw-workspace-triangles:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 7px;
    margin-top: -4px;
    border-color: transparent transparent transparent #ccc;
    content: ' ';
    display: block;
    position: absolute;
    top: 29%;
    -webkit-transition: border-color .15s linear;
    transition: border-color .15s linear
}

.pw-breakpoint-triangles:after,
.pw-workspace-triangles:after {
    right: 0;
    transform: scaleX(-1)
}

.mobile-first .pw-breakpoint-triangles:before {
    right: -7px
}

.mobile-first .pw-breakpoint-triangles:after {
    left: -7px;
    right: auto
}

.pw-workspace-triangles {
    display: none
}

.pw-workspace-triangles.mobile-first {
    display: block
}

.pw-workspace-triangles.mobile-first:before {
    left: 51.5%
}

.pw-workspace-triangles.mobile-first:after {
    right: 51.5%
}

.b-top-bar-breakpoint-range {
    position: fixed;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    top: 0;
    left: 0;
    right: 0;
    display: none
}

.b-top-bar-breakpoint-range.visible {
    display: block
}

.b-top-bar-breakpoint-range.in-preview-mode {
    display: none!important
}

.b-top-bar-breakpoint-range input[type="range"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    margin: 0;
    position: absolute;
    top: 5px;
    opacity: 0
}

.b-top-bar-breakpoint-range input[type="range"].left {
    right: 50%
}

.b-top-bar-breakpoint-range input[type="range"].right {
    left: 50%
}

.b-top-bar-breakpoint-range input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 15px;
    height: 32px;
    cursor: ew-resize;
    position: relative
}

.b-top-bar-breakpoint-range input[type="range"]::-moz-range-thumb {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 15px;
    height: 32px;
    cursor: ew-resize;
    position: relative
}

.b-top-bar-breakpoint-range input[type="range"]::-webkit-slider-runnable-track {
    height: 0
}

.b-top-bar-breakpoint-range input[type="range"]::-moz-range-track {
    height: 0
}

.b-breakpoint-width {
    cursor: default;
    color: #ccc;
    font-size: 1em;
    position: absolute;
    top: 1px;
    display: block;
    opacity: 1;
    -webkit-transition: color .15s linear, opacity .15s linear;
    transition: color .15s linear, opacity .15s linear
}

.b-breakpoint-width-left {
    left: 10px
}

.b-breakpoint-width-right {
    right: 10px
}

.b-breakpoint-icon {
    color: black;
    text-align: center;
    font-size: 24px;
    position: relative;
    pointer-events: none;
    -webkit-transition: color .15s linear;
    transition: color .15s linear
}

.b-breakpoint-icon i {
    z-index: 1;
    position: relative
}

.b-breakpoint-icon i.icon-mobile {
    font-size: 22px
}

.b-breakpoint-icon i.icon-tablet {
    font-size: 22px
}

.b-breakpoint-icon i.icon-desktop {
    font-size: 20px
}

.b-breakpoint-icon i.landscape:before {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

#b-top-bar-breakpoints {
    /*box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);*/
    -webkit-transform: translate3d(0, 0, 0)
}

#b-top-bar-breakpoints .submenu {
    width: 200px;
    background-color: #2c2c2c;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    padding: 20px 0;
    display: none;
    line-height: 30px;
    font-size: 11px;
    margin-top: 10px;
    border-radius: 4px;
}

#b-top-bar-breakpoints .submenu:before {
    display: block;
    content: "";
    position: absolute;
    top: -10px;
    background: transparent;
    height: 10px;
    width: 100%
}

#b-top-bar-breakpoints .submenu:after {
    border-width: 0 10px 14px 12px;
    border-style: solid;
    border-color: transparent transparent #2c2c2c transparent;
    display: block;
    content: "";
    position: absolute;
    top: -14px;
    left: 50%;
    margin-left: -12px
}

#b-top-bar-breakpoints .submenu.on-left:after {
    left: 10px;
    margin-left: 0
}

#b-top-bar-breakpoints .submenu.on-right:after {
    left: auto;
    right: 10px
}

#b-top-bar-breakpoints .submenu a,
#b-top-bar-breakpoints .submenu button {
    text-decoration: none
}

#b-top-bar-breakpoints .submenu .actions {
    padding: 0;
    margin: 0
}

#b-top-bar-breakpoints .submenu .actions li {
    height: 33px;
    display: block;
    padding: 0
}

#b-top-bar-breakpoints .submenu .actions button,
#b-top-bar-breakpoints .submenu .actions a {
    padding: 0 30px;
    height: 100%;
    width: 100%;
    background: transparent;
    border: none;
    color: #c8c8c8;
    outline: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: inherit;
    text-align: left
}

#b-top-bar-breakpoints .submenu .actions button[disabled],
#b-top-bar-breakpoints .submenu .actions a[disabled] {
    color: #666
}

#b-top-bar-breakpoints .submenu .actions button:not([disabled]):hover,
#b-top-bar-breakpoints .submenu .actions a:not([disabled]):hover {
    color: #f3f3f3;
    background-color: #323232
}

i #b-top-bar-breakpoints .submenu .actions button:not([disabled]):hover,
i #b-top-bar-breakpoints .submenu .actions button:not([disabled]).published:hover,
i #b-top-bar-breakpoints .submenu .actions a:not([disabled]):hover,
i #b-top-bar-breakpoints .submenu .actions a:not([disabled]).published:hover {
    color: #3EA5FF
}

#b-top-bar-breakpoints .submenu .actions .breakpoint-populate {
    display: none
}

body.f-bp-color-1 .f-bp-color {
    color: #290!important
}

body.f-bp-color-1 .f-bp-color.f-bp-color-faded {
    color: rgba(235, 157, 0, 0.75)!important
}

body.f-bp-color-2 .f-bp-color {
    color: #229900!important
}

body.f-bp-color-2 .f-bp-color.f-bp-color-faded {
    color: rgba( 235, 137, 0, 0.65)!important
}

body.f-bp-color-3 .f-bp-color {
    color: #a9aaf1!important
}

body.f-bp-color-3 .f-bp-color.f-bp-color-faded {
    color: rgba(169, 170, 241, 0.65)!important
}

body.f-bp-color-4 .f-bp-color {
    color: #66ccb7!important
}

body.f-bp-color-4 .f-bp-color.f-bp-color-faded {
    color: rgba(102, 204, 183, 0.65)!important
}

body.f-bp-color-5 .f-bp-color {
    color: #6cdf7a!important
}

body.f-bp-color-5 .f-bp-color.f-bp-color-faded {
    color: rgba(108, 223, 122, 0.65)!important
}

#upload-area {
    border: 4px dashed #bada55;
    position: relative;
    height: 150px;
    width: 300px
}

#upload-area.dragover {
    border-color: gold
}

#upload-area input {
    position: absolute;
    height: 100%;
    width: 100%;
    opacity: 0;
    left: 0;
    top: 0
}

#upload-area .progress-container {
    outline: 1px solid #2586d0;
    position: absolute;
    height: 12px;
    width: 100%;
    bottom: 0;
    left: 0
}

#upload-area .progress {
    background-color: #2586d0;
    position: absolute;
    height: 100%;
    width: 0;
    left: 0;
    transition: .25s
}

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

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

@-webkit-keyframes super-rainbow {
    0% {
        background: #4775FF
    }
    20% {
        background: #A96DF5
    }
    40% {
        background: #FF4747
    }
    60% {
        background: #FFC300
    }
    80% {
        background: #6CC272
    }
    100% {
        background: #47B3A5
    }
}

@keyframes super-rainbow {
    0% {
        background: #4775FF
    }
    20% {
        background: #A96DF5
    }
    40% {
        background: #FF4747
    }
    60% {
        background: #FFC300
    }
    80% {
        background: #6CC272
    }
    100% {
        background: #47B3A5
    }
}

.b-container-control-drag:hover,
.b-dragging {
    cursor: move
}

body.non-editable [class^="b-widget-placeholder"] {
    visibility: hidden
}

body.non-editable .b-widget-placeholder {
    background: transparent
}

body.non-editable .b-draggable {
    cursor: auto
}

.b-draggable {
    cursor: -webkit-grab
}

.b-invisible-selected {
    opacity: .5
}

.b-margins {
    -webkit-transition: background 100ms ease;
    transition: background 100ms ease
}

.b-container-controls {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.b-container-controls.b-hidden {
    display: none
}

.b-container-controls.b-hidden.b-focus {
    display: block
}

.b-container-controls .b-container-controls-dot {
    border-radius: 6px;
    border: 6px solid black;
    height: 0;
    width: 0;
    cursor: pointer
}

.container-controls-messages {
    position: absolute;
    height: 15px;
    padding: 2px 4px;
    background: rgba(230, 230, 230, 0.5);
    display: none;
    color: #000!important;
    font-size: 12px!important;
    font-weight: normal!important;
    font-family: Tahoma, sans-serif!important;
    bottom: -15px
}

.b-focus-disabled {
    display: none!important;
    pointer-events: none
}

.b-container-icons {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

.b-container-icons a {
    text-decoration: none;
    font-size: 1.9em;
    background: #333;
    color: #fff;
    display: inline-block;
    padding: 0
}

.placeholder-hidden .b-widget-placeholder-text {
    opacity: 0
}

.b-widget-placeholder {
    opacity: 1;
    -webkit-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    background: rgba(230, 230, 230, 0.5);
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.b-widget-placeholder .b-widget-placeholder-text {
    -webkit-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    position: absolute;
    overflow: hidden;
    display: block;
    width: 100%;
    margin-top: -50px;
    top: 50%;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #787b7e
}

.b-widget-placeholder .b-widget-placeholder-text small {
    display: block;
    margin-top: 5px;
    font-size: 12px
}

.b-widget-placeholder .b-widget-placeholder-text div {
    margin-bottom: 20px;
    min-width: 85px
}

.bg-dark .b-widget-placeholder {
    background: rgba(66, 66, 66, 0.5)
}

.bg-dark .b-widget-placeholder .b-widget-placeholder-text {
    color: #787b7e
}

.bg-dark .container-controls-messages {
    background: rgba(66, 66, 66, 0.5);
    color: #999!important
}

*.b-unselectable {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.b-popup {
    z-index: 10000;
    position: fixed;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 600px;
    top: 100px;
    left: 50%;
    margin-left: -300px;
    background: #fff;
    font-size: 12px;
    border-radius: 6px;
    box-shadow: 1px 3px 6px rgba(38, 42, 51, 0.1);
}
.b-popup.b-popup-code-editor {
    z-index: 99999
}
.b-popup.b-popup-code-editor + .editor-popup-overlay {
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    z-index:99998;
    background:rgba(0,0,0,0.2);
}

.b-popup.dialog {
    background: #333;
    width: 500px;
    margin-left: -250px;
    z-index: 2147483648;
    -webkit-transition: all 400ms;
    top: -200px;
    opacity: 0
}

.b-popup:after {
    content: "";
    display: table;
    clear: both
}

.b-popup textarea:not(.handsontableInput),
.b-popup .b-popup-message {
    border: none;
    background: #fff;
    color: #aaa;
    padding: 5px 11px;
    box-shadow: none;
    outline: none;
    font-size: 1rem
}

.b-popup textarea a,
.b-popup .b-popup-message a {
    color: #aaa
}

.b-popup textarea {
    height: 254px;
    width: 600px;
    font-family: Courier, sans-serif;
    font-size: 12px
}

.b-popup textarea::-webkit-input-placeholder {
    color: #555
}

.b-popup textarea::-moz-placeholder {
    color: #555
}

.b-popup textarea:-ms-input-placeholder {
    color: #555
}

.b-popup textarea::placeholder {
    color: #555
}

.b-popup .b-ui-button-close {
    float: right;
    margin: 7px 0 0 0
}

.b-popup .b-ui-button-apply {
    margin: 11px;
    float: right
}

.b-popup .b-popup-heading:hover {
    cursor: move
}

.b-popup .b-popup-heading-rounded {
    border-radius: 4px
}

.b-popup.dialog .b-popup-heading:hover {
    cursor: default
}

.b-popup.dialog .actions>* {
    float: right;
    text-transform: capitalize;
    margin: 1em;
    margin-left: 0
}

.b-popup .b-popup-icontext {
    margin: 7% 5% 0 7%
}

.b-popup .b-popup-icon {
    float: left;
    width: 23%
}

.b-popup .b-popup-text {
    line-height: 2em;
    font-size: 14px;
    margin-left: 23%
}

.b-popup .b-popup-clear {
    clear: both
}

.b-popup.publish-warning .b-popup-icon {
    width: 60px;
    margin-right: 40px
}

#fancybox-loading,
.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
    background-image: url("vendor/fancyBox/fancybox_sprite.png")!important
}

#fancybox-loading div {
    background: url("vendor/fancyBox/fancybox_loading.gif") center center no-repeat!important
}

.fancybox-nav {
    background: transparent url("vendor/fancyBox/blank.gif")!important
}

.fancybox-overlay {
    z-index: 10000;
    background: transparent url("vendor/fancyBox/fancybox_overlay.png")!important
}

.icon-spin5 {
    line-height: inherit;
    font-size: inherit;
    -webkit-transform-origin: 50% 47%;
    -ms-transform-origin: 50% 47%;
    transform-origin: 50% 47%
}

#font-panel .icon-spin5 {
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.b-panel .el-switch {
    -webkit-transition: all 100ms ease;
    transition: all 100ms ease;
    display: inline-block!important;
    content: ' ';
    position: relative;
    width: 36px;
    height: 14px!important;
    border-radius: 7px;
    background: #bbb;
    margin-top: 5px;
    margin-bottom: 5px;
    border-width: 0
}

.b-panel .el-switch.large {
    transform: scale(1.7, 1.7)
}

.b-panel .el-switch:after {
    -webkit-transition: all 200ms ease;
    transition: all 200ms ease;
    display: block;
    content: ' ';
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 7px;
    background: #fff;
    top: 1px;
    left: 1px
}

.b-panel .el-switch:hover:after {
    left: 5px
}

.b-panel .el-switch[data-state="active"] {
    background: #3EA5FF
}

.b-panel .el-switch[data-state="active"]:after {
    background: #fff;
    left: 23px
}

.bbf-field.disabled .el-switch {
    background: #bbb!important;
    pointer-events: none
}

.bbf-field.disabled .el-switch:after {
    background: #fff!important
}

.bbf-field.disabled .bbf-editor span {
    pointer-events: none
}

.b-tab-content-properties .bbf-field .bbf-editor {
    width: auto;
    margin-left: 6px;
    float: right;
}

.b-tab-content-properties .selectbox {
    max-width: auto;
}

.b-tab-content-properties .panel2 .bbf-field label {
    line-height: 24px;
}

.pw-dropdown-selectbox {
    position: relative;
    width: 100%;
    line-height: normal
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    position: relative;
    cursor: pointer;
    background: #fff;
    padding: 0 10px;
    margin: 0;
    width: 100%;
    height: 30px;
    line-height: 30px;
    border: 0;
    border-radius: 3px;
    text-align: left;
    font-size: 12px;
    color: #404040;
    fill: #404040;
    text-decoration: none;
    overflow: hidden;
    -webkit-transition: color .15s ease, backgound .15s ease;
    transition: color .15s ease, backgound .15s ease
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle:hover {
    background: #ffb
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle:disabled,
.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle:disabled:hover {
    color: #ddd;
    fill: #ddd;
    background: #eee;
    pointer-events: none;
    cursor: default
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle .value {
    display: block;
    max-width: calc(100% - 30px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle .caret {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 30px;
    height: 30px;
    text-align: center;
    color: #666;
    fill: #666
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle .caret svg {
    height: 30px;
    display: block
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle .display-name {
    white-space: nowrap
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle.is-placeholder {
    color: #404040
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle.small {
    height: 20px;
    line-height: 20px;
    font-size: 11px;
    padding-left: 4px;
    padding-right: 4px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle.small .caret {
    width: 20px;
    height: 20px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-toggle.small .value {
    max-width: calc(100% - 20px)
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu {
    display: none;
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;
    max-height: 200px;
    background: #fff;
    padding: 0;
    margin: 0;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    box-shadow: 0px 2px 6px -1px rgba(0, 0, 0, 0.3);
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li {
    display: block;
    position: relative;
    margin: 0;
    padding: 4px 10px;
    text-align: left;
    font-size: 12px;
    color: #666;
    fill: #666;
    cursor: pointer;
    -webkit-transition: color .15s ease;
    transition: color .15s ease
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-1 {
    padding-left: 20px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-2 {
    padding-left: 30px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-3 {
    padding-left: 40px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-4 {
    padding-left: 50px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-5 {
    padding-left: 60px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-6 {
    padding-left: 70px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-7 {
    padding-left: 80px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-8 {
    padding-left: 90px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-9 {
    padding-left: 100px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.indent-10 {
    padding-left: 110px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.selected {
    color: #444;
    fill: #444;
    background-color: #def;
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.disabled {
    color: #ccc;
    fill: #ccc
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li:hover {
    background: #bdf
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li:last-child {
    padding-bottom: 6px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.item-hidden {
    display: none
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.separate-top:not(:first-child) {
    margin-top: 7px;
    position: relative
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu li.separate-top:not(:first-child):before {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -4px;
    height: 1px;
    background: #eee;
    pointer-events: none
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu svg {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small {
    top: 20px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li {
    font-size: 11px;
    padding: 4px 4px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-1 {
    padding-left: 14px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-2 {
    padding-left: 24px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-3 {
    padding-left: 34px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-4 {
    padding-left: 44px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-5 {
    padding-left: 54px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-6 {
    padding-left: 64px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-7 {
    padding-left: 74px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-8 {
    padding-left: 84px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-9 {
    padding-left: 94px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.small li.indent-10 {
    padding-left: 104px
}

.pw-dropdown-selectbox .pw-dropdown-selectbox-menu.custom-width.align-right {
    left: auto;
    right: 0
}

.pw-dropdown-selectbox .display-name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis
}

.pw-dropdown-selectbox .display-value {
    display: block;
    float: right;
    font-family: "Courier New", sans-serif;
    text-transform: uppercase;
    color: #AAA;
    margin-top: 1px;
    margin-left: 5px
}

.pw-dropdown-selectbox.expanded .pw-dropdown-selectbox-toggle {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: #fff
}

.pw-dropdown-selectbox.expanded .pw-dropdown-selectbox-menu {
    display: block;
    z-index: 999
}

.pw-dropdown-selectbox .b-scroll::-webkit-scrollbar {
    background-color: #ffd
}

.pw-dropdown-selectbox .b-scroll::-webkit-scrollbar-track {
    background-color: #ffd
}

.pw-dropdown-selectbox .b-scroll::-webkit-scrollbar-track-piece {
    background-color: #ffd
}

.pw-dropdown-selectbox .for-library,
.dropdown-gray .pw-dropdown-selectbox-toggle{
    text-transform: capitalize
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-toggle,
.dropdown-gray .pw-dropdown-selectbox-toggle{
    color: #777;
    fill: #777;
    background: #f8f8f8;
    border: 1px solid #ddd;
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-toggle:hover,
.dropdown-gray .pw-dropdown-selectbox-toggle:hover {
    background: #fff
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-toggle:disabled,
.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-toggle:disabled:hover,
.dropdown-gray .pw-dropdown-selectbox-toggle:disabled,
.dropdown-gray .pw-dropdown-selectbox-toggle:disabled:hover{
    background: #f5f5f5
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-toggle .caret,
.dropdown-gray .pw-dropdown-selectbox-toggle .caret{
    color: #999;
    fill: #999;
    border-left: 1px solid #ddd
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-menu,
.dropdown-gray .pw-dropdown-selectbox-menu{
    color: #6d6e70;
    fill: #6d6e70;
    background: #fff
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-menu li.selected,
.dropdown-gray .pw-dropdown-selectbox-menu li.selected {
    color: #ccc;
    fill: #ccc
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-menu li:hover,
.dropdown-gray .for-library.pw-dropdown-selectbox-menu li:hover{
    background: #eee
}

.pw-dropdown-selectbox .for-library.pw-dropdown-selectbox-menu li:first-child,
.dropdown-gray .pw-dropdown-selectbox-menu li:first-child {
    border-top: 1px solid #999
}

.pw-dropdown-selectbox .for-library.b-scroll::-webkit-scrollbar,
.dropdown-gray .b-scroll::-webkit-scrollbar {
    background-color: #ffd
}

.pw-dropdown-selectbox .for-library.b-scroll::-webkit-scrollbar-track,
.dropdown-gray .b-scroll::-webkit-scrollbar-track {
    background-color: #ffd
}

.pw-dropdown-selectbox .for-library.b-scroll::-webkit-scrollbar-track-piece,
.dropdown-gray .b-scroll::-webkit-scrollbar-track-piece {
    background-color: #ffd
}

.pw-dropdown-selectbox.expanded .for-library.pw-dropdown-selectbox-toggle .caret,
.dropdown-gray.expanded .pw-dropdown-selectbox-toggle .caret {
    border-left-color: transparent
}

#intercom-launcher {
    right: 280px!important;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1), right .25s ease;
    transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1), right .25s ease
}

body:not(.loading-editor-overlay-fadeout) #intercom-launcher,
body.pw-is-preview-mode #intercom-launcher {
    visibility: hidden!important;
    pointer-events: none!important;
    right: 20px!important;
    -webkit-transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1)
}

body.pw-widget-library-is-open #intercom-launcher {
    -webkit-transform: translateX(262px);
    -ms-transform: translateX(262px);
    transform: translateX(262px)
}

.pw-editor-modal-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    background: rgba(50, 50, 50, 0.6)
}

.table-editor-wrap {
    width: 580px;
    height: 290px;
    margin: 10px;
}

.data-source-wrap {
    width: 600px;
    height: 180px;
    padding: 10px 15px;
    font-size: 14px;
}
.data-source-wrap .bbf-field,
.data-source-wrap .row {
    height: 28px;
    line-height: 28px;
    margin-bottom: 4px;
}
.data-source-wrap label.small{
    width: 120px;
    float: left;
}
.data-source-wrap .b-panel-right-field{
    margin: 0;
    left: 0;
    width: calc(60% - 2.5px);
    height: 28px;
    line-height: 28px;
    text-align: right
}
.data-source-wrap .js-articles-picker{
    background: transparent;
    padding: 0;
    margin: 0;
    line-height: 26px;
    height: 26px;
    min-width: 26px;
    fill: #A184F1;
    color: #9771FF;
    border: 1px solid #B397FF;
    border-radius: 3px;
    text-align: center;
}
.data-source-wrap .pw-dropdown-selectbox,
.data-source-wrap input.text{
    width: 100%;
    height: 26px;
    line-height: 26px;
    border: 1px solid #eee;
    border-radius: 3px;
}
.data-source-wrap input.text{
    padding: 0 8px;
    text-align: left;
}

.pw-editor-modal-overlay.type-bright {
    background: rgba(55, 55, 55, 0.2)
}

.pw-editor-modal {
    position: fixed;
    z-index: 3010;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    margin: auto
}

.pw-editor-modal label {
    margin-bottom: 5px;
    display: inline-block;
    color: #455
}

.pw-editor-modal input,
.pw-editor-modal .btn,
.pw-editor-modal button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 300;
    height: 40px;
    line-height: 40px;
    padding: 0 14px
}

.pw-editor-modal input {
    color: #55585e;
    width: 100%
}

.pw-editor-modal .btn,
.pw-editor-modal button {
    margin: 0 5px;
    display: inline-block;
    text-align: center;
    color: #fff;
    -webkit-transition: background-color .25s ease, color .25s ease, border-color .25s ease, opacity .2s ease;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease, opacity .2s ease
}

.pw-editor-modal .btn :not(:disabled),
.pw-editor-modal button :not(:disabled) {
    cursor: pointer
}

.pw-editor-modal .btn[disabled],
.pw-editor-modal button[disabled] {
    pointer-events: none;
    background: #4d4d4d;
    color: #323232
}

.pw-editor-modal .btn.btn-cancel,
.pw-editor-modal .btn.type-outlined,
.pw-editor-modal button.btn-cancel,
.pw-editor-modal button.type-outlined {
    background: transparent;
    color: #455;
    border: 1px solid #455
}

.pw-editor-modal .btn.btn-cancel:hover,
.pw-editor-modal .btn.type-outlined:hover,
.pw-editor-modal button.btn-cancel:hover,
.pw-editor-modal button.type-outlined:hover {
    border-color: #666;
    color: #666
}

.pw-editor-modal .btn.type-text,
.pw-editor-modal button.type-text {
    background: transparent;
    color: #455
}

.pw-editor-modal .btn.type-text:hover,
.pw-editor-modal button.type-text:hover {
    color: #666
}

.pw-editor-modal .btn.btn-add:not([disabled]),
.pw-editor-modal button.btn-add:not([disabled]) {
    background: #1cbf61
}

.pw-editor-modal .btn.btn-add:not([disabled]):hover,
.pw-editor-modal button.btn-add:not([disabled]):hover {
    background: #56d58e
}

.pw-editor-modal .s-close {
    display: inline-block;
    position: absolute;
    top: 5px;
    right: 10px;
    border: 0;
    background: transparent;
    text-align: center;
    padding: 0;
    margin: 5px 0 0 0;
    cursor: pointer;
    width: 22px;
    height: 22px;
    line-height: 19px;
    font-size: 22px;
    text-align: center;
    transition: transform 0.2s ease;
    border-radius: 20px;
    color: #456;
    fill: #456;
}

.pw-editor-modal .s-close svg {
    fill: inherit;
    vertical-align: middle
}

.pw-editor-modal .s-close:hover,
.pw-editor-modal .s-close:focus {
    fill: #000;
    color: #000;
    transform: rotate(90deg);
}

.pw-editor-modal-inner {
    position: relative;
    margin: 100px auto 20px;
    width: 90%;
    max-width: 660px;
    min-width: 660px;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    padding: 0;
    text-align: left;
    color: #888;
    font-size: 12px;
    box-shadow: 0px 3px 16px rgba(0, 0, 0, 0.2);
}

.pw-editor-modal-inner:not(.type-no-animation) {
    -webkit-animation: scale-up .1s ease-out 1;
    animation: scale-up .1s ease-out 1
}

.pw-modal-overlay {
    z-index: 3009;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(radial, 50% 25%, 0, 50% 25%, 800, from(rgba(0, 0, 0, 0.65)), to(black));
    opacity: .7;
    -webkit-animation: fadeIn .3s;
    -moz-animation: fadeIn .3s;
    animation: fadeIn .3s
}

.pw-modal-overlay-outer {
    z-index: 3010;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    padding: 0 50px
}

.pw-modal-overlay-inner {
    display: block;
    position: relative;
    height: 100%;
    width: 100%;
    min-height: 700px
}

.pw-modal-overlay-message {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 600px;
    background-color: #fff;
    border-radius: .6em;
    -webkit-animation: fadeIn .3s;
    -moz-animation: fadeIn .3s;
    animation: fadeIn .3s
}

.pw-modal-overlay-message .close {
    position: absolute;
    top: 3px;
    right: 4px;
    padding: 10px
}

.pw-modal-overlay-message .close>svg {
    width: 24px;
    height: 24px
}

.pw-modal-editor-news {
    width: 900px;
    text-align: center;
    overflow: hidden;
    background: transparent
}

.pw-modal-editor-news .title {
    padding: 40px 0 5px;
    background: white;
    color: #353535;
    font-family: avenir, 'avenir next', helvetica, arial, sans-serif;
    font-weight: 100;
    font-size: 3.5em;
    line-height: 1.3
}

.pw-modal-editor-news .subtitle {
    padding: 5px 100px 30px;
    background: white;
    font-size: 1.5em;
    line-height: 1.5
}

.pw-modal-editor-news iframe {
    display: block;
    margin: 0
}

.publish-project {
    counter-reset: tab-counter
}

.publish-project .pw-editor-modal-inner {
    max-width: 380px;
    min-width: 380px
}

.publish-project .tab-header {
    position: relative;
    background: black;
    color: #4d4d4d;
    text-align: left
}

.publish-project .tab-header h1 {
    font-family: inherit;
    font-size: 23px;
    line-height: 50px;
    font-weight: 300;
    padding: 0 16px;
    margin: 0;
    cursor: pointer;
    counter-increment: tab-counter
}

.publish-project .tab-header h1:before {
    content: counter(tab-counter, decimal-leading-zero) " "
}

.publish-project .tab:only-of-type .tab-header h1:before {
    content: ""
}

.publish-project .tab-content {
    display: none
}

.publish-project .tab-content>div {
    padding: 40px 58px
}

.publish-project .tab-content>div:after {
    content: "";
    display: table;
    clear: both
}

.publish-project .tab-content .info {
    text-align: center;
    margin-bottom: 14px
}

.publish-project .tab-content .info a {
    color: #fff;
    -webkit-transition: color .25s ease;
    transition: color .25s ease
}

.publish-project .tab-content .info a:hover {
    color: #b3b3b3
}

.publish-project .input-wrap {
    position: relative
}

.publish-project .input-wrap button.delete {
    display: none;
    position: absolute;
    top: 50%;
    right: 7px;
    background: #f7f7f7;
    padding: 0;
    margin: 0;
    width: 30px;
    height: 30px;
    margin-top: -15px
}

.publish-project .input-wrap button.delete svg {
    stroke: #f55842;
    -webkit-transition: stroke-width .25s ease;
    transition: stroke-width .25s ease
}

.publish-project .input-wrap button.delete:hover svg {
    stroke-width: 2px
}

.publish-project .input-wrap:hover input[disabled]+button.delete {
    display: block
}

.publish-project .domain-examples {
    margin-top: 8px;
    margin-bottom: 9px;
    margin-left: 2px
}

.publish-project .success-message,
.publish-project .error-message {
    display: none;
    border-radius: 4px;
    padding: 10px 15px;
    margin: 6px 0 0;
    text-align: center
}

.publish-project .success-message .link,
.publish-project .error-message .link {
    display: block;
    color: inherit;
    margin-top: 6px
}

.publish-project .success-message {
    background: #d9ffee;
    color: #0ac674
}

.publish-project .error-message {
    background: #f55842;
    color: #fff
}

.publish-project .error-message.warn {
    background: #e3b900
}

.publish-project .tab.expanded .tab-header {
    color: #c5c5c5
}

.publish-project .tab.expanded .tab-header button.close-x {
    display: block
}

.publish-project .tab.typekit {
    margin-top: 1px
}

.publish-project .actions {
    margin-top: 25px;
    text-align: center
}

.publish-project input {
    font-size: 14px;
    font-weight: 300;
    padding: 14px 13px;
    margin: 0;
    background-color: #f7f7f7;
    border: 1px solid #323232;
    border-radius: 4px;
    color: #55585e;
    width: 100%;
    -webkit-transition: background-color .25s ease, color .25s ease, border-color .25s ease;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease
}

.publish-project input.saved,
.publish-project input.saved-anyway {
    background-position: 100% 50%;
    background-repeat: no-repeat;
    border-color: #0ac674
}

.publish-project input.saved {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="0" y="0" width="37" height="30" viewBox="0 0 37 30" enable-background="new 0 0 37 30" xml:space="preserve"><polyline fill="none" stroke="%230AC674" stroke-width="1.25" stroke-miterlimit="10" points="26.5 8 12.5 22 5.5 15 "/></svg>')
}

.publish-project input.saved-anyway {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="0" y="0" width="37" height="30" viewBox="0 0 37 30" enable-background="new 0 0 37 30" xml:space="preserve"><polyline fill="none" stroke="%23e3b900" stroke-width="1.25" stroke-miterlimit="10" points="26.5 8 12.5 22 5.5 15 "/></svg>')
}

.publish-project input.valid {
    border-color: #0ac674
}

.publish-project input.warn {
    border-color: #e3b900;
    color: #e3b900
}

.publish-project input.error {
    border-color: #f55842
}

.publish-project input.delete {
    border-color: #f55842;
    color: #f55842
}

.publish-project button.check:not([disabled]) {
    background: #000
}

.publish-project button.save:not([disabled]) {
    background: #0ac674
}

.publish-project button.save:not([disabled]):hover {
    background: #56d58e
}

.publish-project button.warn:not([disabled]) {
    background: #e3b900
}

.publish-project button.warn:not([disabled]):hover {
    background: rgba(227, 185, 0, 0.9)
}

.publish-project .close-x {
    display: none;
    top: 50%;
    right: 7px;
    padding: 0;
    margin: 0;
    width: 30px;
    height: 30px;
    line-height: 30px;
    margin-top: -15px
}

.b-export-view-popup {
    width: 800px;
    margin-left: -400px
}

.b-export-view-popup .CodeMirror {
    font-size: 13px;
    height: 450px
}

.b-export-view-popup .tabs {
    float: left;
    width: 300px;
    overflow: hidden;
    list-style-type: none
}

.b-export-view-popup .tabs li {
    float: left;
    padding: 0 11px;
    font-size: 12px;
    font-weight: bold;
    line-height: 24px;
    text-transform: uppercase;
    cursor: pointer;
    color: #999
}

.b-export-view-popup .tabs li:hover,
.b-export-view-popup .tabs li.active {
    background: #3d3d3d;
    color: #ebebeb
}

.b-export-view-popup .tabs li:first-child {
    padding-left: 11px
}

.b-export-view-popup .download-as-zip-link {
    display: inline-block;
    position: absolute;
    right: 0;
    width: auto;
    margin-right: 10px;
    background-color: transparent;
    text-decoration: none;
    text-align: center;
    color: #999
}

.b-export-view-popup .download-as-zip-link:hover {
    background-color: #444;
    color: #ebebeb
}

.b-export-content {
    clear: both
}

.snapshots-popup .pw-editor-modal-overlay {
    z-index: 3009
}

.snapshots-popup .pw-editor-modal {
    z-index: 3010
}

.snapshots-popup .pw-editor-modal-inner {
    max-width: 800px;
    min-width: 800px
}

.snapshots-popup ul {
    display: block;
    padding: 0;
    margin: 0
}

.snapshots-popup li {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    padding: 4px 10px;
    margin: 0;
    -webkit-transition: background-color .2s ease;
    transition: background-color .2s ease
}

.snapshots-popup li:hover {}

.snapshots-popup li:hover .s-actions .btn,
.snapshots-popup li:hover .s-actions button {
    opacity: 1;
    pointer-events: all
}

.snapshots-popup li.is-renaming .s-actions,
.snapshots-popup li.is-renaming .s-pages-count {
    display: none
}

.snapshots-popup li.is-renaming .s-name {
    max-width: 100%
}

.snapshots-popup h1 {
    background: #fff;
    line-height: 40px;
    padding: 0 20px;
    margin: 0;
    min-height: 16.43px;
    border-bottom: 1px solid #e5e5e5;
    font-size: 16px;
    color: #666;
    font-weight: normal;
    text-overflow: ellipsis;
    text-align: left;
    font-family: inherit;
}

.snapshots-popup section {
    padding: 0 20px 20px
}

.snapshots-popup h2 {
    line-height: 50px;
    padding: 0;
    margin: 0;
    font-family: inherit;
    font-size: 14px;
    font-weight: 300;
    text-align: left
}

.snapshots-popup .s-list {}

.snapshots-popup .s-list.b-scroll {
    max-height: 194px
}

.snapshots-popup .s-list.b-scroll::-webkit-scrollbar {
    background-color: transparent
}

.snapshots-popup .s-list.b-scroll::-webkit-scrollbar-track {
    background-color: transparent
}

.snapshots-popup .s-list.b-scroll::-webkit-scrollbar-track-piece {
    background-color: transparent
}

.snapshots-popup .s-name {
    line-height: 40px;
    max-width: 40%;
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center
}

.snapshots-popup .s-actions {
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    text-align: right;
    padding-left: 10px
}

.snapshots-popup .s-actions .btn,
.snapshots-popup .s-actions button {
    opacity: 0;
    pointer-events: none;
    min-width: 90px;
    margin: 0 5px 0 0
}

.snapshots-popup .s-actions .btn:last-child,
.snapshots-popup .s-actions button:last-child {
    margin: 0
}

.snapshots-popup .s-actions .btn.is-published,
.snapshots-popup .s-actions button.is-published {
    opacity: 1;
    pointer-events: all
}

.snapshots-popup .s-actions .btn-publish.is-published {
    background-color: #bcbdc0;
    border-color: #bcbdc0;
    color: #fff
}

.snapshots-popup .s-actions .btn-publish:hover:not(:disabled) {
    background-color: #24abdf;
    border-color: #24abdf
}

.snapshots-popup .s-actions .btn-delete {
    color: #ff6a58;
    min-width: 0;
    margin-right: auto
}

.snapshots-popup .s-actions .btn-delete:hover {
    color: #ff9180
}

.snapshots-popup .s-page-count {
    width: 60px
}

.snapshots-popup .s-snapshot-name {
    font-size: 14px;
    padding: 0 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto
}

.snapshots-popup .s-pages-count {
    flex: 1 0 auto
}

.snapshots-popup .s-snapshot-name[contenteditable=true] {
    background-color: #ffd;
    border-radius: 4px;
    text-overflow: clip;
    width: 100%
}

.snapshots-popup .snapshot-limit-upsell {
    float: right
}

.snapshots-popup .snapshot-limit-upsell .button {
    width: auto;
    display: inline-block;
    padding-top: 14px;
    padding-bottom: 14px;
    border-radius: 4px
}

.snapshots-popup .s-snapshot-count-message,
.snapshots-popup .s-snapshot-count-upsell {
    display: inline-block
}

.snapshots-popup .s-snapshot-count-upsell {
    color: #1cbf61;
    text-decoration: underline;
    margin-left: 5px
}

.snapshots-popup .s-snapshot-count-upsell:hover {
    color: #56d58e
}

html,
body,
button,
input,
select,
textarea {
    font-family: "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, sans-serif
}

body {
    background: url(images/bg.gif) white;
    position: relative;
    min-width: 1418px;
    font-size: 62.5%
}

.disable-hover,
.disable-hover * {
    pointer-events: none!important
}

body.non-selectable {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.b-container-empty,
.b-container-empty * {
    display: none
}

.b-upload-receiver {
    background: red
}

#b-control-elements a,
#b-control-elements div {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.b-panel-tab-content-widget {
    min-height: 30%;
}

.pw-overlaid-control-elements {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden
}

body.pw-is-preview-mode .pw-overlaid-control-elements {
    display: none
}

#b-panel-area {
    position: fixed;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    top: 50px;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 10px;
    z-index: -999
}

.panel-tree-dragging #b-panel-area {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

#b-lock-screen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    background-color: rgba(255, 255, 255, 0.9);
    z-index: 2147483648
}

body.loading-editor-overlay.loading-editor-overlay-fadeout #b-loading-overlay {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility 0s 500ms linear, opacity 500ms linear;
    transition: visibility 0s 500ms linear, opacity 500ms linear
}

body.loading-editor-overlay #b-loading-overlay .message {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #FFF;
    font-size: 13px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .04em
}

body.loading-editor-overlay #b-loading-overlay .message .progress {
    background: rgba(255, 255, 255, 0.2);
    width: 100%;
    min-width: 340px;
    height: 8px;
    margin-bottom: 20px;
    border-radius: 5px;
    overflow: hidden
}

body.loading-editor-overlay #b-loading-overlay .message .progress.progress-60 div {
    width: 60%
}

body.loading-editor-overlay #b-loading-overlay .message .progress.progress-95 div {
    width: 95%
}

body.loading-editor-overlay #b-loading-overlay .message .progress.progress-100 div {
    width: 100%
}

body.loading-editor-overlay #b-loading-overlay .message .progress div {
    -webkit-animation: super-rainbow 5s infinite alternate linear;
    -moz-animation: super-rainbow 5s infinite alternate linear;
    animation: super-rainbow 5s infinite alternate linear;
    -webkit-transition: width .3s linear;
    transition: width .3s linear;
    height: 100%;
    width: 10%;
    background: #FFF
}

.b-ui-heading {
    height: 40px;
    padding: 0 11px;
    border-bottom: 1px solid #e5e5e5;
}

.b-ui-heading-dark {
    background: #fff
}

.b-ui-heading h2 {
    color: #666;
    line-height: 40px;
    font-weight: normal;
    margin: 0;
    padding: 0 20px;
    font-size: 16px;
    text-overflow: ellipsis;
    text-align: left;
    font-family: inherit;
    padding: 0 11px;
    vertical-align: middle;
    text-transform: uppercase
}

.b-ui-button-close {
    font-size: 0;
    color: transparent;
    background-color: transparent;
    height: 26px;
    width: 26px;
    border: none;
    text-align: center;
    line-height: 22px;
    transition: transform 0.2s ease;
    cursor: pointer;
}

.b-ui-button-close:before {
    font-size: 22px;
    content: "×";
    color: #666;
}

.b-ui-button-close:hover {
    transform: rotate(90deg);
}

.b-ui-button-text {
    background: #28c;
    border: solid 1px #19b;
    user-select: none;
    text-align: center;
    line-height: 1.42857143;
    padding: 5px 12px;
    cursor: pointer;
    -webkit-appearance: button;
    display: inline-block;
    touch-action: manipulation;
    font-family: "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
    min-width: 80px;
    color: #fff;
    font-weight: normal;
    font-size: 14px;
    border-radius: 4px
}

.b-ui-button-text:hover {
    background-color: #39d;
    border-color: #4ae
}

.b-margins {
    z-index: 768
}

.b-margins>* {
    pointer-events: none
}

.b-margins .b-margins-element {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.b-margins.b-hovered {
    outline: dashed 1px #787b7e;
    outline-radius: 1px
}

.b-margins.b-focus {
    outline: dashed 1px #ed1c24;
    outline-radius: 1px;
    z-index: 769
}

.b-margins.b-focus .b-widget-placeholder {
    outline: dashed 1px #ed1c24
}

.b-margins .b-widget-placeholder {
    outline: dashed 1px #787b7e;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ease .b-margins {
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease
}

.b-margins,
.b-margins-inner-element,
.b-margins-margin {
    position: absolute
}

.negativetrue .line {
    background: #f00!important
}

.negativetrue .line:before,
.negativetrue .line:after {
    border-top: 1px solid #f00!important;
    border-left: 1px solid #f00!important
}

.weaver-arrows-visible .line {
    display: block!important
}

.b-margins-margin .line {
    position: absolute;
    display: none;
    background: #000
}

.b-margins-margin .line .b-margin-value {
    font-family: Tahoma, sans-serif!important;
    font-size: 12px;
    position: absolute;
    top: -6px;
    left: 50%;
    width: 46px;
    margin-left: -23px;
    margin-top: 2px;
    text-align: center;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 3px
}

.b-margins-margin .line:before,
.b-margins-margin .line:after {
    content: ' ';
    position: absolute;
    display: block;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    width: 4px;
    height: 4px
}

.b-margins-margin .line.vertical:before,
.b-margins-margin .line.vertical:after {
    left: -2px
}

.b-margins-margin .line.vertical:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 1px
}

.b-margins-margin .line.vertical:after {
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
    bottom: 1px
}

.b-margins-margin .line.horizontal:before,
.b-margins-margin .line.horizontal:after {
    top: -2px
}

.b-margins-margin .line.horizontal:before {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 1px
}

.b-margins-margin .line.horizontal:after {
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    right: 1px
}

.b-margins-margin.b-margins-top .b-margin-value {
    top: 50%!important;
    left: 0!important;
    margin-top: -5px;
    margin-left: -20px
}

.b-margins-margin.b-margins-bottom .b-margin-value {
    bottom: 50%!important;
    left: 0!important;
    top: auto!important;
    margin-bottom: -5px;
    margin-left: -20px
}

.b-margins-margin.b-margins-top {
    left: 0;
    right: 0
}

.b-margins-margin.b-margins-top .line {
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    margin-left: -0.5px
}

.b-margins-margin.b-margins-right {
    top: 0;
    bottom: 0
}

.b-margins-margin.b-margins-right .line {
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    margin-top: -0.5px
}

.b-margins-margin.b-margins-bottom {
    left: 0;
    right: 0
}

.b-margins-margin.b-margins-bottom .line {
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    margin-left: -0.5px
}

.b-margins-margin.b-margins-left {
    top: 0;
    bottom: 0
}

.b-margins-margin.b-margins-left .line {
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    margin-top: -0.5px
}

.bg-dark .b-margin-value {
    background: rgba(255, 255, 255, 0.8)!important;
    color: #000
}

.bg-dark .line {
    background: #fff
}

.bg-dark .line:before,
.bg-dark .line:after {
    border-top: 1px solid #fff;
    border-left: 1px solid #fff
}

.b-preview-toggleable {
    opacity: 1;
    -webkit-transition: opacity 150ms linear;
    transition: opacity 150ms linear
}

.b-preview-toggleable.hidden {
    opacity: 0!important;
    pointer-events: none
}

.icon-large:before {
    vertical-align: -10%;
    font-size: 1.33333em
}

.fresheditable {
    outline: none
}

.fresheditable[contentEditable=true] {
    width: 100%;
    cursor: text
}

#classes-panel {
    bottom: 50px;
    left: 50px;
    position: fixed;
    background: gray;
    font-size: 1.5em;
    color: white
}

#classes-panel ul {
    margin: 0;
    padding: 11px;
    list-style: none
}

#classes-panel ul li {
    margin: 0;
    padding: 0
}

.lockscreen {
    display: none;
    position: fixed;
    top: 0;
    z-index: 10000;
    width: 100%;
    height: 100%;
    background-color: rgba(34, 34, 34, 0.86)
}

.well {
    border: 0 none;
    border-radius: 4px;
    box-shadow: 0 0 0 5px rgba(153, 153, 153, 0.4)
}

.rounded-top {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.rounded-bottom {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px
}

.clipboard-helper {
    width: 0;
    height: 0;
    position: absolute;
    top: -999px;
    left: -999px
}

.hidden {
    display: none!important
}

:focus {
    outline: 0;
    outline: none;
    outline-style: none;
    outline-color: transparent;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent
}

#pw-off-canvas-wrap {
    position: relative;
    overflow: hidden;
    height: auto!important
}

body.pw-is-preview-mode {
    min-width: 0
}

body.pw-is-preview-mode #pw-off-canvas-wrap {
    overflow-x: visible
}

.pw-off-canvas,
body.pw-is-preview-mode.pw-widget-library-is-open .pw-off-canvas {
    left: 0;
    right: 0;
    margin-right: 280px;
    margin-left: 34px;
    position: relative;
    -webkit-transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1), margin .25s ease;
    transition: transform .35s cubic-bezier(0.215, 0.61, 0.355, 1), margin .25s ease;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}
.pw-off-canvas.simple-canvas,
body.pw-is-preview-mode.pw-widget-library-is-open .pw-off-canvas.simple-canvas {
    margin-right: 0;
    margin-left: 0;
}
.pw-off-canvas.overlayed,
body.pw-is-preview-mode.pw-widget-library-is-open .pw-off-canvas.overlayed {
    pointer-events: none!important;
    z-index: 1;
    height: 100%
}

.pw-off-canvas.fixed,
body.pw-is-preview-mode.pw-widget-library-is-open .pw-off-canvas.fixed {
    position: fixed
}

body.pw-is-preview-mode .pw-off-canvas,
body.pw-is-preview-mode.pw-widget-library-is-open .pw-off-canvas {
    margin-right: 0;
    margin-left: 0
}

body.pw-widget-library-is-open .pw-off-canvas {
    -webkit-transform: translateX(284px);
    -ms-transform: translateX(284px);
    transform: translateX(284px)
}

@media screen and (min-width: 1900px) {
    .pw-widget-library-is-open #b-panel,
    .pw-widget-library-is-open #b-panel.b-preview-toggleable {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        -webkit-backface-visibility: none;
        backface-visibility: none
    }
    body.pw-widget-library-is-open #intercom-launcher {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
    body.pw-widget-library-is-open .pw-off-canvas {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        margin-left: 318px;
    }
}

@media screen and (max-width: 1440px) {
    .b-breakpoint-width .hide-on-smaller {
        display: none
    }
}

a.type-underlined {
    text-decoration: underline
}

a.type-strong {
    font-weight: 600
}

a.type-accent,
a.type-success {
    color: #1cbf61
}

a.type-accent:hover,
a.type-accent:focus,
a.type-success:hover,
a.type-success:focus {
    color: #56d58e
}

a.type-accent:active,
a.type-success:active {
    color: #099e49
}

a.type-inform {
    color: #7b8cf6
}

a.type-inform:hover,
a.type-inform:focus {
    color: #b2bcfb
}

a.type-inform:active {
    color: #7b8cf6
}

a.type-attention {
    color: white
}

a.type-attention:hover,
a.type-attention:focus {
    color: white
}

a.type-attention:active {
    color: white
}

a.type-warn {
    color: #b89d51
}

a.type-warn:hover,
a.type-warn:focus {
    color: #d4b941
}

a.type-warn:active {
    color: #f1d531
}

.pw-mol-button-inform,
.pw-mol-button-attention,
.pw-org-delete-button,
.pw-mol-button-warn,
.pw-mol-button-success,
.pw-mol-button-beta,
.pw-org-create-new-page-button.is-beta,
.pw-org-twin-button.is-beta,
.pw-mol-button-primary,
.pw-org-create-new-page-button,
.pw-org-add-people-button,
.pw-org-view-page-button,
.pw-org-twin-button,
.pw-org-follow-button,
.pw-mol-text-button,
.pw-org-hire-me-text-button,
.pw-org-delete-text-button,
.pw-mol-user-website-text-button,
.pw-mol-user-twitter-text-button,
.pw-mol-share-text-button,
.pw-mol-share-on-twitter-button,
.pw-org-toggle-private-text-button,
.pw-org-manage-team-button,
.pw-org-back-button,
.pw-org-like-text-button,
.pw-org-twin-text-button,
.pw-mol-button-secondary {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: .875rem;
    font-weight: 400;
    line-height: 2.714;
    text-decoration: none;
    padding: 0;
    cursor: pointer;
    outline: none;
    -webkit-transition: color .15s, background-color .15s, border-color .15s, fill .15s;
    transition: color .15s, background-color .15s, border-color .15s, fill .15s
}

.pw-mol-button-inform>span,
.pw-mol-button-attention>span,
.pw-org-delete-button>span,
.pw-mol-button-warn>span,
.pw-mol-button-success>span,
.pw-mol-button-beta>span,
.pw-org-create-new-page-button.is-beta>span,
.pw-org-twin-button.is-beta>span,
.pw-mol-button-primary>span,
.pw-org-create-new-page-button>span,
.pw-org-add-people-button>span,
.pw-org-view-page-button>span,
.pw-org-twin-button>span,
.pw-org-follow-button>span,
.pw-mol-text-button>span,
.pw-org-hire-me-text-button>span,
.pw-org-delete-text-button>span,
.pw-mol-user-website-text-button>span,
.pw-mol-user-twitter-text-button>span,
.pw-mol-share-text-button>span,
.pw-mol-share-on-twitter-button>span,
.pw-org-toggle-private-text-button>span,
.pw-org-manage-team-button>span,
.pw-org-back-button>span,
.pw-org-like-text-button>span,
.pw-org-twin-text-button>span,
.pw-mol-button-secondary>span {
    -webkit-transition: opacity .15s;
    transition: opacity .15s
}

.pw-mol-button-inform svg,
.pw-mol-button-attention svg,
.pw-org-delete-button svg,
.pw-mol-button-warn svg,
.pw-mol-button-success svg,
.pw-mol-button-beta svg,
.pw-org-create-new-page-button.is-beta svg,
.pw-org-twin-button.is-beta svg,
.pw-mol-button-primary svg,
.pw-org-create-new-page-button svg,
.pw-org-add-people-button svg,
.pw-org-view-page-button svg,
.pw-org-twin-button svg,
.pw-org-follow-button svg,
.pw-mol-text-button svg,
.pw-org-hire-me-text-button svg,
.pw-org-delete-text-button svg,
.pw-mol-user-website-text-button svg,
.pw-mol-user-twitter-text-button svg,
.pw-mol-share-text-button svg,
.pw-mol-share-on-twitter-button svg,
.pw-org-toggle-private-text-button svg,
.pw-org-manage-team-button svg,
.pw-org-back-button svg,
.pw-org-like-text-button svg,
.pw-org-twin-text-button svg,
.pw-mol-button-secondary svg {
    fill: inherit;
    vertical-align: middle;
    margin-right: .35em;
    margin-top: -0.2em
}

.is-loading.pw-mol-button-inform,
.is-loading.pw-mol-button-attention,
.is-loading.pw-org-delete-button,
.is-loading.pw-mol-button-warn,
.is-loading.pw-mol-button-success,
.is-loading.pw-mol-button-beta,
.is-loading.pw-mol-button-primary,
.is-loading.pw-org-create-new-page-button,
.is-loading.pw-org-add-people-button,
.is-loading.pw-org-view-page-button,
.is-loading.pw-org-twin-button,
.is-loading.pw-org-follow-button,
.is-loading.pw-mol-text-button,
.is-loading.pw-org-hire-me-text-button,
.is-loading.pw-org-delete-text-button,
.is-loading.pw-mol-user-website-text-button,
.is-loading.pw-mol-user-twitter-text-button,
.is-loading.pw-mol-share-text-button,
.is-loading.pw-mol-share-on-twitter-button,
.is-loading.pw-org-toggle-private-text-button,
.is-loading.pw-org-manage-team-button,
.is-loading.pw-org-back-button,
.is-loading.pw-org-like-text-button,
.is-loading.pw-org-twin-text-button,
.is-loading.pw-mol-button-secondary {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=)
}

.is-loading.pw-mol-button-inform>span,
.is-loading.pw-mol-button-attention>span,
.is-loading.pw-org-delete-button>span,
.is-loading.pw-mol-button-warn>span,
.is-loading.pw-mol-button-success>span,
.is-loading.pw-mol-button-beta>span,
.is-loading.pw-mol-button-primary>span,
.is-loading.pw-org-create-new-page-button>span,
.is-loading.pw-org-add-people-button>span,
.is-loading.pw-org-view-page-button>span,
.is-loading.pw-org-twin-button>span,
.is-loading.pw-org-follow-button>span,
.is-loading.pw-mol-text-button>span,
.is-loading.pw-org-hire-me-text-button>span,
.is-loading.pw-org-delete-text-button>span,
.is-loading.pw-mol-user-website-text-button>span,
.is-loading.pw-mol-user-twitter-text-button>span,
.is-loading.pw-mol-share-text-button>span,
.is-loading.pw-mol-share-on-twitter-button>span,
.is-loading.pw-org-toggle-private-text-button>span,
.is-loading.pw-org-manage-team-button>span,
.is-loading.pw-org-back-button>span,
.is-loading.pw-org-like-text-button>span,
.is-loading.pw-org-twin-text-button>span,
.is-loading.pw-mol-button-secondary>span {
    opacity: 0
}

.pw-mol-button-beta,
.pw-org-create-new-page-button.is-beta,
.pw-org-twin-button.is-beta,
.pw-mol-button-primary,
.pw-org-create-new-page-button,
.pw-org-add-people-button,
.pw-org-view-page-button,
.pw-org-twin-button,
.pw-org-follow-button,
.pw-mol-button-secondary,
.pw-mol-button-inform,
.pw-mol-button-attention,
.pw-org-delete-button,
.pw-mol-button-warn,
.pw-mol-button-success {
    border-width: 1px;
    border-style: solid;
    border-radius: 4px
}

.pw-mol-button-inform,
.pw-mol-button-attention,
.pw-org-delete-button,
.pw-mol-button-warn,
.pw-mol-button-success {
    line-height: 2;
    padding: 0 .625rem;
    min-width: 4.375rem
}

.pw-mol-button-beta,
.pw-org-create-new-page-button.is-beta,
.pw-org-twin-button.is-beta,
.pw-mol-button-primary,
.pw-org-create-new-page-button,
.pw-org-add-people-button,
.pw-org-view-page-button,
.pw-org-twin-button,
.pw-org-follow-button {
    min-width: 7.5rem;
    padding: 0 .875rem;
    background-color: #1cbf61;
    border-color: #00b360;
    color: white;
    fill: white
}

.pw-mol-button-beta:hover,
.pw-mol-button-primary:hover,
.pw-org-create-new-page-button:hover,
.pw-org-add-people-button:hover,
.pw-org-view-page-button:hover,
.pw-org-twin-button:hover,
.pw-org-follow-button:hover,
.pw-mol-button-beta:focus,
.pw-mol-button-primary:focus,
.pw-org-create-new-page-button:focus,
.pw-org-add-people-button:focus,
.pw-org-view-page-button:focus,
.pw-org-twin-button:focus,
.pw-org-follow-button:focus {
    background-color: #56d58e;
    color: white
}

.pw-mol-button-beta:active,
.pw-mol-button-primary:active,
.pw-org-create-new-page-button:active,
.pw-org-add-people-button:active,
.pw-org-view-page-button:active,
.pw-org-twin-button:active,
.pw-org-follow-button:active {
    background-color: #00b360;
    color: white
}

.pw-mol-button-beta:disabled,
.pw-mol-button-primary:disabled,
.pw-org-create-new-page-button:disabled,
.pw-org-add-people-button:disabled,
.pw-org-view-page-button:disabled,
.pw-org-twin-button:disabled,
.pw-org-follow-button:disabled {
    border-color: #c8f5df;
    background-color: #c8f5df;
    color: #1cbf61
}

.type-big.pw-mol-button-beta,
.type-big.pw-mol-button-primary,
.type-big.pw-org-create-new-page-button,
.type-big.pw-org-add-people-button,
.type-big.pw-org-view-page-button,
.type-big.pw-org-twin-button,
.type-big.pw-org-follow-button {
    line-height: 3.428;
    min-width: 10rem;
    padding-left: .875rem;
    padding-right: .875rem
}

.type-small.pw-mol-button-beta,
.type-small.pw-mol-button-primary,
.type-small.pw-org-create-new-page-button,
.type-small.pw-org-add-people-button,
.type-small.pw-org-view-page-button,
.type-small.pw-org-twin-button,
.type-small.pw-org-follow-button {
    line-height: 2;
    min-width: 5.625rem;
    padding-left: .75rem;
    padding-right: .75rem
}

.type-auto-width.pw-mol-button-beta,
.type-auto-width.pw-mol-button-primary,
.type-auto-width.pw-org-create-new-page-button,
.type-auto-width.pw-org-add-people-button,
.type-auto-width.pw-org-view-page-button,
.type-auto-width.pw-org-twin-button,
.type-auto-width.pw-org-follow-button {
    min-width: 0
}

.type-max-width.pw-mol-button-beta,
.type-max-width.pw-mol-button-primary,
.type-max-width.pw-org-create-new-page-button,
.type-max-width.pw-org-add-people-button,
.type-max-width.pw-org-view-page-button,
.type-max-width.pw-org-twin-button,
.type-max-width.pw-org-follow-button {
    width: 100%
}

.type-inverted.pw-mol-button-beta,
.type-inverted.pw-mol-button-primary,
.type-inverted.pw-org-create-new-page-button,
.type-inverted.pw-org-add-people-button,
.type-inverted.pw-org-view-page-button,
.type-inverted.pw-org-twin-button,
.type-inverted.pw-org-follow-button {
    border-color: #1cbf61;
    color: #1cbf61;
    fill: #1cbf61;
    background-color: white
}

.type-inverted.pw-mol-button-beta:hover,
.type-inverted.pw-mol-button-primary:hover,
.type-inverted.pw-org-create-new-page-button:hover,
.type-inverted.pw-org-add-people-button:hover,
.type-inverted.pw-org-view-page-button:hover,
.type-inverted.pw-org-twin-button:hover,
.type-inverted.pw-org-follow-button:hover,
.type-inverted.pw-mol-button-beta:focus,
.type-inverted.pw-mol-button-primary:focus,
.type-inverted.pw-org-create-new-page-button:focus,
.type-inverted.pw-org-add-people-button:focus,
.type-inverted.pw-org-view-page-button:focus,
.type-inverted.pw-org-twin-button:focus,
.type-inverted.pw-org-follow-button:focus {
    border-color: #c8f5df;
    color: #1cbf61
}

.type-inverted.pw-mol-button-beta:active,
.type-inverted.pw-mol-button-primary:active,
.type-inverted.pw-org-create-new-page-button:active,
.type-inverted.pw-org-add-people-button:active,
.type-inverted.pw-org-view-page-button:active,
.type-inverted.pw-org-twin-button:active,
.type-inverted.pw-org-follow-button:active {
    border-color: #c8f5df;
    background-color: #c8f5df
}

.type-split-count.pw-mol-button-beta .s-count,
.type-split-count.pw-mol-button-primary .s-count,
.type-split-count.pw-org-create-new-page-button .s-count,
.type-split-count.pw-org-add-people-button .s-count,
.type-split-count.pw-org-view-page-button .s-count,
.type-split-count.pw-org-twin-button .s-count,
.type-split-count.pw-org-follow-button .s-count {
    display: inline-block;
    float: right;
    border-left: 1px solid white;
    padding-left: .875rem;
    margin-left: .875rem;
    -webkit-transition: border-color .15s;
    transition: border-color .15s
}

.type-split-count.type-inverted.pw-mol-button-beta .s-count,
.type-split-count.type-inverted.pw-mol-button-primary .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button .s-count,
.type-split-count.type-inverted.pw-org-add-people-button .s-count,
.type-split-count.type-inverted.pw-org-view-page-button .s-count,
.type-split-count.type-inverted.pw-org-twin-button .s-count,
.type-split-count.type-inverted.pw-org-follow-button .s-count {
    border-left-color: #1cbf61
}

.type-split-count.type-inverted.pw-mol-button-beta:hover .s-count,
.type-split-count.type-inverted.pw-mol-button-primary:hover .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button:hover .s-count,
.type-split-count.type-inverted.pw-org-add-people-button:hover .s-count,
.type-split-count.type-inverted.pw-org-view-page-button:hover .s-count,
.type-split-count.type-inverted.pw-org-twin-button:hover .s-count,
.type-split-count.type-inverted.pw-org-follow-button:hover .s-count,
.type-split-count.type-inverted.pw-mol-button-beta:focus .s-count,
.type-split-count.type-inverted.pw-mol-button-primary:focus .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button:focus .s-count,
.type-split-count.type-inverted.pw-org-add-people-button:focus .s-count,
.type-split-count.type-inverted.pw-org-view-page-button:focus .s-count,
.type-split-count.type-inverted.pw-org-twin-button:focus .s-count,
.type-split-count.type-inverted.pw-org-follow-button:focus .s-count {
    border-left-color: #c8f5df
}

.type-split-count.type-inverted.pw-mol-button-beta:active .s-count,
.type-split-count.type-inverted.pw-mol-button-primary:active .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button:active .s-count,
.type-split-count.type-inverted.pw-org-add-people-button:active .s-count,
.type-split-count.type-inverted.pw-org-view-page-button:active .s-count,
.type-split-count.type-inverted.pw-org-twin-button:active .s-count,
.type-split-count.type-inverted.pw-org-follow-button:active .s-count {
    border-left-color: white
}

.pw-mol-button-beta,
.pw-org-create-new-page-button.is-beta,
.pw-org-twin-button.is-beta {
    background-color: #35a6de;
    border-color: #1e9ddc
}

.pw-mol-button-beta:hover,
.pw-org-create-new-page-button.is-beta:hover,
.pw-org-twin-button.is-beta:hover,
.pw-mol-button-beta:focus,
.pw-org-create-new-page-button.is-beta:focus,
.pw-org-twin-button.is-beta:focus {
    background-color: #49b0e2
}

.pw-mol-button-beta:active,
.pw-org-create-new-page-button.is-beta:active,
.pw-org-twin-button.is-beta:active {
    background-color: #1e9ddc
}

.pw-mol-button-beta:disabled,
.pw-org-create-new-page-button.is-beta:disabled,
.pw-org-twin-button.is-beta:disabled {
    border-color: #c7dee8;
    background-color: #c7dee8;
    color: #35a6de
}

.type-inverted.pw-mol-button-beta,
.type-inverted.pw-org-create-new-page-button.is-beta,
.type-inverted.pw-org-twin-button.is-beta {
    border-color: #35a6de;
    color: #35a6de;
    fill: #35a6de;
    background-color: white
}

.type-inverted.pw-mol-button-beta:hover,
.type-inverted.pw-org-create-new-page-button.is-beta:hover,
.type-inverted.pw-org-twin-button.is-beta:hover,
.type-inverted.pw-mol-button-beta:focus,
.type-inverted.pw-org-create-new-page-button.is-beta:focus,
.type-inverted.pw-org-twin-button.is-beta:focus {
    border-color: #c7dee8;
    color: #35a6de
}

.type-inverted.pw-mol-button-beta:active,
.type-inverted.pw-org-create-new-page-button.is-beta:active,
.type-inverted.pw-org-twin-button.is-beta:active {
    border-color: #c7dee8;
    background-color: #c7dee8
}

.type-split-count.type-inverted.pw-mol-button-beta .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button.is-beta .s-count,
.type-split-count.type-inverted.pw-org-twin-button.is-beta .s-count {
    border-left-color: #35a6de
}

.type-split-count.type-inverted.pw-mol-button-beta:hover .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button.is-beta:hover .s-count,
.type-split-count.type-inverted.pw-org-twin-button.is-beta:hover .s-count,
.type-split-count.type-inverted.pw-mol-button-beta:focus .s-count,
.type-split-count.type-inverted.pw-org-create-new-page-button.is-beta:focus .s-count,
.type-split-count.type-inverted.pw-org-twin-button.is-beta:focus .s-count {
    border-left-color: #c7dee8
}

.pw-mol-text-button,
.pw-org-hire-me-text-button,
.pw-org-delete-text-button,
.pw-mol-user-website-text-button,
.pw-mol-user-twitter-text-button,
.pw-mol-share-text-button,
.pw-mol-share-on-twitter-button,
.pw-org-toggle-private-text-button,
.pw-org-manage-team-button,
.pw-org-back-button,
.pw-org-like-text-button,
.pw-org-twin-text-button {
    color: #bcbdc0;
    fill: #bcbdc0
}

.pw-mol-text-button .s-text,
.pw-org-hire-me-text-button .s-text,
.pw-org-delete-text-button .s-text,
.pw-mol-user-website-text-button .s-text,
.pw-mol-user-twitter-text-button .s-text,
.pw-mol-share-text-button .s-text,
.pw-mol-share-on-twitter-button .s-text,
.pw-org-toggle-private-text-button .s-text,
.pw-org-manage-team-button .s-text,
.pw-org-back-button .s-text,
.pw-org-like-text-button .s-text,
.pw-org-twin-text-button .s-text {
    vertical-align: middle
}

.pw-mol-text-button:hover,
.pw-org-hire-me-text-button:hover,
.pw-org-delete-text-button:hover,
.pw-mol-user-website-text-button:hover,
.pw-mol-user-twitter-text-button:hover,
.pw-mol-share-text-button:hover,
.pw-mol-share-on-twitter-button:hover,
.pw-org-toggle-private-text-button:hover,
.pw-org-manage-team-button:hover,
.pw-org-back-button:hover,
.pw-org-like-text-button:hover,
.pw-org-twin-text-button:hover,
.pw-mol-text-button:focus,
.pw-org-hire-me-text-button:focus,
.pw-org-delete-text-button:focus,
.pw-mol-user-website-text-button:focus,
.pw-mol-user-twitter-text-button:focus,
.pw-mol-share-text-button:focus,
.pw-mol-share-on-twitter-button:focus,
.pw-org-toggle-private-text-button:focus,
.pw-org-manage-team-button:focus,
.pw-org-back-button:focus,
.pw-org-like-text-button:focus,
.pw-org-twin-text-button:focus {
    color: #797a80;
    fill: #797a80
}

.pw-mol-text-button:active,
.pw-org-hire-me-text-button:active,
.pw-org-delete-text-button:active,
.pw-mol-user-website-text-button:active,
.pw-mol-user-twitter-text-button:active,
.pw-mol-share-text-button:active,
.pw-mol-share-on-twitter-button:active,
.pw-org-toggle-private-text-button:active,
.pw-org-manage-team-button:active,
.pw-org-back-button:active,
.pw-org-like-text-button:active,
.pw-org-twin-text-button:active {
    color: #262a33;
    fill: #262a33
}

.type-inverted.pw-mol-text-button,
.type-inverted.pw-org-hire-me-text-button,
.type-inverted.pw-org-delete-text-button,
.type-inverted.pw-mol-user-website-text-button,
.type-inverted.pw-mol-user-twitter-text-button,
.type-inverted.pw-mol-share-text-button,
.type-inverted.pw-mol-share-on-twitter-button,
.type-inverted.pw-org-toggle-private-text-button,
.type-inverted.pw-org-manage-team-button,
.type-inverted.pw-org-back-button,
.type-inverted.pw-org-like-text-button,
.type-inverted.pw-org-twin-text-button {
    color: white;
    fill: white
}

.type-inverted.pw-mol-text-button:hover,
.type-inverted.pw-org-hire-me-text-button:hover,
.type-inverted.pw-org-delete-text-button:hover,
.type-inverted.pw-mol-user-website-text-button:hover,
.type-inverted.pw-mol-user-twitter-text-button:hover,
.type-inverted.pw-mol-share-text-button:hover,
.type-inverted.pw-mol-share-on-twitter-button:hover,
.type-inverted.pw-org-toggle-private-text-button:hover,
.type-inverted.pw-org-manage-team-button:hover,
.type-inverted.pw-org-back-button:hover,
.type-inverted.pw-org-like-text-button:hover,
.type-inverted.pw-org-twin-text-button:hover,
.type-inverted.pw-mol-text-button:focus,
.type-inverted.pw-org-hire-me-text-button:focus,
.type-inverted.pw-org-delete-text-button:focus,
.type-inverted.pw-mol-user-website-text-button:focus,
.type-inverted.pw-mol-user-twitter-text-button:focus,
.type-inverted.pw-mol-share-text-button:focus,
.type-inverted.pw-mol-share-on-twitter-button:focus,
.type-inverted.pw-org-toggle-private-text-button:focus,
.type-inverted.pw-org-manage-team-button:focus,
.type-inverted.pw-org-back-button:focus,
.type-inverted.pw-org-like-text-button:focus,
.type-inverted.pw-org-twin-text-button:focus {
    color: white;
    fill: white
}

.type-text-before-icon.pw-mol-text-button .s-text,
.type-text-before-icon.pw-org-hire-me-text-button .s-text,
.type-text-before-icon.pw-org-delete-text-button .s-text,
.type-text-before-icon.pw-mol-user-website-text-button .s-text,
.type-text-before-icon.pw-mol-user-twitter-text-button .s-text,
.type-text-before-icon.pw-mol-share-text-button .s-text,
.type-text-before-icon.pw-mol-share-on-twitter-button .s-text,
.type-text-before-icon.pw-org-toggle-private-text-button .s-text,
.type-text-before-icon.pw-org-manage-team-button .s-text,
.type-text-before-icon.pw-org-back-button .s-text,
.type-text-before-icon.pw-org-like-text-button .s-text,
.type-text-before-icon.pw-org-twin-text-button .s-text {
    float: left
}

.type-text-before-icon.pw-mol-text-button svg,
.type-text-before-icon.pw-org-hire-me-text-button svg,
.type-text-before-icon.pw-org-delete-text-button svg,
.type-text-before-icon.pw-mol-user-website-text-button svg,
.type-text-before-icon.pw-mol-user-twitter-text-button svg,
.type-text-before-icon.pw-mol-share-text-button svg,
.type-text-before-icon.pw-mol-share-on-twitter-button svg,
.type-text-before-icon.pw-org-toggle-private-text-button svg,
.type-text-before-icon.pw-org-manage-team-button svg,
.type-text-before-icon.pw-org-back-button svg,
.type-text-before-icon.pw-org-like-text-button svg,
.type-text-before-icon.pw-org-twin-text-button svg {
    margin-right: 0;
    margin-left: .35em
}

.type-darker.pw-mol-text-button,
.type-darker.pw-org-hire-me-text-button,
.type-darker.pw-org-delete-text-button,
.type-darker.pw-mol-user-website-text-button,
.type-darker.pw-mol-user-twitter-text-button,
.type-darker.pw-mol-share-text-button,
.type-darker.pw-mol-share-on-twitter-button,
.type-darker.pw-org-toggle-private-text-button,
.type-darker.pw-org-manage-team-button,
.type-darker.pw-org-back-button,
.type-darker.pw-org-like-text-button,
.type-darker.pw-org-twin-text-button {
    color: #797a80;
    fill: #797a80
}

.type-darker.pw-mol-text-button:hover,
.type-darker.pw-org-hire-me-text-button:hover,
.type-darker.pw-org-delete-text-button:hover,
.type-darker.pw-mol-user-website-text-button:hover,
.type-darker.pw-mol-user-twitter-text-button:hover,
.type-darker.pw-mol-share-text-button:hover,
.type-darker.pw-mol-share-on-twitter-button:hover,
.type-darker.pw-org-toggle-private-text-button:hover,
.type-darker.pw-org-manage-team-button:hover,
.type-darker.pw-org-back-button:hover,
.type-darker.pw-org-like-text-button:hover,
.type-darker.pw-org-twin-text-button:hover {
    color: #262a33;
    fill: #262a33
}

.is-beta.pw-mol-text-button:hover,
.is-beta.pw-org-hire-me-text-button:hover,
.is-beta.pw-org-delete-text-button:hover,
.is-beta.pw-mol-user-website-text-button:hover,
.is-beta.pw-mol-user-twitter-text-button:hover,
.is-beta.pw-mol-share-text-button:hover,
.is-beta.pw-mol-share-on-twitter-button:hover,
.is-beta.pw-org-toggle-private-text-button:hover,
.is-beta.pw-org-manage-team-button:hover,
.is-beta.pw-org-back-button:hover,
.is-beta.pw-org-like-text-button:hover,
.is-beta.pw-org-twin-text-button:hover {
    color: #1e9ddc;
    fill: #1e9ddc
}

.is-beta.pw-mol-text-button:active,
.is-beta.pw-org-hire-me-text-button:active,
.is-beta.pw-org-delete-text-button:active,
.is-beta.pw-mol-user-website-text-button:active,
.is-beta.pw-mol-user-twitter-text-button:active,
.is-beta.pw-mol-share-text-button:active,
.is-beta.pw-mol-share-on-twitter-button:active,
.is-beta.pw-org-toggle-private-text-button:active,
.is-beta.pw-org-manage-team-button:active,
.is-beta.pw-org-back-button:active,
.is-beta.pw-org-like-text-button:active,
.is-beta.pw-org-twin-text-button:active {
    color: #006a9e;
    fill: #006a9e
}

.is-disabled.pw-mol-text-button,
.is-disabled.pw-org-hire-me-text-button,
.is-disabled.pw-org-delete-text-button,
.is-disabled.pw-mol-user-website-text-button,
.is-disabled.pw-mol-user-twitter-text-button,
.is-disabled.pw-mol-share-text-button,
.is-disabled.pw-mol-share-on-twitter-button,
.is-disabled.pw-org-toggle-private-text-button,
.is-disabled.pw-org-manage-team-button,
.is-disabled.pw-org-back-button,
.is-disabled.pw-org-like-text-button,
.is-disabled.pw-org-twin-text-button {
    pointer-events: none
}

.pw-mol-button-secondary {
    min-width: 7.5rem;
    padding: 0 .875rem;
    border-color: #e1e2e8;
    color: #262a33;
    background-color: white
}

.pw-mol-button-secondary:hover,
.pw-mol-button-secondary:focus {
    border-color: #bcbdc0;
    color: #262a33
}

.pw-mol-button-secondary:active {
    border-color: #e1e2e8;
    background-color: #e1e2e8;
    color: #262a33
}

.pw-mol-button-secondary.type-small {
    line-height: 2;
    min-width: 5.625rem;
    padding-left: .75rem;
    padding-right: .75rem
}

.pw-mol-button-inform {
    border-color: transparent;
    background-color: #7b8cf6;
    color: white
}

.pw-mol-button-inform:hover,
.pw-mol-button-inform:focus {
    background-color: #b2bcfb;
    color: white
}

.pw-mol-button-inform:active {
    background-color: #2c21ac;
    color: white
}

.type-inverted.pw-mol-button-inform {
    background-color: transparent;
    border-color: #7b8cf6;
    color: #7b8cf6
}

.type-inverted.pw-mol-button-inform:hover,
.type-inverted.pw-mol-button-inform:focus {
    border-color: #b2bcfb;
    color: #7b8cf6
}

.type-inverted.pw-mol-button-inform:active {
    border-color: #7b8cf6;
    background-color: #7b8cf6;
    color: white
}

.pw-mol-button-attention,
.pw-org-delete-button {
    border-color: transparent;
    background-color: white;
    color: #ff6a58
}

.pw-mol-button-attention:hover,
.pw-org-delete-button:hover,
.pw-mol-button-attention:focus,
.pw-org-delete-button:focus {
    background-color: #f1f1f3;
    color: #ff6a58
}

.pw-mol-button-attention:active,
.pw-org-delete-button:active {
    background-color: #ff9180;
    color: white
}

.type-inverted.pw-mol-button-attention,
.type-inverted.pw-org-delete-button {
    background-color: transparent;
    border-color: white;
    color: white
}

.type-inverted.pw-mol-button-attention:hover,
.type-inverted.pw-org-delete-button:hover,
.type-inverted.pw-mol-button-attention:focus,
.type-inverted.pw-org-delete-button:focus {
    border-color: #f1f1f3;
    color: white
}

.type-inverted.pw-mol-button-attention:active,
.type-inverted.pw-org-delete-button:active {
    border-color: #ff9180;
    background-color: #ff9180;
    color: white
}

.pw-mol-button-warn {
    border-color: transparent;
    background-color: #b89d51;
    color: white
}

.pw-mol-button-warn:hover,
.pw-mol-button-warn:focus {
    background-color: #d4b941;
    color: white
}

.pw-mol-button-warn:active {
    background-color: #f1d531;
    color: white
}

.type-inverted.pw-mol-button-warn {
    background-color: transparent;
    border-color: #b89d51;
    color: #b89d51
}

.type-inverted.pw-mol-button-warn:hover,
.type-inverted.pw-mol-button-warn:focus {
    border-color: #d4b941;
    color: #d4b941
}

.type-inverted.pw-mol-button-warn:active {
    border-color: #f1d531;
    background-color: #f1d531;
    color: white
}

.pw-mol-button-success {
    border-color: transparent;
    background-color: #1cbf61;
    color: white
}

.pw-mol-button-success:hover,
.pw-mol-button-success:focus {
    background-color: #56d58e;
    color: white
}

.pw-mol-button-success:active {
    background-color: #099e49;
    color: white
}

.type-inverted.pw-mol-button-success {
    background-color: transparent;
    border-color: #1cbf61;
    color: #1cbf61
}

.type-inverted.pw-mol-button-success:hover,
.type-inverted.pw-mol-button-success:focus {
    border-color: #56d58e;
    color: #56d58e
}

.type-inverted.pw-mol-button-success:active {
    border-color: #099e49;
    background-color: #099e49;
    color: white
}

.pw-org-create-new-page-button svg {
    width: 17px;
    height: 17px
}

.pw-org-delete-text-button.type-icon-only .s-text {
    display: none
}

.pw-org-delete-button.is-deleting {
    pointer-events: none;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSIjZmY2YTU4Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg==);
    background-repeat: no-repeat;
    background-position: 50% 50%
}

.pw-org-delete-button.is-deleting .s-text {
    visibility: hidden
}

.pw-org-delete-button.type-inverted.is-deleting {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiBoZWlnaHQ9IjMyIiBmaWxsPSJncmF5Ij4NCiAgPGNpcmNsZSB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMCINCiAgICAgIGtleXRpbWVzPSIwOzAuMjswLjc7MSIga2V5U3BsaW5lcz0iMC4yIDAuMiAwLjQgMC44OzAuMiAwLjYgMC40IDAuODswLjIgMC42IDAuNCAwLjgiIGNhbGNNb2RlPSJzcGxpbmUiIC8+DQogIDwvY2lyY2xlPg0KICA8Y2lyY2xlIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDApIiBjeD0iMCIgY3k9IjE2IiByPSIwIj4gDQogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgdmFsdWVzPSIwOyA0OyAwOyAwIiBkdXI9IjEuMnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC4zIg0KICAgICAga2V5dGltZXM9IjA7MC4yOzAuNzsxIiBrZXlTcGxpbmVzPSIwLjIgMC4yIDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44OzAuMiAwLjYgMC40IDAuOCIgY2FsY01vZGU9InNwbGluZSIgLz4NCiAgPC9jaXJjbGU+DQogIDxjaXJjbGUgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQgMCkiIGN4PSIwIiBjeT0iMTYiIHI9IjAiPiANCiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiB2YWx1ZXM9IjA7IDQ7IDA7IDAiIGR1cj0iMS4ycyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjYiDQogICAgICBrZXl0aW1lcz0iMDswLjI7MC43OzEiIGtleVNwbGluZXM9IjAuMiAwLjIgMC40IDAuODswLjIgMC42IDAuNCAwLjg7MC4yIDAuNiAwLjQgMC44IiBjYWxjTW9kZT0ic3BsaW5lIiAvPg0KICA8L2NpcmNsZT4NCjwvc3ZnPg0KDQo=)
}

.pw-mol-share-text-button {
    color: #797a80;
    fill: #797a80
}

.pw-mol-share-text-button svg {
    margin-left: 0;
    margin-right: .35em
}

.pw-mol-share-text-button:hover,
.pw-mol-share-text-button:focus {
    color: #262a33;
    fill: #262a33
}

.pw-mol-share-text-button:active {
    color: #262a33;
    fill: #262a33
}

.pw-mol-share-on-twitter-button {
    color: #797a80;
    fill: #797a80
}

.pw-mol-share-on-twitter-button svg {
    margin-left: 0;
    margin-right: .35em
}

.pw-mol-share-on-twitter-button:hover,
.pw-mol-share-on-twitter-button:focus {
    color: #262a33;
    fill: #262a33
}

.pw-mol-share-on-twitter-button:active {
    color: #262a33;
    fill: #262a33
}

.pw-org-toggle-private-text-button .s-icon,
.pw-org-toggle-private-text-button .s-text-public,
.pw-org-toggle-private-text-button .s-text-private {
    vertical-align: middle
}

.pw-org-toggle-private-text-button .s-text-private,
.pw-org-toggle-private-text-button .s-icon-private {
    display: none
}

.pw-org-toggle-private-text-button.is-private .s-text-public,
.pw-org-toggle-private-text-button.is-private .s-icon-public {
    display: none
}

.pw-org-toggle-private-text-button.is-private .s-text-private,
.pw-org-toggle-private-text-button.is-private .s-icon-private {
    display: inline
}

.pw-org-toggle-private-text-button.type-text-on-hover .s-text {
    display: none
}

.pw-org-toggle-private-text-button.type-text-on-hover:hover .s-text {
    display: inline
}

.pw-org-like-text-button .s-like-text {
    display: none
}

.pw-org-like-text-button .s-like-count {
    display: inline
}

.pw-org-like-text-button:hover .s-like-text,
.pw-org-like-text-button:focus .s-like-text {
    display: inline
}

.pw-org-like-text-button:hover .s-like-count,
.pw-org-like-text-button:focus .s-like-count {
    display: none
}

.pw-org-like-text-button.is-liked {
    fill: #ff9180
}

.pw-org-like-text-button.is-liked .s-like-text {
    display: none
}

.pw-org-like-text-button.is-liked .s-like-count {
    display: inline
}

.pw-org-twin-text-button .s-twin-text {
    display: none
}

.pw-org-twin-text-button .s-twin-count {
    display: inline
}

.pw-org-twin-text-button:hover .s-twin-text,
.pw-org-twin-text-button:focus .s-twin-text {
    display: inline
}

.pw-org-twin-text-button:hover .s-twin-count,
.pw-org-twin-text-button:focus .s-twin-count {
    display: none
}

.pw-org-twin-button.is-beta.type-inverted .s-twin-icon:before {
    background-image: url("data:image/png;base64, ")
}

.pw-org-twin-button .s-twin-icon {
    position: relative
}

.pw-org-twin-button .s-twin-icon svg {
    height: 16px
}

.pw-org-twin-button .s-twin-icon:before {
    visibility: hidden;
    content: "";
    position: absolute;
    top: 50%;
    left: -2px;
    width: 35px;
    height: 16px;
    margin-top: -8px;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64, );
    background-size: 700px;
    background-position: 0 0
}

.pw-org-twin-button:hover .s-twin-icon {
    visibility: hidden
}

.pw-org-twin-button:hover .s-twin-icon:before {
    visibility: visible;
    -webkit-transition: background .6s steps(19, end);
    transition: background .6s steps(19, end);
    background-position: -665px 0
}

.pw-org-twin-button.type-inverted .s-twin-icon:before {
    background-image: url(data:image/png;base64, )
}

.pw-org-follow-button {
    position: relative
}

.pw-org-follow-button .s-icon {
    display: none;
    width: 18px;
    height: 18px;
    position: relative;
    vertical-align: middle;
    margin-right: 7px
}

.pw-org-follow-button:not(.type-without-icon).is-following .s-icon {
    display: inline-block;
    position: absolute;
    left: .875rem;
    top: 50%;
    margin-top: -9px
}

.pw-org-follow-button:not(.type-without-icon).is-following .s-text {
    margin-left: 25px
}

.pw-org-follow-button.type-without-icon .s-icon {
    display: none
}

.pw-org-follow-button .s-line-1,
.pw-org-follow-button .s-line-2 {
    -webkit-transition: all .15s ease;
    transition: all .15s ease;
    position: absolute;
    background-color: white
}

.pw-org-follow-button .s-line-1 {
    width: 100%;
    height: 1px;
    top: 50%;
    left: 0
}

.pw-org-follow-button .s-line-2 {
    width: 1px;
    height: 100%;
    top: 0;
    left: 50%
}

.pw-org-follow-button .s-text {
    vertical-align: middle;
    display: inline-block
}

.pw-org-follow-button .s-text-following,
.pw-org-follow-button .s-text-unfollow {
    display: none
}

.pw-org-follow-button.is-hover-frozen:hover {
    background-color: #1cbf61
}

.pw-org-follow-button.is-following {
    background-color: transparent;
    border: 1px solid #1cbf61;
    color: #1cbf61
}

.pw-org-follow-button.is-following .s-line-1,
.pw-org-follow-button.is-following .s-line-2 {
    background-color: #1cbf61
}

.pw-org-follow-button.is-following .s-line-1 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 60%;
    top: 65%;
    left: 0
}

.pw-org-follow-button.is-following .s-line-2 {
    -webkit-transform: rotate(27deg);
    transform: rotate(27deg);
    height: 90%;
    top: 4%;
    left: 70%
}

.pw-org-follow-button.is-following .s-text-following {
    display: inline-block
}

.pw-org-follow-button.is-following .s-text-follow,
.pw-org-follow-button.is-following .s-text-unfollow {
    display: none
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):hover,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus {
    background-color: transparent;
    border-color: #ff9180;
    color: #ff9180
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):hover .s-text-following,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus .s-text-following {
    display: none
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):hover .s-text-unfollow,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus .s-text-unfollow {
    display: inline-block
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):hover .s-line-1,
.pw-org-follow-button.is-following:not(.is-hover-frozen):hover .s-line-2,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus .s-line-1,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus .s-line-2 {
    background-color: #ff9180
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):hover .s-line-1,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus .s-line-1 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 125%;
    top: 50%;
    left: -11%
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):hover .s-line-2,
.pw-org-follow-button.is-following:not(.is-hover-frozen):focus .s-line-2 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    height: 125%;
    top: -12%;
    left: 50%
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):active {
    background-color: #ff9180;
    border-color: #ff9180;
    color: white
}

.pw-org-follow-button.is-following:not(.is-hover-frozen):active .s-line-1,
.pw-org-follow-button.is-following:not(.is-hover-frozen):active .s-line-2 {
    background-color: white
}

.pw-org-follow-button.is-following.is-hover-frozen:hover,
.pw-org-follow-button.is-following.is-hover-frozen:focus {
    background-color: transparent;
    color: #1cbf61
}

.pw-mol-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-transition: color .15s, background-color .15s, border-color .15s;
    transition: color .15s, background-color .15s, border-color .15s;
    font-size: .875rem;
    font-weight: 400;
    line-height: 2.714;
    border-radius: 4px;
    border: 1px solid #e1e2e8;
    color: #262a33;
    background-color: white;
    padding: 0 .875rem
}

.pw-mol-input:focus {
    border-color: #bcbdc0
}

.type-full-width.pw-mol-input {
    width: 100%
}

.is-invalid.pw-mol-input {
    border-color: #ff9180
}

.is-invalid.pw-mol-input:hover {
    border-color: #ff6a58
}

select.pw-mol-input {
    background-size: 10px 10px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160"><path d="M5 22h150L80 125z" fill="#797a80"/></svg>');
    background-repeat: no-repeat;
    background-position: 94% 50%;
    padding-right: 12%
}

#flash-messages {
    position: fixed;
    z-index: 2147483649;
    top: 97px;
    left: 34px;
    width: calc(100% - 34px - 280px);
    height: 0;
    transition: top .25s ease
}

body.simple-mode #flash-messages {
    top: 65px
}

.pw-org-flash-message {
    font-size: .875rem;
    line-height: 1.4;
    text-align: center;
    margin: 0 0 10px;
    transition: margin-top .2s linear .1s;
    float: left;
    clear: both;
    max-width: 95%;
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.pw-org-flash-message input,
.pw-org-flash-message button {
    font-family: inherit
}

.pw-org-flash-message .s-flash-message-content {
    background: #FAFAFF;
    color: #7b8cf6;
    border-radius: 4px;
    padding: 20px 40px;
    max-width: 580px;
    margin: 0 auto;
    box-shadow: 1px 3px 6px rgba(38, 42, 51, 0.1);
    -webkit-animation: scale-up .1s ease-out 1;
    animation: scale-up .1s ease-out 1;
    border: 1px solid #C3C8EA;
}

.pw-org-flash-message .s-actions {
    margin: 14px 0 0
}

.pw-org-flash-message .s-action-button {
    margin: 0 5px
}

.pw-org-flash-message .s-action-button:first-child {
    margin-left: 0
}

.pw-org-flash-message .s-action-button:last-child {
    margin-right: 0
}

.pw-org-flash-message.type-with-actions {
    min-width: 350px
}

.pw-org-flash-message.type-with-actions .s-flash-message-content {
    padding: 40px 40px
}

.pw-org-flash-message.type-actions-on-right {
    min-width: 0
}

.pw-org-flash-message.type-actions-on-right .s-flash-message-content {
    display: -webkit-flex;
    display: flex;
    padding: 20px 40px
}

.pw-org-flash-message.type-actions-on-right .s-text {
    display: -webkit-flex;
    display: flex;
    -webkit-flex: 1;
    flex: 1;
    -webkit-align-items: center;
    align-items: center;
    margin-right: 40px;
    text-align: left
}

.pw-org-flash-message.type-actions-on-right .s-actions {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    min-width: 100px;
    padding-left: 40px;
    margin: 0;
    border-left: 1px solid #7b8cf6
}

.pw-org-flash-message.type-actions-on-right .s-action-button {
    margin-top: 5px;
    margin-bottom: 5px
}

.pw-org-flash-message.type-actions-on-right .s-action-button:first-child {
    margin-top: 0
}

.pw-org-flash-message.type-actions-on-right .s-action-button:last-child {
    margin-bottom: 0
}

.pw-org-flash-message.type-actions-on-right.type-attention .s-actions {
    border-color: white
}

.pw-org-flash-message.type-actions-on-right.type-success .s-actions {
    border-color: #1cbf61
}

.pw-org-flash-message.type-actions-on-right.type-warn .s-actions {
    border-color: #b89d51
}

.pw-org-flash-message.type-attention .s-flash-message-content {
    background: #ff6a58;
    color: white
}

.pw-org-flash-message.type-success .s-flash-message-content {
    background: #c8f5df;
    color: #1cbf61
}

.pw-org-flash-message.type-warn .s-flash-message-content {
    background: #fff5cf;
    color: #b89d51
}

.pw-org-flash-message.type-disable-transition .s-flash-message-content {
    -webkit-animation: none;
    animation: none
}

.pw-org-flash-message.is-fadeout:not(.type-disable-transition) {
    margin-top: -100px;
    -webkit-animation: fadeOut .2s both;
    animation: fadeOut .2s both
}

.pw-org-unsuported-browser-modal,
.pw-org-new-page-modal,
.pw-org-upgrade-plan-modal,
.pw-org-feature-banner-modal,
.pw-org-edit-billing-details-modal,
.pw-org-video-popup {
    position: fixed;
    z-index: 10001;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    margin: auto;
    font-size: .875rem;
    line-height: 1.4
}

.pw-org-unsuported-browser-modal input,
.pw-org-new-page-modal input,
.pw-org-upgrade-plan-modal input,
.pw-org-feature-banner-modal input,
.pw-org-edit-billing-details-modal input,
.pw-org-video-popup input,
.pw-org-unsuported-browser-modal button,
.pw-org-new-page-modal button,
.pw-org-upgrade-plan-modal button,
.pw-org-feature-banner-modal button,
.pw-org-edit-billing-details-modal button,
.pw-org-video-popup button {
    font-family: inherit
}

.pw-org-unsuported-browser-modal>.s-modal-inner,
.pw-org-new-page-modal>.s-modal-inner,
.pw-org-upgrade-plan-modal>.s-modal-inner,
.pw-org-feature-banner-modal>.s-modal-inner,
.pw-org-edit-billing-details-modal>.s-modal-inner,
.pw-org-video-popup>.s-modal-inner {
    position: relative;
    margin: 70px auto 20px;
    width: 90%;
    max-width: 660px;
    min-width: 660px;
    background: white;
    border-radius: 4px;
    padding: 40px 60px;
    text-align: center;
    box-shadow: 1px 3px 6px rgba(38, 42, 51, 0.1)
}

.pw-org-unsuported-browser-modal>.s-modal-inner:not(.type-no-animation),
.pw-org-new-page-modal>.s-modal-inner:not(.type-no-animation),
.pw-org-upgrade-plan-modal>.s-modal-inner:not(.type-no-animation),
.pw-org-feature-banner-modal>.s-modal-inner:not(.type-no-animation),
.pw-org-edit-billing-details-modal>.s-modal-inner:not(.type-no-animation),
.pw-org-video-popup>.s-modal-inner:not(.type-no-animation) {
    -webkit-animation: scale-up .1s ease-out 1;
    animation: scale-up .1s ease-out 1
}

.pw-org-unsuported-browser-modal .s-close,
.pw-org-new-page-modal .s-close,
.pw-org-upgrade-plan-modal .s-close,
.pw-org-feature-banner-modal .s-close,
.pw-org-edit-billing-details-modal .s-close,
.pw-org-video-popup .s-close {
    display: inline-block;
    position: absolute;
    top: 10px;
    right: 10px;
    border: 0;
    text-align: center;
    padding: 5px;
    margin: 0;
    cursor: pointer;
    fill: #bcbdc0;
    transition: fill .2s ease
}

.pw-org-unsuported-browser-modal .s-close svg,
.pw-org-new-page-modal .s-close svg,
.pw-org-upgrade-plan-modal .s-close svg,
.pw-org-feature-banner-modal .s-close svg,
.pw-org-edit-billing-details-modal .s-close svg,
.pw-org-video-popup .s-close svg {
    fill: inherit;
    vertical-align: middle
}

.pw-org-unsuported-browser-modal .s-close:hover,
.pw-org-new-page-modal .s-close:hover,
.pw-org-upgrade-plan-modal .s-close:hover,
.pw-org-feature-banner-modal .s-close:hover,
.pw-org-edit-billing-details-modal .s-close:hover,
.pw-org-video-popup .s-close:hover,
.pw-org-unsuported-browser-modal .s-close:focus,
.pw-org-new-page-modal .s-close:focus,
.pw-org-upgrade-plan-modal .s-close:focus,
.pw-org-feature-banner-modal .s-close:focus,
.pw-org-edit-billing-details-modal .s-close:focus,
.pw-org-video-popup .s-close:focus {
    fill: #797a80
}

.pw-org-unsuported-browser-modal .s-close:active,
.pw-org-new-page-modal .s-close:active,
.pw-org-upgrade-plan-modal .s-close:active,
.pw-org-feature-banner-modal .s-close:active,
.pw-org-edit-billing-details-modal .s-close:active,
.pw-org-video-popup .s-close:active {
    fill: #262a33
}

.pw-org-unsuported-browser-modal h1,
.pw-org-new-page-modal h1,
.pw-org-upgrade-plan-modal h1,
.pw-org-feature-banner-modal h1,
.pw-org-edit-billing-details-modal h1,
.pw-org-video-popup h1 {
    font-size: 2.6875rem;
    font-weight: 400;
    line-height: 1.2;
    margin: 0 auto 30px
}

.pw-org-unsuported-browser-modal h2,
.pw-org-new-page-modal h2,
.pw-org-upgrade-plan-modal h2,
.pw-org-feature-banner-modal h2,
.pw-org-edit-billing-details-modal h2,
.pw-org-video-popup h2 {
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.2
}

.pw-org-unsuported-browser-modal .s-description,
.pw-org-new-page-modal .s-description,
.pw-org-upgrade-plan-modal .s-description,
.pw-org-feature-banner-modal .s-description,
.pw-org-edit-billing-details-modal .s-description,
.pw-org-video-popup .s-description {
    color: #bcbdc0
}

.pw-mol-modal-overlay {
    position: fixed;
    z-index: 10000;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(225, 226, 232, 0.95)
}

.pw-org-unsuported-browser-modal>.s-modal-inner {
    max-width: 510px;
    min-width: 0;
    padding: 30px 40px
}

.pw-org-unsuported-browser-modal img {
    margin: 0 0 10px
}

.pw-org-unsuported-browser-modal img+div {
    overflow: hidden
}

.pw-org-unsuported-browser-modal h1 {
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.75rem;
    margin: 5px 0 0;
    padding: 0
}

.pw-org-unsuported-browser-modal p {
    font-size: .75rem;
    line-height: 1rem;
    margin: 17px 0 0;
    padding-left: 0
}

.pw-org-unsuported-browser-modal a {
    color: #262a33
}

.pw-org-unsuported-browser-modal a:hover,
.pw-org-unsuported-browser-modal a:focus {
    color: #bcbdc0
}

.pw-org-unsuported-browser-modal a:active {
    color: #bcbdc0
}

.pw-org-new-page-modal .s-title-container {
    margin: 30px 0 16px
}

.pw-org-new-page-modal .s-title-error {
    margin-bottom: 16px;
    color: #ff9180
}

.pw-org-new-page-modal .s-title-input {
    width: 100%;
    height: 48px;
    border: 1px solid #e1e2e8;
    border-radius: 4px;
    line-height: 3rem;
    font-size: 1.25rem;
    color: #262a33;
    padding: 0 .875rem
}

.pw-org-new-page-modal .s-options {
    text-align: left;
    margin: 14px 0
}

.pw-org-new-page-modal .s-buttons {
    margin: 14px 0 0
}

.pw-org-new-page-modal .s-cancel-button,
.pw-org-new-page-modal .s-submit-button {
    margin: 5px 10px
}

.pw-org-new-page-modal .s-loading {
    display: none
}

.pw-org-new-page-modal.is-loading-screen .s-close {
    display: none
}

.pw-org-upgrade-plan-modal h1 {
    margin: 0 auto
}

.pw-org-upgrade-plan-modal h2 {
    color: #bcbdc0;
    margin: 15px auto
}

.pw-org-upgrade-plan-modal .s-plans-container {
    margin: 40px 0
}

.pw-org-upgrade-plan-modal .s-plans-container:after {
    content: "";
    display: table;
    clear: both
}

.pw-org-upgrade-plan-modal .s-all-plans-link {
    display: inline-block;
    margin-top: 10px;
    text-decoration: none;
    color: #bcbdc0
}

.pw-org-upgrade-plan-modal .s-all-plans-link:hover,
.pw-org-upgrade-plan-modal .s-all-plans-link:focus {
    color: #797a80
}

.pw-org-upgrade-plan-modal .s-all-plans-link:active {
    color: #262a33
}

.pw-org-upgrade-popup-plan {
    text-align: center;
    font-size: .875rem
}

.pw-org-upgrade-popup-plan .s-plan-title {
    text-transform: uppercase;
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: .1em;
    margin: 0 0 .5em
}

.pw-org-upgrade-popup-plan .s-plan-price {
    color: #1cbf61;
    position: relative;
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.pw-org-upgrade-popup-plan .s-plan-price-currency,
.pw-org-upgrade-popup-plan .s-plan-price-period {
    position: absolute;
    display: inline-block;
    width: 100%;
    font-weight: 500;
    line-height: 1
}

.pw-org-upgrade-popup-plan .s-plan-price-price {
    font-size: 8.125rem;
    line-height: 1;
    font-weight: 200;
    letter-spacing: -0.075em;
    padding-right: .075em
}

.pw-org-upgrade-popup-plan .s-plan-price-currency {
    top: 0;
    right: 100%;
    text-align: right;
    margin-top: 1em
}

.pw-org-upgrade-popup-plan .s-plan-price-period {
    bottom: 0;
    left: 100%;
    text-align: left;
    margin-bottom: 1.3em;
    margin-left: -0.60938rem
}

.pw-org-upgrade-popup-plan .s-plan-subline {
    color: #797a80
}

.pw-org-upgrade-popup-plan .s-included-features {
    color: #bcbdc0;
    line-height: 1.5;
    margin: 20px 0 0;
    padding: 20px 0 0;
    border-top: 1px solid #e1e2e8
}

.pw-org-feature-banner-modal>.s-modal-inner {
    background: transparent;
    box-shadow: none;
    max-width: 465px;
    min-width: 465px
}

.pw-org-feature-banner-modal>.s-modal-inner img {
    border-radius: 4px
}

.pw-org-feature-banner-modal .s-close {
    top: 35px;
    right: 20px;
    fill: #797a80
}

.pw-org-feature-banner-modal button {
    margin-top: 20px
}

.pw-org-feature-banner-modal.has-embed-video>.s-modal-inner {
    max-width: 620px;
    min-width: 620px
}

body.pw-modal-popup-is-open {
    overflow: hidden
}

.pw-org-edit-billing-details-modal h1 {
    margin: 0 auto
}

.pw-org-edit-billing-details-modal h2 {
    color: #bcbdc0;
    margin: 15px auto
}

.pw-org-edit-billing-details-modal h3 {
    margin: 30px 0 15px
}

.pw-org-edit-billing-details-modal .s-address-fields,
.pw-org-edit-billing-details-modal .s-card-fields {
    margin: 0 auto;
    max-width: 450px
}

.pw-org-edit-billing-details-modal .s-row {
    margin: 0 -5px;
    text-align: left
}

.pw-org-edit-billing-details-modal .s-row:after {
    content: "";
    display: table;
    clear: both
}

.pw-org-edit-billing-details-modal .s-col {
    padding: 5px
}

.pw-org-edit-billing-details-modal .s-col-6 {
    width: 50%;
    float: left
}

.pw-org-edit-billing-details-modal input[name="expiration_month"],
.pw-org-edit-billing-details-modal input[name="expiration_year"],
.pw-org-edit-billing-details-modal input[name="cvv"] {
    width: 30%
}

.pw-org-edit-billing-details-modal .s-error-messages {
    margin: 30px 0;
    color: #ff6a58
}

.pw-org-edit-billing-details-modal .s-buttons {
    margin: 40px 0 0
}

.pw-org-edit-billing-details-modal button {
    margin: 0 5px
}

.pw-org-edit-billing-details-modal fieldset {
    border: 0;
    margin: 0;
    padding: 0
}

.pw-org-video-popup>.s-modal-inner {
    text-align: left;
    max-width: 1000px;
    min-width: 600px
}

.pw-org-video-popup h2 {
    margin-top: 20px
}

.pw-mol-toggle {
    position: absolute;
    margin-left: -9999px;
    visibility: hidden
}

.pw-mol-toggle+label {
    display: inline-block;
    outline: none;
    margin: 0!important;
    line-height: 1.375rem;
    color: #797a80
}

.pw-mol-toggle+label>.s-label-text {
    vertical-align: middle
}

.pw-mol-toggle+label>.s-toggle {
    display: inline-block;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    margin-top: -0.2em;
    margin-right: 12px;
    width: 2.25rem;
    height: 1.375rem;
    background-color: #e1e2e8;
    border-radius: 1.375rem;
    transition: background-color .2s, border-color .2s
}

.pw-mol-toggle+label>.s-toggle:after {
    display: block;
    position: absolute;
    content: ""
}

.pw-mol-toggle+label>.s-toggle:after {
    top: 50%;
    left: .25rem;
    margin-top: -0.4375rem;
    width: .875rem;
    height: .875rem;
    background-color: white;
    border-radius: .4375rem;
    transition: left .2s, background-color .2s, border-color .2s
}

.pw-mol-toggle+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle+label:not([disabled]):focus>.s-toggle {
    background-color: #bcbdc0
}

.pw-mol-toggle+label:not([disabled]):active>.s-toggle {
    background-color: #797a80
}

.pw-mol-toggle:checked+label>.s-toggle {
    background-color: #1cbf61
}

.pw-mol-toggle:checked+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle:checked+label:not([disabled]):focus>.s-toggle {
    background-color: #56d58e
}

.pw-mol-toggle:checked+label:not([disabled]):active>.s-toggle {
    background-color: #099e49
}

.pw-mol-toggle:checked+label>.s-toggle:after {
    left: 1.125rem
}

.pw-mol-toggle.type-attention+label {
    color: white
}

.pw-mol-toggle.type-attention+label>.s-toggle {
    background-color: #ff6a58;
    border: 1px solid white
}

.pw-mol-toggle.type-attention+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-attention+label:not([disabled]):focus>.s-toggle {
    border-color: #fde3df
}

.pw-mol-toggle.type-attention+label:not([disabled]):active>.s-toggle {
    border-color: white
}

.pw-mol-toggle.type-attention+label>.s-toggle:after {
    background-color: white
}

.pw-mol-toggle.type-attention+label:not([disabled]):hover>.s-toggle:after,
.pw-mol-toggle.type-attention+label:not([disabled]):focus>.s-toggle:after {
    background-color: #fde3df
}

.pw-mol-toggle.type-attention+label:not([disabled]):active>.s-toggle:after {
    background-color: white
}

.pw-mol-toggle.type-attention:checked+label>.s-toggle {
    background-color: white;
    border-color: transparent
}

.pw-mol-toggle.type-attention:checked+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-attention:checked+label:not([disabled]):focus>.s-toggle {
    background-color: #fde3df
}

.pw-mol-toggle.type-attention:checked+label:not([disabled]):active>.s-toggle {
    background-color: white
}

.pw-mol-toggle.type-attention:checked+label>.s-toggle:after {
    background-color: #ff6a58
}

.pw-mol-toggle.type-warn+label {
    color: #b89d51
}

.pw-mol-toggle.type-warn+label>.s-toggle {
    background-color: #fff5cf;
    border: 1px solid #b89d51
}

.pw-mol-toggle.type-warn+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-warn+label:not([disabled]):focus>.s-toggle {
    border-color: #d4b941
}

.pw-mol-toggle.type-warn+label:not([disabled]):active>.s-toggle {
    border-color: #f1d531
}

.pw-mol-toggle.type-warn+label>.s-toggle:after {
    background-color: #b89d51
}

.pw-mol-toggle.type-warn+label:not([disabled]):hover>.s-toggle:after,
.pw-mol-toggle.type-warn+label:not([disabled]):focus>.s-toggle:after {
    background-color: #d4b941
}

.pw-mol-toggle.type-warn+label:not([disabled]):active>.s-toggle:after {
    background-color: #f1d531
}

.pw-mol-toggle.type-warn:checked+label>.s-toggle {
    background-color: #b89d51;
    border-color: transparent
}

.pw-mol-toggle.type-warn:checked+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-warn:checked+label:not([disabled]):focus>.s-toggle {
    background-color: #d4b941
}

.pw-mol-toggle.type-warn:checked+label:not([disabled]):active>.s-toggle {
    background-color: #f1d531
}

.pw-mol-toggle.type-warn:checked+label>.s-toggle:after {
    background-color: #fff5cf
}

.pw-mol-toggle.type-success+label {
    color: #1cbf61
}

.pw-mol-toggle.type-success+label>.s-toggle {
    background-color: #c8f5df;
    border: 1px solid #1cbf61
}

.pw-mol-toggle.type-success+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-success+label:not([disabled]):focus>.s-toggle {
    border-color: #56d58e
}

.pw-mol-toggle.type-success+label:not([disabled]):active>.s-toggle {
    border-color: #099e49
}

.pw-mol-toggle.type-success+label>.s-toggle:after {
    background-color: #1cbf61
}

.pw-mol-toggle.type-success+label:not([disabled]):hover>.s-toggle:after,
.pw-mol-toggle.type-success+label:not([disabled]):focus>.s-toggle:after {
    background-color: #56d58e
}

.pw-mol-toggle.type-success+label:not([disabled]):active>.s-toggle:after {
    background-color: #099e49
}

.pw-mol-toggle.type-success:checked+label>.s-toggle {
    background-color: #1cbf61;
    border-color: transparent
}

.pw-mol-toggle.type-success:checked+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-success:checked+label:not([disabled]):focus>.s-toggle {
    background-color: #56d58e
}

.pw-mol-toggle.type-success:checked+label:not([disabled]):active>.s-toggle {
    background-color: #099e49
}

.pw-mol-toggle.type-success:checked+label>.s-toggle:after {
    background-color: #c8f5df
}

.pw-mol-toggle.type-inform+label {
    color: #7b8cf6
}

.pw-mol-toggle.type-inform+label>.s-toggle {
    background-color: #e9ecff;
    border: 1px solid #7b8cf6
}

.pw-mol-toggle.type-inform+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-inform+label:not([disabled]):focus>.s-toggle {
    border-color: #b2bcfb
}

.pw-mol-toggle.type-inform+label:not([disabled]):active>.s-toggle {
    border-color: #2c21ac
}

.pw-mol-toggle.type-inform+label>.s-toggle:after {
    background-color: #7b8cf6
}

.pw-mol-toggle.type-inform+label:not([disabled]):hover>.s-toggle:after,
.pw-mol-toggle.type-inform+label:not([disabled]):focus>.s-toggle:after {
    background-color: #b2bcfb
}

.pw-mol-toggle.type-inform+label:not([disabled]):active>.s-toggle:after {
    background-color: #2c21ac
}

.pw-mol-toggle.type-inform:checked+label>.s-toggle {
    background-color: #7b8cf6;
    border-color: transparent
}

.pw-mol-toggle.type-inform:checked+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-inform:checked+label:not([disabled]):focus>.s-toggle {
    background-color: #b2bcfb
}

.pw-mol-toggle.type-inform:checked+label:not([disabled]):active>.s-toggle {
    background-color: #2c21ac
}

.pw-mol-toggle.type-inform:checked+label>.s-toggle:after {
    background-color: #e9ecff
}

.pw-mol-toggle.type-beta:checked+label>.s-toggle {
    background-color: #35a6de
}

.pw-mol-toggle.type-beta:checked+label:not([disabled]):hover>.s-toggle,
.pw-mol-toggle.type-beta:checked+label:not([disabled]):focus>.s-toggle {
    background-color: #49b0e2
}

.pw-mol-toggle.type-beta:checked+label:not([disabled]):active>.s-toggle {
    background-color: #1e9ddc
}

.pw-mol-toggle.type-small+label {
    line-height: 1.125rem
}

.pw-mol-toggle.type-small+label>.s-toggle {
    width: 1.875rem;
    height: 1.125rem;
    border-radius: 1.125rem
}

.pw-mol-toggle.type-small+label>.s-toggle:after {
    left: .1875rem;
    margin-top: -0.375rem;
    width: .75rem;
    height: .75rem;
    border-radius: .375rem
}

.pw-mol-toggle.type-small:checked+label>.s-toggle:after {
    left: .9375rem
}

.animate-spin {
    -webkit-animation: spin 2s infinite linear;
    animation: spin 2s infinite linear;
    display: inline-block
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.animate-flip {
    -webkit-animation: flip .2s linear -0.1s infinite;
    animation: flip .2s linear -0.1s infinite
}

@-webkit-keyframes flip {
    0% {
        -webkit-transform: rotateY(-90deg);
        transform: rotateY(-90deg)
    }
    100% {
        -webkit-transform: rotateY(89deg);
        transform: rotateY(89deg)
    }
}

@keyframes flip {
    0% {
        -webkit-transform: rotateY(-90deg);
        transform: rotateY(-90deg)
    }
    100% {
        -webkit-transform: rotateY(89deg);
        transform: rotateY(89deg)
    }
}

.animate-shake {
    -webkit-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes shake {
    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

@keyframes shake {
    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        -ms-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        -ms-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}

.animate-mild-shake {
    -webkit-animation: mild-shake .5s linear 1;
    animation: mild-shake .5s linear 1
}

@-webkit-keyframes mild-shake {
    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
}

@keyframes mild-shake {
    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
}

.fadeOut {
    -webkit-animation: fadeOut 1s both;
    animation: fadeOut 1s both;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.animate-scale-up {
    -webkit-animation: scale-up .1s ease-out 1;
    animation: scale-up .1s ease-out 1
}

@-webkit-keyframes scale-up {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes scale-up {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.95);
        transform: scale(0.95)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.animate-flash {
    -webkit-animation: flash .5s ease both 5;
    animation: flash .5s ease both 5
}

@-webkit-keyframes flash {
    0%,
    100% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
}

@keyframes flash {
    0%,
    100% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
}


/*加的控件*/

.library-panel-pin {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #ccc;
    cursor: pointer;
}

.library-panel-pin:hover {
    color: #7DC2FF;
}

.library-panel-pin.pinned {
    color: #3196F4;
    text-shadow: 1px 1px 0px #fff;
}


/*隐藏一些功能*/

.field-b-page-google-analytics-id {
    display: none;
}

#pw-widget-library ul.tabs li[data-tab-name="favorites"] {
    display: none;
}

.b-panel-tabs li[data-tab-name="view"] {
    display: none;
}

#b-top-bar-actions .actions-list-item.action-publish-list-item,
#b-top-bar-actions .actions-list-item.action-export-list-item {
    display: none;
}

#pw-top-bar-user {
    display: none;
}

#b-top-bar .submenu .actions li.separated {
    display: none;
}

.field-undefined_hideFooter {
    display: none;
}

#b-panel-widget-flexbox-styles {
    display: none;
}

#b-top-bar .submenu .actions li button.js-create-new-project {
    display: none;
}

.pw-widget-library-tab-content .dropdown {
    display: none;
}

#pw-widget-library .pw-widget-library-tab-content .top-actions {}

#b-top-bar #pw-top-bar-title .title {
    display: none;
}

#b-panel-mode-settings {
    display: none;
}

.b-panel-resize {
    display: none;
}

#font-panel .f-font i.icon-star,
#font-panel .f-font:hover i.icon-star,
#font-panel .f-font:hover i.icon-star-empty {
    visibility: hidden;
}


/* end 隐藏一些功能*/
#z-dialog-page-attrs .modal-header{padding-bottom: 0;}
#z-dialog-page-attrs .modal-content .modal-header .modal-title {
    margin-bottom: 0;
}
.page-attr-items .b-panel {
    border: solid 1px #E9E9E9;
    box-shadow: none;
}

.page-attr-items .b-panel-pane-header {
    cursor: auto;
    border-top: none;
}

.page-attr-items .b-panel-pane-header h3 i {
    display: none;
}

.page-attr-items .page-item {
    float: left;
}

.page-attr-items .page-item-left {
    margin-right: 15px;
    width: 250px;
    height: 345px;
}
.page-attr-items .page-item-right {
    margin-right: 0;
    width: 445px;
}
.page-item-right .b-panel {
    width: 100%
}
.page-item-right .panel2 .b-panel-pane-content {
    padding: 0 10px;
}
.page-attr-items .panel2 {
    border-bottom: none;
}
.page-item-right .panel-pane-page-meta.panel2 textarea {
    height: 95px;
}
.slide-show-popup,
.data-source-popup,
.dynamic-field-popup{
    position: fixed;
    z-index: 1;
    height: 200px;
    width: 270px;
    padding: 10px;
    background: #F1F2F4;
    border: 1px solid #ccc;
    border-radius: 5px;
}
.slide-show-popup,
.data-source-popup{
    height: 210px;
}
.slide-show-popup .b-panel-pane-header,
.data-source-popup .b-panel-pane-header{
    border-top: 0 none;
}
.slide-show-popup .panel2,
.data-source-popup .panel2{
    border-bottom: 0 none;
}
.slide-show-popup .header-title,
.data-source-popup .header-title,
.dynamic-field-popup .header-title{
    line-height: 32px;
    height: 32px;
    font-size: 16px;
    font-weight: 700;
}
.dynamic-field-popup .disclaimer-wrap {
    margin: 5px 0 5px;
    color: #a184f1;
    height: 20px;
    line-height: 20px;
}

.dynamic-field-popup .disclaimer-wrap svg{
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 8px;
    margin-top: -2px;
    fill: #a184f1;
}
.dynamic-field-popup .row{
    height: 22px;
    line-height: 22px;
    margin-bottom: 2px;
}
.dynamic-field-popup .b-panel-right-field{
    width: calc(50% - 2.5px);
}
.data-editor .slide-image .b-field-file-upload{
    width: 60%;
}
.data-editor .slide-image label{
    height: 30px;
    line-height: 30px;
}
.slide-show-popup,
.data-source-popup{
    width: 320px;
    height: 300px;
    background-color: #fff;
    padding: 24px 30px;
}
.slide-show-popup{
    height: 218px;
}
.slide-show-popup .b-panel-pane-content,
.data-source-popup .b-panel-pane-content{
    padding: 0;
    background-color: #fff;
}
.slide-show-popup .header-title,
.data-source-popup .header-title{
    color: #138ef6;
    font-size: 16px;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 12px;
}

.slide-show-popup .b-panel-right-field,
.data-source-popup .b-panel-right-field{
    float: left;
    text-align: left;
    margin-top: 24px;
    width: 98%;
}

.slide-show-popup .panel2 .row,
.data-source-popup .panel2 .row {
    width: 46%;
    float: left;
    margin: 10px 4px;
    position: relative;
}

.slide-show-popup .panel2 .row label.small,
.data-source-popup .panel2 .row label.small,
.slide-show-popup .panel2 .bbf-field label.small,
.data-source-popup .panel2 .bbf-field label.small{
    font-size: 14px;
    color: #808080;
    line-height: 1.5;
    position: absolute;
    margin-left: -252px;
    width: auto;
}
.slide-show-popup .panel2 .row .label.small.articles-select-label,
.data-source-popup .panel2 .row .label.small.articles-select-label,
.slide-show-popup .panel2 .row label.small,
.data-source-popup .panel2 .row label.small {
    position: absolute;
    margin-left: -116px;
}

.slide-show-popup .panel2 .row .label.small.articles-select-label .js-articles-picker,
.data-source-popup .panel2 .row .label.small.articles-select-label .js-articles-picker{
    position: absolute;
    right: -50px;
}
.slide-show-popup .panel2 .row .label.small.articles-select-label label.small,
.data-source-popup .panel2 .row .label.small.articles-select-label label.small{
    margin-left: 0;
}

.slide-show-popup .row .pw-dropdown-selectbox,
.data-source-popup .row .pw-dropdown-selectbox{
    border: 1px solid #eee;
    border-radius: 3px;
}
.slide-show-popup .row .pw-dropdown-selectbox .pw-dropdown-selectbox-toggle.js-dropdown-toggle.small,
.data-source-popup .row .pw-dropdown-selectbox .pw-dropdown-selectbox-toggle.js-dropdown-toggle.small{
    height: 28px;
    line-height: 28px;
}
.slide-show-popup .row input[type='text'],
.data-source-popup .row input[type='text']{
    height: 30px;
    line-height: 28px;
}

/*modal 样式改造*/
.modal-content .modal-header{
    background-color: #fff;
    border-bottom: 0 none;
    position: relative;
}
.modal-content .modal-header .modal-title{
    color: #41ce8a;
    font-size: 16px;
    font-weight: 700;
    border-bottom: 1px solid #e6e6e6;
    line-height: 38px;
    height: 38px;
    margin-bottom: 5px;
}
.modal-content .modal-header .modal-close{
    color: #fff;
    border-radius: 50%;
    background-color: #41ce8a;
    float: none;
    position: absolute;
    right: 10px;
    top: 16px;
}
.modal-content .modal-footer{
    text-align: center;
    background-color: #f5f5f5;
    padding: 15px;
}
 .modal-content .modal-main{
    padding: 0 10px;
}
.upload-img-box img{
  max-width:100%!important
}
