????JFIF??x?x????'
| Server IP : 104.21.30.238 / Your IP : 216.73.216.87 Web Server : LiteSpeed System : Linux premium151.web-hosting.com 4.18.0-553.44.1.lve.el8.x86_64 #1 SMP Thu Mar 13 14:29:12 UTC 2025 x86_64 User : tempvsty ( 647) PHP Version : 8.0.30 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /././home/tempvsty/pontiacques.org/wp-content/themes/layerswp/core/assets/ |
Upload File : |
/*
Layers Admin Customizer Styling CSS (Section&Panels, Widget Form, Customizer UI)
- ANIMATION PACE cubic-bezier(0, 0.275, 0.125, 1) 0s
- ACCENT COLOR #0289C0
- ACCENT HOVER #0D5F83
Author: Obox Themes
Author URI: http://www.oboxthemes.com/
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
@import url(icons.css);
/*------------------------------------*/
/*- CUSTOMIZER Look&Feel OVERRIDES ---*/
a{
text-decoration: none;
}
#customize-theme-controls .accordion-section-content{
background: #fff; /*-- Make the accordions white --*/
}
#customize-theme-controls .accordion-section-content .customize-control:last-child{
margin-bottom: 20px;
}
/*------------------------------------*/
/*- HIDE LAYERS WIDGETS IN APPEARANCE */
div#widgets-right .widgets-sortables{
padding-bottom: 1px;
}
.widget-holder div[id*='layers-widget'],
.widget-holder.inactive div[id*='obox-layers-builder'],
.widgets-php #widget-list [id*='layers-widget'],
div#widgets-right .widgets-sortables [id*='layers-widget'],
div#widgets-right div[id*='obox-layers-builder']{
display: none;
}
.widgets-holder-wrap{
border-width: 0px;
}
.widgets-holder-wrap .widget{
border-width: 1px;
}
.layers-hide{ display: none; }
/*----------------------------------*/
/*- HIDING NON LAYERS WIDGETS ------*/
#available-widgets .widget-tpl{}
#available-widgets .widget-tpl[id*='layers-widget']{
/* display: block !important; */
border-right: 4px solid #00A4EC;
}
/*----------------------------------*/
/*- WORDPRESS RESETS / OVERRIDES ---*/
/*---------------------------*/
/*- WIDGET COLOR STYLING ----*/
/*- Layers Badge -*/
.customize-control-widget_form.wide-widget-control div[id*='layers-widget'] .widget-top h4:before{
content: "\e62f";
font-size: 11px;
color: #00A4EC;
font-family: "layers-interface";
text-align: center;
padding: 1px 0px 0px;
border: 0px none;
display: inline-block;
margin-right: 8px;
}
.customize-control-widget_form.wide-widget-control.layers-focussed div[id*='layers-widget'] .widget-top h4:before{
color: #fff;
}
/*- Layers Widget Loading -*/
.customize-control-widget_form.wide-widget-control div[id*='layers-widget'] .widget-top:after{
color: #FFF9F7;
font-size: 10px;
font-weight: 900;
text-transform: uppercase;
transition: .1s ease-in-out;
transition: 0s !important;
width: auto;
height: auto;
line-height: 17px;
border-radius: 40px;
padding: 0 6px;
content: "Loading";
position: absolute;
right: 6px;
top: 15px;
opacity: 0;
}
.customize-control-widget_form.wide-widget-control.layers-loading div[id*='layers-widget'] .widget-top{
transition: 0s !important;
background: #0BA6E0 !important;
border-color: #0E77A5 !important;
}
.customize-control-widget_form.wide-widget-control.layers-loading div[id*='layers-widget'] .widget-top:after{
opacity: 1;
}
.customize-control-widget_form.wide-widget-control.layers-loading div[id*='layers-widget'] .widget-top .widget-title-action{
opacity: 0;
}
/*- Layers Widget Rendered -*/
.customize-control-widget_form.wide-widget-control:not(.widget-rendered) .widget-top{
opacity: 1;
}
/*- Layers Widget Focussed -*/
.customize-control-widget_form.wide-widget-control.expanded:not(.layers-collapsing) .widget-top{
background-color: #FAFAFA;
}
.customize-control-widget_form.wide-widget-control.layers-focussed .widget .widget-top{
background: #0BA6E0 !important;
border-color: #0B6F9A;
color: #3D454E;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}
.customize-control-widget_form.wide-widget-control.layers-focussed .widget .widget-top h3{
color: white;
}
.customize-control-widget_form.wide-widget-control.expanded .widget .widget-top,
.customize-control-widget_form.wide-widget-control.layers-focussed .widget .widget-top{
-webkit-transition: 0s !important;
transition: 0s !important;
}
.customize-control-widget_form.wide-widget-control.layers-focussed .widget .widget-top:hover{
background: #0BA6E0;
border-color: #053E57 !important;
color: #3D454E;
}
.customize-control-widget_form.wide-widget-control.layers-focussed .widget .widget-top .widget-title h4{
color: #fff;
}
.customize-control-widget_form.wide-widget-control.layers-focussed .widget .widget-top .widget-title .in-widget-title{
color: rgba(255, 255, 255, 0.8);
}
/*- Expanded Arrow Tip -*/
.customize-control-widget_form.wide-widget-control.layers-focussed a.widget-action:after{
color: #fff;
}
/*- Layers Badge in Widget Selection Tray -*/
#available-widgets div[id*='layers-widget'].widget .widget-title:after{
content: "\e62f";
font-size: 12px;
color: #00A4EC;
font-family: 'layers-interface';
text-align: center;
position: absolute;
top: -1px;
right: 0;
}
/*---------------------------*/
/*- WIDGET SETTINGS POP OUT -*/
/*-- Static --*/
.customize-control-widget_form.wide-widget-control div[id*='layers-widget'] .widget-inside{
width: 660px;
height: 100%;
max-height: none;
padding: 0 !important;
top: 0 !important;
border-top: none !important;
border-right: none !important;
opacity: 0;
overflow: hidden;
box-shadow: 3px 0 3px rgba(0, 0, 0, 0.1);
transform: translate3d(-10px, 0, 0);
transition: all 0.2s ease-in-out;
background-image: url(images/spinner-on-white.gif);
background-position: 50% 20%;
background-repeat: no-repeat;
background-color: #F5F5F5;
}
/*-- Open --*/
.customize-control-widget_form.wide-widget-control.expanded div[id*='layers-widget'] .widget-inside{
opacity: 1;
box-shadow: 5px 0 18px rgba(0, 0, 0, 0.2), 4px 0 4px rgba(0, 0, 0, 0.10);
overflow-y: visible;
transform: translate3d(0, 0, 0);
}
/*-- Closing --*/
.customize-control-widget_form.wide-widget-control.expanded.layers-collapsing div[id*='layers-widget'] .widget-inside{
transform: translate3d(-10px, 0, 0);
opacity: 0;
}
.customize-control-widget_form.wide-widget-control div[id*='layers-widget'] .widget-inside .form{
padding: 0 !important;
height: 100%;
min-width: 660px;
position: relative;
transition: transform 0.15s ease-in-out, opacity 0.15s ease-in-out;
overflow: scroll;
background-color: white;
opacity: 1;
}
.customize-control-widget_form.wide-widget-control.expanded div[id*='layers-widget'] .widget-inside .form{
overflow: auto;
}
.customize-control-widget_form.wide-widget-control.layers-collapsing div[id*='layers-widget'] .widget-inside .form{
}
/*- COLLAPSED SIDEBAR ------------*/
.collapsed .customize-control-widget_form.wide-widget-control div[id*='layers-widget'] .widget-inside{
width: 0;
left: -300px;
transition-delay: none;
}
.collapsed .customize-control-widget_form.wide-widget-control div[id*='layers-widget'] .widget-inside .form{
opacity: 0;
transition-delay: none;
}
/*-----------------------------*/
/*- WIDGET DEBUGGING ----------*/
.layers-widget-defaults-debug{
font-family: monospace;
font-size: 11px;
letter-spacing: 0px;
background-color: #FDFCF1;
padding: 1px;
color: #735203;
border-radius: 3px;
border: 1px solid rgba(134, 73, 33, 0.1);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.01);
display: inline-block;
line-height: 1.2em;
margin: 0 0 -1px;
}
/*---------------------------*/
/*- DELETE / CLOSE / LOADING */
div[id*='layers-widget'] .widget-control-actions{
padding: 0;
position: absolute;
z-index: 99;
top: 11px;
right: 110px;
border-radius: 100px;
font-size: 0px;
}
div[id*='layers-widget'] .widget-control-actions a{
display: inline-block;
padding: 0 8px;
margin: 0 0 0 5px;
border-radius: 3px;
background-color: #2EA2CC;
border: 1px solid #0D5F83;
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1);
font-size: 11px;
font-weight: 600;
line-height: 22px;
color: #fff;
}
div[id*='layers-widget'] .widget-control-actions a:hover{
background: #1E8CBE;
}
div[id*='layers-widget'] .widget-control-actions .widget-control-remove{
background-color: #FF5353;
border-color: #BC3F39;
font-weight: 600;
}
div[id*='layers-widget'] .widget-control-actions .layers-widget-duplicate-button{
/* font-size: 14px; */
line-height: 22px;
height: 22px;
font-weight: 600;
vertical-align: bottom;
cursor: pointer;
}
div[id*='layers-widget'] .widget-control-actions .widget-control-remove:hover{
background-color: #F2413D;
}
div[id*='layers-widget'] .spinner{
display: none;
margin: 2px -3px 0 5px;
background: url(images/spinner.gif) right no-repeat;
background-size: 20px 20px;
opacity: 1;
}
/* Widget Peek Button */
div[id*='layers-widget'] .widget-control-actions .alignleft{
float: right;
}
div[id*='layers-widget'] .widget-control-actions .alignright{
float: right;
}
.widget-control-actions .layers-widget-peek-button{
float: left;
display: block;
font-size: 20px;
line-height: 24px;
padding: 0;
margin: 0 6px;
color: rgb(255, 255, 255);
border-radius: 100px;
width: 24px;
height: 24px;
box-sizing: border-box;
text-align: center;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
cursor: pointer;
}
.widget-inside.layers-peek-widget{
opacity:0 !important;
}
/*---------------------------*/
/*- CONTAINERS --------------*/
.layers-container{
max-width: 1000px;
margin: auto;
}
.layers-container-large{
position: relative;
/* z-index: 99; */
}
.layers-content-small{
padding: 10px;
}
.layers-content{
padding: 20px;
position: relative;
}
.layers-content-large{
padding: 40px;
position: relative;
}
.layers-content-massive{
padding: 60px;
position: relative;
}
.layers-content img{
max-width: 100%;
height: auto;
}
.layers-well{
background: #fff;
}
.layers-well-alt{
background: #f5f5f5;
border-top: 1px solid #e5e5e5;
}
.layers-panel{
margin-bottom: 20px;
background: #fff;
border: 1px solid #E5E5E5;
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.04);
}
.layers-modal-container{
position: fixed;
width: 100%;
display: block;
top: 0;
left: 0;
z-index: 10;
background: rgba(0, 0, 0, 0.8);
height: 100%;
padding: 20px;
}
.layers-modal{
padding: 50px;
background: #fff;
max-width: 660px;
}
.layers-vertical-center{
position: absolute;
width: 100%;
top: 50%;
left: 50%;
-webkit-transform: translate(-50% ,-50%);
transform: translate(-50% ,-50%);
}
/*---------------------------*/
/*- ICONS -------------------*/
[class^="icon-"], [class*=" icon-"]{
font-size: 32px;
}
[class*="icon-"].layers-small{
font-size: 16px;
}
[class*="icon-"].layers-large{
font-size: 64px;
}
.layers-icon-wrapper{
display: block;
}
.layers-icon-description{
display: block;
margin-top: 3px;
opacity: 0.75;
font-size: 11px;
font-weight: 600;
text-transform: none;
}
/*---------------------------*/
/*- ICON-WRAPPER ------------*/
.layers-visuals-item .layers-icon-wrapper{
padding: 10px 5px 8px;
margin: 4px;
background: transparent;
border: 1px solid transparent;
border-radius: 3px;
text-align: center;
color: #444;
outline: 0;
transform: translateY(0px);
transition: all 0.2s ease-in-out;
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0);
}
.layers-visuals-item input{
display: none;
/* display: block !important; */
/* margin: 3px 0 !important; */
/* height: 16px !important; */
/* line-height: normal !important; */
}
.layers-visuals-item .layers-icon-wrapper:focus{
box-shadow: none;
}
.layers-visuals-item .layers-icon-wrapper:hover{
box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0px 1px 0px #006799;
background: #008EC2;
border-color: #006799;
color: #fff;
}
.layers-visuals-item.layers-active > .layers-icon-wrapper,
.layers-visuals-item.layers-active > .layers-icon-wrapper:hover{
background: #e7e7e7;
border-color: #ccc;
color: #444;
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
}
.layers-visuals-item .layers-icon-wrapper.layers-active,
.layers-visuals-item .layers-icon-wrapper.layers-active:hover{
background: #e7e7e7;
border-color: #ccc;
color: #444;
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0);
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0);
}
/*---------------------------*/
/*- ICON-GROUP --------------*/
.layers-icon-group{
overflow: hidden;
padding: 0;
display: inline-block;
}
.layers-icon-group .layers-icon-wrapper{
display: block;
float: left;
width: 16px;
margin: 0 1px 1px 0 !important;
padding: 3px 7px !important;
background: rgb(255, 255, 255);
border: 1px solid #EAEAEA;
border-radius: 3px;
box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0), 0 1px 0 rgba(255, 255, 255, 0);
text-align: center;
}
.layers-icon-group .layers-icon-wrapper [class*="icon-"],
.layers-icon-group .layers-icon-wrapper [class*="fa"]{
font-size: 16px;
}
.layers-icon-group .layers-icon-wrapper .layers-icon-description{
display: none !important;
}
.layers-icon-group .layers-icon-wrapper.layers-select-images{
clear: both;
width: 100%;
}
.layers-icon-group .layers-icon-wrapper img{
max-width: 100%;
}
.layers-form-item > .layers-icon-group {
display: block;
}
/*---------------------------*/
/*- ICON-GROUP OUTLINED -----*/
.layers-icon-group.layers-icon-group-inline-outline{
padding: 2px 1px 1px 2px;
background: #fff;
border-radius: 3px;
border: 1px solid #ddd;
box-sizing: border-box;
}
.layers-icon-group.layers-icon-group-inline-outline .layers-icon-wrapper{
border-color: transparent;
box-shadow: none;
}
.layers-icon-group.layers-icon-group-inline-outline .layers-icon-wrapper:focus{
box-shadow: none;
}
.layers-icon-group.layers-icon-group-inline-outline .layers-icon-wrapper:hover{
box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0px 1px 0px #006799;
background: #008EC2;
border-color: #006799;
color: #fff;
}
.layers-icon-group.layers-icon-group-inline-outline.layers-active > .layers-icon-wrapper,
.layers-icon-group.layers-icon-group-inline-outline.layers-active > .layers-icon-wrapper:hover{
background: #e7e7e7;
border-color: #ccc;
color: #444;
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
}
.layers-icon-group.layers-icon-group-inline-outline .layers-icon-wrapper.layers-active,
.layers-icon-group.layers-icon-group-inline-outline .layers-icon-wrapper.layers-active:hover{
background: #e7e7e7;
border-color: #ccc;
color: #444;
box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.1);
}
/*---------------------------*/
/*- ICON-GROUP FULL-WIDTH ---*/
.layers-icon-group.layers-icon-group-inline-flexible{
display: block;
}
.layers-icon-group.layers-icon-group-inline-flexible .layers-icon-wrapper {
width: auto;
}
/*---------------------------*/
/*- ICON-GROUP LARGE --------*/
.layers-icon-group-large .layers-icon-wrapper > span{
line-height: 16px;
}
.layers-icon-group-large .layers-icon-wrapper .layers-icon-description{
display: none !important;
}
.layers-icon-group-large .layers-icon-wrapper{
width: 44px;
line-height: 29px;
margin: 0 2px 2px 0 !important;
padding: 3px !important;
}
.layers-icon-group-large .layers-icon-wrapper [class*="icon-"],
.layers-icon-group-large .layers-icon-wrapper [class*="fa"]{
font-size: 18px;
height: auto;
line-height: 18px;
vertical-align: middle;
position: relative;
top: -1px;
}
/*---------------------------*/
/*- INLINE ICON DESCRIPTION -*/
.layers-visuals-wrapper.layers-visuals-inline .layers-icon-wrapper{
text-align: left;
}
.layers-visuals-wrapper.layers-visuals-inline .layers-icon-wrapper{
padding: 5px;
margin: 0 0 5px;
}
.layers-visuals-wrapper.layers-visuals-inline .layers-icon-wrapper [class^="icon-"],
.layers-visuals-wrapper.layers-visuals-inline .layers-icon-wrapper [class*=" icon-"]{
vertical-align: middle;
}
.layers-visuals-wrapper.layers-visuals-inline .layers-icon-wrapper .layers-icon-description{
display: inline-block;
margin: 0 0 0 5px;
}
/*------------------------------------------------------------*/
/*- SET ICON GROUP INLINE ------------------------------------*/
/*- add `'class' => 'layers-icon-group-inline'` to control -*/
.layers-icon-group-inline .layers-visuals-wrapper.layers-visuals-inline{
padding: 5px 1px 0px 5px;
display: inline-block;
padding: 0;
}
.layers-icon-group-inline .layers-visuals-wrapper.layers-visuals-inline .layers-icon-wrapper{
margin: 0;
}
.layers-icon-group-inline .layers-visuals-wrapper.layers-visuals-inline .layers-visuals-item{
float: left;
margin: 0 1px 1px 0;
}
.layers-icon-group-inline .layers-visuals-wrapper.layers-visuals-inline .layers-visuals-item:not(.layers-active) .layers-icon-wrapper{
margin: 0;
}
.layers-icon-group-inline .layers-visuals-wrapper.layers-visuals-inline .layers-visuals-item .layers-icon-description{
display: none;
}
/*--------------------------------------------------------------------------------------*/
/*- SET ICON GROUP INLINE & OUTLINE ----------------------------------------------------*/
/*- add `'class' => 'layers-icon-group-inline layers-icon-group-inline-outline'` to control -*/
.layers-icon-group-inline.layers-icon-group-inline-outline .layers-visuals-wrapper.layers-visuals-inline{
padding: 2px 1px 1px 2px;
background: #fff;
border-radius: 3px;
border: 1px solid #ddd;
box-sizing: border-box;
}
.layers-icon-group-inline.layers-icon-group-inline-outline .layers-visuals-item{
float: left;
margin: 0 4px 5px 0;
}
.layers-icon-group-inline.layers-icon-group-inline-outline .layers-visuals-item .layers-icon-wrapper{
padding: 3px 7px;
}
.layers-icon-group-inline.layers-icon-group-inline-outline .layers-visuals-item [class*="icon-"] {
font-size: 16px;
}
/*---------------------------*/
/*- THE GRID ----------------*/
.layers-row:before, .layers-row:after{
content: " ";
display: table;
}
.layers-row:after{
clear: both;
}
.layers-row{
*zoom: 1;
}
.layers-clearfix:before,
.layers-clearfix:after{
content: " ";
display: table;
}
.layers-clearfix:after{
clear: both;
}
.layers-clearfix{
*zoom: 1;
}
.layers-column{
float: left;
margin: 0 2% 20px 0;
position: relative;
box-sizing: border-box;
}
.layers-column-flush{
float: left;
margin: 0;
position: relative;
box-sizing: border-box;
}
.layers-row .layers-column:last-child{
margin-right: 0;
}
.layers-row:last-child .layers-column{
margin-bottom: 0;
}
.layers-span-1{width: 6.5%;}
.layers-span-2{width: 15%;}
.layers-span-3{width: 23.5%;}
.layers-span-4{width: 32%;}
.layers-span-5{width: 40.5%;}
.layers-span-6{width: 49%;}
.layers-span-7{width: 57.5%;}
.layers-span-8{width: 66%;}
.layers-span-9{width: 74.5%;}
.layers-span-10{width: 83%;}
.layers-span-11{width: 91.5%;}
.layers-span-12{width: 100%;}
.layers-column-flush.layers-span-1{width: 8.333333%;}
.layers-column-flush.layers-span-2{width: 16.6667%;}
.layers-column-flush.layers-span-2-4{width: 20%;}
.layers-column-flush.layers-span-3{width: 25%;}
.layers-column-flush.layers-span-4{width: 33.33333%;}
.layers-column-flush.layers-span-5{width: 41.66665%;}
.layers-column-flush.layers-span-6{width: 50%;}
.layers-column-flush.layers-span-7{width: 58.1%;}
.layers-column-flush.layers-span-8{width: 66.4%;}
.layers-column-flush.layers-span-9{width: 74.7%;}
.layers-column-flush.layers-span-10{width: 83%;}
.layers-column-flush.layers-span-11{width: 91.3%;}
.layers-column-flush.layers-span-12{width: 100%;}
.layers-row .layers-column.layers-span-1:nth-child(12n+12){margin-right: 0;}
.layers-row .layers-column.layers-span-2:nth-child(6n+6){margin-right: 0;}
.layers-row .layers-column.layers-span-3:nth-child(4n+4){margin-right: 0;}
.layers-row .layers-column.layers-span-3:nth-child(4n+5){clear: left;}
.layers-row .layers-column.layers-span-4:nth-child(3n+3){margin-right: 0;}
.layers-row .layers-column.layers-span-4:nth-child(3n+4){clear: left;}
.layers-row .layers-column.layers-span-6 + .layers-span-6{margin-right: 0;}
.layers-row .layers-column.layers-span-6:nth-child(2n+3){clear: left;}
.layers-middled{
margin-left: auto;
margin-right: auto;
}
.layers-no-gutter{
margin-right: 0;
}
/*-----------------------*/
/*- BROAD BASED COLUMNS -*/
div[class*='layers-columns-'] div[class*='layers-span'],
div[class*='layers-columns-'] .layers-sortable-drop{
float: left;
padding: 10px;
margin: 0;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
transition: all 0.2s ease-in-out;
transform: scale(1);
}
div[class*='layers-columns-'] div[class*='layers-span'].ui-sortable-helper{
transition: none;
}
div[class*='layers-columns-'] div[class*='layers-span'].ui-sortable-helper:active{
}
.layers-columns-4 .layers-span, .layers-columns-4 .layers-sortable-drop{width: 25%;}
.layers-columns-3 .layers-span, .layers-columns-3 .layers-sortable-drop{width: 33%;}
.layers-columns-2 .layers-span, .layers-columns-2 .layers-sortable-drop{width: 50%;}
.layers-columns-1 .layers-span, .layers-columns-1 .layers-sortable-drop{width: 100%;}
.layers-columns-3 .layers-span-position-4{display: none;}
.layers-columns-2 .layers-span-position-3,
.layers-columns-2 .layers-span-position-4{display: none;}
.layers-columns-1 .layers-span-position-2,
.layers-columns-1 .layers-span-position-3,
.layers-columns-1 .layers-span-position-4{display: none;}
/*-----------------------*/
/*- COLUMN TWEAKERS -----*/
.no-gutter{margin-right: 0;}
.middled, .row .column.middled{float: none; margin: auto;}
.layers-last{ margin-right: 0; }
.layers-drag{
display: block;
height: 8px;
margin-bottom: 10px;
background: url(images/drag.png) top center repeat-x;
cursor: move;
opacity: 0.5;
transition: 0.2s all ease-in-out
}
.layers-drag:hover{opacity: 1;}
/*---------------------------*/
/*- ELEMENT CONTROLLERS -----*/
.layers-pull-right{
float: right;
}
.layers-pull-left{
float: left;
}
.layers-clear{
clear: both;
}
.layers-no-push-bottom{
margin-bottom: 0 !important;
}
.layers-push-top{
margin-top: 20px !important;
}
.layers-push-top-small{
margin-top: 10px !important;
}
.layers-push-top-medium{
margin-top: 30px !important;
}
.layers-push-top-large{
margin-top: 40px !important;
}
.layers-push-top-massive{
margin-top: 60px !important;
}
.layers-push-bottom{
margin-bottom: 20px !important;
}
.layers-push-bottom-small{
margin-bottom: 10px !important;
}
.layers-push-bottom-medium{
margin-bottom: 30px !important;
}
.layers-push-bottom-large{
margin-bottom: 40px !important;
}
.layers-push-bottom-massive{
margin-bottom: 60px !important;
}
.layers-push-right{
margin-right: 20px !important;
}
.layers-push-right-small{
margin-right: 10px !important;
}
.layers-push-right-medium{
margin-right: 30px !important;
}
.layers-push-right-large{
margin-right: 40px !important;
}
.layers-push-right-massive{
margin-right: 60px !important;
}
.layers-push-left{
margin-left: 20px !important;
}
.layers-push-left-small{
margin-left: 10px !important;
}
.layers-push-left-medium{
margin-left: 30px !important;
}
.layers-push-left-large{
margin-left: 40px !important;
}
.layers-push-left-massive{
margin-left: 60px !important;
}
.layers-push-right{
margin-right: 20px !important;
}
.layers-push-right-small{
margin-right: 10px !important;
}
.layers-push-right-medium{
margin-right: 30px !important;
}
.layers-push-right-large{
margin-right: 40px !important;
}
.layers-push-right-massive{
margin-right: 60px !important;
}
.layers-push-left{
margin-left: 20px !important;
}
.layers-push-left-small{
margin-left: 10px !important;
}
.layers-push-left-medium{
margin-left: 30px !important;
}
.layers-push-left-large{
margin-left: 40px !important;
}
.layers-push-left-massive{
margin-left: 60px !important;
}
.layers-t-left{
text-align: left;
}
.layers-t-center{
text-align: center;
}
.layers-t-right{
text-align: right;
}
.layers-animate{
transition: all 0.2s ease-in-out;
}
/*---------------------------*/
/*- FORM ELEMENTS -----------*/
.layers-form-item{
clear: left;
padding: 0;
margin: 0 0 15px;
}
.layers-form-item:last-child{
margin-bottom: 0;
}
.layers-form-item.layers-column{
clear: none;
margin: 0 2% 0 0;
}
.layers-form-item.layers-middled{
margin-left: auto;
margin-right: auto;
}
.layers-form-item label{
display: block;
margin-bottom: 5px;
font-size: 10px;
line-height: 13px;
text-transform: uppercase;
color: #777;
font-weight: 600;
}
.layers-form-item-description{
margin: 6px 0 0;
font-size: 12px;
line-height: 1.3em;
color: #9E9E9E;
font-style: italic;
text-transform: none;
display: block;
/* max-width: 300px; */
}
.layers-design-bar .layers-form-item-description{
margin: 0;
font-size: 10px;
color: #9E9E9E;
max-width: none;
}
.customize-control .layers-form-item select{
/* width: 100%; */
height: 36px;
margin: 0;
padding: 0 4px;
}
.layersSlct2-drop-mask{
z-index: 10000000;
}
.layersSlct2-drop{
z-index: 10000001;
}
.customize-control .layers-form-item select[multiple]{
min-height: 90px;
}
.customize-control .layers-textarea{
width: 100%;
padding: 8px;
margin: 0;
background: #fff;
border: 1px solid #ddd;
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1);
}
li[id*='customize-control-layers'].customize-control .wp-picker-holder{
/* position: absolute; */
/* z-index: 10000; */
}
li[id*='customize-control-layers'].customize-control .wp-picker-holder .iris-picker{
/* box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); */
border-radius: 2px;
}
.editible,
.layers-form-item .layers-input,
.layers-form-item input[type="text"],
.layers-form-item input[type="email"],
.layers-form-item input[type="number"],
.layers-form-item input[type="password"],
.layers-form-item input[type="link"],
.layers-form-item textarea{
display: block;
width: 100%;
height: 36px;
padding: 0 8px;
margin: 0;
background: #fff;
border: 1px solid #ddd;
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1);
line-height: 28px;
}
.layers-form-item select{
display: block;
width: 100%;
padding: 8px;
margin: 0;
line-height: 18px;
background: #fff;
border: 1px solid #ddd;
box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.04);
outline: none;
}
.layers-form-item .layers-input:disabled,
.layers-form-item input:disabled{
background: #F7F7F7;
}
.layers-form-item input[type="range"]{
display: block;
height: 36px;
padding: 0;
width: 95%;
}
.layers-form-item input[type="number"].layers-range-disabled{
background: #F5F5F5;
}
.layers-form-item textarea{
min-height: 100px;
}
.layers-small-note{
color: #777;
font-size: 11px;
font-style: italic;
}
.layers-form-item input[type=text].layers-color-selector.wp-color-picker{
float: left;
display: inline-block;
height: auto;
padding: 3px;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.layers-form-item .wp-picker-input-wrap{
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
border-radius: 3px;
}
.layers-form-item .wp-picker-input-wrap .button{
margin-left: 0;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
box-shadow: none;
border-left: 0;
height: 24px;
line-height: 22px;
padding: 0 8px 1px;
font-size: 11px;
}
/*------------------------------------*/
/*- DESIGN BAR COLOR PICKERS ---------*/
.layers-form-item.layers-color-wrapper input[type=text].layers-color-selector.wp-color-picker{
float: left;
display: inline-block;
height: auto;
padding: 3px;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
background: white;
}
.layers-design-bar-form-item.layers-color-wrapper label {
position: absolute;
font-size: 13px;
font-weight: normal;
text-transform: none;
margin: 0;
padding: 2px 0 3px;
width: 100%;
box-sizing: border-box;
}
.layers-design-bar-form-item .wp-picker-container {
text-align: right;
width: 100%;
}
.layers-design-bar-form-item .wp-color-result {
display: inline-block;
width: 8px;
height: 14px;
border-radius: 100px;
margin: 0 -1px 0 0 !important;
box-shadow: 0 1px 0px rgba(0, 0, 0, 0.03) !important;
border: 2px solid rgba(0, 0, 0, 0.15);
}
.layers-design-bar-form-item .wp-color-result:after {
display: none;
}
.layers-design-bar-form-item .wp-picker-input-wrap {
display: block !important;
width: 90px;
white-space: nowrap;
margin-top: -18px;
position: relative;
}
/*------------------------------------*/
/*- COLOR PICKER OPEN ----------------*/
.layers-design-bar-form-item .wp-picker-container.wp-picker-active {
margin-top: 25px;
}
.layers-design-bar-form-item .wp-picker-container.wp-picker-active .wp-color-result{
position: relative;
top: 3px;
}
/*------------------------------------*/
/*- CUSTOM ICONS ---------------------*/
.layers-icon-group .layers-icon-wrapper .fa-bold,
.layers-icon-group .layers-icon-wrapper .fa-italic,
.layers-icon-group .layers-icon-wrapper .fa-underline,
.layers-icon-group .layers-icon-wrapper .fa-strikethrough{
font-size: 11px;
line-height: 16px;
}
.editible{
clear: both;
color: #000;
font-size: 14px;
line-height: 1.4;
width: 95%;
}
.layers-tiny-mce-switch{
clear: both;
color: #444;
display: inline-block;
float: right;
font-size: 11px;
margin-bottom: 0px;
padding: 4px 6px;
}
.layers-form-item input[type=text]:hover,
.layers-form-item input[type=email]:hover,
.layers-form-item input[type=number]:hover,
.layers-form-item input[type=password]:hover,
.layers-form-item input[type=link]:hover,
.customize-control .layers-textarea:hover{
border-color: #ccc;
}
.layers-form-item input[type=text]:focus,
.layers-form-item input[type=email]:focus,
.layers-form-item input[type=number]:focus,
.layers-form-item input[type=password]:focus,
.layers-form-item input[type=link]:focus,
.customize-control .layers-textarea:focus,
.layers-form-item select:focus{
border-color: #0289C0;
}
.layers-form-item input[type=text]:invalid,
.layers-form-item input[type=email]:invalid,
.layers-form-item input[type=number]:invalid,
.layers-form-item input[type=password]:invalid,
.layers-form-item input[type=link]:invalid,
.customize-control .layers-textarea:invalid{
border-color: #FF9898;
background: rgba(255, 0, 0, 0.1);
}
.layers-form-item input[type=text].layers-large,
.layers-form-item input[type=email].layers-large,
.layers-form-item input[type=number].layers-large,
.layers-form-item input[type=password].layers-large,
.layers-form-item input[type=link].layers-large{
font-size: 20px;
height: 42px;
}
.layers-input-has-controls{
padding-right: 50px;
}
.customize-control .layers-textarea.layers-large{
font-size: 16px;
line-height: 28px;
min-height: 84px;
}
/* Hide Number Input Controls */
.l_admin-hide-controls[type=number],
.l_admin-hide-controls::-webkit-inner-spin-button,
.l_admin-hide-controls::-webkit-outer-spin-button{
-webkit-appearance: none; /*chrome*/
-moz-appearance: textfield; /*firefox*/
}
.layers-form-inline input,
.layers-form-inline button{
float: left;
}
.layers-form-inline input[type=email]{
width: 65%;
}
.layers-form-inline input[type=email] + button{
height: 38px;
width: 35%;
border-left: 0;
border-radius: 0 3px 3px 0;
box-shadow: none;
}
.layers-sync-setting-holder{
position: relative;
}
.display-setting-button{
display: block;
content: 'click to unlink';
position: absolute;
right: 6px;
top: 50%;
line-height: 23px !important;
width: 22px;
/* background: #E4E4E4; */
margin-top: -12px;
text-transform: uppercase;
font-size: 10px;
padding: 0;
border-radius: 20px;
color: #B7B7B7;
cursor: pointer;
text-align: center;
}
.display-setting-button:hover{
background-color: #6F6F6F;
color: white;
}
.layers-sync-setting-holder.layers-use-widget-value .layers-global-setting{
display: none;
}
.layers-global-setting{
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
}
.layers-global-setting input{
font-style: italic;
color: #737373;
}
.layers-sync-setting-holder.layers-use-widget-value .layers-global-setting{
display: none;
}
/*------------------------------------*/
/*- FORM COLLECTIONS (E.G. BUTTONS) --*/
.layers-form-collection{
border: 1px solid #DDD;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.05);
position: relative;
}
.layers-form-collection.closed{
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1);
}
.layers-form-collection:hover{
}
.layers-form-collection-header{
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
padding: 10px 30px 10px 10px;
position: relative;
font-size: 14px;
cursor: pointer;
transition: .2s;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.layers-form-collection.closed:hover{
border-color: #ccc;
}
/*------------------------------------*/
/*- FORM COLLECTIONS - HEADER --------*/
.layers-form-collection-header:after{
display: block;
padding: 0 10px;
position: absolute;
top: 0;
right: 0;
content: "\f0c1";
font: 400 14px/47px fontawesome;
color: #aaa;
cursor: pointer;
line-height: 36px;
transition: .2s;
}
.layers-form-collection-header:hover:after{
color: #9A9A9A;
}
.layers-form-collection-header i{
color: #B3B3B3;
font-style: normal;
}
/*------------------------------------*/
/*- FORM COLLECTIONS - CONTENT -------*/
.layers-form-collection-content{
padding: 18px 18px;
}
.layers-form-collection.closed .layers-form-collection-content{
overflow: hidden;
}
/*---------------------------------------------------------*/
/*- FORM COLLECTIONS - LINK-GROUP SPECIFIC ELEMENTS -------*/
/*------------------------*/
/*- LINK FIELDS ----------*/
.layers-link-field{
position: relative;
}
.layers-link-field input{
padding-right: 33px !important;
}
.layers-link-field label{
position: absolute;
top: -18px;
right: 0;
font-style: italic;
opacity: .15;
font-weight: normal;
display: none;
}
/*--------------------------------*/
/*- LINK FIELD - TARGET ----------*/
.layers-link-field-link_target{
position: absolute;
bottom: 20px;
right: 6px;
overflow: visible;
}
.layers-link-field-link_target .layers-select-icons{
width: 100%;
}
.layers-link-field-link_target .layers-icon-wrapper{
width: 100%;
max-width: 100%;
box-sizing: border-box;
padding-left: 3px !important;
padding-right: 4px !important;
line-height: 3px;
}
.layers-link-field-link_target .layers-icon-wrapper:hover{
box-shadow: none;
}
.layers-link-field-link_target .layers-icon-wrapper .fa{
position: relative;
top: 2px;
left: 2px;
}
.layers-link-field-link_target .layers-icon-wrapper .icon-new-window{
font-size: 16px;
}
/*-----------------------*/
/*- CUSTOM CSS EDITOR ---*/
.layers-css-wrapper textarea{
height: 260px;
font-size: 11px;
font-family: courier new, mono-space;
color: #000;
}
/*-------------------*/
/*- CHECKBOX --------*/
.layers-checkbox-wrapper input[type=checkbox]{
display: none;
}
.layers-checkbox-wrapper{
clear: both;
margin: 0 0 8px;
}
.layers-checkbox-wrapper input[type=submit], .layers-checkbox-wrapper button{
float: left;
margin: 0;
}
/* OLD STYLE CHECKBOX */
/*.layers-checkbox-wrapper label:before{
content:"";
display: inline-block;
width: 16px;
height: 16px;
margin-right: 8px;
background: #fff url(images/checkbox.png) 0 -32px no-repeat;
background-size: 16px 16px;
border: 1px solid #ccc;
box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.1);
border-radius: 2px;
transition: all 0.2s ease-in-out;
vertical-align: bottom;
} */
.layers-checkbox-wrapper input[type=checkbox]:checked + label:before{
background-color: #0289C0;
background-position: 0 0;
border-color: #0289C0;
box-shadow: none;
}
.layers-checkbox-wrapper label{
clear: none;
display: inline-block;
font-size: 13px;
text-transform: none;
line-height: 18px;
font-weight: 400;
}
.layers-invert .layers-checkbox-wrapper label{
color: #ccc;
}
/*-------------------*/
/*- RADIO -----------*/
.layers-radio-wrapper input[type=radio]{
display: none;
}
.layers-radio-wrapper{
clear: both;
margin: 0 0 8px;
}
.layers-radio-wrapper label:before{
content:"";
display: inline-block;
width: 16px;
height: 16px;
margin-right: 10px;
background: #fff url(images/radio.png) 0 -32px no-repeat;
background-size: 16px 16px;
border: 1px solid #ccc;
box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.1);
border-radius: 100px;
transition: all 0.2s ease-in-out;
vertical-align: bottom;
}
.layers-radio-wrapper label{
clear: none;
display: inline-block;
font-size: 13px;
line-height: 18px;
font-weight: 400;
}
/* CHECKED */
.layers-radio-wrapper input[type=radio]:checked + label:before{
background-color: #0289C0;
background-position: 0 0;
border-color: #0289C0;
box-shadow: none;
}
/*-------------------*/
/*- SWITCH --------*/
.layers-checkbox-wrapper input[type=checkbox]{
display: none;
}
.layers-checkbox-wrapper{
clear: both;
margin: 0 0 8px;
}
.layers-checkbox-wrapper input[type=submit],
.layers-checkbox-wrapper button{
float: left;
margin: 0;
}
.layers-checkbox-wrapper .layers-switch-icon:before{
content:"";
display: inline-block;
width: 30px;
height: 18px;
position: relative;
top: 0px;
right: 0;
position: absolute;
margin: 0;
background: #e0e0e0;
border: 0;
padding: 0;
border-left-width: 20px;
border-radius: 100px;
transition: all 0.2s ease-in-out;
vertical-align: middle;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.04);
}
.layers-checkbox-wrapper .layers-switch-icon:after{
content: "";
border-radius: 100px;
background: white;
position: absolute;
right: 15px;
top: 3px;
width: 12px;
height: 12px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
transition: all 0.2s 0.2s ease-in-out;
}
.layers-checkbox-wrapper label,
.l_option-customize-control.l_option-customize-control-switch label{
clear: none;
display: block;
font-size: 13px;
text-transform: none;
line-height: normal;
font-weight: 400;
position: relative;
padding-right: 36px;
margin: 0 0 11px;
}
.layers-invert .layers-checkbox-wrapper label{
color: #ccc;
}
/* HOVER */
.layers-checkbox-wrapper .layers-switch-icon:hover:before{
background: #c7c7c7;
box-shadow: inset 0 1px 0px rgba(0, 0, 0, 0.1);
}
/* CHECKED */
.layers-checkbox-wrapper input[type=checkbox]:checked + label > .layers-switch-icon:before{
background-color: #0289C0;
background-position: 0 0;
border-color: #0289C0;
box-shadow: none;
}
.layers-checkbox-wrapper input[type=checkbox]:checked + label > .layers-switch-icon:after{
right: 3px;
}
/*-------------------------------*/
/*- DESIGN BAR ------------------*/
.layers-design-bar{
position: absolute;
right: 0;
width: 90px;
height: 100%;
background: #f5f5f5;
z-index: 103;
}
.layers-design-bar + .layers-container-large{
width: calc(100% - 90px);
}
.layers-design-bar .layers-visuals-title{
padding: 15px 0px;
margin: 0px;
background: #222;
color: #fff;
text-align: center;
text-transform: uppercase;
}
.layers-design-bar .layers-visuals-title .icon-settings{
display: block;
}
/*---------------------------*/
/*- FORM ITEMS --------------*/
.editible,
.layers-design-bar .layers-form-item .layers-input,
.layers-design-bar .layers-form-item select,
.layers-design-bar .layers-form-item input[type="text"]:not(.layers-color-selector),
.layers-design-bar .layers-form-item input[type="email"],
.layers-design-bar .layers-form-item input[type="number"],
.layers-design-bar .layers-form-item input[type="password"],
.layers-design-bar .layers-form-item input[type="link"],
.layers-design-bar .layers-form-item textarea{
padding: 0 8px;
margin-top: 3px;
margin-bottom: 3px;
height: 30px;
border: 1px solid #ddd;
border-radius: 2px;
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1);
font-size: 13px;
}
.layers-design-bar .layers-form-item select{
padding: 0 4px;
}
.layers-design-bar .layers-form-item textarea{
padding: 8px;
}
.layers-design-bar .layers-form-item input[type="number"]{
padding-right: 0;
}
.layers-design-bar .layers-form-item input[type="range"]{
height: 30px;
}
.layers-design-bar .layers-form-item textarea[id*='-customcss']{
font-family: monospace;
font-size: 12px;
padding: 8px;
line-height: 18px;
}
/*---------------------------*/
/*- ICON-GROUP - DESIGN-BAR -*/
.layers-design-bar .layers-visuals-item{
position: relative;
padding: 1px;
margin: 0;
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
}
/*-- ANIMATE ICONS --*/
.wide-widget-control .layers-design-bar .layers-visuals-item{
opacity: 0;
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
.wide-widget-control.expanded .layers-design-bar .layers-visuals-item{
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.layers-design-bar .layers-visuals-item{transition-delay: 0.25s;}
.layers-design-bar .layers-visuals-item:nth-child(2){transition-delay: 0.27s;}
.layers-design-bar .layers-visuals-item:nth-child(3){transition-delay: 0.29s;}
.layers-design-bar .layers-visuals-item:nth-child(4){transition-delay: 0.31s;}
.layers-design-bar .layers-visuals-item:nth-child(5){transition-delay: 0.33s;}
.layers-design-bar .layers-visuals-item:nth-child(6){transition-delay: 0.35s;}
.layers-design-bar .layers-visuals-item:nth-child(7){transition-delay: 0.37s;}
.layers-design-bar .layers-visuals-item:nth-child(8){transition-delay: 0.39s;}
.layers-design-bar .layers-visuals-item:nth-child(9){transition-delay: 0.41s;}
.layers-design-bar .layers-visuals-item:nth-child(10){transition-delay: 0.43s;}
.layers-design-bar .layers-visuals-item:nth-child(11){transition-delay: 0.45s;}
.layers-visuals-item .layers-icon-error{
color: #FF5353;
}
.layers-visuals-item .layers-icon-error:hover{
background-color: #FF5353;
border-color: #BC3F39;
box-shadow: 0 1px 0 #BC3F39;
color: #fff;
}
.layers-inline-field-wrapper:after{
content: '';
display: block;
clear: both;
float: none;
}
.layers-inline-field-row{
padding: 0 !important;
margin: 0 0 15px !important;
height: 30px !important;
box-sizing: border-box !important;
}
.layers-inline-field-row .layers-column-flush {
margin-top: -1px;
margin-bottom: -1px;
}
.layers-inline-field-row .layers-column {
margin-bottom: -2px !important;
}
.layers-row.layers-inline-field-row .layers-column-flush{
position: relative;
font-weight: normal;
}
.layers-row.layers-inline-field-row .layers-column-flush:after{
display:block;
width:1px;
height: 12px;
position:absolute;
margin-top: -6px;
top: 34%;
right:0;
content:'';
background: rgba(0, 0, 0, 0.08);
}
.layers-row.layers-inline-field-row .layers-column-flush:last-child:after{
display:none;
}
.layers-row.layers-inline-field-row .layers-column label,
.layers-row.layers-inline-field-row .layers-column-flush label{
width: 100%;
margin: 3px 0 0;
font-size: 10px;
text-align: center;
line-height: 12px;
font-weight: normal;
}
.layers-row.layers-inline-field-row .layers-column input,
.layers-row.layers-inline-field-row .layers-column-flush input,
.layers-row.layers-inline-field-row .layers-column select,
.layers-row.layers-inline-field-row .layers-column-flush select{
text-align: center;
font-weight: bold;
padding-left: 3px;
padding-right: 3px;
margin: 0;
}
.layers-row.layers-inline-field-row .layers-column-flush input,
.layers-row.layers-inline-field-row .layers-column-flush select{
background: none !important;
box-shadow: none;
border: 1px solid rgba(0, 0, 0, 0);
}
.layers-row.layers-inline-field-row .layers-column input {
}
.layers-row.layers-inline-field-row input[type="number"] {
padding-left: 0;
padding-right: 0;
}
/*---------------------------*/
/*- DESIGN BAR TABS ---------*/
.layers-interface-tabs {
margin-bottom: -5px;
}
.layers-interface-tabs .layers-column {
margin-bottom: 0;
}
label.layers-interface-tab {
text-align: center;
padding: 4px 9px;
border-radius: 3px;
border: 1px solid rgba(0, 0, 0, 0.18);
display: block;
margin-bottom: 9px;
}
label.layers-interface-tab:hover {
box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0px 1px 0px #006799;
background: #008EC2;
border-color: #006799;
color: #fff;
}
label.layers-interface-tab.layers-interface-tab-active {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15);
color: #777;
background: rgba(0, 0, 0, 0.09);
border: 1px solid rgba(0, 0, 0, 0.18);
}
/*---------------------------*/
/*- LAYERS PRO UPSELL -------*/
.layers-visuals-item.layers-pro-upsell{
position: absolute;
bottom: 0;
}
.layers-visuals-item.layers-pro-upsell a{
display: block;
margin: 4px;
padding: 4px;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 3px;
color: rgba(0, 0, 0, 0.3);
font-size: 9px;
line-height: 12px;
font-weight: 600;
text-align: center;
text-transform: uppercase;
transition: all 0.15s ease-in-out;
}
.layers-visuals-item.layers-pro-upsell a:hover{
background: #0085BA;
border-color: #006799;
box-shadow: 0px 1px 0px #006799;
color: #fff;
}
.layers-visuals-item.layers-pro-upsell a:active{
box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.1) inset;
transform: translateY(1px);
}
/*---------------------------*/
/*- SETTINGS POP MENU -------*/
.layers-pop-menu-wrapper{
position: absolute;
z-index: 100000000;
top: 5px;
right: 100px;
width: 220px;
max-height: 320px; /*browser compatibility*/
max-height: 50vh;
background: #f5f5f5;
border: 1px solid #ddd;
border-radius: 3px;
overflow: hidden;
overflow-y: scroll;
visibility: hidden;
opacity: 0;
transition: all 0.15s ease-in-out 0.1s;
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
padding: 0 10px;
}
.layers-visuals-item.layers-last .layers-pop-menu-wrapper{
top: auto;
bottom: 5px;
}
.layers-visuals-item.layers-active .layers-pop-menu-wrapper{
right: 95px;
opacity: 1;
visibility: visible;
}
.layers-pop-menu-setting .background-image{
display: block;
max-height: 150px;
margin-bottom: 15px;
position: relative;
vertical-align: middle;
border-radius: 2px;
overflow: hidden;
}
.layers-pop-menu-setting img{
max-width: 100%;
height: auto;
}
.layers-pop-menu-setting .layers-form-item{
padding: 10px;
margin: 0 -10px;
border-bottom: 1px solid #e5e5e5;
opacity: 0;
transition: 0.25s opacity ease-in-out 0.25s, 0.25s transform ease-in-out 0.25s;
}
.layers-pop-menu-setting .layers-form-item:first-child{
}
.layers-pop-menu-setting .layers-form-item:last-child{
}
.layers-pop-menu-setting input[type='checkbox'] + label{
margin-bottom: 0;
}
.layers-pop-menu-setting input[type='checkbox']:disabled + label{
color: rgba(0, 0, 0, 0.5);
}
.layers-form-item.layers-form-item-advanced{
background-color: #FDFDFD;
}
.layers-form-item.layers-form-item-temp-disable *{
opacity: .2;
}
/*-----------------------*/
/*- POP MENU SMALL ------*/
.layers-pop-menu-wrapper.layers-small{
top: 0px;
width: 84px;
max-height: none;
overflow: hidden;
}
.layers-visuals-item.layers-last .layers-pop-menu-wrapper.layers-small{
bottom: 0px;
}
.layers-small .layers-pop-menu-setting input[type="checkbox"] + label{
font-size: 11px;
}
.layers-small .layers-checkbox-wrapper{
margin: 0 !important;
}
/*---------------------------*/
/*- SETTINGS - HORIZONTAL ---*/
.layers-content .layers-visuals.layers-visuals-horizontal{
position: relative;
right: auto;
margin: -20px -20px 20px;
height: auto;
background-color: #fff;
}
.layers-visuals.layers-visuals-horizontal{
width: auto;
padding: 0px;
border-bottom: 1px solid #eee;
z-index: 101;
}
.layers-visuals.layers-visuals-horizontal .layers-visuals-title{
float: left;
padding: 12px 16px 13px;
margin: 0px;
background: #F0F0F0;
color: #999;
}
.layers-visuals.layers-visuals-horizontal .layers-visuals-wrapper{
border-left: none;
}
.layers-visuals-horizontal .layers-visuals-item{
float: left;
border-right: 1px solid #eee;
}
.layers-visuals-horizontal .layers-visuals-item.layers-pull-right{
float: right;
border-right: none;
}
.layers-visuals-horizontal .layers-visuals-item .layers-icon-wrapper{
padding: 6px 10px;
margin: 4px 6px;
}
.layers-visuals-horizontal .layers-visuals-item.layers-pull-right .layers-icon-error{
padding: 6px 4px;
position: relative;
}
.layers-visuals-horizontal .layers-visuals-item [class*="icon-"]{
font-size: 16px;
}
/*---------------------------------------*/
/*- SETTINGS - HORIZONTAL ALIGN-RIGHT ---*/
.layers-content .layers-visuals.layers-visuals-horizontal.layers-align-right{
float: right;
}
/*--------------------------------------*/
/*- SETTINGS - HORIZONTAL AS BUTTONS ---*/
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline{
margin: 0;
border: 0;
}
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline > .layers-visuals-title{
display: none;
}
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline > ul{
padding: 0;
}
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline > ul > li{
border: 0;
padding: 0 4px 0 0;
}
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline > ul > li:last-child{
border: 0;
padding-right: 0;
}
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline > ul > li > a{
margin: 0;
box-shadow: none;
background: #FFFFFF;
border-color: #DCDCDC;
color: #6D6D6D;
}
.layers-visuals-horizontal.layers-visuals-inline .layers-visuals-item.layers-active .layers-pop-menu-wrapper{
top: 35px !important;
}
/*-------------------------------*/
/*- SETTINGS - CONTENT BUTTON ---*/
.layers-visuals.layers-visuals-horizontal.layers-visuals-inline{
position: absolute;
z-index: 102;
top: 26px;
right: 25px;
}
/*-----------------------*/
/*- TOOL TIP ------------*/
.layers-visuals-horizontal .layers-icon-description{
position: absolute;
top: 43px;
left: 50%;
margin-left: -50px;
width: 100px;
padding: 3px;
background: rgba(0, 0, 0, 0.7);
border-radius: 3px;
color: #fff;
font-size: 11px !important;
font-weight: normal;
opacity: 1;
visibility: hidden;
transform: translate3d(0, -5px, 0);
transition: all 0.05s ease-in-out;
}
.layers-visuals-horizontal .layers-icon-wrapper:hover .layers-icon-description{
opacity: 1;
visibility: visible;
transform: translate3d(0, 0, 0);
transition: all 0.2s ease-in-out 0.25s;
}
.layers-visuals-horizontal .layers-active .layers-icon-wrapper:hover .layers-icon-description{
opacity: 0;
visibility: hidden;
transform: translate3d(0, -5px, 0);
transition: all 0.1s ease-in-out;
}
/*-------------------*/
/*- LAST ITEM -------*/
.layers-visuals-horizontal .layers-last .layers-icon-description{
left: auto;
right: 0;
}
/*-----------------------*/
/*- TOOL TIP TIP --------*/
.layers-visuals-horizontal .layers-icon-description:before{
border: solid;
border-color: rgba(0, 0, 0, 0.7) transparent;
border-width: 0 6px 6px 6px;
content: "";
position: absolute;
left: 46px;
top: -6px;
z-index: 99;
visibility: hidden;
opacity: 0;
transition: all 0.05s ease-in-out;
}
.layers-visuals-horizontal .layers-icon-wrapper:hover .layers-icon-description:before{
opacity: 1;
visibility: visible;
transition: all 0.21s ease-in-out 0.25s;
}
.layers-visuals-horizontal .layers-active .layers-icon-wrapper:hover .layers-icon-description:before{
opacity: 0;
visibility: hidden;
transition: all 0.1s ease-in-out;
}
/*-------------------*/
/*- LAST ITEM -------*/
.layers-visuals-horizontal .layers-last .layers-icon-description:before{
left: auto;
right: 10px;
}
.layers-visuals-horizontal .layers-pop-menu-wrapper{
top: 54px !important;
right: auto;
left: 0;
bottom: auto !important;
}
.layers-visuals-horizontal .layers-visuals-item.layers-active .layers-pop-menu-wrapper{
top: 44px !important;
right: auto;
transition: all 0.1s ease-in-out 0.1s;
}
.layers-visuals-horizontal .layers-visuals-item.layers-last .layers-pop-menu-wrapper{
left: auto;
right: 0;
}
.layers-visuals-horizontal .layers-pop-menu-wrapper.layers-small{
width: auto;
}
.layers-visuals-horizontal .layers-pop-menu-wrapper .layers-icon-wrapper{
margin: 5px;
}
/*---------------------------*/
/*- POP UP ANIMATIONS -------*/
.layers-pop-menu-setting .layers-form-item{transform: translate3d(-10px, 0, 0);}
.layers-pop-menu-setting .layers-form-item:nth-child(2){transition-delay: 0.27s;}
.layers-pop-menu-setting .layers-form-item:nth-child(3){transition-delay: 0.29s;}
.layers-pop-menu-setting .layers-form-item:nth-child(4){transition-delay: 0.31s;}
.layers-pop-menu-setting .layers-form-item:nth-child(5){transition-delay: 0.33s;}
.layers-pop-menu-setting .layers-form-item:nth-child(6){transition-delay: 0.35s;}
.layers-pop-menu-setting .layers-form-item:nth-child(7){transition-delay: 0.37s;}
.layers-pop-menu-setting .layers-form-item:nth-child(8){transition-delay: 0.39s;}
.layers-pop-menu-setting .layers-form-item:nth-child(9){transition-delay: 0.41s;}
.layers-pop-menu-setting .layers-form-item:nth-child(10){transition-delay: 0.43s;}
.layers-pop-menu-setting .layers-form-item:nth-child(11){transition-delay: 0.45s;}
.layers-active .layers-pop-menu-setting .layers-form-item{
opacity: 1;
transform: translate3d(0, 0, 0);
}
.layers-pop-menu-setting .layers-icon-wrapper{
transform: translate3d(-10px, 0, 0);
opacity: 0;
transition: 0.25s opacity ease-in-out 0.25s, 0.25s transform ease-in-out 0.25s;
}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(2){transition-delay: 0.27s;}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(3){transition-delay: 0.29s;}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(4){transition-delay: 0.31s;}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(5){transition-delay: 0.33s;}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(6){transition-delay: 0.35s;}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(7){transition-delay: 0.37s;}
.layers-pop-menu-setting .layers-icon-wrapper:nth-child(8){transition-delay: 0.39s;}
.layers-active .layers-pop-menu-setting .layers-icon-wrapper{
opacity: 1;
transform: translate3d(0, 0, 0);
}
/*---------------------------*/
/*- DESIGN-BAR GROUPS -------*/
.layers-design-bar-group {
margin: 0 -10px 0;
padding: 0 10px;
overflow: hidden;
border-bottom: 1px solid #e5e5e5;
}
.layers-design-bar-group .layers-form-item {
margin: 0;
padding: 9px 0;
}
.layers-design-bar-group .layers-group-start-wrapper {
border-bottom: none;
cursor: pointer;
padding: 7px 9px;
margin: 0 -10px;
transition: .2s;
}
.layers-group-start-wrapper label {
margin-bottom: 0;
}
.layers-group-start-wrapper:after {
font-family: layers-interface;
content: "\e922";
position: absolute;
right: 10px;
top: 6px;
line-height: 15px;
padding: 0;
font-size: 16px;
font-weight: normal;
color: #fff;
background: #9b9b9b;
border-radius: 100%;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}
.layers-form-item.layers-accordion-end-wrapper {
display: none;
}
.layers-design-bar-group-inner {
padding-bottom: 10px;
border-top: 1px dotted rgba(0, 0, 0, 0.15);
}
.layers-design-bar-group-inner:after {
display: block;
content: '';
margin-bottom: -11px;
}
/*---------------------------*/
/*- OPEN & HOVER STATES -----*/
.layers-design-bar-group.layers-design-bar-group-open {
border-bottom-width: 2px;
background: #f9f9f9;
box-shadow: inset 0 1px 0 #e5e5e5;
}
.layers-design-bar-group.layers-design-bar-group-open .layers-group-start-wrapper:after {
content: "\e923";
box-shadow: 0px -2px 1px rgba(0, 0, 0, 0.1);
}
.layers-design-bar-group.layers-design-bar-group-open .layers-group-start-wrapper {
}
.layers-design-bar-group .layers-group-start-wrapper:hover {
background: rgba(255,255,255,0.6);
}
.layers-design-bar-group.layers-design-bar-group-open .layers-group-start-wrapper:hover {
background: transparent;
}
/*-------------------------------*/
/*- RICH TEXT EDITING -----------*/
.layers-form-item .fr-box{
width: 100%;
border: 0;
}
.layers-form-item .fr-element.fr-view{
border: 1px solid #ddd;
padding: 8px;
font-size: 14px;
min-height: 60px;
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1);
width: 100%;
}
.layers-form-item .fr-code-view .fr-element.fr-view{
display: none;
}
.layers-form-item .fr-wrapper textarea{
display: none;
}
.layers-form-item .fr-code-view .fr-wrapper textarea{
display: block;
background-color: #2c2c2c;
color: #eee;
font-family: 'Courier New', monospace;
font-size: 13px;
padding: 5px 6px;
}
.layers-form-item .fr-wrapper .fr-placeholder{
margin: 8px;
font-size: 14px;
}
.layers-form-item .fr-basic .fr-wrapper .fr-placeholder{
margin: 0 !important;
}
.layers-form-item .fr-element.fr-view p{
font-size: 14px;
margin: 0 0 10px;
color: rgb(50, 55, 60);
}
.layers-form-item .fr-box.fr-basic.fr-top .fr-wrapper{
box-shadow: none;
}
.layers-form-item .fr-toolbar.fr-top{
background: #ff;
border: 1px solid #e5e5e5;
border-bottom: 0;
border-radius: none;
height: 38px;
overflow: visible;
padding: 0px;
transition: .2s ease-in-out .2s;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.layers-form-item .fr-box.fr-toolbar-hide .fr-toolbar{
transform: translate( 0, 30px );
height: 0px;
opacity:0;
}
.layers-form-item .fr-editor button.fr-btn i{
font-size: 14px;
}
.layers-form-item .fr-editor button.fr-btn i{
font-size: 14px;
}
button[data-cmd="html"]{
float: right !important;
background-color: #f0f0f0 !important;
color: #999 !important;
}
button[data-cmd="html"].fr-btn.fr-active{
background: #202020 !important;
color: #fff !important;
}
.layers-form-item .fr-toolbar button.fr-btn,
.layers-form-item .fr-toolbar button.fr-trigger{
width: 39px;
height: 29px;
line-height: 14px;
font-size: 14px;
padding: 2px;
margin: 4px;
border: 1px solid transparent;
border-radius: 3px;
color: #444;
transition: all 0.1s ease-in-out 0s;
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0);
}
.layers-form-item .fr-toolbar button.fr-btn:hover,
.layers-form-item .fr-toolbar .bttn-wrapper:not(.touch) button.fr-btn:hover,
.layers-form-item .fr-toolbar button.fr-btn.fr-active:hover{
background: #008EC2;
border-color: #006799;
box-shadow: 0px 1px 0px #006799;
color: #fff;
}
/*---------------------------*/
/*- WHEN IN HTML MODE -------*/
.layers-form-item .f-html .fr-editor button.fr-btn:hover,
.layers-form-item .f-html .fr-editor .bttn-wrapper:not(.touch) button.fr-btn:hover,
.layers-form-item .f-html .fr-editor button.fr-btn.fr-active:hover{
border-color: transparent;
box-shadow: none;
}
.layers-form-item .fr-toolbar button.fr-btn.fr-active,
.layers-form-item .fr-toolbar button.fr-btn:active{
border-color: #ccc;
color: #444;
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1) inset;
background-color: #e7e7e7;
transition: 0s;
}
.layers-form-item .fr-toolbar button.fr-btn i{
font-size: 14px;
display: block;
width: auto;
margin: 0;
text-align: center;
float: none;
line-height: 170%;
}
.layers-form-item .f-html .fr-element{
background-color: #2c2c2c;
padding: 0;
}
.layers-form-item .f-html .fr-element textarea{
color: #eee;
font-size: 13px;
padding: 5px 6px;
}
button[data-cmd="html"]:hover{
box-shadow: none !important;
}
/*---------------------------*/
/*- RTE LIST STYLING --------*/
/*---------------------------*/
.fr-view li{
list-style-type: inherit;
overflow: visible;
}
.fr-view li ul,
.fr-view li ol{
padding:0 10px;
}
.fr-view ul,
.fr-view ol{
padding: 0 0 0 10px;
overflow: visible;
}
.fr-view ul,
.fr-view ol{
margin: 0 0 0 20px;
padding-bottom: 10px;
}
.fr-view ul{
list-style-type:disc;
}
.fr-view ol{
list-style-type:decimal;
}
.fr-view ol ol{
list-style: upper-alpha;
}
.fr-view ol ol ol{
list-style: lower-roman;
}
.fr-view ol ol ol ol{
list-style: lower-alpha;
}
/*---------------------------*/
/*- RTE LINK STYLING --------*/
/*---------------------------*/
.fr-popup.fr-active{
margin-top: 9px;
background: #f5f5f5;
border: 1px solid #ddd;
border-radius: 3px;
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
}
.layers-form-item .fr-popup .fr-arrow{
top: -6px;
border-bottom-color: #ddd;
}
.fr-popup .fr-buttons{
display: none;
}
.layers-form-item .fr-popup .fr-input-line{
padding: 0;
margin: 0 0 8px;
display: block;
position: relative;
}
.fr-view a{
border-bottom: 1px dotted;
}
.layers-form-item .fr-popup .fr-input-line input[type="text"],
.layers-form-item .fr-popup .fr-input-line textarea{
background: #fff;
border: 1px solid #ddd;
padding: 6px;
}
.layers-form-item .fr-popup .fr-input-line input[type="text"]:focus,
.layers-form-item .fr-popup .fr-input-line textarea:focus{
border: 1px solid #0289C0;
}
.layers-form-item .fr-popup .fr-input-line input.fr-not-empty + span,
.layers-form-item .fr-popup .fr-input-line textarea.fr-not-empty + span{
display: none;
}
.layers-form-item .fr-popup .fr-checkbox-line{
float: left;
margin-top: 5px;
}
.fr-popup .fr-checkbox-line label{
line-height: 20px;
display: inline-block;
}
.layers-form-item .fr-popup .fr-action-buttons{
float: right;
height: auto;
}
.layers-form-item .fr-popup .fr-action-buttons button.fr-command{
border-radius: 3px;
line-height: 24px;
height: auto;
padding: 0px 8px;
font-size: 12px;
color: #fff ;
background-color: #0085ba;
border-color: #0073aa #006799 #006799;
border-width: 1px;
border-style: solid;
box-shadow: 0 2px 0 #006799;
text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799;
}
.layers-form-item .fr-popup .fr-action-buttons button.fr-command:hover{
background: #008ec2;
border-color: #006799;
color: #fff;
}
/*---------------------------*/
/*- TITLES ------------------*/
.layers-controls-title{
padding: 8px 20px;
background: #0074A2;
border-bottom: 1px solid #006086;
overflow: hidden;
line-height: 29px;
}
.layers-controls-title .layers-heading{
margin: 0;
padding: 0;
color: #fff;
font-size: 20px;
text-indent: 0;
font-weight: normal;
}
.layers-heading{
margin-top: 0;
padding-top: 0;
}
/*---------------------------*/
/*- BUTTONS -----------------*/
.layers-button{
display: inline-block;
height: 28px;
margin: 0px;
padding: 0px 10px 1px;
background: #f7f7f7;
border: 1px solid #ccc;
border-radius: 3px;
white-space: nowrap;
box-sizing: border-box;
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1);
vertical-align: middle;
cursor: pointer;
color: #555;
text-decoration: none;
font-size: 13px;
line-height: 26px;
text-align: center;
}
.layers-button:before{
transition: all .2s;
-webkit-transition: all .2s;
}
.layers-button:hover{
border-color: #999;
color: #555;
}
.layers-button:focus{
box-shadow: none;
}
/*-----------------------*/
/*- PRIMARY BUTTON ------*/
.btn-primary{
background: #0085BA;
border-color: #006799;
box-shadow: 0px 1px 0px #006799;
color: #fff;
}
.btn-primary:hover{
background: #008EC2;
border-color: #006799;
color: #fff;
}
/*-----------------------*/
/*- SECONDARY BUTTON ----*/
.btn-secondary{
background-color: #A3C567;
border-color: #668056;
color: #fff;
}
.btn-secondary:hover{
background-color: #93B25E;
color: #fff;
}
/*-----------------------*/
/*- ERROR BUTTON --------*/
.btn-error{
background-color: #FF5353;
border-color: #BC3F39;
color: #fff;
}
.btn-error:hover{
background-color: #F2413D;
color: #fff;
}
/*-----------------------*/
/*- LINK BUTTON --------*/
.btn-link{
background-color: transparent;
border-color: transparent;
color: #2EA2CC;
text-decoration: underline;
box-shadow: none;
}
.btn-link:hover{
background-color: transparent;
color: #1E8CBE;
}
/*-----------------------*/
/*- CANCEL BUTTON -------*/
.btn-cancel{
background-color: transparent;
border-color: transparent;
color: #A00;
text-decoration: underline;
box-shadow: none;
}
.btn-cancel:hover{
background-color: transparent;
color: #f00;
}
/*-----------------------*/
/*- BUTTON SIZES --------*/
.layers-button.btn-small{
height: 24px;
font-size: 11px;
line-height: 22px;
}
.layers-button.btn-large{
height: 38px;
font-size: 16px;
line-height: 34px;
}
.layers-button.btn-massive{
height: 44px;
font-size: 18px;
line-height: 40px;
}
.layers-button.btn-full{
display: block;
}
/*-----------------------*/
/*- BUTTON WELL ---------*/
.layers-button-well{
overflow: hidden;
padding: 10px;
clear: both;
border-top: 1px solid #E5E5E5;
background: #F5F5F5;
}
.inside .layers-button-well{
margin: 0px -12px -12px;
}
/*-----------------------*/
/*- BUTTON COLLECTION ---*/
.layers-button-collection{
overflow: hidden;
}
/*-----------------------*/
/*- LOADING INDICATORS --*/
@-webkit-keyframes loading-background-animation{
0%{ background-position: 0 0; }
100%{ background-position: 50px 50px; }
}
@-moz-keyframes loading-background-animation{
0%{ background-position: 0 0; }
100%{ background-position: 50px 50px; }
}
.layers-button.layers-loading-button{
background-image: -webkit-gradient(
linear,
0 0,
100% 100%,
color-stop(.25, rgba(0, 0, 0, .05)),
color-stop(.25, rgba(0, 0, 0, 0)),
color-stop(.5, rgba(0, 0, 0, 0)),
color-stop(.5, rgba(0, 0, 0, .05)),
color-stop(.75, rgba(0, 0, 0, .05)),
color-stop(.75, rgba(0, 0, 0, 0)),
to(rgba(0, 0, 0, 0))
);
background-image: -moz-linear-gradient(
-45deg,
rgba(0, 0, 0, .05) 25%,
rgba(0, 0, 0, 0) 25%,
rgba(0, 0, 0, 0) 50%,
rgba(0, 0, 0, .05) 50%,
rgba(0, 0, 0, .05) 75%,
rgba(0, 0, 0, 0) 75%,
transparent
);
-webkit-background-size: 50px 50px;
-moz-background-size: 50px 50px;
background-size: 50px 50px;
-webkit-animation: loading-background-animation 2s linear infinite;
-moz-animation: loading-background-animation 2s linear infinite;
animation: loading-background-animation 2s linear infinite;
background-color: #FAFAFA;
border: 1px solid #CCC;
background-position: 50%;
color: #999999;
pointer-events: none;
}
.layers-button.btn-primary.layers-loading-button{
background-color: #D2D2D2;
border: 1px solid #A7A7A7;
color: #FFFFFF;
}
/*---------------------------*/
/*- ACCORDIONS --------------*/
.layers-accordions{
padding: 0;
margin: 0;
}
.layers-accordion-item{
margin-bottom: 0;
}
.layers-widget-repeater:after{
content: '';
clear:both;
float: none;
height: 6px;
display: block;
}
.layers-accordion-item.layers-accordion-item-remove{
animation: layers-accordion-item-remove-animation .8s cubic-bezier(.65,-0.02,.72,.29);
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
}
.layers-accordion-item.layers-accordion-item-adding{
transition: .2s ease-in-out;
}
.layers-accordion-item.layers-accordion-item-adding-hidden{
opacity: 0 !important;
transform: scale(.96) !important;
}
.layers-accordion-title{
display: block;
margin: 0;
padding: 15px 20px;
position: relative;
font-size: 14px;
line-height: 16px;
font-weight: 600;
background: #fff;
border-bottom: 1px solid #ddd;
color: #555;
cursor: pointer;
}
.layers-accordion-item.layers-accordion-item-adding-flash{
border-color: #009eec !important;
}
.layers-accordion-item.open .layers-accordion-title{
background: #f5f5f5;
}
.layers-accordion-title:hover{
background: #f0f0f0; color: #555;
}
.layers-accordion-title:hover:after{
color: #555;
}
.layers-accordion-title .layers-accordion-duplicate,
.layers-accordion-title .layers-accordion-edit{
color: #aaa;
cursor: pointer;
line-height: 37px;
transition: .1s;
border-left: 1px solid rgba(0, 0, 0, 0.02);
}
.layers-accordion-title:hover .layers-accordion-duplicate,
.layers-accordion-title:hover .layers-accordion-edit,
.layers-accordion-item.open .layers-accordion-title .layers-accordion-duplicate,
.layers-accordion-item.open .layers-accordion-title .layers-accordion-edit{
color: #6d6d6d;
}
.layers-accordion-title .layers-accordion-edit{
display: block;
padding: 0 11px;
position: absolute;
top: 0;
right: 0;
}
.layers-accordion-title .layers-accordion-edit:after{
content: '\e00d';
font: 400 14px/37px layers-interface;
}
.layers-accordion-title .layers-accordion-duplicate{
padding: 0px 8px;
text-transform: uppercase;
cursor: pointer;
position: absolute;
right: 31px;
top: 0;
padding: 0 13px;
opacity: 0;
visibility: hidden;
}
.layers-accordion-title .layers-accordion-duplicate:after{
font: normal normal normal 14px/1 FontAwesome;
content: "\f0c5";
}
.layers-accordion-title .layers-accordion-edit:hover,
.layers-accordion-title .layers-accordion-duplicate:hover{
background: rgba(1,1,1,0.05);
}
.layers-accordion-item.open .layers-accordion-title .layers-accordion-duplicate{
opacity: 1;
visibility: visible;
right: 36px;
}
.layers-accordion-item:first-child .layers-accordion-title{
border-top-width: 0;
}
.layers-accordion-section{
background: #fff;
}
.layers-accordion-section:after{
content: "";
display: block;
float: none;
clear: both;
width: 100%;
clear: both;
}
.layers-accordion-item:last-child .layers-accordion-section{
border-bottom: none;
}
@keyframes layers-accordion-item-remove-animation{
0%{
opacity: 1;
transform: translateX(0);
}
30%{
opacity: 1;
transform: translateX(10px);
}
80%{
opacity: 1;
transform: translateX(-600px);
}
100%{
opacity: 0;
transform: translateX(-600px);
}
}
@keyframes layers-accordion-item-flash-animation{
40%{
border-color: #009eec;
}
100%{
}
}
/*---------------------------*/
/*- ACCORDIONS - SORTABLE ---*/
.layers-accordions-sortable{}
.layers-accordions-sortable .layers-accordion-item{
margin-bottom: 10px;
border: 1px solid #E8E8E8;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.02);
}
.layers-accordions-sortable .layers-accordion-item:hover{
border-color: #ccc;
}
.layers-accordions-sortable .layers-accordion-title{
padding: 10px;
border-top: none;
border-bottom: 1px solid transparent;
cursor: move;
}
.layers-accordions-sortable .layers-accordion-title:after{
line-height: 37px;
/* border-color: #eee; */
}
.layers-accordions-sortable .layers-accordion-section{
border-top: 1px solid #EEE;
border-bottom: none;
}
/*---------------------------*/
/*- SORTING (DRAG N DROPS) --*/
.layers-sortable-drop{
min-height: 37px;
background: #fff;
border: 1px dashed #A3C567;
text-align: center;
margin-bottom: 10px;
}
.layers-sortable-drop a{
color: #000;
display: block;
font-weight: bold;
padding: 10px 5px;
text-align: center;
}
.ui-sortable-helper{
background-color: #fff;
opacity: 0.95;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05) !important;
}
/*---------------------------*/
/*- ICON STYLING ------------*/
input[type=radio][id*=obox-layers]{display: none;}
.layers-icon{
text-indent: -999px;
overflow: hidden;
}
.layers-settings-icon{
display: block;
float: left;
width: 68px;
margin: 0 10px 10px 0;
border: 2px solid #f5f5f5;
border-radius: 4px;
text-align: center;
padding: 5px;
background-color: #fff;
background-size: 68px 26px;
background-repeat: no-repeat;
background-position: center 5px;
}
.layers-settings-icon span{
display: block;
padding: 0 5px;
margin: 35px 0 0;
background-color: #f5f5f5;
color: #777;
font-size: 9px;
font-weight: 700;
line-height: 17px;
text-transform: uppercase;
border-radius: 3px;
transition: all 0.2s ease-in-out;
}
input[type=radio]:checked + .layers-settings-icon{
background-color: #f5f5f5;
}
input[type=radio]:checked + .layers-settings-icon span{
background-color: #0289C0;
color: #fff;
}
.layers-settings-icon:last-child{margin-right: 0;}
.layers-settings-icon:hover{border-color: #0289C0}
/*---------------------------*/
/*- RADIO PILLS -------------*/
.layers-radio-pills-collection{
overflow: hidden;
}
.layers-radio-pills{
float: left;
margin-right: 10px;
}
.layers-radio-pills input[type=radio]{
display: none;
}
.layers-radio-pills span{
display: block;
float: left;
padding: 3px 10px 3px 0px;
color: #333;
font-size: 10px;
font-weight: 700;
line-height: 17px;
}
.layers-radio-pills input[type=radio] + label{
display: block;
float: left;
padding: 3px 10px;
background: #f5f5f5;
color: #777;
font-size: 10px;
font-weight: 700;
line-height: 17px;
text-transform: uppercase;
}
.layers-radio-pills input[type=radio] + label:hover{
background-color: #0289C0;
color: #fff;
}
.layers-radio-pills input[type=radio]:first-child + label{border-radius: 3px 0px 0px 3px;}
.layers-radio-pills label:last-child{border-radius: 0px 3px 3px 0px;}
/*---------------------------*/
/*- ONCE OFF CSS ------------*/
.layers-controls-title .btn-collection{}
.layers-controls-title .layers-button{padding: 6px 10px; margin-left: 5px;}
/*---------------------------*/
/*- BACKGROUND UPLOADER -----*/
.layers-image-uploader{
display: block;
height: 200px;
margin-bottom: 15px;
border: 1px dashed #ddd;
position: relative;
overflow: hidden;
transform-style: preserve-3d;
text-align: center;
}
.layers-image-uploader p{
padding: 40px 10px 0;
margin: 60px 0 0;
background: url(images/icon-bgimage-small.png) top no-repeat;
background-size: 32px 32px;
color: #777;
}
.layers-image-uploader:hover{
border-color: #168ABE;
}
.layers-image-uploader.layers-small{
min-height: 200px;
}
.layers-image-container{
position: relative;
}
.layers-image-container.layers-has-image{
padding: 8px;
background: #fff;
border: 1px solid #ddd;
border-radius: 4px;
}
.layers-image-container .layers-image-display{
display: none;
}
.layers-image-container.layers-has-image .layers-image-display{
display: block;
max-height: 108px;
padding: 8px;
margin-bottom: 10px;
background: #f0f0f0;
border: 1px solid #ddd;
border-radius: 3px;
overflow: hidden;
cursor: pointer;
}
.layers-image-container .layers-image-display:hover{
background-color: #EAEAEA;
}
.layers-image-display img{
display: block;
max-height: 108px;
width: auto;
margin: 0 auto;
border-radius: none;
}
.layers-image-remove{
display: none;
width: 16px;
height: 16px;
background: #FF5353 url('images/cross.png') no-repeat;
background-size: 16px 16px;
border: 1px solid #BC3F39;
position: absolute;
top: 8px;
right: 8px;
z-index: 2;
color: #fff;
font-size: 11px;
border-radius: 3px;
transition: all 0.2s ease-in-out;
text-indent: -999px;
overflow: hidden;
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4) inset, 0px 1px 0px rgba(0, 0, 0, 0.08);
}
.layers-image-remove:hover{
background-color: #F2413D;
}
.layers-image-display img + .layers-image-remove{
display: block;
}
/*---------------------------*/
/*- FILE UPLOADER -----------*/
.layers-file-container.layers-has-file{
position: relative;
padding: 8px;
background: #fff;
border: 1px solid #ddd;
border-radius: 3px;
}
.layers-file-container.layers-has-file .layers-file-name{
display: block;
padding: 0 8px 8px;
margin: 0 -8px 8px;
border-bottom: 1px solid #ddd;
text-align: center;
font-family: "courier new", monospace, sans-serif;
font-size: 12px;
}
.layers-file-container.layers-has-file .layers-image-remove{
display: block;
}
/*---------------------------*/
/*- ELEMENT CONTROLLER ------*/
.layers-media-controller{
background: #f5f5f5;
border: 1px solid #ddd;
overflow: hidden;
}
.layers-media-controller .layers-section-links{
float: left;
width: 52px;
margin: 0 0 10px;
padding: 0;
list-style: none;
position: relative;
z-index: 2;
}
.layers-media-controller .layers-section-links li{
margin: 0;
border-bottom: 1px solid #ddd;
}
.layers-media-controller .layers-section-links li.active{
margin-right: -1px;
background: #fff;
}
.layers-media-controller .layers-section-links a{
display: block;
width: auto;
padding: 10px;
transition: all 0.5s cubic-bezier(0, 0.275, 0.125, 1) 0s;
outline: none;
color: #777;
}
.layers-media-controller .layers-section-links a:hover{
background-color: #fff;
color: #000;
}
.layers-media-controller .layers-section-links li.active a{
color: #000;
}
.layers-media-controller .layers-controller-elements{
overflow: hidden;
background: #fff;
border-left: 1px solid #DDD;
position: relative;
z-index: 1;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.layers-media-controller .layers-controller-elements .layers-content{
height: 0;
padding: 0 20px;
opacity: 0;
visibility: hidden;
overflow: hidden;
transition: height 0.5s ease-in-out, padding 0.5s ease-in-out, opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}
.layers-media-controller .layers-controller-elements .layers-content.section-active{
height: 290px;
padding: 20px;
opacity: 1;
visibility: visible;
overflow-y: scroll;
}
.layers-media-controller .layers-controller-elements .layers-form-item{
margin: 20px 0 60px;
transition: margin 0.5s ease-in-out 0.2s;
}
.layers-media-controller .layers-controller-elements .section-active .layers-form-item{
margin: 0 0 15px;
}
.layers-media-controller .layers-controller-elements .layers-checkbox{
margin: 20px 0 100px;
transition: margin 0.5s ease-in-out 0.2s;
}
.layers-media-controller .layers-controller-elements .section-active .layers-checkbox{
margin: 0 0 8px;
}
/*---------------------------*/
/*- MAP CONTAINER -----------*/
.layers-map-container{
display: block;
padding: 0;
min-height: 300px;
background: #f8f8f8 url(images/icon-map-large.png) center no-repeat;
background-size: 64px 64px;
border: 2px solid transparent;
border-radius: 3px;
}
.layers-map img{max-width: none;}
/*---------------------------*/
/*- TABBED NAV --------------*/
.layers-nav-tabs{
text-align: center;
}
.layers-nav-tabs ul{
margin: 0;
background: #F3F3F3;
margin-top: -6px;
margin: -6px -12px 0;
width: 101.6%;
border-bottom: 1px solid #eee;
}
.layers-nav-tabs li{
float: left;
margin: 0px;
}
.layers-nav-tabs a{
display: block;
padding: 10px 15px;
background: #F3F3F3;
font-weight: 600;
color: #8F8F8F;
text-decoration: none;
border-right: 1px solid #eee;
border-top: none;
border-bottom: none;
margin: 0px;
}
.layers-nav-tabs a:hover{
color: #454545;
background: #F3F3F3;
}
.layers-nav-tabs .active a{
background: #fff;
border-bottom: 0 none;
color: #454545;
}
/*---------------------------*/
/*- IRIS COLOR PICKER -------*/
.wp-picker-container .iris-picker{
width: 200px !important;
height: 170px !important;
border-radius: 3px !important;
margin-bottom: 6px;
}
.wp-picker-container .iris-border .iris-picker-inner{
width: 200px;
}
.wp-picker-container .iris-picker .iris-square{
width: 159px !important;
height: 150px !important;
margin-right: 4px !important;
}
.wp-picker-container .iris-picker .iris-strip{
height: 150px !important;
width: 20px !important;
}
/*---------------------------*/
/*- INTERFACE COPY ----------*/
/*-----------------------*/
/*- UPSELL --------------*/
li[id*="accordion-section"] .customize-control
.l_option-customize-control.l_option-customize-control-heading.layers-upsell-tag{
padding: 8px 10px 5px;
background: #f5f5f5;
border-radius: 3px;
}
.layers-upsell-title,
li[id*="accordion-section"] .customize-control
.l_option-customize-control.l_option-customize-control-heading.layers-upsell-tag
.customize-control-title{
display: inline-block;
padding: 0px 5px;
margin-bottom: 2px;
background: #009EEC;
border-radius: 3px;
color: #FFF;
text-transform: uppercase;
font-size: 11px;
font-weight: bold;
line-height: 18px;
}
.layers-inline-upsell{
text-transform: uppercase;
padding: 0px 4px;
margin: 0 0 0 3px;
border: 1px solid #696969;
border-radius: 100px;
color: #000;
font-size: 9px;
line-height: 1;
opacity: .4;
}
.layers-inline-upsell a{
font-weight: bold;
transition: none;
}
.layers-inline-upsell:hover{
opacity: 1;
background: #009eec;
border-color: transparent;
color: #fff;
}
.layers-inline-upsell:hover a{
color: #fff;
}
/*--------------------------------*/
/*- DISCOVER MORE PHOTOS ---------*/
.layers-discover-more-photos{
padding: 4%;
text-align: center;
}
.layers-discover-more-feature{
width: 100%;
max-width: 600px;
margin: 0 auto 20px;
}
.layers-discover-more-feature .layers-column{
height: 0;
padding-bottom: 20%;
overflow: hidden;
background-color: #333333;
}
.layers-discover-more-feature .layers-column img{
left: -35%;
max-width: 175%;
position: absolute;
}
.layers-discover-more-photos .btn-primary{
color: #fff;
border: 1px solid #0074A2;
box-sizing: border-box;
}
.layers-discover-more-photos .btn-primary:hover{
color: #fff;
}
/*-------------------------------*/
/*- LOADING INDICATORS ----------*/
@-webkit-keyframes move{
0%{ background-position: 0 0; }
100%{ background-position: 50px 50px; }
}
@-moz-keyframes move{
0%{ background-position: 0 0; }
100%{ background-position: 50px 50px; }
}
.layers-button.layers-loading-button{
background-image: -webkit-gradient(
linear,
0 0,
100% 100%,
color-stop(.25, rgba(0, 0, 0, .05)),
color-stop(.25, rgba(0, 0, 0, 0)),
color-stop(.5, rgba(0, 0, 0, 0)),
color-stop(.5, rgba(0, 0, 0, .05)),
color-stop(.75, rgba(0, 0, 0, .05)),
color-stop(.75, rgba(0, 0, 0, 0)),
to(rgba(0, 0, 0, 0))
);
background-image: -moz-linear-gradient(
-45deg,
rgba(0, 0, 0, .05) 25%,
rgba(0, 0, 0, 0) 25%,
rgba(0, 0, 0, 0) 50%,
rgba(0, 0, 0, .05) 50%,
rgba(0, 0, 0, .05) 75%,
rgba(0, 0, 0, 0) 75%,
transparent
);
-webkit-background-size: 50px 50px;
-moz-background-size: 50px 50px;
background-size: 50px 50px;
-webkit-animation: move 2s linear infinite;
-moz-animation: move 2s linear infinite;
animation: move 2s linear infinite;
background-color: #FAFAFA;
background-position: 50%;
color: #999999;
pointer-events: none;
}
/*-------------------------------*/
/*- TIP-TIP ---------------------*/
div#tiptip_holder{
z-index: 9999999;
}
#tiptip_holder #tiptip_content{
max-width: 198px;
padding: 3px 6px;
font-size: 11px;
line-height: 1.5em;
box-shadow: none;
border: 0;
background: rgba(0, 0, 0, 0.75);
}
#tiptip_holder.tip_top #tiptip_arrow{
border-top-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_bottom #tiptip_arrow{
border-bottom-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_right #tiptip_arrow{
border-right-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_left #tiptip_arrow{
border-left-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_top #tiptip_arrow_inner{
margin-top: -6px;
border-top-color: rgba(0, 0, 0, 0.75);
}
#tiptip_holder.tip_bottom #tiptip_arrow_inner{
margin-top: -6px;
border-bottom-color: rgba(0, 0, 0, 0.75);
}
#tiptip_holder.tip_right #tiptip_arrow_inner{
margin-left: -6px;
border-right-color: rgba(0, 0, 0, 0.75);
}
#tiptip_holder.tip_left #tiptip_arrow_inner{
margin-left: -6px;
border-left-color: rgba(0, 0, 0, 0.75);
}
/*-------------------------------*/
/*- OPTIONS PANEL CSS -----------*/
/*-------------------------------*/
/*-------------------------------*/
/*- CUSTOMIZER CONTROLS ---------*/
#customize-controls .description{
color: #999;
}
li[id*='customize-control-layers'].customize-control{
margin: 0;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control{
padding: 6px 0;
}
li[id*='customize-control-layers'].customize-control:first-child{
margin: 6px 0 0px;
}
li[id*='customize-control-layers'].customize-control .layers-form-item{
margin: 0 0 6px;
}
li[id*='customize-control-layers'].customize-control .layers-form-item:after{
content: '';
display: block;
float: none;
clear: both;
}
/*-----------------------------*/
/*- SPECIFIC FORM TYPES -------*/
.customize-control .customize-control-layers-seperator{
border: 0;
border-top: 0;
border-bottom: 1px solid #EEE;
margin: 8px 0;
}
.layers-form-item .wp-color-result{
margin: 0 6px 3px 0;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
}
li[id*='customize-control-layers'].customize-control.customize-control-image .actions
li[id*='customize-control-layers'].customize-control.customize-control-image .actions{
margin-bottom: 0;
}
#customize-control-custom_logo .thumbnail-image img,
.customize-control-site_logo .current img{
display: block;
max-width: 100%;
margin: auto;
padding: 10px;
background-image: url(../assets/images/transparent-tile.png);
border-radius: 4px;
box-sizing: border-box;
}
/*----------------------------*/
/*- HEADING CONTROLS -------- */
li[id*='customize-control-layers'].customize-control .heading-label .customize-control-title{
font-size: 14px;
line-height: 24px;
font-weight: bold;
margin: 0 0 4px;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-heading .customize-control-title{
display: block;
font-size: 14px;
line-height: 24px;
font-weight: 600;
text-transform: none;
margin: 0;
}
li[id*='customize-control-layers'].customize-control .customize-control-title.l_option-heading-divider{
display: block;
font-size: 14px;
line-height: 24px;
font-weight: 600;
margin: 0 0 6px;
}
table.l_option-heading-divider{
width: 100%;
margin: 6px 0 0;
padding: 0;
border-spacing: 0;
}
table.l_option-heading-divider tr{
margin: 0;
padding: 0;
}
table.l_option-heading-divider tr td:first-child{
padding-right: 6px;
font-size: 14px;
line-height: 24px;
font-weight: 600;
text-transform: none;
margin: 0;
white-space: nowrap;
}
table.l_option-heading-divider tr td:last-child{
width: 100%;
}
table.l_option-heading-divider tr td:last-child div{
border-bottom: 1px solid #EEE;
height: 2px;
}
li[id*='customize-control-layers'].customize-control table.l_option-heading-divider .customize-control-title{
display: block;
font-size: 14px;
line-height: 24px;
font-weight: 600;
margin: 0 0 6px;
}
/*----------------------------------------*/
/*- HEADING DIVIDER - DEDICATED CONTROLS -*/
li[id*='customize-control-layers'].customize-control.customize-control-layers-heading-divider{
margin-top: 12px;
}
li[id*='customize-control-layers'].customize-control.customize-control-layers-heading-divider table.l_option-heading-divider .customize-control-title{
margin: 0;
}
li[id*='customize-control-layers'].customize-control.customize-control-layers-heading-divider .description{
margin-top: 3px;
}
/*-----------------------------*/
/*- RANGE + NUMBER CONTROL ----*/
.l_option-range-wrapper input[type="range"],
.l_option-customize-control-range input[type="range"]{
width: 95%;
display: block;
height: 30px;
padding: 0;
margin: 0;
border: initial;
box-shadow: initial;
padding: 0;
}
.l_option-range-wrapper input[type="number"],
.l_option-customize-control-range input[type="number"]{
height: 30px;
display: inline-block;
box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.04);
}
.l_option-customize-control-range:not(.group) > .layers-form-item{
border: 1px solid rgb(221, 221, 221);
border-radius: 2px;
padding: 6px;
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.02);
}
/*----------------------*/
/*- CHECKBOX -----------*/
li[id*='customize-control-layers'].customize-control .l_option-customize-control-checkbox .layers-form-item{
margin: 0;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control-checkbox .description{
margin-top: .2em;
}
/*----------------------*/
/*- SWITCH (CHECKBOX) --*/
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-switch {
padding: 0;
margin: 1px 0;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-switch .layers-form-item {
/* padding: 0; */
/* margin: 0; */
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-switch .layers-form-item label {
padding: 0;
margin: 0;
}
/*---------------------------*/
/*- COLOR CONTROLS ----------*/
.l_option-customize-control-color label {
margin-bottom: 6px;
display: inline-block;
position: absolute;
width: 100%;
box-sizing: border-box;
}
.l_option-customize-control-color input[type=text].layers-color-selector.wp-color-picker{
float: left;
display: inline-block;
height: auto;
padding: 3px;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.l_option-customize-control-color.layers-color-wrapper label {
position: absolute;
font-size: 13px;
font-weight: normal;
text-transform: none;
margin: 2px 0;
}
.l_option-customize-control-color .wp-picker-container {
text-align: right;
width: 100%;
}
.l_option-customize-control-color .wp-color-result {
display: inline-block;
width: 8px;
height: 16px;
border-radius: 100px;
margin: 1px -1px 0 0 !important;
box-shadow: 0 1px 0px rgba(0, 0, 0, 0.03) !important;
border: 2px solid rgba(0, 0, 0, 0.15);
}
.l_option-customize-control-color .wp-color-result:after {
display: none;
}
.l_option-customize-control-color .wp-picker-input-wrap {
display: block !important;
width: 90px;
white-space: nowrap;
margin-top: -18px;
position: relative;
}
/*------------------------------------*/
/*- COLOR PICKER OPEN ----------------*/
.l_option-customize-control-color .wp-picker-container.wp-picker-active {
margin-top: 25px;
}
.l_option-customize-control-color .wp-picker-container.wp-picker-active .wp-color-result{
position: relative;
top: 3px;
}
/*-------------------------------*/
/*- CUSTOMIZER CONTROL GROUPS -- */
li.customize-control .l_option-heading-divider{
display: block;
font-size: 14px;
line-height: 24px;
font-weight: 600;
margin: 0 0 6px;
}
li .l_option-customize-control.l_option-customize-control-heading.group .l_option-heading-divider{
margin: 12px 0 4px;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.group .customize-control-title,
li.customize-control.customize-control-layers-color .l_option-customize-control.group label{
text-transform: uppercase;
font-size: 10px;
font-weight: 600;
/* letter-spacing: 1px; */
margin-bottom: 3px;
line-height: 1.5em;
display: block;
color: #777777;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.group label{
text-transform: uppercase;
font-size: 10px;
font-weight: 600;
line-height: 1.5em;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-color.group label{
text-transform: none;
font-size: 13px;
font-weight: 400;
line-height: 1.5em;
}
li[id*='customize-control-layers'].customize-control.li-group{
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.group{
display: list-item;
box-sizing: border-box;
padding: 9px 9px 6px 9px;
background: #f6f6f6;
position: relative;
transition: border-radius .25s ease-in-out, all 0s;
}
/* ACCORDION OPEN */
li[id*='customize-control-layers'].customize-control.open .l_option-customize-control.group{
background: #d9d9d9;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.group:after{
content: "";
background: #e5e5e5;
display: block;
height: 1px;
width: calc(100% - 16px);
left: 8px;
bottom: 0px;
position: absolute;
transition: .5s;
float: none;
clear: both;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-accordion-end.group:after{
opacity: 0;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.group.layers-push-top-small {
margin-top: 2px !important;
}
/*---------------------------------*/
/*- FIRST & LAST GROUP ELEMENTS -- */
li[id*='customize-control-layers'].customize-control.li-group-first .l_option-customize-control{
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
li[id*='customize-control-layers'].customize-control.li-group-last {
}
li[id*='customize-control-layers'].customize-control.li-group-last .l_option-customize-control{
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
li[id*='customize-control-layers'].customize-control.li-group-last .l_option-customize-control:after{
opacity: 0;
}
.l_option-customize-control.group .description{
font-size: 12px;
line-height: 1.3em;
margin-bottom: 6px;
margin-top: -6px;
cursor: pointer;
}
.l_option-customize-control.l_option-customize-control-font.group .description{
margin-top: 6px;
}
/*---------------------------*/
/*- GROUP INPUTS ------------*/
.l_option-customize-control.group:not(.l_option-customize-control-color) input,
.l_option-customize-control.group select,
.l_option-customize-control.group .layers-input {
line-height: 28px;
height: 29px;
font-size: 13px;
padding: 0 6px;
background: #ffffff;
border-radius: 2px;
}
.l_option-customize-control.group input{
background: #FBFBFB;
}
.l_option-customize-control.group input[type="number"]{
/* padding-right: 0; */
}
.l_option-customize-control.group:not(.l_option-customize-control-color) input[type="range"]{
background: transparent;
height: 28px;
}
.l_option-customize-control.group.l_option-customize-control-range input[type="range"]{
height: 28px;
padding: 0;
}
.l_option-customize-control.group.l_option-customize-control-checkbox label{
margin-bottom: 6px;
}
/*--------------------------------------------*/
/*- CUSTOMIZER CONTROL ACCORDIONS (STANDARD) -*/
li[id*='customize-control-layers'].customize-control-layers-accordion-start:not(.li-group) {
margin-bottom: -1px;
}
li[id*='customize-control-layers'].customize-control-layers-accordion-start .l_option-customize-control,
li[id*='customize-control-layers'].customize-control-layers-accordion-end .l_option-customize-control {
transition: .25s;
}
li[id*='customize-control-layers'].customize-control:not(.li-group) .l_option-customize-control-accordion-start {
border-top: 1px solid #e1e1e1;
border-bottom: 1px solid #e1e1e1;
padding: 0 12px;
margin: 12px -12px 12px;
position: relative;
}
li[id*='customize-control-layers'].customize-control:not(.li-group) .l_option-customize-control-accordion-start:after {
font-family: layers-interface;
content: "\e923";
position: absolute;
right: 10px;
top: 6px;
line-height: 15px;
padding: 0;
font-size: 16px;
font-weight: normal;
color: #fff;
background: #9b9b9b;
border-radius: 100%;
box-shadow: 0px 0px 0px 2px white inset;
}
li[id*='customize-control-layers'].customize-control:not(.li-group) .customize-control-title {
padding: 0;
margin: 0;
font-size: 13px;
font-weight: 700;
line-height: 28px;
}
li[id*='customize-control-layers'].customize-control:not(.li-group) .l_option-customize-control-accordion-end {
height: 0px;
border-bottom: 1px solid #e1e1e1;
padding: 0 12px;
margin: 12px -12px;
position: relative;
}
li[id*='customize-control-layers'].customize-control.li-prev-is-accordion {
margin-top: -25px;
}
/*--------------------------*/
/*- HOVER (STANDARD) ------*/
li[id*='customize-control-layers'].customize-control:not(.li-group) .l_option-customize-control:hover:after {
color: #bbbbbb !important;
background: white !important;
}
/*--------------------------*/
/*- CLOSED (STANDARD) ------*/
li[id*='customize-control-layers'].customize-control.customize-control-layers-accordion-start.closed:not(.li-group) .l_option-customize-control {
margin-bottom: 0px;
}
li[id*='customize-control-layers'].customize-control.customize-control-layers-accordion-end.closed:not(.li-group) .l_option-customize-control {
margin-top: 0px;
padding: 0;
}
li[id*='customize-control-layers'].customize-control.customize-control-layers-accordion-start.closed:not(.li-group) .l_option-customize-control:after {
content: "\e922";
}
/*------------------------------------------*/
/*- CUSTOMIZER CONTROL ACCORDIONS (GROUPS) -*/
li[id*='customize-control-layers'].customize-control .l_option-customize-control-accordion-start {
cursor: pointer;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-accordion-start:after {
font-family: layers-interface;
content: "\e923";
position: absolute;
left: auto;
bottom: auto;
right: 10px;
top: 7px;
line-height: 15px;
padding: 0;
font-size: 16px;
font-weight: normal;
color: #fff;
background: #9b9b9b;
border-radius: 100%;
box-shadow: 0px 0px 0px 2px white inset;
width: auto;
height: auto;
border: 0;
transition: .15s;
opacity: 1;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control-accordion-end.li-group {
height: 0px;
border: none;
padding: 0;
margin: 0;
}
li.customize-control-layers-accordion-end.li-group {
display: none !important;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control-accordion-start.group {
padding-top: 7px;
padding-bottom: 6px;
margin-top: 2px;
position: relative;
z-index: 1;
}
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-accordion-start.group:after {
/* top: 8px; */
right: 9px;
}
li[id*='customize-control-layers'].customize-control.customize-control-layers-accordion-start .l_option-customize-control.group .customize-control-title,
li[id*='customize-control-layers'].customize-control.customize-control-layers-accordion-start .l_option-customize-control.group label {
margin-bottom: 0;
}
/*--------------------------*/
/*- HOVER (GROUPS) ------*/
li[id*='customize-control-layers'].customize-control .l_option-customize-control.l_option-customize-control-accordion-start.group:hover:after{
color: #bbbbbb !important;
background: white !important;
}
/*------------------------*/
/*- CLOSED (GROUPS) ------*/
li[id*='customize-control-layers'].customize-control.closed .l_option-customize-control.l_option-customize-control-accordion-start.group {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
/* padding-bottom: 7px; */
}
li[id*='customize-control-layers'].customize-control.closed .l_option-customize-control.l_option-customize-control-accordion-start.group:after {
content: "\e922";
top: 7px;
right: 9px;
}
/*-------------------------------*/
/*- CUSTOMIZER CONTROL TABS -----*/
.customize-control-layers-tab-start {
display: none !important;
}
.customize-control-layers-tab-end {
display: none !important;
}
/*-------------------------------*/
/*- CUSTOMIZER CONTROL EXTRAS ---*/
.layers-control-has-partial {
font-weight: normal;
border-radius: 100px;
padding: 0 4px;
border: 1px solid rgba(0, 0, 0, 0.09);
color: rgba(66, 66, 66, 0.35);
font-size: 9px;
text-transform: uppercase;
margin: 0 4px 4px 0;
opacity: 1;
line-height: 15px;
display: inline-block;
position: relative;
/* top: -1px; */
left: -1px;
}