/*
 * File: spb-style.css
 * Author: MegaDrupal
 */

/* =============================================================
    COMPONENTS

    1 - Grid
    2 - Section / wrapper
    3 - Row
    4 - Column

    2 - Icon
    3 - Row
    4 - Box
    5 - Dialog Box
    6 - Button
    7 - Input, Select, Textarea
    8 - Popup
    9 - Panel sidebar
    10 - Dialog

===============================================================*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
.md-pagebuilder *, .md-pagebuilder *:after, .md-pagebuilder *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.hide {
    display: none
}

/* Font Typography
=================================================================================================== */
.layout-name {
    font-size: 18px;
    font-weight: 700;
    line-height: 23px;
}
.region-name, .md-btn {
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
}


/* Animation CSS3
=================================================================================================== */

@-webkit-keyframes md-popup {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}
@-moz-keyframes md-popup {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}
@-ms-keyframes md-popup {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);

    }
}
@-o-keyframes md-popup {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes md-popup {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}

/* 2 - Icon Style
=================================================================================================== */

.md-icon {
    color: #FFF;
    vertical-align: middle;
}

a:hover .mdi-layout,
a.active .mdi-layout {
    background-position: -120px -130px;
}
.mdi-edit-layout {
    background-position: -150px -100px;
}
.mdi-edit-layout-white {
    background-position: -210px -100px;
}
a:hover  .mdi-edit-layout,
a.active .mdi-edit-layout  {
    background-position: -150px -130px;
}
.mdi-block {
    background-position: -60px -100px;
}
.ui-state-active .mdi-block {
    background-position: -60px -130px;
}
.mdi-field {
    background-position: -90px -100px;
}
.ui-state-active .mdi-field {
    background-position: -90px -130px;
}
.mdi-expand {
    background-position: -30px -100px;
}
.mdi-expand:hover {
    background-position: -30px -130px;
}
.show-sidebar .mdi-expand {
    background-position: -180px -100px;
}

.md-btn-border > i {
    background-position: -80px 0;
    height: 21px;
    left: 9px;
    position: absolute;
    top: 4px;
    vertical-align: middle;

    -webkit-transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -ms-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;

}

/* 2 - Section (Wrapper)
=================================================================================================== */


.mdpb-live-layout .md-section {
    padding: 30px 0;
    border-bottom: 1px solid transparent;
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;

}
.responsive .mdpb-live-layout .md-section {
    width: 90%;
}
.mdpb-live-layout .md-section.fixed-wrapper {
    width: 1170px;
    margin-left: auto;
    margin-right: auto;
}
.responsive .mdpb-live-layout .md-section.fixed-wrapper {
    width: auto;
}
/* Section tooltips*/
.mdpb-live-layout .section-tooltips {
    border-radius: 0;
    padding: 0 5px;
    bottom: -14px;
    left: 50%;
    background-color: #FF6600;
    position: absolute;
    z-index: 3;
    -webkit-transform: translate(-50%);
    -moz-transform: translate(-50%);
    -ms-transform: translate(-50%);
    -o-transform: translate(-50%);
    transform: translate(-50%);
}

.mdpb-live-layout .section-tooltips > a {
    display: inline-block;
    float: left;
    height: 30px;
    position: relative;
    font-family: "open sans";
}

.mdpb-live-content .md-section {
    background-color: #FFF;
    position: relative;
}
.mdpb-live-content.mdpb-dropable .md-section {
    margin-bottom: 20px;
}

/* These Event Handler on section / wrapper  (sordable)
HOVER / SORTALBE (move) / EDIT(background & animation) / DUPLICATION / DELETE / REFRESH(Responsive)

----------------------------------------------------------------- */

.mdpb-live-layout .md-section-wrapper .md-section.js-edit-section,
.mdpb-live-layout .md-section-wrapper .md-section {
    border-color: #FF6600;
}
.mdpb-live-layout .md-section-wrapper.responsive .md-section.js-edit-section,
.mdpb-live-layout .md-section-wrapper.responsive .md-section:hover  {
    border-color: transparent;
}

.mdpb-live-layout .section-tooltips > a {
    width: 26px;
    height: 30px;
    text-align: center;
    font-family: "open sans";
}

/*
*
EDIT (animation & background)

Adding class "color-bg" or "img-bg" or "video-bg"
custom background color or image
for section wrapper
*
*/
.mdpb-live-layout .md-section.color-bg,
.mdpb-live-content .md-section.color-bg {
    background-color: #599599;
    background-image: none;
}

.mdpb-live-layout .md-section .video-bg,
.mdpb-live-content .md-section .video-bg {
    left: 0;
    min-height: 100%;
    min-width: 100%;
    opacity: 1;
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
}

.mdpb-live-layout .md-section .video-bg iframe,
.mdpb-live-content .md-section .video-bg iframe {
    height: 100%;
    left: 0;
    opacity: 1;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}
.mdpb-live-layout .md-section.img-bg,
.mdpb-live-content .md-section.img-bg{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.mdpb-live-layout .md-section.img-bg.md-parallax,
.mdpb-live-content .md-section.img-bg.md-parallax {
    background-attachment: fixed;
}

.section-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

/*
*
SORTALBE (move)

Add class "js-section-sortable"
to "md-section-wrapper" tags
while drag and Drop md-section-item

*
*/

/* Sortable Section helper */
.mdpb-live-layout .js-section-sortable .md-section.ui-sortable-helper {
    background: rgba(255,102,0,.6);
    position: relative;
}
.mdpb-live-layout .js-section-sortable .md-section.ui-sortable-helper:after,
.mdpb-live-layout .js-section-sortable .md-section.fixed-wrapper.ui-sortable-helper:after {
    position: absolute;
    top: 50%;
    left: 50%;
    font-family: "Open Sans";
    font-size: 13px;
    color: #FFF;

    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.js-section-sortable .md-section.fixed-wrapper.ui-sortable-helper:after {
    content: "Fixed Wrapper";
}
.js-section-sortable .md-section.ui-sortable-helper:after {
    content: "Full Wrapper";
}


/*
*
Effect of elements while sort section progress
*
*/
.mdpb-live-layout .js-section-sortable .md-section {
    background-image: url('../images/pattern.png');
    height: 80px;
}
.mdpb-live-layout .js-section-sortable .md-section.js-edit-section,
.mdpb-live-layout .js-section-sortable .md-section:hover {
    border-color: transparent;
}
.mdpb-live-layout .js-section-sortable .md-section > div,
.mdpb-live-layout .js-section-sortable .md-section:hover > div {
    display: none;
}

/* default section */
.mdpb-live-layout .js-section-sortable .section-placeholder {
    height: 80px;
    width: 100%;
    border: 1px dashed #FF6600;
    margin: 0 auto;
}
/* Fixed section (adding class "fixed-wrapper")*/
.mdpb-live-layout .js-section-sortable .section-placeholder.fixed-wrapper {
    max-width: 1200px;
}

/* 2 - Row Style
=================================================================================================== */

#md-pagebuilder .mdpb-live-layout .row,
.sub-layout-dialog .row {
    margin-right: -15px;
    margin-left: -15px;
    padding: 8px 10px 8px;
    position: relative;
    margin-top: 15px;
    margin-bottom: 15px;
    background-color: #f1f1f1;
}

/* Row Tooltips */
/* Tooltip default */
.mdpb-live-layout .row .row-tooltips,
.sub-layout-dialog .row .row-tooltips  {
    text-align: center;
    position: absolute;
    background-color: #292A2D;
    z-index: 0;
    top: 0;
    bottom: 0;
    left: 100%;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;
}
.mdpb-live-layout .row .row-tooltips > a,
.sub-layout-dialog .row .row-tooltips > a {
    display: block;
    height: 24px;
    width: 35px;
    position: relative;
}
.mdpb-live-layout .row .row-tooltips .md-icon,
.sub-layout-dialog .row .row-tooltips .md-icon {
    color: #a6a6a6;
    margin: 0;
    padding: 0;
}
/* Hover icon */
.mdpb-live-layout .row .row-tooltips a:hover .md-icon,
.sub-layout-dialog .row .row-tooltips a:hover .md-icon,
.mdpb-live-layout .row .row-tooltips a:hover .md-icon ,
.sub-layout-dialog.row .row-tooltips a:hover .md-icon {
    color: #007FFF;
}
/* Tooltips (container-fluid) */
.mdpb-live-layout .container-fluid .row-tooltips,
.sub-layout-dialog .container-fluid .row-tooltips {
    bottom: 100%;
    right: 0%;
    top: auto;
    left: auto;

    border-bottom-right-radius: 0;
    border-top-left-radius: 3px;
    border-right-left-radius: 3px;
}
.mdpb-live-layout .container-fluid .row-tooltips > a,
.sub-layout-dialog .row-tooltips > a {
    display: inline-block;
    height: 30px;
}
.mdpb-live-layout .row-tooltips a.row-reset,
.sub-layout-dialog  .row-tooltips a.row-reset {
    display: none;
}
/* Tooltips Row Responsive */
.responsive .row-move,
.responsive .row-duplicate,
.responsive .row-delete,
.responsive .row-edit {
    display: none !important;
}
.responsive .row-tooltips a.row-reset {
    display: block;
}

/* These Event Handler on ROW  (sordable)
----------------------------------------------------------------- */
.md-subrow-wrapper {
    padding: 20px;
    background-color: #FFF;
}

/* Sub layout Dialog */
.sub-layout-dialog .desktop .container,
.sub-layout-dialog .md-section .container  {
    width: auto;
}
.spb-column.ui-sortable-helper .region-box .region-tools {
    display: none;
}
.spb-column.ui-sortable-helper .region-box:hover {
    border: 0;
}
.md-section .row:hover .region-box {
    border-color: #FFF;;
}
.md-section .row [class^="col-"]:last-child {
    border-right: 0;
}
.md-section .row [class^="col-"] .resizable-handle {
    border-right: 2px dotted #666666;
    cursor: col-resize;
    position: absolute;
    right: 0;
    top:0;
    bottom: 0;
    display: none;
}
.md-section .row:hover .resizable-handle {
    display: block;
}

/* Row in Page Assign */

.md-section .row.row-assign:hover {
    background: none;
}
.md-section .row.row-assign:hover .region-box {
    border-color: #A6A6A6;
}
.md-section .row:hover .regionbox-placeholder.region-box,
.js-placeholder.region-box {
    border-color: #007FFF !important ;
}
.row.row-assign .subrow-wrapper .mdpb-subrow {
    margin-bottom: 10px;
}

/* Tooltip Reset row */
.row-tooltips.reset {
    background: none;
    padding-top: 16px;
}
.row-tooltips.reset .row-reset {
    position: relative;
    background-color: #403F3F;
    padding: 9px 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.row-tooltips.reset .row-reset:after {
    position: absolute;
    content: "";
    border-bottom: 8px solid rgba(0, 0, 0, 0);
    border-right: 7px solid #403F3F;
    border-top: 8px solid rgba(0, 0, 0, 0);
    right: 100%;
    top: 32%;
}
.row-tooltips.reset .row-reset:hover {
    background-color: #FF781B;
}
.row-tooltips.reset .row-reset:hover:after {
    border-right-color: #FF781B;
}
/* Sub Row */
.mdpb-subrow .spb-preview {
    background-color: #ddd;
    margin: 3px 0;
    position: relative;
    z-index: 3;
}

.mdpb-addrow {
    padding: 20px 30px;
    text-align: center;
}


/* These event handler on the ROW element
------------------------------------------------------------- */

/*

Sortable Row
Adding class "ui-sortable-helper"

*/


.row-placeholder {
    border: 1px dashed #AAAAAA;
    min-height: 100px;
     margin-left: -12px;
    margin-right: -12px;
}

.mdpb-live-layout .row.ui-sortable-helper,
.mdpb-live-layout .row.ui-sortable-helper:hover {
    background: rgba(221,221,221, .6);

}
.mdpb-live-layout .row.ui-sortable-helper .spb-column:after {
    background: transparent;
    border: transparent;
}

.mdpb-live-layout .row.ui-sortable-helper .spb-column:hover .region-tools,
.mdpb-live-layout .row.ui-sortable-helper .spb-column.js-edit-col .region-tools,
.row.ui-sortable-helper .sub-layout-dialog .spb-column:hover .region-tools,
.row.ui-sortable-helper .sub-layout-dialog .spb-column.js-edit-col .region-tools,
.mdpb-live-layout .row.ui-sortable-helper .spb-column:hover .ui-resizable-e,
.mdpb-live-layout .row.ui-sortable-helper .spb-column.js-edit-col .ui-resizable-e,
.row.ui-sortable-helper .sub-layout-dialog .spb-column:hover .ui-resizable-e,
.row.ui-sortable-helper:hover .row-tooltips,
.row.ui-sortable-helper.js-edit-row .row-tooltips {
    opacity: 0;
    visibility: hidden;
}


/* 3 - Column
=================================================================================================== */


.mdpb-live-layout .spb-column,
.sub-layout-dialog .spb-column,
.mdpb-live-content.js-custom-block .spb-column {
    position: relative;
    margin: 0;
    padding: 10px 0;
}
.mdpb-live-layout .spb-column:after,
.mdpb-live-content.mdpb-dropable .spb-column:after,
.sub-layout-dialog .spb-column:after,
.mdpb-live-layout .mdpb-subrow .spb-column:after {
    background: none repeat scroll 0 0 #fff;
    bottom: 3px;
    content: "";
    left: 3px;
    position: absolute;
    right: 3px;
    top: 3px;
    border: 1px solid #ccc;
}
.spb-column.has-sublayout:after {
    border: 0;
}
.mdpb-live-layout .spb-column.ui-sortable-helper,
.mdpb-live-layout .spb-column.ui-sortable-helper:after {
    background: rgba(0,127,255,.4);
}
.mdpb-live-layout .spb-column.ui-sortable-helper:after,
.mdpb-live-layout .row:hover .spb-column.ui-sortable-helper:after {
    border-color: transparent;
    background-color: transparent;
}
.mdpb-live-layout .spb-column:hover.ui-sortable-helper .ui-resizable-e,
.sub-layout-dialog .spb-column:hover.ui-sortable-helper .ui-resizable-e {
    opacity: 0;
    visibility: hidden;
}

.mdpb-live-layout .row:hover .spb-column:after,
.mdpb-live-layout .row.js-edit-row .spb-column:after,
.sub-layout-dialog .row.js-edit-row .spb-column:after {
    border-color: #fff
}

.spb-column .ui-resizable-e {
    right: 3px;
    bottom: 3px;
    top: 3px;
    width: 10px;
    height: auto;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    text-align: center;
}
.mdpb-live-content.mdpb-dropable .spb-column {
        padding: 10px;
}
.spb-column .ui-resizable-e:after {
    content: "\e60a";
    color: #007fff;
    font-family: "pbi";
    font-size: 15px;
    line-height: 100%;
    position: absolute;
    right: 5px;
    top: 42%;
}

.mdpb-live-layout .spb-column:hover .ui-resizable-e,
.mdpb-live-layout .spb-column.js-edit-col .ui-resizable-e,
.sub-layout-dialog .spb-column:hover .ui-resizable-e {
    opacity: 1;
    visibility: visible;
}

/* Tooltips Column Responsive */
.responsive [class*=col-] .sub-region,
.responsive [class*=col-] .split-region,
.responsive [class*=col-] .delete-region,
.responsive [class*=col-] .edit-region {
    display: none;
}
.region-tools a.state-region {
        display: none;
}
.responsive .region-tools a.state-region {
    display: block;
}

/* Sub layout preview */

/* 1subrow */
.sublayout-column .mdpb-subrow .spb-preview {
    max-height: 16px;
    height: 16px;
}
.sub-layout-dialog .md-section-wrapper {
    margin: 0 auto;
}
.sub-layout-dialog .md-section-wrapper.table-landscape{
    max-width: 960px;
    width: 90%;
}
.sub-layout-dialog .md-section-wrapper.table-portrait{
    max-width: 600px;
    width: 68%;
}
.sub-layout-dialog .md-section-wrapper.mobile-landscape{
    max-width: 320px;
    width: 40%;
}


/* These event handler on the COLUMN element
------------------------------------------------------------- */


/* Sortable column */

.spb-column.ui-sortable-helper .region-box {
    background: rgba(0,127,255,.4);
    border: 0;
}
.spb-column.ui-sortable-helper .region-box .pbi-dots {
    display: none;
}
.spb-column-placeholder {
    width: 100px;
    height: 80px;
    border: 1px dashed #007FFF;
    float: left;
    margin-bottom: 5px;
 }

/*  4 - Box Region Style
=================================================================================================== */

.region-name {
    position: absolute;
    top: 50%;
    left: 50%;

    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.region-tools > a,
.block-tools > a {
    display: inline-block;
    /*float: left;*/
    width: 29px;
    height: 30px;
    text-align: center;
    position: relative;
}

.md-subrow .region-box {
    min-height: 30px;
    height: 30px;
    padding: 0;
}

.region-tools {
    position: absolute;
    background-color: #007FFF;
    height: 30px;
    width: auto;
    top: 50%;
    left: 50%;
    padding: 0 3px;
    opacity: 0;
    visibility: visible;
    z-index: 3;

    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

/* Add class "js-edit-col" while edit column to show region-tools */

.mdpb-live-layout .spb-column:hover .region-tools,
.mdpb-live-layout .spb-column.js-edit-col .region-tools,
.sub-layout-dialog .spb-column:hover .region-tools,
.sub-layout-dialog .spb-column.js-edit-col .region-tools {
    opacity: 1;
}

.mdpb-live-layout .spb-column.ui-sortable-helper:hover .region-tools {
    opacity: 0;
    visibility: hidden;
}


.col-lg-1 .region-tools > a {
    display: block;
}
.col-lg-1 .region-tools{
    height: auto;
    width: auto !important;
}
.col-lg-1 .region-tools .split-region,
.col-lg-1 .region-tools .sub-region,
.col-lg-1 .region-tools .state-region{
    display: none;
}
.col-lg-2 .region-tools,
.col-md-2 .region-tools,
.col-sm-2 .region-tools,
.col-xs-2 .region-tools {
    width: 100%;
    text-align: center;
}

.region-tools .active-region {
    display: none;
}
.row-tooltips .reset {
    display: none;
}
.viewport-table-landscape .region-tools [class^="region-"],
.viewport-table-portrait .region-tools [class^="region-"],
.viewport-mobile-landscape .region-tools [class^="region-"] {
    display: none;
}
.viewport-table-landscape .region-tools .active-region,
.viewport-table-portrait .region-tools .active-region,
.viewport-mobile-landscape .region-tools .active-region {
    display: block;
}
.viewport-table-landscape .region-tools,
.viewport-table-portrait .region-tools,
.viewport-mobile-landscape .region-tools {
    padding: 0;
}
.viewport-table-landscape .region-tools,
.viewport-table-portrait .region-tools,
.viewport-mobile-landscape .region-tools {
    height: 30px;
    width: 30px;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}


.viewport-table-landscape .row-tooltips a[class^="row-"],
.viewport-table-portrait .row-tooltips a[class^="row-"],
.viewport-mobile-landscape .row-tooltips a[class^="row-"] {
    display: none;
}
.viewport-table-landscape .row-tooltips .reset,
.viewport-table-portrait .row-tooltips .reset,
.viewport-mobile-landscape .row-tooltips .reset {
    display: block;
}


/* 5 - Dialog Style
=================================================================================================== */

.md-dialog {
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    padding: 15px 20px;
    display: inline-block;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 20px;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.dialog-note {
    background-color: #FE7800;
}
.md-dialog.dialog-note:after {
    border-top: 6px solid #FE7800;
}
.dialog-success {
    background-color: #04BFBF;
}
/* Arrow Bottom */
.md-dialog:after {
    content: "";
    position: absolute;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    top: 100%;
    left: 15%;
}
.md-dialog.dialog-success:after {
    border-top: 6px solid #04BFBF;
}
.row-tooltips .row-edit.active:after,
.region-tools .edit-region.active:after,
.mdpb-live-layout .row-tooltips .active.row-edit:after,
.mdpb-live-layout .region-tools .active.edit-region:after,
.mdpb-live-layout .section-tooltips .active.section-edit:after {
    position: absolute;
    content: "";
    top: 120%;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    /*border-bottom: 10px solid #292A2D;*/
    border-bottom: 10px solid #000;
    left: 3px;
}
.mdpb-live-layout .region-tools .top.active.edit-region:after,
.mdpb-live-layout .section-tooltips .top.active.section-edit:after {
    top: -45%;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #292A2D;
    border-bottom: transparent;
    left: 3px;
}


/* 6 - Button Style
=================================================================================================== */
.md-btn {
    padding: 8px 17px;
    display: inline-block;
    line-height: 18px;
    text-align: center;
    position: relative;
    text-decoration: none;
    color: #FFF;
    font-family: "open sans";
}
.md-btn:hover {
    text-decoration: none;
}
#md-panel-sidebar .md-btn:visited,
#md-panel-sidebar  .md-btn:hover,
#md-panel-sidebar  .md-btn:focus,
.md-custom-layout .md-btn:visited,
.md-custom-layout  .md-btn:hover,
.md-custom-layout  .md-btn:focus,
#md-panel-sidebar .ui-widget-content a,
.md-dialog-custom  .md-btn:hover,
.md-dialog-custom  .md-btn:focus { color: #FFF; }
.md-btn-color.orange {
    background-color: #FF781B;
}
.md-btn-color.orange:hover {
    background-color: #FF8C40;
}
.md-btn-color.blue {
    background-color: #007FFF;
}
.md-btn-color.blue:hover {
    background-color: #1C8DFF;
}
.md-btn-color {
    border: 1px solid transparent;
    color: #FFF;
}
.md-btn-border {
    border: 1px solid #A6A6A6;
    color: #666666;
    padding: 5px 35px;
}
.md-btn-icon {
    padding-left: 28px;
}
.md-btn-border:hover {
    border-color: #736D72;
    color: #736D72;
}
.md-btn-border:hover i {
    left: 3px;
}
.form-buttons .md-btn { margin-right: 5px; }

.md-panel-sidebar .form-buttons {
    position: absolute;
    bottom: 20px;
    right: 11px
}
.md-panel-sidebar .md-btn {
    padding: 5px 10px;
    font-size: 13px;
    font-family: "open sans";
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.btn-blue {
    background-color: #007FFF;
    color: #FFF;
}
.md-panel-sidebar .btn-blue:hover {
    background-color: #2894FF;
}
.md-panel-sidebar .btn-dark {
    background-color: #272B2E;
    color: #999;
}
.md-panel-sidebar .btn-dark:hover {
    background-color: #363D41;
}


/* 7 - Form Style ( inputs, textareas, selects, labels ) , for example as
    + Toolbar Left
    + Dialog edit custom
    + field-setting-dialog
    + block-content ̣̣̣̣̣̣̣̣(md-live-content)
===================================================================================================  */


/* Common Form Element
--------------------------------------- */

.md-pagebuilder input[type="email"],
.md-pagebuilder input[type="number"],
.md-pagebuilder input[type="password"],
.md-pagebuilder input[type="search"],
.md-pagebuilder input[type="tel"],
.md-pagebuilder input[type="text"],
.md-pagebuilder input[type="url"],
.md-pagebuilder textarea,
.md-pagebuilder select {
    background: #FFF;
    border: 1px solid #A6A6A6;
    font-size: 13px;
    line-height: 24px;
    display: block;
    width: 100%;
    font-family: "Open Sans";
    color: #666;
    border-radius: 0;
     -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
}
.md-pagebuilder input[type="email"]:focus,
.md-pagebuilder input[type="number"]:focus,
.md-pagebuilder input[type="password"]:focus,
.md-pagebuilder input[type="search"]:focus,
.md-pagebuilder input[type="tel"]:focus,
.md-pagebuilder input[type="text"]:focus,
.md-pagebuilder input[type="url"]:focus
.md-pagebuilder textarea:focus,
.md-pagebuilder select:focus  {
    border-color: #5B9DD9;
    -webkit-box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
    -moz-box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
    box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
}
.mdpb-toolbar input[type="email"],
.mdpb-toolbar input[type="number"],
.mdpb-toolbar input[type="password"],
.mdpb-toolbar input[type="search"],
.mdpb-toolbar input[type="tel"],
.mdpb-toolbar input[type="text"],
.mdpb-toolbar input[type="url"],
.mdpb-toolbar textarea,
.mdpb-toolbar select,
.md-dialog-custom input[type="email"],
.md-dialog-custom input[type="number"],
.md-dialog-custom input[type="password"],
.md-dialog-custom input[type="search"],
.md-dialog-custom input[type="tel"],
.md-dialog-custom input[type="text"],
.md-dialog-custom input[type="url"],
.md-dialog-custom textarea,
.md-dialog-custom select {
    background-color: #1d1f21;
    border: 1px solid  #3c4145;
    font-family: "Open Sans";
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
}
.md-pagebuilder input[type="email"],
.md-pagebuilder input[type="number"],
.md-pagebuilder input[type="password"],
.md-pagebuilder input[type="search"],
.md-pagebuilder input[type="tel"],
.md-pagebuilder input[type="text"],
.md-pagebuilder input[type="url"] {
    height: 30px;
    padding: 0px 16px;
}

#md-pagebuilder .form-group {
    margin-bottom: 30px;
}

/* Field Setting
------------------------------------------------------ */
.md-pagebuilder .field-setting-dialog .md-popup input[type="email"],
.md-pagebuilder .field-setting-dialog .md-popup input[type="number"],
.md-pagebuilder .field-setting-dialog .md-popup input[type="password"],
.md-pagebuilder .field-setting-dialog .md-popup input[type="search"],
.md-pagebuilder .field-setting-dialog .md-popup input[type="tel"],
.md-pagebuilder .field-setting-dialog .md-popup input[type="text"],
.md-pagebuilder .field-setting-dialog .md-popup input[type="url"] {
    width: 500px;
}
.md-pagebuilder .field-setting-dialog .md-popup input[type="email"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup input[type="number"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup input[type="password"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup input[type="search"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup input[type="tel"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup input[type="text"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup input[type="url"]:focus,
.md-pagebuilder .field-setting-dialog .md-popup textarea:focus,
.md-pagebuilder .field-setting-dialog .md-popup select:focus {
    border-color: #66AFE9;
    outline: 0 none;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
}


/* Input
--------------------------------------- */
.md-pagebuilder input.big {
    width: 175px;
}
.md-pagebuilder input.medium {
    width: 175px;
}
.md-pagebuilder input.small {
    width: 175px;
}
.md-pagebuilder input.mini {
    width: 175px;
}


/* Labels
--------------------------------------- */
.form-group label {
    display: block;
    border: 0;
    font-weight: 400;
    color: #FFF;
    font-size: 13px;
    line-height: 28px;
    margin:0 0 10px 0;
    padding: 0;
    font-family: "Open Sans";
}
.form-group label.lb-inline {
    display: inline-block;
    margin-right: 10px;
}
.md-pagebuilder .form-group label.lb-inline.lb-right {
    float: right;
    margin-left: 10px;
    margin-right: 0;
}
.md-pagebuilder .lb-hidden {
    position: absolute;
    width: 1px;
    overflow: hidden;
}
label.lb-inline {display: inline-block;}

/* Selects
--------------------------------------- */

.md-pagebuilder select {
    width: auto;
    cursor:pointer;
    padding: 3px 5px;
}

.md-selection {
    border: 1px solid #3C4145;
    position: relative;
    background-color: #1D1F21;
    height: 30px;
}

.md-selection:before {
    background: #1D1F21;
    bottom: 0;
    content: "\e604";
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 24px;
    line-height: 24px;
    height: 100%;
    font-family: "pbi";
    color: #555;
    padding-top: 1px;
}
.md-selection .select:hover,
.md-selection .select:focus,
.md-selection .select:active {
    outline: none;
}

.md-selection .select {
    background-color: #1D1F21;
    border: 0 none;
    color: #999;
    cursor: pointer;
    height: 100%;
    margin: 0;
    padding: 4px;
    text-indent: 0.01px;
    text-overflow: "";
    width: 100%;
    font-size: 13px;
    font-family: "Open Sans";
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.form-group.lb-inline .md-selection {
    display: inline-block;
}
.md-selection .select option {
    padding: 5px 0;
    font-family: "Open Sans";
}
.md-selection.medium .select,
.md-selection.small .select{
    /*font-size: 12px;*/
}
.md-selection.medium {
    width: 100px;
}

.md-selection.small {
    width:70px;
}

/* Checkbox / Radio
--------------------------------------- */
.md-pagebuilder .input-checkbox,
.md-pagebuilder .input-radio {
    display: none;
}
.input-checkbox[type="checkbox"] + .lb-checkbox,
.input-radio[type="radio"] + .lb-radio {
    color: #9CA0A3;
    cursor: pointer;
    font-size: 13px;
    padding: 0 0 0 25px;
}
.input-checkbox[type="checkbox"] + .lb-checkbox {
    background-image: url("../images/obj-checkbox.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    height: 16px;
    line-height: 16px;
}
/* Checked */
.input-checkbox[type="checkbox"]:checked + .lb-checkbox {
    background-position: 0 -16px;
    color: #FFF;
}
.input-radio[type="radio"] + .lb-radio {
    background-image: url("../images/obj-radio.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    height: 14px;
    line-height: 14px;
}
/* Checked */
.input-radio[type="radio"]:checked + .lb-radio {
    background-position: 0 -14px;
    color: #FFF;
}
.lb-checkbox[for="mute-video-sound"] {
    margin-top: 15px;
}
/* Inline checkbox / radio */
.form-group.inline .lb-checkbox,
.form-group.inline .lb-radio {
    display: inline-block;
    margin-right: 20px;
}
.form-group.inline .lb-checkbox:last-child,
.form-group.inline .lb-radio:last-child {
    margin-right: 0;
}

/* 8 - Popup Style
=================================================================================================== */
.md-overlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0,0,0,0.8);
    z-index: 9999;
}

/*========= Layout Styles =========*/
.md-popup {
    background: none repeat scroll 0 0 #FFFFFF;
    bottom: 30px;
    left: 15%;
    min-height: 210px;
    overflow: auto;
    position: fixed;
    right: 15%;
    top: 30px;
    z-index: 99;
}
.md-popup .md-section {
    background: transparent;
}
.md-popup-inner-header {
    border-bottom: 1px solid #DFDFDF;
    height: 50px;
    position: relative;
}
.md-popup-inner-content {
    background-color: #fff;
    position: absolute;
    top: 78px;
    bottom: 50px;
    width: 100%;
    overflow: auto;
    left: 0;
    right: 0;
    padding: 20px 60px 20px 30px;
}
.md-popup-inner-footer {
    background: #FFF;
    border-top: 1px solid #dfdfdf;
    bottom: 0;
    height: 50px;
    width: 100%;
    position: absolute;
}
.md-popup-backdrop {
    background: #000;
    bottom: 0;
    left: 0;
    min-height: 400px;
    opacity: 0.7;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 98;
}

/* Dimension popup screen */
.md-popup.popup-big {
    bottom: 2%;
    left: 2%;
    right: 2%;
}
.md-popup.popup-medium {
    bottom: 10%;
    left: 15%;
    right: 15%;
    top: 10%;
}
.md-popup.popup-small {
    bottom: auto;
    left: 30%;
    right: 30%;
    top: 35%;
}

/*========= Header Styles =========*/
.md-popup-title {
    color: #555;
    font-size: 22px;
    font-weight: 200;
    left: 14px;
    line-height: 53px;
    position: absolute;
    top: 0;
}
.md-popup-close {
    background: url("images/icon-close.png") no-repeat left top;
    height: 25px;
    overflow: hidden;
    position: absolute;
    right: 14px;
    text-indent: 300%;
    top: 14px;
    width: 25px;
}
.md-popup-close:hover {
    background-position: 0 -25px;
}

/* Footer POPUP Styles */
.md-popup-inner-footer .form-buttons {
    position: absolute;
    right: 12px;
    top: 10px;
}
.md-popup-inner-footer .form-buttons .md-btn:hover {
    border-color: #007FFF;
    color: #007FFF;
}
.md-popup-over {
    background-color: #000;
    opacity: 0.2;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
}

/* TOOLBAR STYLE
============================= */
#mdpb-toolbar a {
    text-decoration: none;
    font-family: "open sans";
}
#mdpb-toolbar .enable-pagebuilder,
#mdpb-toolbar .enable-pagebuilder > a  {
    display: inline-block;
    color: #FFF;
    font-family: "open sans";
}
.enable-pagebuilder > a,
.enable-pagebuilder > a:visited {
    padding: 5px 10px;
    background-color: #007FFF;
    position: fixed;
    bottom: 0;
    right: -100px;
    z-index: 9;
    color: #FFF;
    font-size: 14px;
    font-family: "open sans";
}
.enable-pagebuilder > a:hover {
    color: #FFF;
    right: 0px;
}
.enable-pagebuilder > a > i {
    vertical-align: middle;
    margin-right: 10px;
    font-size: 20px;
}
#md-toolbar-inner {
    height: 50px;
    background-color: #F4F5F7;
    position: fixed;
    width: 0;
    bottom: 0;
    z-index: 999999;
    right: 0;
    overflow: hidden;
}
#md-toolbar-inner.show {
    width: 100%;
}
.enable-pagebuilder > a.hide {
    display: none;
}
.md-logo,
.layout-name-tools,
.viewport-select {
    float: left;
}
.mdpb-toolbar .toolbar-right {
    float: right;
}
.md-logo {
    padding: 13px;
}
.md-pagebuilder .layout-name-tools {
    display: inline-block;
    margin-left: 13px;
}
.layout-name-tools > a {
    float: left;
    padding: 9px 15px;
    vertical-align: middle;
    display: inline-block;
}
.layout-name-tools > a:hover,
.layout-name-tools > a.active {
    background-color: #D4D4D4;
}
.viewport-select {
    border-left: 1px solid #ccc;
    padding: 9px;
}
.viewport-select a {
    vertical-align: middle;
    display: inline-block;
}
.viewport-select span {
    padding-left: 20px;
    padding-right: 20px;
}
.toolbar-right .form-buttons {
    float: left;
    padding: 10px;
}
.expand {
    border-left: 1px solid #ccc;
    padding: 9px 12px;
    display: inline-block;
}

/* PANEL PRIMARY STYLE
============================= */
.md-panel-primary {
    position: relative;
}
.md-pagebuilder.expanded .md-panel-primary {
    position: relative;
    -webkit-transform: translateX(-290px);
    -moz-transform: translateX(-290px);
    -ms-transform: translateX(-290px);
    -o-transform: translateX(-290px);
    transform: translateX(-290px);
}

.mdpb-toolbar.expanded  .md-panel-sidebar {
    right: 0;
}

/* BODY STYLE
============================= */

.md-pb-body {
    background-color: #FFFFFF;
    overflow: auto;
    width: 100%;
}

/* FOOTER STYLE
============================= */
.md-pb-footer .md-btn-border {
    border-color: #444;
}

.footer-logo,
.md-pb-footer .form-buttons {position: absolute;}

.footer-logo {
    left: 20px;
    top: 12px;
}
.md-pb-footer .form-buttons {
    right: 20px;
    top: 12px;
}
.footer-help {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}
.md-pb-footer .form-buttons .md-btn {margin-right: 5px;}
.md-pb-footer .form-buttons .md-btn:hover {
    color: #FFF;
}
.md-pb-footer .form-buttons .md-btn:active {
    color: #FF781B;
}

/*** LAYOUT TEMPLATE PAGE
=================================================================================================== */

.layout-item {
    float: left;
    margin-right: 20px;
    max-width: 150px;
}
.layout-preview {
    text-align: center;
    background-color: #DDDDDD;
    display: inline-block;
    font-weight: 600;
    min-width: 140px;

}
.layout-preview:hover a {
    border-color: #FFF;
}
.layout-preview a {
    display: block;
    height: 140px;
    padding: 24px 10px;
    border: 7px solid #ddd;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.layout-info {
    color: #999;
    font-size: 11px;
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}
.layout-name a {
    color: #666;
    font-size: 14px
}
.layout-preview.addnew {
    border: 1px dashed #BBBBBB;
}
.icon-plus {
    font-size: 72px;
    color: #736D72;
    line-height: 78%;
    font-weight: 700;
    display: block;
}

/* Layout preview */
.layout-preview [class*="md-col-"],
.layout-preview [class^="md-col-"] {
    height: 12px;
    background-color: #FFF;
    margin-bottom: 10px;
}


/* POPUP STYLE
=================================================================================================== */

/* 9 -  Panel Sidebar
=================================================================================================== */
.md-panel-sidebar {
    background-color: #111111;
    width: 240px;
    top: 0;
    bottom: 0;
    right: -290px;
    position: fixed;
    z-index: 9999;
}
.md-panel-sidebar .sidebar-inner {
    background: #111111;
    border: none;
    padding: 0;
    height: 100%;
}

.spb-edit #toolbar {
    padding: 0;
    margin: 0
}

/* Sidebar tab */
.spb-tabs ul.ui-tabs-nav  {
    text-align: center;
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
}
.spb-tabs ul.ui-tabs-nav,
.spb-tabs li.ui-state-default {
    background: #111111;
    border-radius: 0;
    border: none;
    padding: 0 0 1px 0;
    margin : 0;
    border-bottom: 1px solid  #007FFF;
}

.spb-tabs .ui-tabs-nav a.ui-tabs-anchor {
    color: #999;
    font-size: 13px;
    padding: 6px 15px;
    font-family: "Open Sans";
    font-weight: 400;
    text-transform: none;
}
.spb-tabs.ui-tabs .ui-tabs-nav {
    font-size: 0;
}
.spb-tabs.ui-tabs .ui-tabs-nav li {
    padding: 0;
    margin: 0 5px -1px 0;
    display: inline-block;
    float: none;
    font-size: 12px;
    font-family: "open sans";
}
.spb-tabs li.ui-state-default {
    background: #272B2E;
}
.spb-tabs li.ui-state-default.ui-state-active {
    background: #007FFF;
}
.spb-tabs li.ui-state-default .ui-tabs-anchor {
    color: #999;
}
.spb-tabs li.ui-state-default.ui-state-active .ui-tabs-anchor {
    color: #FFF;
    cursor: default;
}
.spb-tabs li a i {
    vertical-align: -9px;
    margin-right: 5px;
}
.spb-tabs.ui-tabs .ui-tabs-nav li.ui-tabs-active a:after {
    content: "";
}
.spb-tabs.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    border: none;
}
.spb-tabs.ui-tabs .ui-tabs-nav li {
    top: 0;
    border: 0;
}

/* Logo */
#md-panel-sidebar .spb-logo {
    text-align: center;
    padding: 20px;
}

/* Tempalte name */
.name-template {
    margin-bottom: 20px;
}
#md-panel-sidebar input {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 13px;
    color: #FFF;
}
.name-template .md-btn { margin-top: 10px; }
/* Content Tab */
#md-panel-sidebar .content-tabs {
    padding: 0 15px;
    margin: 15px 0 0 0;
    background: #111;
    border: 0;
}
.content-tabs .ui-widget-content {
    background: #292A2D;
    padding : 0;
}
.content-tabs .md-selection {
    margin-bottom: 15px;
}
.content-tabs li a {
    background-color: #272B2E;
    color: #999999;
    position: relative;
    font-size: 13px;
    font-weight: 400;
    margin:0 0 6px 0;
    padding: 5px 10px   ;
    line-height: 18px;
    display: block;
    font-family: "Open Sans";

}
.content-tabs li:nth-child(2n) a {
    margin-right: 0;
}
.content-tabs li a:hover {
    cursor: move;
}
.content-tabs li a:focus {
    border-color: #0080FF ;
}
.content-tabs li a:hover span {
    color: #FFF;
}

/* Custom UI jquery  */
.spb-tabs{
    background: #111;
    padding: 0;
    margin: 0;
    border: 0;
    -webkit-border-radius: none;
    -moz-border-radius: none;
    border-radius: none;
}
#md-panel-sidebar .content-tabs .list-object {
    margin : 0;
    padding: 0;
    list-style: none;
}
.list-object .spb-content {
    margin: 0; padding: 0;
}
#md-panel-sidebar .ui-widget-content .list-object .spb-content a {
    color: #999;
}
#md-panel-sidebar .ui-widget-content .list-object .spb-content a:hover {
    color: #fff;
}
#md-panel-sidebar .ui-widget-content .list-object .spb-content a span {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
.list-object .content-placeholder {
    visibility: hidden;
}

.spb-content.js-disoverflow {
    z-index: 99999 !important;
}
.spb-content.js-disoverflow a {
    background-color: #007FFF;
}
.spb-content.js-disoverflow a span {
    color: #fff;
}

/* 10 - Dialog
=================================================================================================== */

.md-dialog-custom {
    background-color: #000;
    /*border: 1px solid #333333;*/
    border: 1px solid #000;
    left: 45%;
    padding: 20px 15px;
    position: absolute;
    top: 50%;
    width: 280px;
    z-index: 100;
}
.custom-regionbox {
    position: absolute;
}
.custom-regionbox:after {
    border-bottom: 10px solid #292A2D;
    border-left: 10px solid rgba(0, 0, 0, 0);
    border-right: 10px solid rgba(0, 0, 0, 0);
    bottom: 100%;
    content: "";
    left: 50%;
    margin-left: -5px;
    position: absolute;
}
.box-list {
    height: 200px;
    margin-top: 20px;
    overflow: auto;
}
.md-dialog-custom label {
    color: #ccc;
}
.md-dialog-custom .form-buttons {
    text-align: right;
}

.md-dialog-custom .select option:hover {
    color: #0E83FF;
}
.md-dialog-custom .box-dropdown {
    position: relative;
    height: 30px;
    overflow: hidden;
    background: #1D1F21;
}
.md-dialog-custom .box-dropdown:after {
    background: none repeat scroll 0 0 #1d1f21;
    bottom: 1px;
    color: #555;
    content: "";
    font-family: "pbi";
    padding-top: 1px;
    pointer-events: none;
    position: absolute;
    right: 2px;
    width: 24px;
    height: 24px;
    top: 2px;
    bottom: 0;
    margin: auto;
}
/* Dropdown */
.md-dialog-custom .box-dropdown.js-expanded {
    background-color: #1D1F21;
    overflow: visible;
}
.md-dialog-custom .box-dropdown .item-chose {
    padding: 0 13px;
    height: 100%;
    color: #666;
    border: 1px solid #3C4145;
    cursor: pointer;

    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.box-dropdown .items-list {
    border: 1px solid #3C4145;
    position: absolute;
    width: 100%;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 3;
}
.box-dropdown .spb-scrollbar {
    height: 200px;
    overflow: hidden;
    padding: 0 10px 0 5px;
    margin: 10px 0;
}
/* Dropdown */
.box-dropdown.js-expanded .items-list {
    background: #1D1F21;
    top: 90%;
}
.md-dialog-custom .box-dropdown .items-list ul {
    position: relative;
    opacity: 0;
    visibility: hidden;
    margin: 0;
    padding: 0;
}
/* Dropdown */
.box-dropdown.js-expanded .items-list ul {
    opacity: 1;
    visibility: visible;
    background: #1D1F21;
}
.box-dropdown li {
    color: #999;
    font-size: 13px;
    line-height: 130%;
    padding: 5px 8px;
    cursor: pointer;
    font-family: "open sans";
}
.box-dropdown li:hover {
    color: #0C83FF;
}
.animation-preview {
    position: absolute;
    height: 70px;
    width: 210px;
    padding: 20px;
    top: 50%;
    right: 100%;
    background-color: #444444;
    text-align: center;
    overflow: hidden;
}
.animation-preview h3 {
    font-size: 20px;
    color: #ccc;
    font-family: "open sans";
}
/* Dialog action */
.md-dialog-custom .img-upload .md-btn {
    margin: 0 15px 0 0;
    padding: 6px 10px;
    color: #FFF;
    font-family: "open sans";
}
.md-dialog-custom .form-action .md-btn {
    color: #666;
    font-size: 13px;
    font-weight: 600;
    padding: 8px;
    font-family: "open sans";
}
.md-dialog-custom .form-action .md-btn.btn-blue {
    color: #007FFF;
    background: transparent;
}
.md-dialog-custom .form-action .divider {
    width: 1px;
    height: 14px;
    background: #666;
    display: inline-block;
    vertical-align: middle;
}
.md-dialog-custom .form-action .md-btn.md-blue {
    color: #007FFF;
}
.md-dialog-custom .form-action .md-btn:hover {
    color: #A3A3A3;
}
.md-dialog-custom .form-action .md-btn.md-blue:hover {
    color: #007AF4;
}
/* Menu Tabs */
.md-dialog-custom .spb-tabs,
.md-dialog-custom .spb-tabs ul.ui-tabs-nav,
.md-dialog-custom .spb-tabs li.ui-state-default {
    background: #000;
}
.md-dialog-custom .spb-tabs li.ui-state-default.ui-state-active {
    background: transparent;
}
.md-dialog-custom .spb-tabs ul.ui-tabs-nav, .spb-tabs li.ui-state-default {
    border: none;
}
.md-dialog-custom .ui-tabs .ui-tabs-panel {
    padding: 0;
    border: 0;
}
.md-dialog-custom .spb-tabs li.ui-state-default.ui-state-active .ui-tabs-anchor{
    color: #007FFF;
    font-family: "Open Sans";
}
.md-dialog-custom .spb-tabs .ui-tabs-nav a.ui-tabs-anchor {
    color: #666666;
    font-weight: 600;
    padding: 0 15px 0 10px;
}
.md-dialog-custom .spb-tabs .ui-tabs-nav a.ui-tabs-anchor:hoer {
    text-decoration: none;
}
.md-dialog-custom .spb-tabs .ui-tabs-nav li:first-child a.ui-tabs-anchor {
    padding-left: 0;
    border-right: 1px solid #666666;
}
.md-dialog-custom .spb-tabs ul.ui-tabs-nav {
    text-align: left;
    margin: 0 0 15px 0;
}
.md-dialog-custom .ps-container .ps-scrollbar-y-rail {
    right: 10px;
}
.md-dialog-custom .bg-color label {
    display: inline-block;
    margin-left: 15px;
}
.md-dialog-custom .bg-color {
    margin-top: 20px;
}
#md-pagebuilder .md-dialog-custom .form-group {
    margin: 0 0 20px 0;
    padding: 0;
}
.md-dialog-custom .img-preview {
    background: #599599;
    height: 100px;
    margin: 0 0 20px 0;
    width: auto;
}
.md-dialog-custom .img-preview img {
    width: 100%;
    height: 100%;
}
/* Jquery UI ScrollBar */
.spb-scrollbar {
    position:relative;
    margin:0px auto;
    padding:0px;
    height: 100%;
    overflow: hidden;
}
.ps-container .ps-scrollbar-x-rail {
    position: absolute; /* please don't change 'position' */
    bottom: 3px; /* there must be 'bottom' for ps-scrollbar-x-rail */
    height: 8px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    opacity: 0;
}
.ps-container .ps-scrollbar-x-rail:hover,
.ps-container .ps-scrollbar-x-rail.hover {
    background-color: #eee;
    opacity: 0.9;
    filter: alpha(opacity = 90);
}
.ps-container .ps-scrollbar-x-rail.in-scrolling {
    background-color: #eee;
    opacity: 0.9;
    filter: alpha(opacity = 90);
}
.ps-container .ps-scrollbar-y-rail {
    position: absolute; /* please don't change 'position' */
    right: 0px; /* there must be 'right' for ps-scrollbar-y-rail */
    width: 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    opacity: 0;
}
.ps-container:hover .ps-scrollbar-y-rail,
.ps-container.hover .ps-scrollbar-y-rail {
    opacity: 1;
    filter: alpha(opacity = 60);
}
.ps-container .ps-scrollbar-y-rail:hover,
.ps-container .ps-scrollbar-y-rail.hover {
    background-color: #292A2D;
    opacity: 1;
    filter: alpha(opacity = 90);
}
.ps-container .ps-scrollbar-y-rail.in-scrolling {
    background-color: #292A2D;
    opacity: 1;
    filter: alpha(opacity = 90);
}
.ps-container .ps-scrollbar-x {
    position: absolute; /* please don't change 'position' */
    bottom: 0; /* there must be 'bottom' for ps-scrollbar-x */
    height: 8px;
    background-color: #aaa;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.ps-container.ie6 .ps-scrollbar-x {
    font-size: 0; /* fixed scrollbar height in xp sp3 ie6 */
}
.ps-container .ps-scrollbar-x-rail:hover .ps-scrollbar-x,
.ps-container .ps-scrollbar-x-rail.hover .ps-scrollbar-x {
    background-color: #999;
}
.ps-container .ps-scrollbar-y {
    position: absolute; /* please don't change 'position' */
    right: 0; /* there must be 'right' for ps-scrollbar-y */
    width: 5px;
    background-color: #0E83FF;
}
.ps-container.ie6 .ps-scrollbar-y {
    font-size: 0; /* fixed scrollbar height in xp sp3 ie6 */
}
.ps-container .ps-scrollbar-y-rail:hover .ps-scrollbar-y,
.ps-container .ps-scrollbar-y-rail.hover .ps-scrollbar-y {
    background-color: #0E83FF;
    cursor: pointer;
}
.ps-container.ie .ps-scrollbar-x,
.ps-container.ie .ps-scrollbar-y {
    visibility: hidden;
}
.ps-container.ie:hover .ps-scrollbar-x,
.ps-container.ie:hover .ps-scrollbar-y,
.ps-container.ie.hover .ps-scrollbar-x,
.ps-container.ie.hover .ps-scrollbar-y {
    visibility: visible;
}
/* Picker Color */
.section-tooltips .sp-replacer .sp-preview {
    width: 100%;
    height: 100%;
    border: 0;
}
.section-tooltips  .sp-dd {
    display: none;
}
.section-tooltips .sp-replacer {
    border: 1px solid #403F3F;
    height: 18px;
    padding: 0;
    width: 18px;
}
/* New css */
.md-custom-layout {
    text-align: center;
    padding: 20px 0;
    z-index: 1;
}
.row.row-assign .subrow-wrapper {
    margin-top: 30px;
}
/* Custom layout wrapper , row */
.custom-layout-row {
    display: inline-block;
    background-color: #007FFF;
    vertical-align: top;
    position: relative;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.custom-layout-row:hover {
    overflow: visible;
}
.md-custom-layout .md-btn {
    color: #FFF;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
}
#md-pagebuilder .custom-layout-row ul {
    background-color: transparent;
    position: absolute;
    bottom: 70%;
    left: 0;
    right: 0;
    height: auto;
    margin: 0;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    z-index: 9;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
}
#md-pagebuilder .custom-layout-row ul:after {
    position: absolute;
    content: "";
    border-right: 8px  solid transparent;
    border-left: 8px  solid transparent;
    border-top: 10px  solid #007FFF;
    top: 83%;
    right: 50%;
    margin-right: -5px;
}
.custom-layout-row ul li {
    background: #007fff;
}
.custom-layout-row ul li:first-child {
    padding-top: 5px;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
}
.custom-layout-row ul li:last-child {
    padding-bottom: 5px;
    -webkit-border-radius:  0 0 4px 4px;
        -moz-border-radius:  0 0 4px 4px;
        -ms-border-radius:  0 0 4px 4px;
        -o-border-radius:  0 0 4px 4px;
        border-radius:  0 0 4px 4px;
}
.custom-layout-row li a {
    display: block;
    padding: 8px 40px;
    color: #FFF;
    font-size: 13px;
    font-weight: 400;
    font-family: "Open sans";
    line-height: 130%;
}
.custom-layout-row:hover span.md-btn {
    opacity: 0.4;
    cursor: pointer;
}
#md-pagebuilder .custom-layout-row:hover ul {
    height: 85px;
    bottom: 100%;
    opacity: 1;
    visibility: visible;
}
.custom-layout-row li a:hover {
    background-color: rgba(255,255,255, 0.2);
    color: #FFF;
}
/* Drag Drop Content (object)
-----------------------------------------------------------------------------*/
#mdpb-live-content .container .region-box {
    border-color: #FFF;
    cursor: initial;
}
#mdpb-live-content.mdpb-dropable .region-box{
    border: 1px dashed #666666;
}
#mdpb-live-content .row-placeholder {
    min-height: auto;
}
#mdpb-live-content .md-section .row:hover {
    background: none;
}
#mdpb-live-content .mdpb-subrow {
    position: relative;
    z-index: 9;
}
#mdpb-live-content.js-custom-block .spb-column:after{
    border: 0;
}
#mdpb-live-content.mdpb-dropable .spb-column:after {
    border: 1px dashed #666;
}
/* Add class "js-drop-block-column" to "spb-column" */
#mdpb-live-content.mdpb-dropable .spb-column.js-drop-column:after {
    border-color: #007FFF;
}
.spb-column .spb-content {
    list-style: none;
}
/* Block / Object focus */
.js-custom-block .mdpb-block {
    z-index: 9;
    /*cursor: pointer;*/
    position: relative;
}
.mdpb-dropable.js-custom-block .mdpb-block.ui-sortable-helper .block-tools > a {
    /*display: inline-block;*/
    display: block;
}
.js-custom-block .mdpb-block {
    border: 1px solid transparent;
}
.js-custom-block .mdpb-block:hover {
    border: 1px solid #007FFF;
}
.mdpb-dropable .mdpb-block .block-tools {
    background-color: transparent;
}
.mdpb-block .block-tools {
    background-color: #007FFF;
    position: absolute;
    right: 0;
    top: 0;
    padding: 0 10px;
    display: none;
    z-index: 999;
    height: 32px;
}
.mdpb-dropable .ui-sortable-helper .block-tools {
    display: block;
}
.mdpb-block.ui-sortable-helper .block-tools {
    padding-left: 0;
}
.mdpb-dropable.js-custom-block .mdpb-block .block-tools {
    position: static;
}
.block-tools > h4 {
    display: none;
    color: #FFF;
    margin-right: 15px;
    vertical-align: middle;
}
.mdpb-dropable .block-tools > h4 {
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.mdpb-dropable .mdpb-block.ui-sortable-helper .block-tools > h4 {
    position: static;
    left: 0;
    top: 0;
    background: rgba(255,255,255,0.2);
    padding: 6px 10px;
    margin-right: 0;
    -webkit-transform: translate(0%, 0%);
    -ms-transform: translate(0%, 0%);
    -o-transform: translate(0%, 0%);
    transform: translate(0%, 0%);
}
.mdpb-dropable .mdpb-block.ui-sortable-helper {
    height: 32px !important;
    background: #007FFF;
}
.block-tools > a { display: inline-block; }
.col-lg-2 .block-tools h4,
.col-md-2 .block-tools h4,
.col-sm-2 .block-tools h4,
.col-xs-2 .block-tools h4,
.col-lg-1 .block-tools h4,
.col-md-1 .block-tools h4,
.col-sm-1 .block-tools h4,
.col-xs-1 .block-tools h4 {
    display: none;
}
/* Add class "js-custom-block" to tag id "mdpb-live-content" */
/*.js-custom-block .mdpb-block:hover {
    outline: 1px solid #000;
}*/
.js-custom-block .mdpb-block.block-selected:hover{
    outline: 0;
}
.js-custom-block .mdpb-block.block-selected .block-tools,
.js-custom-block .mdpb-block:hover .block-tools {
    display: block;
}
/* Add class "js-disoverflow" to "spb-scrollbar"  while drag and Drop Ojbect/block  */
.spb-scrollbar.js-disoverflow {
    overflow: visible !important;
}
/* */
#mdpb-live-content.mdpb-dropable .content-placeholder {
    height: 70px;
    border: 1px dashed #007FFF;
    z-index: 999;
    position: relative;
    list-style: none;
    margin-bottom: 8px;
}
.content-placeholder {
    height: 70px;
    border: 1px dashed #007FFF;
    z-index: 999;
    position: relative;
    list-style: none;
    margin-bottom: 8px;
}

/* Ajax loader
------------------------------------------------- */
#spb-loader{
    width:150px;
    height:4px;
    overflow:hidden;
    background-color: #FFF;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    -ms-border-radius:8px;
    -o-border-radius:8px;
    border-radius:8px;
}
.spb-loader-process{
    background-color:#0E83FF;
    margin-top:0;
    margin-left:-150px;
    width:150px;
    height:4px;
    -moz-animation-name:bounce_loadingProgressG;
    -moz-animation-duration:1.3s;
    -moz-animation-iteration-count:infinite;
    -moz-animation-timing-function:linear;
    -webkit-animation-name:bounce_loadingProgressG;
    -webkit-animation-duration:1.3s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:linear;
    -ms-animation-name:bounce_loadingProgressG;
    -ms-animation-duration:1.3s;
    -ms-animation-iteration-count:infinite;
    -ms-animation-timing-function:linear;
    -o-animation-name:bounce_loadingProgressG;
    -o-animation-duration:1.3s;
    -o-animation-iteration-count:infinite;
    -o-animation-timing-function:linear;
    animation-name:bounce_loadingProgressG;
    animation-duration:1.3s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

@-moz-keyframes bounce_loadingProgressG{
    0%{
    margin-left:-150px;
    }
    100%{
    margin-left:150px;
    }
}
@-webkit-keyframes bounce_loadingProgressG{
    0%{
    margin-left:-150px;
    }
    100%{
    margin-left:150px;
    }
}

@-ms-keyframes bounce_loadingProgressG{
    0%{
    margin-left:-150px;
    }
    100%{
    margin-left:150px;
    }
}
@-o-keyframes bounce_loadingProgressG{
    0%{
    margin-left:-150px;
    }
    100%{
    margin-left:150px;
    }
}
@keyframes bounce_loadingProgressG{
    0%{
    margin-left:-150px;
    }
    100%{
    margin-left:150px;
    }
}

/* Toolbar Responsive Viewport

------------------------------------------------------------- */
#spb-toolbar-viewport {
    position: fixed;
    z-index: 9999;
    left: 0;
    right: 0;
    top: 0;
    height: 32px;
    opacity: .9;
}
.toolbar.toolbar-drawer #spb-toolbar-viewport {
    top: 66px;
}
.toolbar #spb-toolbar-viewport {
    top: 31px;
}
.admin-menu #spb-toolbar-viewport {
    top: 21px;
}

#spb-toolbar-viewport.light,
.spb-toolbar-viewport.light {
    background: rgba(255,255,255,.9);
}
#spb-toolbar-viewport.dark,
.spb-toolbar-viewport.dark {
    background: rgba(0,0,0,.9);
}
.spb-toolbar-viewport  .viewport-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
}
.spb-toolbar-viewport .viewport-size {
    display: block;
    position: relative;
    height: 32px;
    margin: 0 auto;
    text-align: left;
    border: none;
    padding: 0;
}
.spb-toolbar-viewport .vp-color {
    height: 32px;
    -webkit-transition: all 175ms ease;
    -moz-transition: all 175ms ease;
    -o-transition: all 175ms ease;
    transition: all 175ms ease;
}
.spb-toolbar-viewport .viewport-size:before,
.spb-toolbar-viewport .viewport-size:after {
    display: block;
    background: #999;
    height: 9px;
    width: 1px;
    content: '';
    position: absolute;
    bottom: 0;
    -webkit-transition: background-position 300ms;
    -moz-transition: background-position 300ms;
    -o-transition: background-position 300ms;
    transition: background-position 300ms;
}
.spb-toolbar-viewport .viewport-size.vp-fullwidth:before,
.spb-toolbar-viewport .viewport-size.vp-fullwidth:after {
    display: none;
}
.spb-toolbar-viewport .viewport-size:before {
    right: 0;
}
.spb-toolbar-viewport .viewport-size:after {
    left: 0;
}
.viewport-size.vp-fullwidth:hover .vp-color,
.viewport-size.vp-fullwidth.js-vp-active .vp-color {
    background-color: #000;
}
.spb-toolbar-viewport .viewport-size.vp-table-landscape {
    max-width: 1024px;
    width: 80%;
}
.sub-layout-dialog .viewport-size.vp-table-landscape {
    max-width: 960px;
    width: 80%;
}
.viewport-size.vp-table-landscape:hover .vp-color,
.viewport-size.vp-table-landscape.js-vp-active .vp-color {
    background-color: #007FFF;
}
.spb-toolbar-viewport .viewport-size.vp-table-portrait {
    max-width: 768px;
    width: 60%;
}
.sub-layout-dialog .viewport-size.vp-table-portrait {
    max-width: 600px;
    width: 60%;
}
.viewport-size.vp-table-portrait:hover .vp-color,
.viewport-size.vp-table-portrait.js-vp-active .vp-color {
    background-color: #A9CF54;
}
.spb-toolbar-viewport .viewport-size.vp-mobile-landscape {
    max-width: 460px;
    width: 40%;
}
.sub-layout-dialog .viewport-size.vp-mobile-landscape {
    max-width: 320px;
    width: 40%;
}
.viewport-size.vp-mobile-landscape:hover .vp-color,
.viewport-size.vp-mobile-landscape.js-vp-active .vp-color  {
    background-color: #F7E967;
}
.spb-toolbar-viewport .vp-lable-left,
.spb-toolbar-viewport .vp-lable-right {
    color: #999999;
    font-size: 1em;
    position: absolute;
    top: 1px;
    display: block;
    width: 40px;
    text-align: center;
    opacity: 1;
    -webkit-transition: opacity 300ms ease;
    -moz-transition: opacity 300ms ease;
    -o-transition: opacity 300ms ease;
    transition: opacity 300ms ease;
}

.js-vp-active .vp-lable-left,
.js-vp-active .vp-lable-right {
   font-weight: 600;
}
.dark .js-vp-active .vp-lable-left,
.dark .js-vp-active .vp-lable-right {
   color: #FFF;
}
.light .js-vp-active .vp-lable-left,
.light .js-vp-active .vp-lable-right {
   color: #000;
}
.spb-toolbar-viewport .vp-lable-left {left: -20px;}
.spb-toolbar-viewport .vp-lable-right {right: -20px;}
.spb-toolbar-viewport .viewport-icon {
    color: black;
    line-height: 32px;
    text-align: center;
    font-size: 24px;
    position: relative;
    margin: 0 auto;
    pointer-events: none;
}
/* Viewport icon when active separate responsive
    + .pbi-desktop
    + .pbi-landscape
    + .pbi-portrait
    + .pbi-mobile
------------------------------------------------------------- */

.dark .viewport-icon .pbi-desktop,
.dark .viewport-icon .pbi-landscape,
.dark .viewport-icon .pbi-mobile,
.dark .viewport-icon .pbi-portrait {
    color: #FFF;
    font-size: 20px;
}
.light .viewport-icon .pbi-desktop,
.light .viewport-icon .pbi-landscape,
.light .viewport-icon .pbi-mobile,
.light .viewport-icon .pbi-portrait {
    color: #000;
    font-size: 20px;
}

/* Md Live Content */
.mdpb-live-content .row {
    margin-left: -15px;
    margin-right: -15px;
}

/*  Picker Color
* containerClassName: "spb-spectrum"
* replacerClassName: "spb-pickercolor"
----------------------------------------------------------------------------------------------*/
.form-color label {
    display: inline-block;
    margin-left: 10px;
}
/* Replacer Element */
.spb-pickercolor.sp-replacer {
    border: 1px solid #666;
    height: 20px;
    padding: 0;
    width: 20px;
}
.spb-pickercolor.sp-replacer .sp-preview {
    border: 0 none;
    height: 100%;
    width: 100%;
}
.spb-pickercolor .sp-dd {
    display: none;
}
/* Replacer Container */
.spb-spectrum.sp-container {
    background-color:#292A2D;
    border: 1px solid #3C4045;

    -webkit-box-shadow: 0 5px 6px 0px #000000;
    -moz-box-shadow: 0 5px 6px 0px #000000;
    box-shadow: 0 5px 6px 0px #000000;
}
.spb-spectrum .sp-picker-container {
    border: 0;
}
.spb-spectrum .sp-input-container input {
    border: 1px solid #3C4145;
    background-color: #1D1F21;
    color: #666;
}
/* Button CHOOSE */
.spb-spectrum.sp-container button {
    border: 1px solid #CCCCCC;
    background-color: rgba(0,0,0,0);
    color: #ccc;
    background-image: none;
    text-shadow: none;
}
.spb-spectrum.sp-container button:active {
    box-shadow: none;
}
/* Show value color */
.md-pagebuilder .form-color .value-color {
    border: 0;
    background: rgba(0,0,0,0);
    color: #CECFD1;
    width: 70px;
    display: inline-block;
    font-size: 12px;
}
.md-pagebuilder .form-color .value-color:focus {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.form-color-inner {
    border: 1px solid #3C4045;
    display: inline-block;
    padding: 0 5px;

    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.spb-fluid-fluid.md-btn {
    background: #007FFF;
    color: #fff;
    margin-right: 10px;
}
.spb-fluid-fixed.md-btn {
    background: #FF6600;
    color: #fff;
}
/* ===============================================================
                        Global Style
================================================================== */
* html .clearfix,
* html .ui-helper-clearfix {
    height: 1%; /* IE5-6 */
}

.clearfix,
.ui-helper-clearfix {
    display: inline-block; /* IE7xhtml*/
}

html .clearfix,
html .ui-helper-clearfix {
    display: block; /* O */
}

.clearfix:after,
.ui-helper-clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
    line-height: 0;
    font-size: 1px;
    overflow: hidden;
}
.clear {clear: both;}

.spb-edit #mdpb-live-content .spb-column,
.spb-edit  #mdpb-live-layout .spb-column,
.spb-edit  #mdpb-live-content .md-section > .container,
.spb-edit  .sub-layout-dialog .spb-column {
    min-height: 85px;
}

.mdpb-toolbar {
    position: absolute;
}


.ui-sortable-helper .block-tools .row-edit,
.ui-sortable-helper .block-tools .row-move,
.ui-sortable-helper .block-tools .row-delete {
    display: none !important;
}

.ui-sortable-helper .block-tools h4 {
    background: none;
    font-family: "Open Sans" !important;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 28px;
    margin: 0 !important;
    padding: 0 10px !important;
    text-transform: lowercase;
}