.switcher{
border-radius:5px 0 5px 5px;
width:225px;
position:fixed;
right:0;
height: 50px;
top:135px;
z-index:1000;
}
.switcher-inner {
background: #272727;
float: right;
width: 170px;
padding: 10px;
border: 1px solid #404040;
border-radius: 10px;
}
.switcher h2{
color:#fff;
font-size:16px;
text-align:center;
margin:0;
padding:0 0 10px;
text-transform: uppercase;
}
.switcher h2 a{
height: 50px;
width: 50px;
top:0;
left:-10px;
position:absolute;
line-height: 50px;
font-size: 20px;
color: #e7512f;
}
.switcher h2 a::before{
content: "\f013";
font-family: fontawesome;
position: absolute;
left: 50%;
margin: 0 0 0 -10px;
-webkit-animation:spin 3s linear infinite;
-moz-animation:spin 3s linear infinite;
animation:spin 3s linear infinite;}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.switcher .content {
overflow:hidden;
padding:5px 0;
}
.layout-switcher {
overflow:hidden;
margin:0 0 10px;
}
ul.color_schemes {
list-style:none;
margin:0;
padding:0;
}
ul.color_schemes li {
color:#000;
font-size:14px;
line-height:25px;
cursor: pointer;
}
ul.color_schemes li a {
font-size: 14px;
color: #fff;
text-transform: capitalize;
padding-right: 0px;
text-align: right;
}
.styleswitch::after{ content: ""; height: 15px; width: 15px; background: #fff;
position: absolute; right: 0; margin: 5px 0 0 0;}
.styleswitch.light::after{ background: #fff;}
.styleswitch.dark::after{ background: #000;}
.styleswitch.color-3::after{ background: #FE491A;}
.styleswitch.color-4::after{ background: #0376B5;}
.styleswitch.color-5::after{ background: #129793;}
ul.color_schemes li a:hover {
text-decoration:none;
}
.pattern {
width:21px;
height:24px;
display:block;
cursor:pointer;
float:left;
box-shadow:0 0 0 1px #D6D2D2 inset;
margin:0 4px 4px 0;
}
.switcher-box,.bg {
height:auto;
overflow:hidden;
margin-bottom:6px;
position: relative;
}