@charset "utf-8";

/* ****************************************************************************
 * SWITCHER
 * 
 * Style Picker to switch theme colour panel
 * ****************************************************************************
 */
 
/* Background class to be overwritten by Style Picker
-----------------------------------------------------------------------------*/
.override-background-color a:hover {
  color                 : #FFFFF0!important;
  text-decoration       : underline;
}


/* Style Picker areas
-----------------------------------------------------------------------------*/
#bgColor,
#bgHeaderColor,
#bgFooterColor {
  height                : 20px;
  width                 : 20px;
  position              : relative;
}


/* Style Picker
-----------------------------------------------------------------------------*/
.style-picker {
  direction             : ltr;
  color                 : #010101;
  font-family           : Arial,"Helvetica CY",sans-serif;
  font-size             : 12px;
  width                 : 0;
  min-height            : 200px;
  position              : fixed;
  top                   : 40px;
  left                  : 0;
}

.style-picker .bgChanger {
  min-width             : 35px;
  min-height            : 100px;
  position              : relative;
}

.style-picker a {
  color                 : #fff !important;
}

.style-picker a:hover {
  text-decoration       : none;
}

.style-picker input,
.style-picker select {
  border                : 1px solid #b7b7b7;
  color                 : #010101;
  font-family           : "Trebuchet MS",Arial,"Helvetica CY",sans-serif;
}

.style-picker input {
  width                 : 120px;
}
.style-picker select {
  background            : #FAFAFA url(../images/select3.png) no-repeat right;
  border                : 1px solid #CCC;
  font-size             : 1em;
  padding               : 3px;
  width                 : 90%;
  height                : auto;
  outline               : 0;
  -webkit-appearance    : none;
  -moz-appearance       : none;
}
.style-picker .container {
  width                 : 240px;
  padding               : 0 0 5px 0;
}
.style-picker .options,.style-picker .handler {
  background-color      : #181818;
  border                : 1px solid #181818;
  box-shadow            : 1px 1px 1px rgba(0,0,0,0.3);
  color                 : #CCC;
}

.style-picker .options {
  -moz-border-radius-bottomright       : 3px;
  -webkit-border-bottom-right-radius   : 10px;
  border-bottom-right-radius           : 3px;
  border-radius         : 0 0 3px 0;
  padding               : 3px 0 7px 10px;
  position              : relative;
  width                 : 230px;
}

.style-picker .handler {
  -moz-border-radius-bottomright       : 3px;
  -moz-border-radius-topright          : 3px;
  -webkit-border-bottom-right-radius   : 3px;
  -webkit-border-top-right-radius      : 3px;
  background            : #181818 url(../images/close.png) 5px 6px no-repeat!important;
  border-left           : 0;
  border-radius         : 0 3px 3px 0;
  height                : 35px;
  position              : absolute;
  right                 : -35px;
  top                   : 0;
  width                 : 33px;
  z-index               : 30;
}

.style-picker .container .handler.closed {
  background            : #181818 url(../images/pencil.png) 5px 6px no-repeat;
}

.style-picker span {
  clear                 : both;
  display               : block;
  font-weight           : 700;
  padding               : 10px 0 3px;
}

.style-picker a.thumb-img {
  border                : 1px solid #666;
  margin                : 0 5px 4px 0;
}

.style-picker a.thumb-img,.style-picker a.thumb-img img {
  cursor                : pointer;
  display               : block;
  float                 : left;
  height                : 12px;
  width                 : 12px;
}

.style-picker a.thumb-img img {
  background            : none;
  border                : 0;
  padding               : 0;
}

.style-picker a.bgColor {
  clear                 : both;
  color                 : #ccc!important;
  display               : inline-block;
  font-weight           : 700;
  line-height           : 20px;
  margin                : 8px 0;
  padding               : 5px 18px 0 0;
  position              : relative;
  width                 : 90%;
}

.style-picker a.bgColor span {
  border                : 0 solid #b7b7b7;
  float                 : right;
  height                : 18px;
  margin                : 1px 0 0;
  padding               : 0;
  width                 : 18px;
}
