.color-switcher,
.color-switcher * {
    box-sizing: border-box;
}

.color-switcher {
    position: fixed;
    top: 30%;
    right: -166px;
    width: 166px;
    padding: 10px;
    background: #fff;
    border-radius: 0 4px 4px 4px;
    box-shadow: 4px 0px 10px 2px rgba(0,0,0,.15);
    -webkit-transition: right .2s;
    transition: right .2s;
	z-index: 1;
}

.color-switcher-show {
    right: 0;
}

.color-switcher-button,
.color-switcher-tab {
    display: inline-block;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s;
}

.color-switcher-button:focus,
.color-switcher-tab:focus {
    outline: 0;
}

.color-switcher-button {
    position: absolute;
    left: -40px;
    border-radius: 0;
    box-shadow: 5px 0 7px rgba(0,0,0,.15);
    color: #fff;
    top: 0;
}


.color-switcher-button:before {
    display: inline-block;
	content: '\f013';
	font-size: 25px;
	font-family: "FontAwesome";
    -webkit-animation: controlSpin 4s linear infinite;
            animation: controlSpin 4s linear infinite;
}

.color-switcher-tabs {
    margin: -5px;
}

.color-switcher-tab {
    border-radius: 50% 0 50% 50%;
    margin: 5px;
}

@-webkit-keyframes controlSpin {
    100% {
        -webkit-transform:rotate(360deg);
                transform:rotate(360deg);
    }
}

@keyframes controlSpin {
    100% {
        -webkit-transform:rotate(360deg);
                transform:rotate(360deg);
    }
}