/*
  Basic Grid System
  By: 47digits.com
  Version: 1.0.0
*/

.row, .row [class*="col"], 
.row:before, .row:after,
.row [class*="col"]:before, 
.row [class*="col"]:after,
.row\%, .row\% [class*="col"], 
.row\%:before, .row\%:after,
.row\% [class*="col"]:before, 
.row\% [class*="col"]:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  *behavior:url(/StyleSheets/BoxSizing.htc);
}

.row, .row\% {
  *zoom: 1;
}
.row:before, .row:after,
.row\%:before, .row\%:after {
  display: table;
  content: "";
  line-height: 0;
}
.row:after, .row\%:after {
  clear: both;
}


/* Fixed Width(940) */
.row {
  margin-left:-20px;

}
.row [class*="col"] {
  float: left;
  position:relative;
  min-height: 1px;
  margin-left:20px;
  padding:0;
}

.row .col-12 {width: 940px;}
.row .col-11 {width: 860px;}
.row .col-10 {width: 780px;}
.row .col-9 {width: 700px;}
.row .col-8 {width: 620px;}
.row .col-7 {width: 540px;}
.row .col-6 {width: 460px;}
.row .col-5 {width: 380px;}
.row .col-4 {width: 300px;}
.row .col-3 {width: 220px;}
.row .col-2 {width: 140px;}
.row .col-1 {width: 60px;}

.row .offset-12 {margin-left: 980px;}
.row .offset-11 {margin-left: 900px;}
.row .offset-10 {margin-left: 820px;}
.row .offset-9 {margin-left: 740px;}
.row .offset-8 {margin-left: 660px;}
.row .offset-7 {margin-left: 580px;}
.row .offset-6 {margin-left: 500px;}
.row .offset-5 {margin-left: 420px;}
.row .offset-4 {margin-left: 340px;}
.row .offset-3 {margin-left: 260px;}
.row .offset-2 {margin-left: 180px;}
.row .offset-1 {margin-left: 100px;}

.row > hr {
	margin-left:20px;
}



/* Percent Width */
.row\% {
  margin-left:-10px;
  margin-right:-10px;
}
.row\% [class*="col"] {
  float: left;
  position:relative;
  min-height: 1px;
  padding-left:10px;
  padding-right:10px;
  margin:auto;
}

.row\% .col-12 {width: 100%;}
.row\% .col-11 {width: 91.66666667%;}
.row\% .col-10 {width: 83.33333333%;}
.row\% .col-9 {width: 75%;}
.row\% .col-8 {width: 66.66666667%;}
.row\% .col-7 {width: 58.33333333%;}
.row\% .col-6 {width: 50%;}
.row\% .col-5 {width: 41.66666667%;}
.row\% .col-4 {width: 33.33333333%;}
.row\% .col-3 {width: 25%;}
.row\% .col-2 {width: 16.66666667%;}
.row\% .col-1 {width: 8.33333333%;}

.row\% .offset-12 {margin-left: 100%;}
.row\% .offset-11 {margin-left: 91.66666667%;}
.row\% .offset-10 {margin-left: 83.33333333%;}
.row\% .offset-9 {margin-left: 75%;}
.row\% .offset-8 {margin-left: 66.66666667%;}
.row\% .offset-7 {margin-left: 58.33333333%;}
.row\% .offset-6 {margin-left: 50%;}
.row\% .offset-5 {margin-left: 41.66666667%;}
.row\% .offset-4 {margin-left: 33.33333333%;}
.row\% .offset-3 {margin-left: 25%;}
.row\% .offset-2 {margin-left: 16.66666667%;}
.row\% .offset-1 {margin-left: 8.33333333%;}
.row\% .offset-0 {margin-left: 0;}

.row\% > hr {
	margin-left:10px;
	margin-right:10px;
}


/* Nested Grid */
.row\% .row [class*="col"] {
  float: left;
  position:relative;
  min-height: 1px;
  margin-left:20px;
  padding:0;
}

.row\% .row .col-12 {width: 940px;}
.row\% .row .col-11 {width: 860px;}
.row\% .row .col-10 {width: 780px;}
.row\% .row .col-9 {width: 700px;}
.row\% .row .col-8 {width: 620px;}
.row\% .row .col-7 {width: 540px;}
.row\% .row .col-6 {width: 460px;}
.row\% .row .col-5 {width: 380px;}
.row\% .row .col-4 {width: 300px;}
.row\% .row .col-3 {width: 220px;}
.row\% .row .col-2 {width: 140px;}
.row\% .row .col-1 {width: 60px;}

.row\% .row .offset-12 {margin-left: 980px;}
.row\% .row .offset-11 {margin-left: 900px;}
.row\% .row .offset-10 {margin-left: 820px;}
.row\% .row .offset-9 {margin-left: 740px;}
.row\% .row .offset-8 {margin-left: 660px;}
.row\% .row .offset-7 {margin-left: 580px;}
.row\% .row .offset-6 {margin-left: 500px;}
.row\% .row .offset-5 {margin-left: 420px;}
.row\% .row .offset-4 {margin-left: 340px;}
.row\% .row .offset-3 {margin-left: 260px;}
.row\% .row .offset-2 {margin-left: 180px;}
.row\% .row .offset-1 {margin-left: 100px;}




/* Media Queries */
@media (min-width: 768px) and (max-width: 960px) {
	
	/* Fixed Width */
	.row .col-12 {width: 724px;}
	.row .col-11 {width: 662px;}
	.row .col-10 {width: 600px;}
	.row .col-9 {width: 538px;}
	.row .col-8 { width: 476px;}
	.row .col-7 {width: 414px;}
	.row .col-6 {width: 352px;}
	.row .col-5 {width: 290px;}
	.row .col-4 {width: 228px;}
	.row .col-3 {width: 166px;}
	.row .col-2 {width: 104px;}
	.row .col-1 {width: 42px;}
	
	.row .offset-12 {margin-left: 764px;}
	.row .offset-11 {margin-left: 702px;}
	.row .offset-10 {margin-left: 640px;}
	.row .offset-9 {margin-left: 578px;}
	.row .offset-8 {margin-left: 516px;}
	.row .offset-7 {margin-left: 454px;}
	.row .offset-6 {margin-left: 392px;}
	.row .offset-5 {margin-left: 330px;}
	.row .offset-4 {margin-left: 268px;}
	.row .offset-3 {margin-left: 206px;}
	.row .offset-2 {margin-left: 144px;}
	.row .offset-1 {margin-left: 82px;}
	
	
	/* Percent Width */
	.row\% .col-12 {width: 100%;}
	.row\% .col-11 {width: 91.66666667%;}
	.row\% .col-10 {width: 83.33333333%;}
	.row\% .col-9 {width: 75%;}
	.row\% .col-8 {width: 66.66666667%;}
	.row\% .col-7 {width: 58.33333333%;}
	.row\% .col-6 {width: 50%;}
	.row\% .col-5 {width: 41.66666667%;}
	.row\% .col-4 {width: 33.33333333%;}
	.row\% .col-3 {width: 25%;}
	.row\% .col-2 {width: 16.66666667%;}
	.row\% .col-1 {width: 8.33333333%;}
	
	.row\% .offset-12 {margin-left: 100%;}
	.row\% .offset-11 {margin-left: 91.66666667%;}
	.row\% .offset-10 {margin-left: 83.33333333%;}
	.row\% .offset-9 {margin-left: 75%;}
	.row\% .offset-8 {margin-left: 66.66666667%;}
	.row\% .offset-7 {margin-left: 58.33333333%;}
	.row\% .offset-6 {margin-left: 50%;}
	.row\% .offset-5 {margin-left: 41.66666667%;}
	.row\% .offset-4 {margin-left: 33.33333333%;}
	.row\% .offset-3 {margin-left: 25%;}
	.row\% .offset-2 {margin-left: 16.66666667%;}
	.row\% .offset-1 {margin-left: 8.33333333%;}
	.row\% .offset-0 {margin-left: 0;}
	
	
	/* Nested Grid */
	.row\% .row .col-12 {width: 724px;}
	.row\% .row .col-11 {width: 662px;}
	.row\% .row .col-10 {width: 600px;}
	.row\% .row .col-9 {width: 538px;}
	.row\% .row .col-8 { width: 476px;}
	.row\% .row .col-7 {width: 414px;}
	.row\% .row .col-6 {width: 352px;}
	.row\% .row .col-5 {width: 290px;}
	.row\% .row .col-4 {width: 228px;}
	.row\% .row .col-3 {width: 166px;}
	.row\% .row .col-2 {width: 104px;}
	.row\% .row .col-1 {width: 42px;}
	
	.row\% .row .offset-12 {margin-left: 764px;}
	.row\% .row .offset-11 {margin-left: 702px;}
	.row\% .row .offset-10 {margin-left: 640px;}
	.row\% .row .offset-9 {margin-left: 578px;}
	.row\% .row .offset-8 {margin-left: 516px;}
	.row\% .row .offset-7 {margin-left: 454px;}
	.row\% .row .offset-6 {margin-left: 392px;}
	.row\% .row .offset-5 {margin-left: 330px;}
	.row\% .row .offset-4 {margin-left: 268px;}
	.row\% .row .offset-3 {margin-left: 206px;}
	.row\% .row .offset-2 {margin-left: 144px;}
	.row\% .row .offset-1 {margin-left: 82px;}
	
}

@media (max-width: 767px) {
	.row {margin:0;}	
	.row [class*="col"], .row\% [class*="col"], .row\% .row [class*="col"]{float: none;display: block;width: auto;margin-left: 0;}
	.row > hr {margin:0;}
}

