/* Styles Switcher
====================================================================== */

@media only screen and (max-width: 1023px) { #style-switcher { display: none; } }


/* Styles Switcher
====================================================================== */



	#style-switcher {
    position: fixed;
    top: 130px;
    right: 0;
    width: 190px;
    background: #fff;
    -webkit-transition: right 400ms;
    transition: right 400ms;
    z-index: 1100;
    text-align: center;
    box-shadow: 0 0 5px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.2);
	}

	.switcher .switcher_container {
	  margin:0 auto;
	}

	.switcher .switch_menu h5.title {
		  color:#333;
		  margin:0;
		  line-height: 60px;
		  background: #fff;
		  text-align: center;
		  margin-bottom: 20px;
		  font-size:18px;
		  font-weight: 700;
		  text-transform: uppercase;
	}
	.switcher .switch_menu .switcher_container h5 {
	  text-align: center;
	  color:#272727;
	  font-size:18px;
	  font-weight: 700;
	}



.switcher .switch_btn button {
  width:60px;
  height:60px;
  border:none;
  background: #fff;
  color:#333;
  font-size: 24px;
  box-shadow: -4px 0 5px rgba(0,0,0,0.2);
  cursor: pointer;
	outline:none;
}
.switcher .switch_btn {
  position: absolute;
  left: -54px;
  z-index: -1;
}
.switch_body {
  cursor: pointer;
  padding: 18px 10px;
  text-align: center;
}

.colors {
	list-style:none;
	overflow: hidden;
  margin-bottom: 0px;
  padding: 14px 30px;
}

.colors li {
	float:left;
	margin: 4px 2px 0 2px;

}

.colors li a {
	display: block;
	width: 50px;
	height: 50px;
	cursor: pointer;
	border-radius:30px;
  box-shadow:0 0 0 3px rgba(255, 255, 255, 0.68) inset;
}
.colors li.active a{

}

.color1{
  background: #10c2ba;
}

.color2{
  background: #D90A2C;
}
.color3{
  background: #4448e0;
}
.color4{
  background: #5567ae;
}
.color5{
  background: #007bff;
}
.color6{
  background: #ff6839;
}
.color7{
  background: #5dab00;
}
.color8{
  background: #02ad88;
}