*{
	margin: 0;
	padding: 0;
}
.container{
	width: 100%;
}
.row:before, 
.row:after {
    content:"";
    display: table;
    clear:both;
}
[class*='col-']{
	box-sizing: border-box; 
	float: left;
	padding: 10px;
}
.inner{
	height: 50px;
	background: #eee;
	border: 1px solid #999;
}
@media (min-width: 769px){
	.col-md-1{
		width: 8.33%;
	}
	.col-md-2{
		width: 16.66%;
	}
	.col-md-3{
		width: 25%;
	}
	.col-md-4{
		width: 33.33%;
	}
	.col-md-5{
		width: 41.66%;
	}
	.col-md-6{
		width: 50%;
	}
	.col-md-7{
		width: 58.33%;
	}
	.col-md-8{
		width: 66.66%;
	}
}
@media (max-width: 768px){
	.col-sm-1{
		width: 8.33%;
	}
	.col-sm-2{
		width: 16.66%;
	}
	.col-sm-3{
		width: 25%;
	}
	.col-sm-4{
		width: 33.33%;
	}
	.col-sm-5{
		width: 41.66%;
	}
	.col-sm-6{
		width: 50%;
	}
	.col-sm-7{
		width: 58.33%;
	}
	.col-sm-8{
		width: 66.66%;
	}
	.col-sm-9{
		width: 75%;
	}
	.col-sm-10{
		width: 83.33%;
	}
	.col-sm-11{
		width: 91.66%;
	}
	.col-sm-12{
		width: 100%;
	}
}