@charset "utf-8";
/* CSS Styleswitcher powered by UNITED THEMES */

#ut_styleswitcher {
	position: fixed;
    display: block;
    width: 240px;
    margin:0px;
    padding:20px;
    left:-240px;
    top:150px;
    z-index: 9999;
    background-color:#FFFFFF;
	border:1px solid #DDDDDD;
	-moz-box-shadow: 5px 5px rgba(0,0,0,0.1);
	-webkit-box-shadow: 5px 5px rgba(0,0,0,0.1);
	box-shadow: 5px 5px rgba(0,0,0,0.1);
	-webkit-transform: translateZ(0);
}
#ut_styleswitcher .toggle {
    position: absolute;	
    width: 45px;
    height: 45px;	
    right: -65px;
	outline: none;
	border:1px solid #DDDDDD;
	border-left:none;
	text-align:center;
	background:#FFFFFF;
	color:#333333;
	-moz-box-shadow: 6px 5px rgba(0,0,0,0.1);
	-webkit-box-shadow: 6px 5px rgba(0,0,0,0.1);
	box-shadow: 6px 5px rgba(0,0,0,0.1);
}
#ut_styleswitcher .toggle:hover {
 
}
#ut_styleswitcher .toggle i {
	margin-top:8px;
}
#ut_styleswitcher .colorchange {
	display: inline-block;
	width: 25px;
	height: 25px;
	overflow:hidden;
	text-indent: -999px;
}

#ut_styleswitcher .colorchange.green {
	background: #77BE32;
}
#ut_styleswitcher .colorchange.sky {
	background: #4CDDF3;
}
#ut_styleswitcher .colorchange.sunflowertwo {
	background: #FDA527;
}
#ut_styleswitcher .colorchange.red {
	background: #F2333A;
}
#ut_styleswitcher .colorchange.purple {
	background: #D786FE;
}
#ut_styleswitcher .colorchange.amethyst {
	background: #9b59b6;
}
#ut_styleswitcher .colorchange.river {
	background: #3498db;
}
#ut_styleswitcher .colorchange.pumpkin {
	background: #d35400;
}
#ut_styleswitcher .colorchange.asbestos {
	background: #7f8c8d;
}
#ut_styleswitcher .colorchange.emerald {
	background: #2ecc71;
}
#ut_styleswitcher .colorchange.midnight {
	background: #2c3e50;
}
#ut_styleswitcher .colorchange.pomegranate {
	background: #c0392b;
}
#ut_styleswitcher .colorchange.turquoise {
	background: #1abc9c;
}
#ut_styleswitcher .colorchange.sunflower {
	background: #f1c40f;
}
#ut_styleswitcher .colorchange.carrot {
	background: #FF6E00;
}

/* Fonts */
#ut_styleswitcher h1 {
    font-weight: normal;
    font-size: 14px;
	margin-top:10px;
    margin-bottom: 10px;
}

#ut_styleswitcher h2 {
    padding-left:40px;
    font-size:20px;
}

#ut_styleswitcher h2:before {
    content: " ";
    position: absolute;
    left: 0px;
    width: 10px;
    height: 30px;
    padding: 0px 0px 0px 20px;
}

#ut_styleswitcher h2 {
    font-size:12px;
    line-height:30px;
}

#ut_styleswitcher h2:after {
    content: counter(steps, decimal);
    counter-increment: steps 1;
    position: absolute;
    left: -10px;
    height: 30px;
    line-height:30px;
    padding: 0px 20px 0px;
    font-size:20px;
}


#ut_styleswitcher h6 {
    font-weight: bold;
    font-size: 14px;
	margin-top:10px;
    margin-bottom: 15px;
	font-family: ralewayregular,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

#ut_styleswitcher p {
    font-size: 13px;
    line-height: 130%;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

#ut_styleswitcher .info {
	color: #ADADAD;
    font-size: 9px;
    font-weight: bold;
	margin-bottom:10px;
}

#ut_styleswitcher strong {
	color: #222;
}

/* CSS Styleswitcher Elements*/
#ut_styleswitcher ul.pattern {
    margin-bottom: 20px;
    display: inline-block;
}

#ut_styleswitcher ul.pattern li {
    display: block;
    float: left;
    width: 20px;
    height: 20px;
    margin-right: 1px;
    margin-bottom: 1px;
    margin-left: 0px;
    cursor: pointer;
}

#ut_styleswitcher .clear {
    clear: both;
}

#ut_styleswitcher input {
  letter-spacing: 1px;
  margin-bottom: 10px;
  padding: 8px 10px;
  text-transform: none;
  font-size:11px;
  background:#fff;
  color:#333333;
  border:1px solid #ddd;
  border-radius:0;
}

#ut_styleswitcher select { 
    width:150px; 
    margin-bottom: 10px; 
    padding:5px;
}

#ut_colorpicker {
    margin: 20px;
}