﻿/* =================================================================== */
/* Styles Switcher
====================================================================== */
	
	#style-switcher {
		background-color: #fff;
		width: 225px;
		position:fixed;
		top: 120px;
		z-index: 999;
		border-radius: 0 0 3px 0;
		left: -226px;
		border: 1px solid #e4e4e4;
		border-left: 0;
		border-top: 0;
		box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08);
	}
	
	#style-switcher div {
		padding: 10px 18px;
	}
	
	#style-switcher .title {
		background-color: #909090;
		color: #fff;
		font-size: 15px;
		height: 43px;
	}
	
	#style-switcher .title a {
		background: url("../vendor/switcher.png") no-repeat 10px center transparent;
		background-color: #909090;
		display: block;
		height: 43px;
		position: absolute;
		right: -43px;
		text-indent: -9999px;
		top: 0;
		width: 43px;
		border-radius: 0 3px 3px 0;
	}	

	#style-switcher span.subtitle {
		display: block;
		color: #7F7F7F;
		font-size: 15px;
		margin: 0 0 -3px 1px;
	}

	.colors {
		list-style:none;
		margin: 0 0px 10px 0;
		overflow: hidden;
	}
	
	.colors li {
		float:left;
		margin: 4px 0px 2px 2px;
	}
	
	.colors li a {
		color: transparent;
		display: block;
		width: 40px;
		height: 40px;
		border: 1px solid #fff;
		cursor: pointer;
		border-radius: 2px;
		position: relative;
		text-align: center;
	} 
	.colors li a:hover, .colors li a:active, .colors li a:focus {color: transparent}
	.colors li a:hover, .colors li a.active {border: 1px solid #ddd}

	.colors li a span {
		position: absolute;
		top: 2px;
		bottom: 2px;
		left: 2px;
		right: 2px;
		border-radius: 2px;
	}
	.colors li a span i {
		width: 34px;
		line-height: 34px;
		color: #fff;
		text-align: center;
		display: none;
	}
	.colors li a.active span i {display: block}

	.layout-style select,
	.footer-style select {
		width: 164px;
		padding: 5px;
		color: #888;
		cursor: pointer;
		border-radius: 2px;
		font-size: 13px;
		margin: 2px 0 10px 2px;
	}
	
	.layout-style,
	.footer-style { padding: 0 !important; }
	
	.standart span {background-color: #1378C2}
	.red span { background: #c62828; }
	.pink span {background: #c2185b; }
	.purple span {background: #7b1fa2; }
	.deeppurple span {background: #512da8; }
	.indigo span {background: #303f9f; }
	.blue span {background: #1976d2 ; }
	.lightblue span {background: #0288d1; }
	.cyan span {background: #0097a7; }
	.teal span {background: #00796b; }
	.green span {background: #388e3c; }
	.lightgreen span {background: #689f38; }
	.lime span {background: #afb42b; }
	.yellow span {background: #fbc02d; }
	.amber span {background: #ffa000; }
	.orange span {background: #f57c00; }
	.deeporange span {background: #f57c00; }
	.brown span {background: #5d4037; }
	.grey span {background: #616161; }
	.bluegrey span {background: #455a64  }


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