/* --------------------
   -------------------- Layout -------------------- */
.b-customizer  {
     position:  fixed;
     z-index:  111111111;
     top: 0;
     left: 0;
     bottom: 0;
     font:  300 1.6em/1.5 'Open Sans',  sans-serif;
     text-align:  left;
 }

.b-customizer_options  {
     position:  relative;
     z-index:  5;
     padding:  20px 20px;
     width:  259px;
     height: 100%;
     overflow-y: auto;
     background:  rgba(255,  255,  255,  .96);
 }


.b-customizer_toggle  {
     position:  absolute;
     z-index:  0;
     left:  100%;
     top:  65px;
     padding:  15px 20px 15px 15px;
     font-size:  22px;
     line-height:  24px;
     text-align:  center;
     color:  #666;
     background:  #fff;
     background:  rgba(255,  255,  255,  .96);
     cursor:  pointer;
     border-radius: 0 0px 0px 0 !important;
 }

 .b-customizer_toggle,
 .b-customizer {
     box-shadow: 0 1px 12px 0px rgba(51, 51, 51, 0.23);
    -moz-box-shadow: 0 1px 12px 0px rgba(51, 51, 51, 0.23);
    -webkit-box-shadow: 0 1px 12px 0px rgba(51, 51, 51, 0.23);
    -o-box-shadow: 0 1px 12px 0px rgba(51, 51, 51, 0.23);
 }

.b-customizer_toggle:hover {
     color:  #F8626D !important;
 }
.b-customizer_toggle:focus,
.b-customizer_toggle:active {
     color:  #666;
 }


.b-customizer_toggle, 
.b-customizer_options  {
     -webkit-border-radius:  0 0px 0px 0;
     -moz-border-radius:  0 0px 0px 0;
     border-radius:  0 0px 0px 0;
 }


.b-customizer_set  {
     position:  relative;
     margin-bottom:  25px;
 }

 .b-customizer_set:last-child  {
     margin-bottom:  0px !important;
 }

.b-customizer_set ~ .b-customizer_set  {
     margin-top:  16px;
 }


.b-customizer_set_legend  {
    font-size: 20px !important;
    margin-bottom: 10px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .025em;
    color: #666;
    border-bottom: 1px solid rgba(0,0,0,0.15);
 }


@media (max-width: 768px)  {
    

    .b-customizer  {
          position:  fixed;
      }


}


/* --------------------
   -------------------- Toggle -------------------- */
.b-customizer  {
     -webkit-transform:  translate(-260px,  0);
     -moz-transform:  translate(-260px,  0);
     -ms-transform:  translate(-260px,  0);
     -o-transform:  translate(-260px,  0);
     transform:  translate(-260px,  0);
     -webkit-transition:  all 400ms;
     -moz-transition:  all 400ms;
     -o-transition:  all 400ms;
     transition:  all 400ms;
 }

.b-customizer.open  {
     -webkit-transform:  translate(0,  0);
     -moz-transform:  translate(0,  0);
     -ms-transform:  translate(0,  0);
     -o-transform:  translate(0,  0);
     transform:  translate(0,  0);
 }



/* --------------------
   -------------------- Links -------------------- */
.b-customizer_layout, 
.b-customizer_style,
.b-customizer_homepage  {
     list-style:  none;
     font:  700 .875em/1.25 'Open Sans',  sans-serif;
     letter-spacing:  .025em;
 }


.b-customizer_homepage li,
.b-customizer_layout li, 
.b-customizer_style li  {
     display:  block;
     margin-bottom:  0px;
 }

.b-customizer_homepage a,
.b-customizer_layout a, 
.b-customizer_style a  {
     text-decoration:  none;
     color:  #666;
    font-size:  15px;
     font-weight:  400;
}

.b-customizer_homepage a,
.b-customizer_layout a, 
.b-customizer_style a {
    padding-left: 0px;
    -moz-transition:        all 0.4s ease-out;
    -o-transition:          all 0.4s ease-out;
    -ms-transition:         all 0.4s ease-out;
    transition:             all 0.4s ease-out;
}

.b-customizer_homepage a:hover,
.b-customizer_layout a:hover, 
.b-customizer_style a:hover {
    padding-left: 8px;
}


.b-customizer_layout a:hover, 
.b-customizer_style a:hover,
.b-customizer_homepage a:hover,
.b-customizer_layout a.current, 
.b-customizer_style a.current,
.b-customizer_homepage a.current  {
     color:  #f8626d;
 }



.b-customizer_options ul  {
    margin:  0px;
     padding-left:  0px;
}


/* --------------------
   -------------------- Colors -------------------- */
.b-customizer_colors  {
     list-style:  none;
     /*max-width:  160px;*/
 }

.b-customizer_colors li  {
     display:  inline-block;
     margin-right:  5px;
 }


.b-customizer_colors a  {
    display:  block;
    width:  45px;
    height:  35px;
    cursor:  pointer;
    border:  0px solid transparent;
    -webkit-border-radius:  0px;
    -moz-border-radius:  0px;
    border-radius:  0px;
    -webkit-box-sizing:  border-box;
    -moz-box-sizing:  border-box;
    box-sizing:  border-box;
    position: relative;
    opacity: 0.75;
    -o-transform: scale(0.8);
    -mz-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition: all 0.4s ease-out;
    -moz-transition:        all 0.4s ease-out;
    -o-transition:          all 0.4s ease-out;
    -ms-transition:         all 0.4s ease-out;
    transition:             all 0.4s ease-out;
 }

 .b-customizer_colors a:after,
 .b-customizer_colors a:before {
    content: '';
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
 }
  .b-customizer_colors a:before{
    left: 0;
 }
 .b-customizer_colors a:after{
    right: 0;
 }
 .b-customizer_colors a.current {
    opacity: 1;
    -o-transform: scale(1);
     -mz-transform: scale(1);
     -moz-transform: scale(1);
     -webkit-transform: scale(1);
     transform: scale(1);
 }
.b-customizer_colors a:hover  {
     opacity:  1;
 }


.b-customizer_colors a.red  {
    background: #DA251D;
}
.b-customizer_colors a.lime  {
    background: #98D361;
}
.b-customizer_colors a.blue  {
    background: #609DDB;
}
.b-customizer_colors a.purple  {
    background: #8E44AD;
}


.b-customizer_colors a.gradient-red  {
    background: -webkit-linear-gradient(left, #e40079, #0091ea);
    background: -moz-linear-gradient(left, #e40079, #0091ea);
    background: -ms-linear-gradient(left, #e40079, #0091ea);
    background: -o-linear-gradient(left, #e40079, #0091ea);
    background: linear-gradient(left, #e40079, #0091ea);
}
.b-customizer_colors a.gradient-lime  {
    background: -webkit-linear-gradient(left, #98D361, #56B4D3);
    background: -moz-linear-gradient(left, #98D361, #56B4D3);
    background: -ms-linear-gradient(left, #98D361, #56B4D3);
    background: -o-linear-gradient(left, #98D361, #56B4D3);
    background: linear-gradient(left, #98D361, #56B4D3);
}
.b-customizer_colors a.gradient-blue  {
    background: -webkit-linear-gradient(left, #609ddb, #B5AC49);
    background: -moz-linear-gradient(left, #609ddb, #B5AC49);
    background: -ms-linear-gradient(left, #609ddb, #B5AC49);
    background: -o-linear-gradient(left, #609ddb, #B5AC49);
    background: linear-gradient(left, #609ddb, #B5AC49);
}
.b-customizer_colors a.gradient-purple  {
    background: -webkit-linear-gradient(left, #8e44ad, #0eb8e8);
    background: -moz-linear-gradient(left, #8e44ad, #0eb8e8);
    background: -ms-linear-gradient(left, #8e44ad, #0eb8e8);
    background: -o-linear-gradient(left, #8e44ad, #0eb8e8);
    background: linear-gradient(left, #8e44ad, #0eb8e8);
}