.switcher{
border-radius:5px 0 5px 5px;
width:231px;
position:fixed;
right:0;
height: 50px;
top:180px;
z-index:1000;
}
.switcher-inner {
background: #101820;
float:right;
width:180px;
padding: 30px;
}
.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:1px;
position:absolute;
line-height: 50px;
font-size: 20px;
color: #fff;
}
.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: 5px;
text-align: left;
}
.styleswitch::after{ content: ""; height: 15px; width: 15px; background: #fff;
position: absolute; right: 0; margin: 5px 0 0 0;}
.styleswitch.color-1::after{ background: #DC4A29;}
.styleswitch.color-2::after{ background: #652d81;}
.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;
}