#style-switcher {
	position:fixed;
	z-index:99999;
	top:150px;
	right:-222px;
	width:222px;
	background:#fff;
	padding:10px;
	border:1px solid #ddd;
}

#toggle-switcher {
    display:block;
    width:50px;
    height:50px;
	background:#fff;
    position:absolute;
    left:-50px;
    top:-1px;
	text-align:center;
	cursor:pointer;
	border:1px solid #ddd;
	border-top-left-radius:25px;
	border-bottom-left-radius:25px;
	border-right:none;
}

#toggle-switcher [class*=fa]{
	font-size:32px;
	line-height:50px;
	color:#5CC9DF;
}

#style-switcher h1 {
    font-family:"Titillium Web";
    font-size:24px;
    text-align:center;
    color:#666;
    margin:10px 0 5px -10px;
}

#style-switcher h1:nth-of-type(1) {
    margin-top:0;
}

#style-switcher ul {
    list-style:none;
    margin:0;
    padding:0;
}

#style-switcher ul li{
    display:block;
    width:40px;
    height:40px;
    margin:10px 10px 0 0;
    float:left;
    border-radius:5px;
	cursor:pointer;
}

#style-switcher ul li#light-purple{
    background:#8aaad9;
}

#style-switcher ul li#cyan{
    background:#5CC9DF;
}

#style-switcher ul li#red{
    background:#f05557;
}

#style-switcher ul li#orange{
    background:#F78F39;
}

#style-switcher ul li#green{
    background:#21b799;
}

#style-switcher ul li#grass{
    background:#a2ce7e;
}

#style-switcher ul li#purple{
    background:#9661a8;
}

#style-switcher ul li#pink{
    background:#f1678d;
}

#style-switcher ul li#light-green{
    background:#36D9C3;
}

#style-switcher ul li#blue{
    background:#38A5DB;
}

#style-switcher ul li#yellow{
    background:#FBDF29;
}

#style-switcher ul li#yellow-orange{
    background:#FAC928;
}

#style-switcher img {
    margin-right:10px;
}

#style-switcher p {
    margin:0;
    padding:10px 0;
    font-size:16px;
    border-bottom:1px solid #eee;
}

#style-switcher a {
    color:#777;
    text-decoration:none;
}

#style-switcher a:hover{
    color:#5CC9DF;
    text-decoration:none;
}

.new-feature{
    position:relative;
}

.new-feature:after{
    display:block;
    position:absolute;
    content:'New';
    padding:4px 6px;
    top:-2px;
    right:-10px;
    font-size:10px;
    line-height:10px;
    font-weight:700;
    text-transform:uppercase;
    color:#fff;
    background:#ff0000;
    border-radius:3px;
    opacity:1;
}

@media (max-width:767px){
        
    .new-feature:after{
        right:10px;
    }
	
	#style-switcher {
		display:none;
	}
	
}
















