File: /home/grainesdfo/www/wp-content/themes/jupiterx/lib/assets/dist/css/customizer.css
.select2-container .jupiterx-select2-container.select2-selection--single {
display: block;
height: auto;
margin: 0;
padding: 0 20px 0 10px;
color: #fff;
background-color: #757575;
border: 1px solid #757575;
border-radius: 3px;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
cursor: pointer;
}
.select2-container .jupiterx-select2-container.select2-selection--single:focus {
outline: none;
}
.select2-container .jupiterx-select2-container.select2-selection--single .select2-selection__rendered {
height: 28px;
padding: 0;
color: #fff;
font-size: 12px;
line-height: 26px;
}
.select2-container .jupiterx-select2-container.select2-selection--single .select2-selection__placeholder {
color: #fff;
}
.select2-container .jupiterx-select2-container.select2-selection--single .select2-selection__arrow {
display: none;
}
.select2-container .jupiterx-select2-container.select2-selection--single .select2-selection__arrow b {
border-color: #fff transparent transparent transparent;
}
.select2-container .jupiterx-select2-container.select2-selection--single .select2-selection__clear {
height: 100%;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple {
display: block;
height: auto;
min-height: 28px;
margin: 0;
padding: 0 10px;
color: #fff;
background-color: #404040;
border: 1px solid #333333;
border-radius: 3px;
cursor: pointer;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple:focus {
outline: none;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__rendered {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0;
color: #fff;
font-size: 12px;
line-height: 26px;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__rendered li {
margin: 0;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
margin: 0 5px 0 0;
padding: 0;
background: none;
border: none;
font-size: 12px;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__rendered .select2-selection__choice + .select2-search--inline {
display: none;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__placeholder {
color: #fff;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__arrow b {
border-color: #fff transparent transparent transparent;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-search {
margin: 0;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-search__field {
color: #fff;
margin-top: 0;
}
.select2-container .jupiterx-select2-container.select2-selection--multiple .select2-selection__choice__remove:hover {
color: #d64848;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown {
background-color: #757575;
border: none;
z-index: 900000;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-results__options:focus {
outline: none;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-results__option {
margin: 0;
padding: 5px 10px;
color: #fff;
font-size: 12px;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-results__option.select2-results__option--highlighted:last-child {
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-results__option:focus {
outline: none;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-results__option[data-selected=true] {
background-color: #658897;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-search {
padding: 0;
}
.select2-container .jupiterx-select2-dropdown.select2-dropdown .select2-search__field {
height: 28px;
margin: 0;
padding: 5px 10px;
background-color: #404040;
border: 1px solid #333;
border-left: 0;
border-right: 0;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
font-size: 12px;
}
.select2-container .jupiterx-select2-dropdown-wrapped.select2-dropdown .select2-results__option {
max-width: 250px;
}
.select2-container .jupiterx-select2-dropdown-wrapped.select2-dropdown .jupiterx-pro-badge {
vertical-align: bottom;
margin-left: 5px;
max-height: 18px;
}
.select2-container .jupiterx-select2-autocomplete.select2-selection--multiple {
height: 28px;
}
.select2-container .jupiterx-select2-autocomplete.select2-selection--multiple .select2-selection__choice__remove {
display: none;
}
.select2-container.select2-container--open .jupiterx-select2-container.select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #fff transparent;
}
.select2-container.select2-container--open .jupiterx-select2-container.select2-selection--multiple .select2-selection__arrow b {
border-color: transparent transparent #fff transparent;
}
.select2-container.select2-container--open .jupiterx-select2-autocomplete.select2-selection--multiple .select2-selection__choice {
display: none;
}
.jupiterx-row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-line-pack: start;
align-content: flex-start;
margin: 12px 0;
padding: 0 12px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-row .jupiterx-row {
margin: 0 -20px;
}
.jupiterx-row.reverse {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.jupiterx-col.reverse {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.jupiterx-col,
.jupiterx-col-1,
.jupiterx-col-2,
.jupiterx-col-2-alt,
.jupiterx-col-3,
.jupiterx-col-3-alt,
.jupiterx-col-4,
.jupiterx-col-5,
.jupiterx-col-6,
.jupiterx-col-7,
.jupiterx-col-8,
.jupiterx-col-9,
.jupiterx-col-10,
.jupiterx-col-11,
.jupiterx-col-12,
.jupiterx-col-offset-0,
.jupiterx-col-offset-1,
.jupiterx-col-offset-2,
.jupiterx-col-offset-3,
.jupiterx-col-offset-4,
.jupiterx-col-offset-5,
.jupiterx-col-offset-6,
.jupiterx-col-offset-7,
.jupiterx-col-offset-8,
.jupiterx-col-offset-9,
.jupiterx-col-offset-10,
.jupiterx-col-offset-11,
.jupiterx-col-offset-12 {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
padding-right: 8px;
padding-left: 8px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-col {
-ms-flex-preferred-size: 0;
flex-basis: 0;
max-width: 100%;
}
.jupiterx-col-1 {
-ms-flex-preferred-size: 8.33333333%;
flex-basis: 8.33333333%;
max-width: 8.33333333%;
}
.jupiterx-col-2 {
-ms-flex-preferred-size: 16.66666667%;
flex-basis: 16.66666667%;
max-width: 16.66666667%;
}
.jupiterx-col-2-alt {
-ms-flex-preferred-size: 20.9999999%;
flex-basis: 20.9999999%;
max-width: 20.9999999%;
}
.jupiterx-col-3 {
-ms-flex-preferred-size: 25%;
flex-basis: 25%;
max-width: 25%;
}
.jupiterx-col-3-alt {
-ms-flex-preferred-size: 29%;
flex-basis: 29%;
max-width: 29%;
}
.jupiterx-col-4 {
-ms-flex-preferred-size: 33.33333333%;
flex-basis: 33.33333333%;
max-width: 33.33333333%;
}
.jupiterx-col-5 {
-ms-flex-preferred-size: 41.66666667%;
flex-basis: 41.66666667%;
max-width: 41.66666667%;
}
.jupiterx-col-6 {
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
max-width: 50%;
}
.jupiterx-col-7 {
-ms-flex-preferred-size: 58.33333333%;
flex-basis: 58.33333333%;
max-width: 58.33333333%;
}
.jupiterx-col-8 {
-ms-flex-preferred-size: 66.66666667%;
flex-basis: 66.66666667%;
max-width: 66.66666667%;
}
.jupiterx-col-9 {
-ms-flex-preferred-size: 75%;
flex-basis: 75%;
max-width: 75%;
}
.jupiterx-col-10 {
-ms-flex-preferred-size: 83.33333333%;
flex-basis: 83.33333333%;
max-width: 83.33333333%;
}
.jupiterx-col-11 {
-ms-flex-preferred-size: 91.66666667%;
flex-basis: 91.66666667%;
max-width: 91.66666667%;
}
.jupiterx-col-12 {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%;
}
.jupiterx-col-offset-0 {
margin-left: 0;
}
.jupiterx-col-offset-1 {
margin-left: 8.33333333%;
}
.jupiterx-col-offset-2 {
margin-left: 16.66666667%;
}
.jupiterx-col-offset-3 {
margin-left: 25%;
}
.jupiterx-col-offset-4 {
margin-left: 33.33333333%;
}
.jupiterx-col-offset-5 {
margin-left: 41.66666667%;
}
.jupiterx-col-offset-6 {
margin-left: 50%;
}
.jupiterx-col-offset-7 {
margin-left: 58.33333333%;
}
.jupiterx-col-offset-8 {
margin-left: 66.66666667%;
}
.jupiterx-col-offset-9 {
margin-left: 75%;
}
.jupiterx-col-offset-10 {
margin-left: 83.33333333%;
}
.jupiterx-col-offset-11 {
margin-left: 91.66666667%;
}
.jupiterx-start {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
text-align: start;
}
.jupiterx-center {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
}
.jupiterx-end {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
text-align: end;
}
.jupiterx-top {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.jupiterx-middle {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.jupiterx-bottom {
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
.jupiterx-around {
-ms-flex-pack: distribute;
justify-content: space-around;
}
.jupiterx-between {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.jupiterx-first {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1;
}
.jupiterx-last {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}
@-webkit-keyframes jupiterx-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes jupiterx-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.jupiterx-responsive-control {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.jupiterx-responsive-control .customize-control-title {
-webkit-box-ordinal-group: -49;
-ms-flex-order: -50;
order: -50;
-webkit-box-flex: 0;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
max-width: none;
width: auto;
}
.jupiterx-responsive-control .jupiterx-viewport {
width: calc(100% - 27px);
}
.customize-control-jupiterx-input .jupiterx-responsive-control .jupiterx-viewport,
.customize-control-jupiterx-textarea .jupiterx-responsive-control .jupiterx-viewport {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.jupiterx-responsive-control .customize-control-title ~ .jupiterx-viewport {
-webkit-box-flex: 1;
-ms-flex: 1 0 100%;
flex: 1 0 100%;
max-width: 100%;
width: 100%;
}
.jupiterx-responsive-control .jupiterx-responsive-switcher {
-webkit-box-ordinal-group: 51;
-ms-flex-order: 50;
order: 50;
-webkit-box-flex: 0;
-ms-flex: 0 0 22px;
flex: 0 0 22px;
max-width: 22px;
width: 22px;
margin: 3px 0 0 5px;
}
.jupiterx-responsive-control .customize-control-title ~ .jupiterx-responsive-switcher {
-webkit-box-ordinal-group: -24;
-ms-flex-order: -25;
order: -25;
margin: 0 0 0 5px;
}
.jupiterx-responsive-switcher {
position: relative;
z-index: 200;
width: 22px;
height: 22px;
}
.jupiterx-responsive-switcher-buttons {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: absolute;
top: -3px;
left: -1px;
padding: 3px 2px;
margin: 0 0 0 -1px;
background-color: transparent;
border-radius: 14px;
-webkit-box-shadow: none;
box-shadow: none;
}
.jupiterx-responsive-switcher:hover .jupiterx-responsive-switcher-buttons {
background-color: #6b6b6b;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
}
.jupiterx-responsive-switcher-button {
display: none;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 22px;
height: 22px;
margin: 0 1px;
border-radius: 50%;
cursor: pointer;
}
.jupiterx-responsive-switcher-button:hover {
background-color: #828282;
}
.jupiterx-responsive-switcher:hover .jupiterx-responsive-switcher-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-responsive-switcher-icon,
.jupiterx-responsive-switcher-icon img {
display: block;
line-height: 0;
}
.jupiterx-viewport-desktop,
.jupiterx-viewport-tablet,
.jupiterx-viewport-mobile {
display: none;
}
.preview-desktop .jupiterx-viewport-desktop,
.preview-tablet .jupiterx-viewport-tablet,
.preview-mobile .jupiterx-viewport-mobile {
display: block;
}
.preview-desktop .jupiterx-responsive-switcher-desktop,
.preview-tablet .jupiterx-responsive-switcher-tablet,
.preview-mobile .jupiterx-responsive-switcher-mobile {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.preview-desktop .jupiterx-responsive-switcher-desktop, .preview-desktop .jupiterx-responsive-switcher-desktop:hover,
.preview-tablet .jupiterx-responsive-switcher-tablet,
.preview-tablet .jupiterx-responsive-switcher-tablet:hover,
.preview-mobile .jupiterx-responsive-switcher-mobile,
.preview-mobile .jupiterx-responsive-switcher-mobile:hover {
background-color: #3c3c3c;
}
.jupiterx-button {
display: inline-block;
height: 28px;
padding: 0 8px;
background-color: #6b6b6b;
border: 1px solid transparent;
border-radius: 2px;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
font-size: 12px;
white-space: nowrap;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
cursor: pointer;
}
.jupiterx-button:hover {
background-color: #757575;
}
.jupiterx-button:focus {
outline: none;
}
.jupiterx-button:active {
-webkit-transform: translateY(1px);
transform: translateY(1px);
}
.jupiterx-button[disabled] {
opacity: 0.5;
}
.jupiterx-button-danger {
background-color: #d64848;
}
.jupiterx-button-danger:hover {
background-color: #e45454;
}
.jupiterx-button-outline {
background-color: transparent;
border: 1px solid #6b6b6b;
-webkit-box-shadow: none;
box-shadow: none;
color: #6b6b6b;
}
.jupiterx-button-outline:hover {
background-color: transparent;
}
.jupiterx-button-outline.jupiterx-button-danger {
border-color: #d64848;
color: #d64848;
}
.jupiterx-button-outline.jupiterx-button-danger:hover {
border-color: #e45454;
color: #e45454;
}
.jupiterx-button-small {
height: 23px;
padding: 0 6px;
font-size: 10px;
font-weight: bold;
}
.jupiterx-input-group {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.jupiterx-input-group-wide {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.jupiterx-input-group.has-unit input {
padding-right: 28px;
}
.jupiterx-input-group.has-icon input {
width: calc(100% - 27px);
min-height: auto;
}
.jupiterx-input-group-icon {
-ms-flex-negative: 0;
flex-shrink: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 30px;
height: 27px;
padding-right: 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-input-group-text {
display: block;
padding-right: 6px;
font-size: 12px;
line-height: 27px;
white-space: nowrap;
}
.jupiterx-input-group-unit {
position: absolute;
top: 0;
right: 0;
display: block;
max-height: 100%;
height: 27px;
width: 28px;
color: #999;
font-size: 11px;
line-height: 26px;
text-align: center;
white-space: nowrap;
}
.jupiterx-unit-selector-wrapper {
position: relative;
top: 34px;
left: 10px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: 34px;
}
.jupiterx-unit-selector-label {
text-transform: capitalize;
font-size: 10px;
color: #949494;
padding-left: 2px;
line-height: 1;
}
.jupiterx-control-unit-selector {
position: absolute;
top: 1px;
right: 2px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 35px;
height: 27px;
color: #ccc;
font-size: 10px;
cursor: pointer;
text-transform: uppercase;
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
overflow: hidden;
z-index: 9;
}
.jupiterx-control-unit-selector.open {
overflow: visible;
height: auto;
background-color: #3d3d3d;
z-index: 300;
}
.jupiterx-control-unit-selector.open li:not(.selected-unit) {
margin: 0 1px 1px 1px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-control-unit-selector.open .selected-unit {
margin-bottom: -3px;
}
.jupiterx-control-unit-selector li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 1px 4px;
background-color: #535353;
width: 30px;
display: none;
}
.jupiterx-control-unit-selector li:not(.selected-unit):hover {
background-color: #616161;
}
.jupiterx-control-unit-selector li.disabled {
background-color: #3d3d3d;
}
.jupiterx-control-unit-selector .selected-unit {
height: 19px;
border-radius: 2px;
margin: 2px 1px 3px 2px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-control-pro-badge {
color: #f23c97;
pointer-events: none;
}
.jupiterx-pro-preview-lightbox .featherlight-content {
width: 90vw;
height: 90vh;
margin: 0;
padding: 0;
border: 0;
border-radius: 4px;
}
.jupiterx-pro-preview-lightbox .featherlight-close {
display: none;
}
.jupiterx-pro-preview {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
overflow: hidden;
}
.jupiterx-pro-preview .jupiterx-pro-preview-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
height: 60px;
padding: 10px 13px 10px;
}
.jupiterx-pro-preview .jupiterx-pro-preview-modal-description {
font-size: 14px;
padding-right: 15px;
}
.jupiterx-pro-preview .jupiterx-pro-preview-back {
display: inline-block;
padding: 10px 17px;
border: 1px solid #6c757d;
border-radius: 4px;
color: #6c757d;
font-size: 14px;
text-decoration: none;
}
.jupiterx-pro-preview .jupiterx-pro-preview-back .jupiterx-icon-arrow-left-solid {
position: relative;
top: 1px;
display: inline-block;
margin-right: 6px;
vertical-align: middle;
}
.jupiterx-pro-preview .jupiterx-pro-preview-upgrade {
display: inline-block;
padding: 11px 18px;
background-color: #f23c97;
border-radius: 4px;
color: #fff;
font-size: 14px;
text-decoration: none;
-webkit-transition: .1s ease;
transition: .1s ease;
}
.jupiterx-pro-preview .jupiterx-pro-preview-upgrade:hover {
background-color: #f44ea1;
}
.jupiterx-pro-preview .jupiterx-pro-preview-content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: calc(100% - 60px);
padding: 16px 32px 26px;
}
.jupiterx-pro-preview .jupiterx-pro-preview-container {
overflow-y: auto;
width: 100%;
background-color: #f4f4f4;
border: 1px solid #6c757d;
}
.jupiterx-pro-preview .jupiterx-pro-preview-image {
display: block;
width: 100%;
height: auto;
}
.jupiterx-tabs-list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background-color: #333;
}
.jupiterx-tabs-button {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 39px;
margin: 0;
padding: 0 20px;
background-color: #424242;
color: #fff;
text-decoration: none;
border: 1px solid #262626;
border-width: 1px 1px 1px 0;
border-radius: 0;
cursor: pointer;
-webkit-transition: all .05s ease-in-out;
transition: all .05s ease-in-out;
}
.jupiterx-tabs-button:focus {
outline: none;
}
.jupiterx-tabs-button .jupiterx-control-pro-badge {
margin-left: 10px;
}
.jupiterx-tabs-button.active {
background-color: #535353;
border-bottom-color: #535353;
}
.jupiterx-popup {
display: none;
position: fixed;
top: 48px;
left: 50px;
z-index: 5000;
background: #333;
border: 1px solid #333;
border-radius: 5px;
-webkit-box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.2), 0px 20px 40px 0px rgba(0, 0, 0, 0.4);
box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.2), 0px 20px 40px 0px rgba(0, 0, 0, 0.4);
color: #fff;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
overflow: hidden;
}
.jupiterx-popup.open {
display: block;
-webkit-animation: jupiterx-fade-in .18s;
animation: jupiterx-fade-in .18s;
}
.jupiterx-popup-container {
width: 460px;
height: 590px;
}
.jupiterx-popup-section {
position: relative;
display: none;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
}
.jupiterx-popup-section.open {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-popup-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
padding: 10px 20px;
cursor: move;
}
.jupiterx-popup-title {
margin: 0 auto 0 0;
color: #fff;
font-size: 13px;
font-weight: bold;
line-height: 1.4;
}
.jupiterx-popup-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: transparent;
border: 1px solid #37c4ff;
border-radius: 3px;
width: auto;
height: 23px;
outline: none;
color: #37c4ff;
font-size: 10px;
font-weight: bold;
text-transform: uppercase;
line-height: 1.75;
cursor: pointer;
}
.jupiterx-popup-button .dashicons {
width: auto;
height: auto;
margin-left: -2px;
font-size: 16px;
}
.jupiterx-popup-content {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
background-color: #535353;
overflow-y: auto;
}
.jupiterx-popup-tabs {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
background-color: #535353;
overflow-y: auto;
}
.jupiterx-popup-child {
display: none;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
z-index: 100;
width: 100%;
height: 100%;
background-color: rgba(51, 51, 51, 0.7);
}
.jupiterx-popup-child.open {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-controls:after {
display: table;
content: '';
clear: both;
}
.jupiterx-controls.jupiterx-row > li:not([class*="jupiterx-col"]) {
padding-left: 8px;
padding-right: 8px;
}
.open-jupiterx-popup-content .jupiterx-popup {
display: block;
-webkit-animation: jupiterx-fade-in .18s;
animation: jupiterx-fade-in .18s;
}
#customize-controls .jupiterx-popup-title {
font-size: 13px;
}
#customize-jupiterx-popup-content .customize-control-title {
display: block;
margin-bottom: 6px;
color: #fff;
font-size: 12px;
font-weight: normal;
}
#customize-jupiterx-popup-content .customize-control-description {
margin-bottom: 6px;
color: #999;
font-size: 12px;
font-style: normal;
}
#customize-jupiterx-popup-content .customize-control-title ~ .customize-control-description {
margin-top: -6px;
}
#customize-jupiterx-popup-content .customize-control-notifications-container:empty {
display: none;
}
#customize-jupiterx-popup-content h1, #customize-jupiterx-popup-content h2, #customize-jupiterx-popup-content h3, #customize-jupiterx-popup-content h4, #customize-jupiterx-popup-content h5, #customize-jupiterx-popup-content h6 {
color: #fff;
}
.control-section-kirki-popup .accordion-section-title .jupiterx-control-pro-badge {
display: inline-block;
vertical-align: sub;
margin-left: 2px;
}
.customize-control-jupiterx-child-popup {
margin-bottom: 0;
}
.jupiterx-child-popup {
display: none;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
position: relative;
overflow: visible;
width: 409px;
height: 525px;
padding: 0;
background: #535353;
border: 1px solid #333333;
border-radius: 5px;
color: #fff;
-webkit-box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.2), 0px 20px 40px 0px rgba(0, 0, 0, 0.4);
box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.2), 0px 20px 40px 0px rgba(0, 0, 0, 0.4);
}
.jupiterx-child-popup.active {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-child-popup-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
padding: 10px 20px 10px 20px;
border-bottom: 1px solid #404040;
cursor: move;
}
.jupiterx-child-popup-header-buttons {
position: absolute;
top: 8px;
right: 9px;
}
.jupiterx-child-popup-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: auto;
height: 24px;
padding: 0 4px;
background-color: transparent;
border: none;
border-radius: 3px;
outline: none;
color: #d9d9d9;
font-size: 10px;
font-weight: bold;
text-transform: uppercase;
line-height: 1.75;
cursor: pointer;
}
.jupiterx-child-popup-button .dashicons {
width: auto;
height: auto;
font-size: 16px;
}
.jupiterx-child-popup-title {
margin: 0 auto 0 0;
color: #fff;
font-size: 13px;
font-weight: bold;
line-height: 1.4;
}
.jupiterx-child-popup-content {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
overflow-y: auto;
}
#customize-theme-controls .control-section-kirki-jupiterx-link .accordion-section-title {
display: block;
text-decoration: none;
outline: 0;
font-weight: bold;
background-color: #f83298;
color: #fff;
border-left-width: 0;
}
#customize-theme-controls .control-section-kirki-jupiterx-link .accordion-section-title::after {
color: inherit;
}
#customize-theme-controls .control-section-kirki-jupiterx-link .accordion-section-title:hover, #customize-theme-controls .control-section-kirki-jupiterx-link .accordion-section-title:focus {
background-color: #f7198c;
color: #fff;
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
#customize-theme-controls .control-section-kirki-jupiterx-link .accordion-section-title:hover::after, #customize-theme-controls .control-section-kirki-jupiterx-link .accordion-section-title:focus::after {
color: inherit;
}
#customize-theme-controls .control-section-kirki-jupiterx-link .jupiterx-icon-pro {
vertical-align: middle;
width: 16px;
height: 16px;
padding-right: 3px;
font-size: 16px;
line-height: 16px;
}
.jupiterx-row .jupiterx-group-controls {
margin-bottom: -12px;
}
.jupiterx-input-control {
position: relative;
}
.jupiterx-input-control input {
width: 100%;
height: 27px;
padding: 3px 8px;
border: 1px solid #363636;
border-radius: 2px;
background-color: #3d3d3d;
color: white;
outline: none;
}
.jupiterx-input-control input::-webkit-input-placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-input-control input::-moz-placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-input-control input::-ms-input-placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-input-control input::placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-input-control input:-ms-input-placeholder {
/* Internet Explorer 10-11 */
color: #999999;
}
.jupiterx-input-control input::-ms-input-placeholder {
/* Microsoft Edge */
color: #999999;
}
.jupiterx-input-control input:hover {
background-color: #383838;
}
.jupiterx-input-control:focus {
outline: none;
-webkit-box-shadow: none;
box-shadow: none;
border-color: #37c4fc;
}
.jupiterx-input-control input {
height: 27px;
-moz-appearance: textfield;
-webkit-appearance: none;
appearance: none;
}
.jupiterx-input-control input[type=number]::-webkit-inner-spin-button,
.jupiterx-input-control input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
appearance: none;
}
.jupiterx-input-group.has-unit.input {
padding-right: 30px;
}
.jupiterx-textarea-control textarea {
display: block;
width: 100%;
min-height: 58px;
padding: 5px 8px;
border: 1px solid #363636;
border-radius: 2px;
background-color: #3d3d3d;
color: white;
outline: none;
resize: none;
}
.jupiterx-textarea-control textarea:focus {
outline: none;
-webkit-box-shadow: none;
box-shadow: none;
border-color: #37c4fc;
}
.jupiterx-select-control {
position: relative;
}
.jupiterx-select-control:after {
content: "\f140";
font-family: dashicons;
position: absolute;
right: 0;
top: 5px;
padding: 0 5px;
pointer-events: none;
}
.jupiterx-select-control-plain:after {
content: none;
}
.jupiterx-select-control select,
select.jupiterx-select-field {
display: block;
width: 100%;
height: 28px;
font-size: 12px;
line-height: 26px;
margin: 0;
padding: 0 20px 0 10px;
color: #fff;
background-image: none;
background-color: #757575;
border: none;
border-radius: 3px;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
cursor: pointer;
}
.jupiterx-select-control select:focus,
select.jupiterx-select-field:focus {
color: #fff;
border-color: #757575;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
}
.jupiterx-select-control select::-ms-expand,
select.jupiterx-select-field::-ms-expand {
display: none;
}
.jupiterx-select-control select:focus::-ms-value,
select.jupiterx-select-field:focus::-ms-value {
background-color: inherit;
color: inherit;
}
.jupiterx-input-group.has-icon select {
width: calc( 100% - 30px);
}
.jupiterx-toggle-control {
line-height: 0;
}
.jupiterx-toggle-control-label {
display: inline-block;
}
.jupiterx-toggle-control-switch {
display: block;
position: relative;
width: 33px;
height: 12px;
border: 1px solid #363636;
border-radius: 25px;
background-color: #3d3d3d;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
cursor: pointer;
}
.jupiterx-toggle-control-switch:hover:before {
background-color: #999999;
}
.jupiterx-toggle-control-switch:before {
display: block;
position: absolute;
top: 50%;
left: 0;
width: 17px;
height: 17px;
border-radius: 50%;
background-color: #808080;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateY(-50%) translateX(-2px);
transform: translateY(-50%) translateX(-2px);
-webkit-transition: -webkit-transform 0.1s ease;
transition: -webkit-transform 0.1s ease;
transition: transform 0.1s ease;
transition: transform 0.1s ease, -webkit-transform 0.1s ease;
content: '';
}
input[type=checkbox].jupiterx-toggle-control-checkbox:checked + .jupiterx-toggle-control-switch {
background-color: #46626e;
}
input[type=checkbox].jupiterx-toggle-control-checkbox:checked + .jupiterx-toggle-control-switch:before {
-webkit-transform: translateY(-50%) translateX(18px);
transform: translateY(-50%) translateX(18px);
background-color: #37c4ff;
}
.jupiterx-toggle-control.jupiterx-input-group {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.jupiterx-toggle-control .jupiterx-input-group-text {
padding-right: 13px;
}
.jupiterx-choose-control-buttons {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
input[type=radio].jupiterx-choose-control-radio,
input[type=checkbox].jupiterx-choose-control-radio {
display: none;
}
.jupiterx-choose-control-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
min-width: 28px;
height: 28px;
background-color: #6b6b6b;
border: 1px solid transparent;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
font-size: 12px;
white-space: nowrap;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
}
.jupiterx-choose-control-button:first-of-type {
border-radius: 2px 0 0 2px;
}
.jupiterx-choose-control-button:last-of-type {
border-radius: 0 2px 2px 0;
}
input[type=radio].jupiterx-choose-control-radio:checked + .jupiterx-choose-control-button,
input[type=checkbox].jupiterx-choose-control-radio:checked + .jupiterx-choose-control-button {
background-color: #3d3d3d;
border: 1px solid #363636;
-webkit-box-shadow: none;
box-shadow: none;
}
.jupiterx-choose-control-fit .jupiterx-choose-control-button {
width: 100%;
}
.jupiterx-choose-control-icon {
padding: 0 4px;
}
.jupiterx-choose-control-label {
position: relative;
padding: 0 8px;
}
.jupiterx-choose-control-label .jupiterx-control-pro-badge {
position: absolute;
top: -10px;
right: -8px;
}
.jupiterx-multicheck-control-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin-bottom: -10px;
}
input[type=checkbox].jupiterx-multicheck-control-checkbox {
display: none;
}
.jupiterx-multicheck-control-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
margin: 0 6px 10px 0;
}
.jupiterx-multicheck-control-item:nth-child(odd) {
width: 50%;
}
.jupiterx-multicheck-control-label {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 12px;
}
.jupiterx-multicheck-control-box {
display: inline-block;
position: relative;
height: 16px;
min-width: 16px;
width: 16px;
margin-right: 5px;
border: 1px solid #363636;
border-radius: 3px;
background-color: #3d3d3d;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
}
input[type=checkbox].jupiterx-multicheck-control-checkbox:checked + .jupiterx-multicheck-control-label .jupiterx-multicheck-control-box {
background-color: #37c4ff;
}
.jupiterx-multicheck-control-icon-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: -12px;
}
.jupiterx-multicheck-control-icon-item {
margin: 0 12px 12px 0;
}
.jupiterx-multicheck-control-icon-label {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 32px;
height: 32px;
-webkit-box-shadow: 0 0 0 1px #363636;
box-shadow: 0 0 0 1px #363636;
border-radius: 4px;
}
input[type=checkbox].jupiterx-multicheck-control-checkbox:checked + .jupiterx-multicheck-control-icon-label {
-webkit-box-shadow: 0 0 0 2px #37c4ff;
box-shadow: 0 0 0 2px #37c4ff;
}
.customize-control-jupiterx-divider {
margin-bottom: 0;
}
.jupiterx-divider-control {
height: 1px;
margin: 0 -20px 12px;
background-color: #404040;
}
.jupiterx-divider-control-empty .jupiterx-divider-control {
height: 0;
margin: 0;
background-color: transparent;
}
.jupiterx-label-control {
font-size: 12px;
}
.jupiterx-label-control-description {
color: #999;
}
.jupiterx-label-control-fancy {
position: relative;
padding: 2px 0;
color: #fff;
text-align: center;
}
.jupiterx-label-control-fancy:before {
position: absolute;
top: 50%;
left: 0;
right: 0;
height: 1px;
min-width: 100%;
margin: 0 -20px;
background-color: #fff;
content: '';
}
.jupiterx-label-control-fancy .jupiterx-label-control-text {
display: inline-block;
position: relative;
z-index: 1;
min-width: 77px;
padding: 0 12px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: #535353;
border: 1px solid #fff;
border-radius: 11px;
font-size: 11px;
font-weight: bold;
line-height: 19px;
text-transform: uppercase;
white-space: nowrap;
}
.jupiterx-label-control-fancy.jupiterx-label-control-orange {
color: #b18153;
}
.jupiterx-label-control-fancy.jupiterx-label-control-orange:before {
background-color: #b18153;
}
.jupiterx-label-control-fancy.jupiterx-label-control-orange .jupiterx-label-control-text {
border-color: #b18153;
}
.jupiterx-label-control-fancy.jupiterx-label-control-green {
color: #509384;
}
.jupiterx-label-control-fancy.jupiterx-label-control-green:before {
background-color: #509384;
}
.jupiterx-label-control-fancy.jupiterx-label-control-green .jupiterx-label-control-text {
border-color: #509384;
}
.jupiterx-label-control-fancy.jupiterx-label-control-yellow {
color: #c2b86c;
}
.jupiterx-label-control-fancy.jupiterx-label-control-yellow:before {
background-color: #c2b86c;
}
.jupiterx-label-control-fancy.jupiterx-label-control-yellow .jupiterx-label-control-text {
border-color: #c2b86c;
}
.jupiterx-label-control-fancy.jupiterx-label-control-blue {
color: #6ca5c2;
}
.jupiterx-label-control-fancy.jupiterx-label-control-blue:before {
background-color: #6ca5c2;
}
.jupiterx-label-control-fancy.jupiterx-label-control-blue .jupiterx-label-control-text {
border-color: #6ca5c2;
}
.jupiterx-alert-control {
padding: 8px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 12px;
background: red;
border-radius: 4px;
}
.jupiterx-alert-control .dashicons {
margin-right: 3px;
width: 18px;
height: 18px;
font-size: 18px;
}
.jupiterx-alert-control-link {
color: #37c4ff;
text-decoration: none;
}
.jupiterx-alert-control-link:focus {
color: #00a0d2;
-webkit-box-shadow: none;
box-shadow: none;
}
.jupiterx-alert-control-warning {
background-color: #665c4e;
border: 1px solid #9e854e;
}
.jupiterx-alert-control-warning .dashicons {
color: #9e854e;
}
.jupiterx-color-control input {
display: none;
}
.jupiterx-toggle-control.jupiterx-input-group {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.jupiterx-spectrum-replacer {
display: block;
position: relative;
overflow: visible;
width: 26px;
min-width: 26px;
height: 26px;
padding: 0;
border: 1px solid #363636;
border-radius: 2px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
}
.jupiterx-spectrum-replacer.sp-active, .jupiterx-spectrum-replacer:hover {
border-color: #37c4fc;
}
.jupiterx-spectrum-replacer .sp-preview {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0;
border: none;
}
.jupiterx-spectrum-replacer .sp-preview-inner {
width: 100%;
height: 100%;
}
.jupiterx-spectrum-replacer .sp-dd {
display: none;
}
.jupiterx-spectrum-container {
padding: 4px 4px 0;
background-color: #535353;
border: solid 1px #333;
border-radius: 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px;
box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px;
}
.jupiterx-spectrum-container .sp-picker-container {
border: none;
}
.jupiterx-spectrum-container .sp-color,
.jupiterx-spectrum-container .sp-hue,
.jupiterx-spectrum-container .sp-clear,
.jupiterx-spectrum-container .sp-slider,
.jupiterx-spectrum-container .sp-alpha-handle,
.jupiterx-spectrum-container .sp-input {
border: 1px solid #333;
}
.jupiterx-spectrum-container .sp-slider,
.jupiterx-spectrum-container .sp-alpha-handle,
.jupiterx-spectrum-container .sp-input {
border-radius: 2px;
}
.jupiterx-spectrum-container .sp-slider {
height: 6px;
}
.jupiterx-spectrum-container .sp-alpha {
height: 10px;
}
.jupiterx-spectrum-container .sp-alpha-handle {
top: -3px;
bottom: -3px;
width: 6px;
border-width: 2px;
}
.jupiterx-spectrum-container .sp-input {
height: 28px;
background-color: #3d3d3d;
outline: none;
color: white;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-spectrum-container .sp-input-container {
width: 105px;
}
.jupiterx-spectrum-container .sp-initial span {
height: 26px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-spectrum-container .sp-val {
right: -1px;
bottom: -1px;
}
.jupiterx-position-control {
max-width: 92px;
}
.jupiterx-position-control-buttons {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
input[type=radio].jupiterx-position-control-radio {
display: none;
}
.jupiterx-position-control-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 28px;
height: 28px;
margin-bottom: 5px;
background-color: #6b6b6b;
border: 1px solid transparent;
border-radius: 2px;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
font-size: 12px;
white-space: nowrap;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
}
input[type=radio].jupiterx-position-control-radio:checked + .jupiterx-position-control-button {
background-color: #3d3d3d;
border: 1px solid #363636;
-webkit-box-shadow: none;
box-shadow: none;
}
.jupiterx-position-control-icon {
padding: 0 4px;
}
#customize-control-jupiterx_logo_retina .customize-control-title,
#customize-control-jupiterx_logo_secondary_retina .customize-control-title,
#customize-control-jupiterx_logo_sticky_retina .customize-control-title {
width: 95px;
}
.jupiterx-image-upload-control {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column;
flex-flow: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
width: 93px;
height: 93px;
background-color: #3d3d3d;
border: 1px solid #363636;
border-radius: 2px;
text-align: center;
cursor: pointer;
}
.jupiterx-image-upload-control-icon {
display: block;
opacity: 0.5;
min-width: 26px;
margin-bottom: 5px;
padding: 4px 8px;
border: 1px solid #fff;
border-radius: 2px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 0;
}
.jupiterx-image-upload-control-label {
opacity: 0.5;
padding: 0 10px;
color: #fff;
font-size: 11px;
line-height: 1.4em;
}
.jupiterx-image-upload-control-preview {
display: none;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.jupiterx-image-upload-control-remove {
display: none;
position: absolute;
top: -5px;
right: -5px;
width: 20px;
height: 20px;
}
.jupiterx-image-upload-control-remove img {
position: relative;
}
.jupiterx-image-upload-control-remove:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
background: #FF1800;
border-radius: 50%;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.jupiterx-image-upload-control-remove:hover:before {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
.jupiterx-image-upload-control.has-image .jupiterx-image-upload-control-icon,
.jupiterx-image-upload-control.has-image .jupiterx-image-upload-control-label {
display: none;
}
.jupiterx-image-upload-control.has-image .jupiterx-image-upload-control-preview {
display: block;
}
.jupiterx-image-upload-control.has-image:hover .jupiterx-image-upload-control-remove {
display: block;
}
.jupiterx-radio-image-control-buttons {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin: 0 -9px;
}
input[type=radio].jupiterx-radio-image-control-radio {
display: none;
}
.jupiterx-radio-image-control-button {
position: relative;
width: 25%;
margin-bottom: 12px;
padding: 0 9px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-radio-image-control-button .jupiterx-radio-image-control-image {
display: block;
width: 100%;
border-radius: 3px;
-webkit-box-shadow: none;
box-shadow: none;
}
input[type=radio].jupiterx-radio-image-control-radio:checked + .jupiterx-radio-image-control-button .jupiterx-radio-image-control-image {
-webkit-box-shadow: 0 0 0 3px #37c4ff;
box-shadow: 0 0 0 3px #37c4ff;
}
input[type=radio].jupiterx-radio-image-control-radio:checked + .jupiterx-radio-image-control-button:after {
display: block;
position: absolute;
right: 0;
bottom: -8px;
width: 18px;
height: 18px;
background: url(../../../assets/customizer/img/radio-check.svg) no-repeat center center;
content: '';
}
.jupiterx-radio-image-control-button .jupiterx-control-pro-badge {
position: absolute;
top: -4px;
right: 4px;
}
.jupiterx-child-popup-control .jupiterx-button {
margin-left: auto;
cursor: pointer;
}
.jupiterx-child-popup-control-drag {
display: inline-block;
margin-right: 10px;
padding: 5px 0;
}
.jupiterx-child-popup-control-drag img {
display: block;
}
.jupiterx-child-popup-control-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
margin-bottom: 10px;
padding: 6px 7px 6px 13px;
border: 1px solid #808080;
border-radius: 4px;
}
.jupiterx-child-popup-control-item.ui-sortable-handle {
cursor: move;
}
.jupiterx-child-popup-control-item.ui-sortable-helper {
background-color: #3d3d3d;
border-color: #363636;
}
.jupiterx-child-popup-control-item.hidden {
display: none;
}
.jupiterx-child-popup-control-item .jupiterx-control-pro-badge {
margin-left: 10px;
}
.jupiterx-popup-control-button {
display: block;
width: 100%;
height: auto;
padding: 6px 11px;
background-color: #f7f7f7;
border: 1px solid #cccccc;
border-radius: 5px;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
color: #555;
font-size: 14px;
text-align: left;
cursor: pointer;
}
.jupiterx-popup-control-button:hover {
border-color: #999;
color: #262b30;
}
.customize-control-jupiterx-background {
position: relative;
}
.jupiterx-background-control {
margin-bottom: -12px;
}
.jupiterx-background-control .hidden {
display: none;
}
.jupiterx-background-control li[class*=jupiterx-col-]:not(.customize-control) {
margin-bottom: 0;
}
.jupiterx-background-control-attachment,
.jupiterx-background-control-size {
position: absolute;
bottom: 26px;
right: 1px;
max-width: 127px;
}
.jupiterx-background-control-attachment > .jupiterx-control,
.jupiterx-background-control-size > .jupiterx-control {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.jupiterx-background-control-size {
bottom: -7px;
}
.jupiterx-background-control-type .jupiterx-choose-control-button {
min-width: 32px;
}
.jupiterx-box-model-control {
position: relative;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input {
position: absolute;
width: 43px;
height: 27px;
padding: 3px 5px;
border: 1px solid #363636;
border-radius: 2px;
background-color: #3d3d3d;
color: white;
text-align: center;
outline: none;
-moz-appearance: textfield;
-webkit-appearance: none;
appearance: none;
font-size: 12px;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input:hover {
background-color: #383838;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input:focus {
outline: none;
-webkit-box-shadow: none;
box-shadow: none;
border-color: #37c4fc;
background-color: #383838;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input:disabled {
background-color: #535353;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input::-webkit-inner-spin-button, .jupiterx-box-model-control input.jupiterx-box-model-control-input::-webkit-outer-spin-button {
-webkit-appearance: none;
appearance: none;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input::-webkit-input-placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input::-moz-placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input::-ms-input-placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input::placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: #999999;
opacity: 1;
/* Firefox */
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input:-ms-input-placeholder {
/* Internet Explorer 10-11 */
color: #999999;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input::-ms-input-placeholder {
/* Microsoft Edge */
color: #999999;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input.jupiterx-box-model-control-top {
top: 6px;
left: 50%;
margin-left: -21px;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input.jupiterx-box-model-control-right {
top: 50%;
/*rtl:ignore*/
right: 6px;
/*rtl:ignore*/
margin-top: -14px;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input.jupiterx-box-model-control-bottom {
bottom: 6px;
left: 50%;
margin-left: -21px;
}
.jupiterx-box-model-control input.jupiterx-box-model-control-input.jupiterx-box-model-control-left {
top: 50%;
/*rtl:ignore*/
left: 6px;
/*rtl:ignore*/
margin-top: -14px;
}
.jupiterx-box-model-control .jupiterx-control-units-container {
position: relative;
height: 55px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jupiterx-box-model-control .jupiterx-control-unit-selector {
position: absolute;
top: 15px;
left: 0;
background-color: #3d3d3d;
border-radius: 2px;
}
.jupiterx-box-model-control .jupiterx-control-unit-selector .selected-unit {
margin: 3px;
}
.jupiterx-box-model-control-property {
position: relative;
float: left;
min-width: 154px;
min-height: 102px;
padding: 39px 54px;
border: 1px dashed #808080;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.jupiterx-box-model-control-title {
position: absolute;
left: 8px;
top: 4px;
color: #9e9e9e;
font-size: 9px;
}
.customize-control-jupiterx-box-model .jupiterx-responsive-switcher {
left: -23px;
}
.customize-control-jupiterx-box-model .jupiterx-responsive-control .jupiterx-viewport {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: auto;
}
.customize-control-jupiterx-fonts .customize-control-description {
margin-bottom: 15px;
}
.jupiterx-fonts-control button {
cursor: pointer;
}
.jupiterx-fonts-control button:focus {
outline: none;
}
.jupiterx-fonts-control-register {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 50px;
padding: 0 12px;
background-color: #404040;
border: 1px dashed #000;
border-radius: 2px;
cursor: pointer;
}
.jupiterx-fonts-control-register:hover {
border-color: #fff;
}
.jupiterx-fonts-control-register:focus {
outline: none;
}
.jupiterx-fonts-control-register-icon {
display: block;
width: 20px;
height: 20px;
margin-right: 10px;
background-color: #000;
border-radius: 50%;
text-align: center;
}
.jupiterx-fonts-control-register-text {
font-size: 12px;
}
.jupiterx-fonts-control-preview {
position: relative;
margin-top: 12px;
padding: 8px 12px;
border: 1px solid #333;
border-radius: 3px;
}
.jupiterx-fonts-control-preview-family {
display: inline-block;
padding-right: 24px;
color: #fff;
font-size: 12px;
}
#customize-controls h3.jupiterx-fonts-control-preview-sample {
display: block;
overflow: hidden;
margin: 5px 0 0;
color: #fff;
font-size: 18px;
font-weight: normal;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 1.3;
}
.jupiterx-fonts-control-preview-remove {
position: absolute;
top: 11px;
right: 11px;
width: 16px;
height: 16px;
padding: 0;
background-color: transparent;
border: none;
border-radius: 0;
opacity: 0.4;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.jupiterx-fonts-control-preview-remove svg path {
fill: #ff0000;
}
.jupiterx-fonts-control-preview-remove:hover {
opacity: 1;
}
.jupiterx-fonts-control-popup .jupiterx-child-popup {
height: auto;
}
.jupiterx-fonts-control-selector {
padding: 10px 10px 20px;
}
.jupiterx-fonts-control-selector-preview {
position: relative;
margin-bottom: 12px;
padding: 25px 14px;
background-color: #fff;
border: 1px solid #262626;
border-radius: 2px;
}
#customize-controls h3.jupiterx-fonts-control-selector-sample {
display: block;
overflow: hidden;
margin: 0;
color: #000000;
font-size: 18px;
font-weight: normal;
text-overflow: ellipsis;
white-space: nowrap;
}
.jupiterx-fonts-control-selector-group {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom: 12px;
}
.jupiterx-fonts-control-selector-group .customize-control-title {
width: 100%;
}
.jupiterx-fonts-control-selector-families {
-webkit-box-flex: 0;
-ms-flex: 0 0 265px;
flex: 0 0 265px;
max-width: 265px;
}
.jupiterx-fonts-control-selector-families .jupiterx-select-control {
position: static;
}
.jupiterx-fonts-control-selector-families .jupiterx-select-control:after {
content: none;
}
.jupiterx-fonts-control-selector-filters {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
margin-left: 12px;
}
.jupiterx-fonts-control-selector-subsets {
display: none;
margin-bottom: 12px;
}
.jupiterx-fonts-control-selector-buttons .jupiterx-button {
min-width: 50px;
margin-right: 7px;
}
.jupiterx-font-control {
position: relative;
}
.jupiterx-font-control::after {
content: "\f140";
font-family: dashicons;
position: absolute;
right: 0;
top: 5px;
padding: 0 5px;
pointer-events: none;
}
.jupiterx-typography-control-font-size {
-ms-flex-preferred-size: 39%;
flex-basis: 39%;
max-width: 39%;
}
.jupiterx-typography-control-color {
-ms-flex-preferred-size: 17%;
flex-basis: 17%;
max-width: 17%;
}
.jupiterx-exceptions-control-group {
margin-bottom: 20px;
padding: 15px;
background-color: #4d4d4d;
border: 1px solid #333333;
border-radius: 2px;
}
.jupiterx-exceptions-control-group h3 {
float: left;
margin: 0;
}
.jupiterx-exceptions-control-group .jupiterx-exceptions-control-remove {
float: right;
}
.jupiterx-exceptions-control-group .jupiterx-group-controls {
min-width: 100%;
padding-top: 12px;
}
.jupiterx-exceptions-control-add {
position: relative;
}
.jupiterx-exceptions-control-add .jupiterx-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
}
.jupiterx-exceptions-control-add .jupiterx-button img {
margin-right: 5px;
}
.jupiterx-exceptions-control-add .select2 {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100%;
z-index: -1;
}
.jupiterx-exceptions-control-remove {
text-transform: uppercase;
}
.jupiterx-template-control {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.jupiterx-template-control .jupiterx-select-control {
width: 175px;
}
.jupiterx-template-control .jupiterx-text-separator {
margin: 0 12px;
font-size: 11px;
}
.jupiterx-template-control .jupiterx-button {
position: relative;
margin-right: 10px;
padding-left: 15px;
padding-right: 15px;
}
.jupiterx-template-control .jupiterx-button .jupiterx-control-pro-badge {
position: absolute;
top: -12px;
right: -12px;
}
.jupiterx-template-control.jupiterx-loading {
pointer-events: none;
}
.jupiterx-template-control:not(.jupiterx-has-value) .jupiterx-edit,
.jupiterx-template-control.jupiterx-loading .jupiterx-button,
.jupiterx-template-control.jupiterx-loading .jupiterx-text-separator {
display: none;
}
.jupiterx-pro-box-control {
padding: 25px;
background-color: #424242;
border-radius: 10px;
text-align: center;
}
.jupiterx-pro-box-control .jupiterx-icon-pro {
color: #E04994;
font-size: 22px;
}
.jupiterx-pro-box-control .jupiterx-pro-box-control-button {
display: inline-block;
margin-top: 30px;
padding: 11px 18px;
background-color: #f23c97;
border-radius: 4px;
color: #fff;
text-decoration: none;
-webkit-transition: .1s ease;
transition: .1s ease;
}
.jupiterx-pro-box-control .jupiterx-pro-box-control-button:hover {
background-color: #f44ea1;
}
.jupiterx-pro-box-control-title {
margin-top: 10px;
color: #fff;
font-size: 15px;
font-weight: 500;
}
.jupiterx-pro-box-control-description {
margin-top: 8px;
color: #9CA7B2;
font-size: 12px;
}
.customize-control-jupiterx-pro-box:first-child {
margin-top: 12px;
}