/* -------------------------------------------------- 
  :: ControlBlockPatterns Font
  ---------------------------------------------------*/

.ui-tabs li>a [class^="cpb-icon-"],
.ui-tabs li>a [class*=" cpb-icon-"] {
    display: block;
    height: 14px;
    float: right;
    padding: 2px 0px 0 9px;
}


/* -------------------------------------------------- 
  :: Messages
  ---------------------------------------------------*/

.wrap.settings-wrap div.error,
.wrap.settings-wrap div.updated {
    margin: 9px 2px 0px 5px !important;
}


/* -------------------------------------------------- 
  :: ControlBlockPatterns Wrappers
  ---------------------------------------------------*/

#cbp-settings-api>.ui-tabs {
    margin: 0px 2px 0 5px;
    -webkit-box-shadow: inset -146px 0 0 #f1f1f1, inset -147px 0 0 #ccc, 0 1px 3px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset -146px 0 0 #f1f1f1, inset -147px 0 0 #ccc, 0 1px 3px rgba(0, 0, 0, 0.05);
    box-shadow: inset -146px 0 0 #f1f1f1, inset -147px 0 0 #ccc, 0 1px 3px rgba(0, 0, 0, 0.05);
}


/* -------------------------------------------------- 
  :: Header
  ---------------------------------------------------*/

#block-patterns-header {
    margin: 11px 2px 0 5px;
}

#block-patterns-header li {
    float: right;
}

#block-patterns-header #block-patterns-logo a {
    border-right: 0;
    border-left: 1px solid #333;
    float: right;
    padding: 3px 13px 3px 12px;
}

#block-patterns-header li#block-patterns-logo:hover {
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topright: 2px;
    border-top-right-radius: 2px;
}

#block-patterns-header #block-patterns-version span,
#block-patterns-header #theme-version span {
    border-left: 0;
    border-right: 1px solid #555;
    float: left;
}

#block-patterns-header #theme-version:before {
    border-right: 0;
    border-left: 1px solid #333;
    float: right;
}


/* light */

.admin-color-light #block-patterns-header #block-patterns-logo a,
.admin-color-light #block-patterns-header #theme-version:before {
    border-left-color: #3c3c3c;
}

.admin-color-light #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #3c3c3c;
}

.admin-color-light #block-patterns-header #block-patterns-version span,
.admin-color-light #block-patterns-header #theme-version span {
    border-right-color: #999;
}


/* blue */

.admin-color-blue #block-patterns-header #block-patterns-logo a,
.admin-color-blue #block-patterns-header #theme-version:before {
    border-left-color: #002b39;
}

.admin-color-blue #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #002b39;
}

.admin-color-blue #block-patterns-header #block-patterns-version span,
.admin-color-blue #block-patterns-header #theme-version span {
    border-right-color: #5dc2e6;
}


/* coffee */

.admin-color-coffee #block-patterns-header #block-patterns-logo a,
.admin-color-coffee #block-patterns-header #theme-version:before {
    border-left-color: #0f0e0d;
}

.admin-color-coffee #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #0f0e0d;
}

.admin-color-coffee #block-patterns-header #block-patterns-version span,
.admin-color-coffee #block-patterns-header #theme-version span {
    border-right-color: #675f58;
}


/* ectoplasm */

.admin-color-ectoplasm #block-patterns-header #block-patterns-logo a,
.admin-color-ectoplasm #block-patterns-header #theme-version:before {
    border-left-color: #181220;
}

.admin-color-ectoplasm #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #181220;
}

.admin-color-ectoplasm #block-patterns-header #block-patterns-version span,
.admin-color-ectoplasm #block-patterns-header #theme-version span {
    border-right-color: #644d85;
}


/* midnight */

.admin-color-midnight #block-patterns-header #block-patterns-logo a,
.admin-color-midnight #block-patterns-header #theme-version:before {
    border-left-color: #090a0b;
}

.admin-color-midnight #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #090a0b;
}

.admin-color-midnight #block-patterns-header #block-patterns-version span,
.admin-color-midnight #block-patterns-header #theme-version span {
    border-right-color: #4c5359;
}


/* ocean */

.admin-color-ocean #block-patterns-header #block-patterns-logo a,
.admin-color-ocean #block-patterns-header #theme-version:before {
    border-left-color: #39464a;
}

.admin-color-ocean #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #39464a;
}

.admin-color-ocean #block-patterns-header #block-patterns-version span,
.admin-color-ocean #block-patterns-header #theme-version span {
    border-right-color: #87a6af;
}


/* sunrise */

.admin-color-sunrise #block-patterns-header #block-patterns-logo a,
.admin-color-sunrise #block-patterns-header #theme-version:before {
    border-left-color: #8a322a;
}

.admin-color-sunrise #block-patterns-header li#block-patterns-logo:hover a {
    border-left-color: #8a322a;
}

.admin-color-sunrise #block-patterns-header #block-patterns-version span,
.admin-color-sunrise #block-patterns-header #theme-version span {
    border-right-color: #e75546;
}


/* -------------------------------------------------- 
  :: Sub Header
  ---------------------------------------------------*/

#block-patterns-sub-header {
    margin: 0 2px 0 5px;
}


/* -------------------------------------------------- 
  :: Tabs
  ---------------------------------------------------*/

.wrap.settings-wrap .ui-tabs-nav {
    float: right;
    margin: 0 -4px 0 0;
}

.wrap.settings-wrap .ui-tabs-nav li {
    border-left-width: 0;
    border-right-width: 1px;
    -webkit-border-radius: 0 2px 2px 0;
    -moz-border-radius: 0 2px 2px 0;
    border-radius: 0 2px 2px 0;
}

.wrap.settings-wrap .ui-tabs-nav li a {
    padding: 5px 12px 5px 5px;
}


/* -------------------------------------------------- 
  :: Format Setting
  ---------------------------------------------------*/

.cbp-format-setting .cbp-format-setting-inner {
    float: right;
}

.cbp-format-setting .description {
    float: left;
}

#post .cbp-format-setting-inner p {
    float: right;
}

.docs-ul li {
    margin-left: 0;
    margin-right: 20px;
}

#contextual-help-setting {
    float: right;
}

#contextual-help-label {
    float: right;
}

#block_patterns_settings_help {
    float: right;
}

#cbp-settings-api blockquote {
    padding-left: 0;
    padding-right: 15px;
}

#cbp-settings-api blockquote:before {
    left: auto;
    right: -10px;
    top: 10px;
}


/* -------------------------------------------------- 
  :: Input & Upload
  ---------------------------------------------------*/

input.cbp-ui-upload-input,
input.block-patterns-ui-input {
    -moz-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
}

.block-patterns-sortable input.cbp-ui-upload-input,
.block-patterns-sortable input.block-patterns-ui-input {
    width: 99.9%;
    /* fixes a strange bug with input with */
}


/* -------------------------------------------------- 
  :: Upload
  ---------------------------------------------------*/

div.cbp-ui-media-wrap {
    margin: 5px 0 0 55px;
}

.cbp-ui-media-wrap img {
    float: right;
}

.cbp-ui-upload-parent {
    margin-right: 0;
    margin-left: 45px;
}

.cbp-format-setting .cbp-upload-media {
    right: auto;
    left: -45px;
}

.cbp-ui-media-wrap a.cbp-ui-remove-media {
    right: auto;
    left: -55px;
}


/* -------------------------------------------------- 
  :: Setting Item with Drag & Drop
  ---------------------------------------------------*/

.cbp-setting .open {
    padding: 10px 10px 10px 100px;
}

.cbp-setting .open:hover:before {
    left: auto;
    right: 4px;
}

.button-section {
    right: auto;
    left: 0px;
}


/* -------------------------------------------------- 
  :: Layouts
  ---------------------------------------------------*/

#cbp-options-layouts-form {
    left: auto;
    right: 13px;
}

.block-patterns-save-layout {
    float: right;
}

.block-patterns-save-layout.active-layout {
    border-left: 0;
    border-right: 1px solid #fff;
    padding-left: 0;
    padding-right: 9px;
}

.block-patterns-save-layout .widefat {
    float: right;
}

.block-patterns-save-layout button.blue {
    margin: 0 10px 0 0;
}

.block-patterns-active-layout {
    border-right: 0;
    border-left: 1px solid #ccc;
    float: right;
    padding: 10px 0 10px 10px;
}

.button.save-layout {
    margin: 0 10px 0 0 !important;
}


/* -------------------------------------------------- 
  :: Option Group
  ---------------------------------------------------*/

.cbp-option-group {
    float: right;
    padding-right: 0px;
    padding-left: 5px;
}

.cbp-option-group--is-last {
    padding-left: 0;
}

.cbp-option-group--icon {
    border-left: 1px solid #ccc;
    border-right: 0px;
    left: auto;
    right: 1px;
}

.cbp-option-group--icon+input.block-patterns-ui-input {
    padding-left: 5px !important;
    padding-right: 34px !important;
    margin-left: 5px;
    margin-right: 0px;
}

.cbp-option-group--checkbox {
    float: right;
    padding-right: 0px;
    padding-left: 10px;
}

#post-body .cbp-option-group--checkbox p {
    float: right;
}


/* -------------------------------------------------- 
  :: Select
  ---------------------------------------------------*/

.cbp-select-wrapper {
    background: #fff url(../images/block-patternsselect-rtl.png) no-repeat left center;
    float: right;
    margin: 0 0 5px 5px;
    -moz-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
}

.cbp-select-wrapper:hover {
    background-image: url(../images/select-hover-rtl.png);
}

.cbp-select-wrapper span {
    padding-left: 27px;
    padding-right: 7px;
}

.type-measurement .cbp-select-wrapper {
    margin-left: 0;
    right: auto;
    left: 0px;
}


/* FireFox */

@-moz-document url-prefix() {
    #cbp-options-layouts-form .cbp-select-wrapper {
        left: auto;
        right: 250px;
    }
    ;
}


/* -------------------------------------------------- 
  :: Measurement
  ---------------------------------------------------*/

.block-patterns-ui-measurement-input-wrap {
    margin-right: 0;
    margin-left: 80px;
}


/* -------------------------------------------------- 
  :: Checkbox & Radio
  ---------------------------------------------------*/

.cbp-format-setting.type-checkbox input,
.cbp-format-setting.type-radio input {
    float: right;
    margin: 2px 1px 0 5px;
}

.cbp-format-setting.type-checkbox label,
.cbp-format-setting.type-radio label {
    float: right;
}

#cbp-settings-api .cbp-format-setting.type-checkbox p,
#cbp-settings-api .cbp-format-setting.type-radio p {
    float: right;
}


/* -------------------------------------------------- 
  :: Radio Images
  ---------------------------------------------------*/

.type-radio-image .cbp-ui-radio-images {
    float: right;
    margin: 0 0px 10px 10px;
}


/* -------------------------------------------------- 
  :: Numeric Slider
  ---------------------------------------------------*/

.cbp-numeric-slider-wrap {
    margin: 0 0 0 96px;
}

.cbp-numeric-slider-wrap .cbp-numeric-slider-helper-input {
    right: auto;
    left: 5px;
}

.cbp-numeric-slider.ui-slider {
    -webkit-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
}


/* -------------------------------------------------- 
  :: Colorpicker
  ---------------------------------------------------*/

.block-patterns-ui-colorpicker-input-wrap {
    float: right;
}

.block-patterns-ui-colorpicker-input-wrap .block-patterns-ui-colorpicker-label {
    margin-left: 10px;
    margin-right: 0px;
}

.type-link-color .block-patterns-ui-colorpicker-input-wrap {
    margin-left: 20px;
    margin-right: 0px;
}

.block-patterns-ui-colorpicker-input-wrap .wp-color-result {
    margin: 0px 0px 5px 5px;
}

.block-patterns-ui-colorpicker-input-wrap .wp-picker-container .iris-picker {
    margin: 0px 0px 5px 5px;
}


/* -------------------------------------------------- 
  :: Google Font
  ---------------------------------------------------*/

.js-remove-google-font.cbp-ui-button.button {
    margin-left: 5px;
    margin-right: 0;
    margin-top: 0;
}


/* -------------------------------------------------- 
  :: ControlBlockPatterns UI Buttons 
  ---------------------------------------------------*/

.cbp-ui-button {
    float: right !important;
}

.cbp-ui-button.right {
    float: left !important;
}

.cbp-ui-button.hug-left {
    margin-right: 0px;
}

.cbp-ui-button.hug-right {
    margin-left: 0px;
}

.cbp-ui-button.left-item {
    float: right !important;
    margin: 5px 5px 5px 0;
    -webkit-border-radius: 0px 2px 2px 0px;
    -moz-border-radius: 0px 2px 2px 0px;
    border-radius: 0px 2px 2px 0px;
}

.cbp-ui-button.center-item {
    margin: 5px -1px 5px 0;
}

.cbp-ui-button.right-item {
    float: left !important;
    margin: 5px -1px 5px 5px;
    -webkit-border-radius: 2px 0px 0px 2px;
    -moz-border-radius: 2px 0px 0px 2px;
    border-radius: 2px 0px 0px 2px;
}

.cbp-ui-buttons {
    margin: 11px 2px 0 5px;
}

button.reset-settings {
    left: auto;
    right: 8px;
}


/* -------------------------------------------------- 
  :: ControlBlockPatterns UI Button Icons 
  ---------------------------------------------------*/

.cbp-ui-button .icon {
    float: right;
    text-indent: 0;
}

.cbp-ui-button .icon.left-label {
    margin-left: 10px;
    float: left;
}


/* -------------------------------------------------- 
  :: Gallery
  ---------------------------------------------------*/

ul.cbp-gallery-list {
    float: right;
}

ul.cbp-gallery-list li {
    float: right;
    margin: 0px 0 10px 10px;
}

.block-patternsgallery-buttons {
    float: right;
}


/* -------------------------------------------------- 
  :: Google Fonts
  ---------------------------------------------------*/

.cbp-google-font-family,
.cbp-google-font-variants,
.cbp-google-font-subsets,
#cbp-settings-api p.checkbox-wrap,
#post-body .cbp-metabox-panels p.checkbox-wrap {
    float: right;
}


/* -------------------------------------------------- 
  :: On/Off Switch
  ---------------------------------------------------*/

@media only screen {
    .on-off-switch {
        -webkit-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
        -moz-box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
        box-shadow: inset -1px 1px 1px rgba(0, 0, 0, 0.05);
    }
    .on-off-switch label {
        float: right;
    }
    .on-off-switch .slide-button {
        left: auto;
        right: -1px;
    }
    .on-off-switch input:last-of-type:checked~.slide-button {
        left: auto;
        right: 50%;
    }
}


/* -------------------------------------------------- 
  :: Date Picker
  ---------------------------------------------------*/

.ui-datepicker {
    direction: rtl;
}

.ui-datepicker .ui-widget-header {
    left: auto;
    right: -1px;
}

.ui-datepicker-prev:before {
    border-right: 0px;
    border-left: 1px solid #555;
    content: "\f105";
    float: left;
    width: 31px;
    height: 30px;
}

.ui-datepicker-prev {
    border-right: 0px;
    border-left: 1px solid #333;
    float: right;
    width: 31px;
}

.ui-datepicker-next:before {
    border-left: 0px;
    border-right: 1px solid #333;
    content: "\f104";
    float: right;
    width: 30px;
    height: 30px;
}

.ui-datepicker-next {
    border-left: 0px;
    border-right: 1px solid #555;
    float: left;
    width: 30px;
}

.ui-datepicker thead th:last-child {
    border-left: 1px solid #ccc;
}

.ui-datepicker tbody td {
    border-left: 1px solid #ccc;
}

.ui-datepicker tbody td:first-child {
    border-left: 0px;
}

.ui-datepicker .ui-datepicker-buttonpane button {
    float: left;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    float: right;
}

@-moz-document url-prefix() {
    .ui-datepicker-calendar {
        position: relative;
        right: -1px;
    }
    .ui-datepicker-calendar thead {
        border-right: 1px solid #ccc;
    }
}


/* -------------------------------------------------- 
  :: Time Picker
  ---------------------------------------------------*/

.ui-timepicker-div {
    direction: rtl;
}

.ui-timepicker-div dl {
    text-align: right;
    padding: 0 5px 0 0;
}

.ui-timepicker-div dl dt {
    float: right;
    clear: right;
}

.ui-timepicker-div dl dd {
    margin: 0 45% 10px 10px;
}


/* -------------------------------------------------- 
  :: Meta Box Tabs
  ---------------------------------------------------*/

.cbp-metabox-tabs.ui-tabs .cbp-metabox-nav.ui-tabs-nav {
    float: right;
    margin: 0 0 0 -1px;
}

.cbp-metabox-tabs.ui-tabs .cbp-metabox-nav.ui-tabs-nav li {
    border-width: 1px 1px 1px 0px;
    -webkit-border-radius: 0 0 2px 2px;
    -moz-border-radius: 0 0 2px 2px;
    border-radius: 0 0 2px 2px;
}

.cbp-metabox-tabs.ui-tabs .cbp-metabox-nav.ui-tabs-nav li a {
    padding: 5px 12px 5px 5px;
}


/* -------------------------------------------------- 
  :: Theme Option & Side Metabox Tabs
  ---------------------------------------------------*/

.ctrl-block-patterns-option-tabs.ui-tabs .cbp-options-nav.ui-tabs-nav li.ui-state-default,
#side-sortables .cbp-metabox-tabs.ui-tabs .cbp-metabox-nav.ui-tabs-nav li.ui-state-default {
    float: right;
    margin: 0 3px 0 0 !important;
}