.generator{
	margin:20px auto;
	padding:10px;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px;
	border-radius:10px;
	position:relative;
	overflow:hidden;
}
.generatorForm{
	margin:0 220px;
}
.generatorForm div{
	margin-top:5px;
	padding:5px;
}
.generatorForm > div {
	clear:both;
	padding-bottom: 10px;
}
label{
	width:250px;
	float:left;
	
}
input[type="range"]{
	-webkit-appearance:none;
	appearance:none;
	background:#4b799a;
	height:10px;
}
input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
    background-color: #069;
    border:1px solid #333;
    width: 10px;
    height: 13px;
}
.borderCode{
	width:300px;	
}
.result div{
	-moz-column-count: 4;
    -webkit-column-count: 4;
    -o-column-count: 4;
    column-count: 4;
	-moz-column-gap: 20px;
    -webkit-column-gap: 20px;
    -o-column-gap: 20px;
    column-gap: 20px;
   -moz-column-rule: 1px dotted #cbcefb;
    -webkit-column-rule: 1px dotted #cbcefb;
    -o-column-rule: 1px dotted #cbcefb;
    column-rule: 1px dotted #cbcefb;
}
.borderCode{
	margin:10px auto;
	background:#ddd;
	padding:10px;
}
.demo{
	width:70px;
	height:30px;
	margin-top:10px;
	margin-left:180px;
}
div.styleBorder{
	margin:10px auto;
	padding:10px;
	-moz-border-radius: 10px; 
	-webkit-border-radius: 10px;
	border-radius:10px;
	background:#fff;
}
div.styleBorder div{
	background:transparent;
}
div.update{
	color:#fff;
	text-align:center;
	-webkit-transform: rotateZ(-45deg);
	-webkit-transform-origin: top right;
	-moz-transform: rotateZ(-45deg);
	-moz-transform-origin: top right;
	-o-transform: rotateZ(-45deg);
	-o-transform-origin: top right;
	transform: rotateZ(-45deg);
	transform-origin: top right;
	width:200px;
	padding-top:5px;
	padding-bottom:5px;
	position:absolute;
	background:#4b799a;
	top:-28px;
	left:-85px;
}