.customizer-box img {
max-width: 100%;
}
.customizer-box h3,
.customizer-box h4,
.customizer-box p {
margin: 0;
}
.customizer-box h4 {
font-size: 18px;
color: #272727;
font-weight: bold;
line-height: 18px;
margin-bottom: 15px;
}
.customizer-box p {
font-size: 14px;
color: #9E9E9E;
font-weight: bold;
}
.customizer-box ul,
.customizer-box ul li {margin: 0;padding: 0;list-style: none;}
.customizer-box {
position: fixed;
width: 100%;
max-width: 240px;
background: #fff;
padding: 0 20px;
position: fixed;
top: 10vh;
left: -340px;
text-align: center;
z-index: 10000;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
-webkit-transition: left .4s ease;
transition: left .4s ease;
}
.customizer-box.on {
left: 0;
}
.customizer-box.off {
left: -240px;
}
.customizer-inner {
max-height: 80vh;
overflow-x: hidden;
overflow-y: auto;
padding-bottom: 35px;
}
.customizer-box button.toggler {
border: none;
outline: none;
width: 50px;
height: 50px;
font-size: 24px;
line-height: 50px;
color: #A8C41B;
background: #fff;
position: absolute;
top: 0;
left: 100%;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}
.customizer-box .content-row {
margin-left: -7.5px;
margin-right: -7.5px;
}
.customizer-box .content-row:before,
.customizer-box .content-row:after {
content: " "; display: table; }
.customizer-box .content-row:after {
clear: both;
} .customizer-box .content-row {
*zoom: 1;
}
.customizer-box .content-col {
float: left;
padding: 0 7.5px;
}
.customizer-box .col-3 {
width: 25%;
}
.customizer-box .col-6 {
width: 50%;
} .customizer-box .content-box + .content-box {
padding-top: 20px;
margin-top: 15px;
border-top: 1px solid #f7f7f7;
} .customizer-box .top-box {
background: #272727;
margin-left: -20px;
margin-right: -20px;
margin-bottom: 15px;
}
.customizer-box .top-box h3 {
font-size: 18px;
text-transform: uppercase;
color: #fff;
font-weight: 900;
font-family: 'Roboto Slab';
line-height: 50px;
} .customizer-box #full-box,
.customizer-box #boxed {cursor: pointer;} .customizer-box .switcher-box p {
display: inline-block;
vertical-align: middle;
}
.customizer-box .switch {
vertical-align: middle;
width: 80px;
height: 33px;
margin: 0 10px;
}
.customizer-box .slider {
background: #A8C41B;
}
.customizer-box .slider:before {
width: 30px;
height: 30px;
left: 1px;
bottom: 1.75px;
}
.customizer-box input:checked + .slider {
background: #F4F4F4 !important;
}
.customizer-box input:checked + .slider:before {
-webkit-transform: translateX(47px);
-ms-transform: translateX(47px);
transform: translateX(47px);
} .customizer-box .pattern-box {
width: 100%;
height: 39px;
border: 2px solid #F5F5F5;
background-repeat: repeat;
background-position: center center;
cursor: pointer;
}
.customizer-box .pattern-box.skin-pattern-1 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-1.jpg);
}
.customizer-box .pattern-box.skin-pattern-2 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-2.jpg);
}
.customizer-box .pattern-box.skin-pattern-3 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-3.jpg);
}
.customizer-box .pattern-box.skin-pattern-4 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-4.jpg);
}
html {    
background-repeat: repeat;
background-position: center center;
}
html.boxed-pattern-1 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-1.jpg);
}
html.boxed-pattern-2 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-2.jpg);
}
html.boxed-pattern-3 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-3.jpg);
}
html.boxed-pattern-4 {
background-image: url(//www.bieler-christian.at/wp-content/themes/landshaper/customizer/img/pattern-4.jpg);
} .customizer-box .skin-box {
width: 100%;
height: 39px;
display: block;
cursor: pointer;
}
.customizer-box .skin-box .skin-box-inner {
width: 100%;
height: 100%;
display: block;
}
.customizer-box .skin-box.skin-1 .skin-box-inner {
background-color: #A8C41B;
}
.customizer-box .skin-box.skin-2 .skin-box-inner {
background-color: #6AAF08;
}
.customizer-box .skin-box.skin-3 .skin-box-inner {
background-color: #28C67A;
}
.customizer-box .skin-box.skin-4 .skin-box-inner {
background-color: #C9BF1C;
}