/* =================================================================== */ /* Styles Switcher ====================================================================== */ #style-switcher { background-color: #eee; width: 180px; position: fixed; top: 100px; z-index: 9999; border-radius: 0 0 10px 0; left: -185px; -webkit-box-shadow: 2px 3px 3px rgba(0,0,0,0.3); box-shadow: 2px 3px 3px rgba(0,0,0,0.3); } #style-switcher div { padding: 5px 10px; } #style-switcher h2 { background-color: #ddd; color: #373737; padding: 0; font-size: 15px; padding: 6px 0 7px 13px; } #style-switcher h2 a { background-image: url("../images/icons/settings-icon.png"); background-repeat: no-repeat; background-position: 9px center; background-color: #ddd; display: block; height: 41px; position: absolute; right: -39px; text-indent: -9999px; top: 0; width: 39px; border-radius: 0 5px 5px 0; -webkit-box-shadow: 1px 2px 1px rgba(0,0,0,0.3); box-shadow: 1px 2px 1px rgba(0,0,0,0.3); } #style-switcher h3 { letter-spacing: 0.5px; color:#373737; font-size:13px; margin: 5px 0 5px 3px; } .colors { list-style:none; margin:0px 0px 10px 0px; overflow: hidden; } .colors li { float:left; margin:2px; border: solid 1px #fff; text-align: center; line-height: 30px; font-weight: 600; } .colors li a { display: block; width:20px; height:20px; cursor: pointer; } #reset {margin: 0 0 10px 2px;} #reset a {color: #fff; font-size: 12px; padding: 5px 14px; box-shadow: none; border-radius: 1px; } .orange {background-color: #f99200; } .olive { background-color: #abbd38; } .green { background-color: #9bce29; } .blue { background-color: #169fe6; } .yellow { background-color: #f0cb00; } .red { background-color: #ff1414; } .cherry { background-color: #9f1854; } .gray { background-color: #828588;} #layout-style { background-color: #ddd; color: #373737; font-weight: 600; margin-left: 2px; margin-bottom: 15px; } .bg1 { background-image: url("../images/patterns/pattern-1.png"); } .bg2 { background-image: url("../images/patterns/pattern-2.png"); } .bg3 { background-image: url("../images/patterns/pattern-3.jpg"); } .bg4 { background-image: url("../images/patterns/pattern-4.png"); } .bg5 { background-image: url("../images/patterns/pattern-5.png"); } .bg6 { background-image: url("../images/patterns/pattern-6.png"); } .bg7 { background-image: url("../images/patterns/pattern-7.jpg"); } .bg8 { background-image: url("../images/patterns/pattern-8.png"); } .bgr { padding: 0 !important; } .colors li a.active { box-shadow:0 0 0 1px #ddd inset; border-radius: 50%; } @media only screen and (max-width: 767px) { #style-switcher { display: none; } } @media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6/2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) { #style-switcher h2 a { background: url("../images/settings-icon.png") no-repeat 9px center transparent; background-size: 21px; background-color: #404040; } }