#demopanel {left: 0px;position: fixed;top: 35px;z-index: 99999;}
#demopanel .header {
  height: 47px;
  line-height: 47px;
  background-image: url(img/bg-header.gif);
  background-repeat: repeat-x;
  background-position: left 3px !important;
  border-radius: 0 0 5px 0;
  -webkit-border-radius: 0 0 5px 0;
  -moz-border-radius: 0 0 5px 0;
  box-shadow: rgba(0,0,0,.4) 0px 5px 25px
}

#demopanel .schSet, #demopanel .bgSet {
  margin: 0 0 10px 0;
  padding: 0;
  display: block;
  width: 100%;
}

#demopanel .preset_icon {
  height: 37px;
  width: 37px;
  margin-right: 9px;
  margin-bottom: 9px;
  list-style: none;
  display: block;
  float: left;
}
#demopanel .preset_icon:last-child {
  margin-right:0;
}
#demopanel .preset_icon img {
  height: 37px;
  width: 37px;
}

#demopanel .preset_icon img.selected {
  height: 35px;
  width: 35px;
  border: 2px #f6de3e solid;
}

#boxed {
  opacity: 0;
  -moz-opacity: 0;
}
#demopanel .demo-icon {
  -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear;
  float: right;
  width:47px;
  height:47px;
}
#demopanel .demo-icon:hover {
  opacity: .8;
  -moz-opacity: .8;
  filter: alpha(80);
}
#demopanel .demo-icon img {
  margin-top:  9px;
  margin-left: 9px
}
#demopanel .layout-type {
    margin-top: 15px;
    margin-bottom: 15px;
}
#demopanel .layout-selector {
    width: 102px;
    height: 83px;
    cursor: pointer;
    float:left;
    background-repeat: no-repeat;
}
#demopanel #layout-flexible {
    margin-right: 18px;
    background-image: url(img/layout-1a.png);
}
#demopanel #layout-boxed {
    background-image: url(img/layout-2i.png);
}
#demopanel #layout-flexible, #demopanel #layout-boxed {
    -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear;
}
#demopanel #layout-flexible:hover, #demopanel #layout-boxed:hover {
    opacity: .8;
    -moz-opacity: .8;
    filter: alpha(80);
}
#demopanel .layout-style {
    margin-bottom: 15px;
}
#demopanel .layout-style .spacer {
    float: left;
    width:43px;
    height: 27px;
    line-height: 27px;
    font-size: 8px;
    text-align:center;
    text-transform: uppercase;
}
#demopanel .layout-style .btn {
}
#demopanel .layout-style .btn:hover {
    opacity: .8;
    -moz-opacity: .8;
    filter: alpha(80);
}

#demopanel .layout-style .btn.current {
    border-color: #ffc000;
}
#demopanel .strong {
    font-weight: 900;
}
#demopanel .layout-style .btn {
    -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear;
    border: 3px #d9d9d9 solid;
    cursor: pointer;
    width: 83px;
    font-size: 10px;
    height: 21px;
    line-height: 21px;
    background-repeat: repeat-x;
    font-weight: 600;
    font-family: Lato, Helvetica, Arial;
    text-transform: uppercase;
    float: left;
    text-align:center;
}
#demopanel .layout-style .btn.dark {
    background-image: url(img/btn-bg-dark.gif);
    color: #fff;
}
#demopanel .layout-style .btn.light {
    background-image: url(img/btn-bg-light.gif);
    color: #111;
}
#demopanel .header h3 {
    padding-left: 14px;
    background-image: url(img/line.gif);
    background-repeat: repeat-x;
    background-position: right top;
    background-size: 100% 3px;
    -webkit-background-size: 100% 3px;
    -moz-background-size: 100% 3px;
    color:#fff!important;
    padding-bottom:4px;
    margin-bottom:8px;
    line-height: 50px;
    font-size:16px;
    font-weight: 900;
    font-family:Lato, Helvetica, Arial, sans-serif !important;
    text-transform: uppercase;
}
#demopanel .header h3 span {
    color: #ffc000 !important;
}
#panel {position:relative; left:-250px;}
.panel_button { position: relative; left:-250px; width:298px; cursor: pointer;}
#panel {
    position: absolute;left:-280px;overflow: hidden;
    background:#fff;
/*    padding:15px 12px 15px 13px;*/
box-shadow: rgba(0,0,0,.1) 0 5px 5px;
padding: 0;
width:250px;
font-size:10px;color:#555;
}
#panel .inner {
    padding: 20px 14px;
}
#panel h3 {border-bottom:1px dashed #AAA; color:#505050!important; padding-bottom:4px; margin-bottom:8px; font-size:20px; font-family:"Arial",Helvetica, sans-serif!important; }
#panel p {
	font-size:11px;
	line-height:16px;
	margin-bottom:0;
	font-family:"Arial",Helvetica, sans-serif!important; 
}
#panel select { margin-bottom:5px; width:222px;}
#panel .heading {font-weight:bold; font-size: 13px; font-family:Lato, Helvetica, Arial, sans-serif; color: #020304; text-transform: uppercase; margin-top:10px; display:block; clear:both; float:left; width:100%;}
#panel .selector ul {list-style: none outside none;margin: 0;padding: 0;}
#panel .selector  ul li {border: 1px solid #888888;cursor: pointer;float: left;height: 15px;margin: 3px;width: 15px;background-color:#fff;}
#font_list {font-size:12px; max-width:222px; }
.dark_c .scale + .l { display:none!important;}
#panel .color-box {
    width:16px;
    height: 16px;
    float: left;
    cursor: pointer;
    background-color: #fff;
    border: #ddd 1px solid;
}
#panel .x212121 {background-color: #212121;}
#panel .x0039ab {background-color: #0039ab;}
#panel .xffea00 {background-color: #ffea00;}
#panel .xf03200 {background-color: #f03200;}
#panel .x749500 {background-color: #749500;}
#panel .x5f0095 {background-color: #5f0095;}
#panel .x464547 {background-color: #464547;}
#panel .x00ccff {background-color: #00ccff;}
#panel .xa800ff {background-color: #a800ff;}
#panel .xdbdbdb {background-color: #dbdbdb;}
#panel .x611c1c {background-color: #611c1c;}
#panel .x1e5500 {background-color: #1e5500;}
#panel .x008f8d {background-color: #008f8d;}
#panel .x005b8f {background-color: #005b8f;}
#panel .xd10085 {background-color: #d10085;}
#panel .x949494 {background-color: #949494;}

#panel .box {
    width:16px;
    height: 16px;
    float: left;
    cursor: pointer;
    background-color: #fff;
    border: #fff 1px solid;
}
#panel .box#pattern01 { background-image: url(../assets/styles/_patterns/pattern01.png); }
#panel .box#pattern02 { background-image: url(../assets/styles/_patterns/pattern02.png); }
#panel .box#pattern03 { background-image: url(../assets/styles/_patterns/pattern03.png); }
#panel .box#pattern04 { background-image: url(../assets/styles/_patterns/pattern04.png); }
#panel .box#pattern05 { background-image: url(../assets/styles/_patterns/pattern05.png); }
#panel .box#pattern06 { background-image: url(../assets/styles/_patterns/pattern06.png); }
#panel .box#pattern07 { background-image: url(../assets/styles/_patterns/pattern07.png); }
#panel .box#pattern08 { background-image: url(../assets/styles/_patterns/pattern08.png); }
#panel .box#pattern09 { background-image: url(../assets/styles/_patterns/pattern09.png); }
#panel .box#pattern10 { background-image: url(../assets/styles/_patterns/pattern10.png); }
#panel .box#pattern11 { background-image: url(../assets/styles/_patterns/pattern11.png); }
#panel .box#pattern12 { background-image: url(../assets/styles/_patterns/pattern12.png); }
#panel .box#pattern13 { background-image: url(../assets/styles/_patterns/pattern13.png); }
#panel .box#pattern14 { background-image: url(../assets/styles/_patterns/pattern14.png); }
#panel .box#pattern15 { background-image: url(../assets/styles/_patterns/pattern15.png); }
#panel .box#pattern16 { background-image: url(../assets/styles/_patterns/pattern16.png); }
#panel .box#pattern17 { background-image: url(../assets/styles/_patterns/pattern17.png); }
#panel .box#pattern18 { background-image: url(../assets/styles/_patterns/pattern18.png); }
#panel .box#pattern19 { background-image: url(../assets/styles/_patterns/pattern19.png); }
#panel .box#pattern20 { background-image: url(../assets/styles/_patterns/pattern20.png); }
#panel .box#pattern21 { background-image: url(../assets/styles/_patterns/pattern21.png); }
#panel .box#pattern22 { background-image: url(../assets/styles/_patterns/pattern22.png); }
#panel .box#pattern23 { background-image: url(../assets/styles/_patterns/pattern23.png); }
#panel .box#pattern24 { background-image: url(../assets/styles/_patterns/pattern24.png); }
#panel .box#pattern25 { background-image: url(../assets/styles/_patterns/pattern25.png); }
#panel .box#pattern26 { background-image: url(../assets/styles/_patterns/pattern26.png); }
#panel .box#pattern27 { background-image: url(../assets/styles/_patterns/pattern27.png); }
#panel .box#pattern28 { background-image: url(../assets/styles/_patterns/pattern28.png); }
#panel .box#pattern29 { background-image: url(../assets/styles/_patterns/pattern29.png); }
#panel .box#pattern30 { background-image: url(../assets/styles/_patterns/pattern30.png); }
#panel .box#pattern31 { background-image: url(../assets/styles/_patterns/pattern31.png); }
#panel .box#pattern32 { background-image: url(../assets/styles/_patterns/pattern32.png); }
#panel .box#pattern33 { background-image: url(../assets/styles/_patterns/pattern33.png); }
#panel .box#pattern34 { background-image: url(../assets/styles/_patterns/pattern34.png); }
#panel .box#pattern35 { background-image: url(../assets/styles/_patterns/pattern35.png); }
#panel .box#pattern36 { background-image: url(../assets/styles/_patterns/pattern36.png); }
#panel .box#pattern37 { background-image: url(../assets/styles/_patterns/pattern37.png); }
#panel .box#pattern38 { background-image: url(../assets/styles/_patterns/pattern38.png); }
#panel .box#pattern39 { background-image: url(../assets/styles/_patterns/pattern39.png); }
#panel .box#pattern40 { background-image: url(../assets/styles/_patterns/pattern40.png); }
#panel .box#pattern41 { background-image: url(../assets/styles/_patterns/pattern41.png); }
#panel .box#pattern42 { background-image: url(../assets/styles/_patterns/pattern42.png); }
#panel .box#pattern43 { background-image: url(../assets/styles/_patterns/pattern43.png); }
#panel .box#pattern44 { background-image: url(../assets/styles/_patterns/pattern44.png); }
#panel .box#pattern45 { background-image: url(../assets/styles/_patterns/pattern45.png); }
#panel .box#pattern46 { background-image: url(../assets/styles/_patterns/pattern46.png); }
#panel .box#pattern47 { background-image: url(../assets/styles/_patterns/pattern47.png); }
#panel .box#pattern48 { background-image: url(../assets/styles/_patterns/pattern48.png); }
#panel .box#pattern49 { background-image: url(../assets/styles/_patterns/pattern49.png); }
#panel .box#pattern50 { background-image: url(../assets/styles/_patterns/pattern50.png); }

/* PTN */
#panel .box#ptn-01 { background-image: url(../assets/styles/_patterns/ptn-01.png); }
#panel .box#ptn-02 { background-image: url(../assets/styles/_patterns/ptn-02.png); }
#panel .box#ptn-03 { background-image: url(../assets/styles/_patterns/ptn-03.png); }
#panel .box#ptn-04 { background-image: url(../assets/styles/_patterns/ptn-04.png); }
#panel .box#ptn-05 { background-image: url(../assets/styles/_patterns/ptn-05.png); }
#panel .box#ptn-06 { background-image: url(../assets/styles/_patterns/ptn-06.png); }
#panel .box#ptn-07 { background-image: url(../assets/styles/_patterns/ptn-07.png); }
#panel .box#ptn-08 { background-image: url(../assets/styles/_patterns/ptn-08.png); }
#panel .box#ptn-09 { background-image: url(../assets/styles/_patterns/ptn-09.png); }
#panel .box#ptn-10 { background-image: url(../assets/styles/_patterns/ptn-10.png); }
#panel .box#ptn-11 { background-image: url(../assets/styles/_patterns/ptn-11.png); }
#panel .box#ptn-12 { background-image: url(../assets/styles/_patterns/ptn-12.png); }
#panel .box#ptn-13 { background-image: url(../assets/styles/_patterns/ptn-13.png); }
#panel .box#ptn-14 { background-image: url(../assets/styles/_patterns/ptn-14.png); }
#panel .box#ptn-15 { background-image: url(../assets/styles/_patterns/ptn-15.png); }
#panel .box#ptn-16 { background-image: url(../assets/styles/_patterns/ptn-16.png); }
#panel .box#ptn-17 { background-image: url(../assets/styles/_patterns/ptn-17.png); }
#panel .box#ptn-18 { background-image: url(../assets/styles/_patterns/ptn-18.png); }
#panel .box#ptn-19 { background-image: url(../assets/styles/_patterns/ptn-19.png); }
#panel .box#ptn-20 { background-image: url(../assets/styles/_patterns/ptn-20.png); }
#panel .box#ptn-21 { background-image: url(../assets/styles/_patterns/ptn-21.png); }
#panel .box#ptn-22 { background-image: url(../assets/styles/_patterns/ptn-22.png); }
#panel .box#ptn-23 { background-image: url(../assets/styles/_patterns/ptn-23.png); }
#panel .box#ptn-24 { background-image: url(../assets/styles/_patterns/ptn-24.png); }
#panel .box#ptn-25 { background-image: url(../assets/styles/_patterns/ptn-25.png); }
#panel .box#ptn-26 { background-image: url(../assets/styles/_patterns/ptn-26.png); }
#panel .box#ptn-27 { background-image: url(../assets/styles/_patterns/ptn-27.png); }
#panel .box#ptn-28 { background-image: url(../assets/styles/_patterns/ptn-28.png); }
#panel .box#ptn-29 { background-image: url(../assets/styles/_patterns/ptn-29.png); }
#panel .box#ptn-30 { background-image: url(../assets/styles/_patterns/ptn-30.png); }
#panel .box#ptn-31 { background-image: url(../assets/styles/_patterns/ptn-31.png); }
#panel .box#ptn-32 { background-image: url(../assets/styles/_patterns/ptn-32.png); }
#panel .box#ptn-33 { background-image: url(../assets/styles/_patterns/ptn-33.png); }
#panel .box#ptn-34 { background-image: url(../assets/styles/_patterns/ptn-34.png); }
#panel .box#ptn-35 { background-image: url(../assets/styles/_patterns/ptn-35.png); }
#panel .box#ptn-36 { background-image: url(../assets/styles/_patterns/ptn-36.png); }
#panel .box#ptn-37 { background-image: url(../assets/styles/_patterns/ptn-37.png); }
#panel .box#ptn-38 { background-image: url(../assets/styles/_patterns/ptn-38.png); }
#panel .box#ptn-39 { background-image: url(../assets/styles/_patterns/ptn-39.png); }
#panel .box#ptn-40 { background-image: url(../assets/styles/_patterns/ptn-40.png); }
#panel .box#ptn-41 { background-image: url(../assets/styles/_patterns/ptn-41.png); }
#panel .box#ptn-42 { background-image: url(../assets/styles/_patterns/ptn-42.png); }
#panel .box#ptn-43 { background-image: url(../assets/styles/_patterns/ptn-43.png); }
#panel .box#ptn-44 { background-image: url(../assets/styles/_patterns/ptn-44.png); }
#panel .box#ptn-45 { background-image: url(../assets/styles/_patterns/ptn-45.png); }
#panel .box#ptn-46 { background-image: url(../assets/styles/_patterns/ptn-46.png); }
#panel .box#ptn-47 { background-image: url(../assets/styles/_patterns/ptn-47.png); }
#panel .box#ptn-48 { background-image: url(../assets/styles/_patterns/ptn-48.png); }
#panel .box#ptn-49 { background-image: url(../assets/styles/_patterns/ptn-49.png); }
#panel .box#ptn-50 { background-image: url(../assets/styles/_patterns/ptn-50.png); }


#panel .body-img {
  cursor: pointer;
  width: 73px;
  height:73px;
  margin-bottom: 1px;
  margin-right: 1px;
  float: left;
  background-position: center;
  -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear;
}
#panel .body-img:hover {
  opacity: .8;
  -moz-opacity: .8;
  filter: alpha(80);
}
#panel .body-img:active {
  background-color: #111;
  opacity: .5;
  -moz-opacity: .5;
  filter: alpha(50);
}
#panel .body-img.bg1 {
  background-image: url(backgrounds/background01_th.jpg);
}
#panel .body-img.bg2 {
  background-image: url(backgrounds/background02_th.jpg);
}
#panel .body-img.bg3 {
  background-image: url(backgrounds/background03_th.jpg);
}
#panel .body-img.bg4 {
  background-image: url(backgrounds/background04_th.jpg);
}
#panel .body-img.bg5 {
  background-image: url(backgrounds/background05_th.jpg);
}
#panel .body-img.bg6 {
  background-image: url(backgrounds/background06_th.jpg);
}
#panel select {
    padding:0px 5px;
    border:none;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    line-height: 27px;
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance:none;
    appearance:none;
    background: #fff url('img/selector.png') center right no-repeat;
    color:#727272;
    cursor: pointer;
    text-shadow:0px 1px rgba(255,255,255,.8);
    border:1px solid #b3b3b3!important;
    overflow: hidden;
    -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear;
}

#panel select:hover {
    opacity: .8;
    -moz-opacity: .8;
    filter: alpha(80);
}
