/* CSS Grid */

.row, .row5, .lw { width: 960px; margin: 0 auto; } 
.row > div, .row5 > div { float: left; position: relative; margin-left: 24px } 
.row > div:first-child, .row5 > div:first-child { margin-left: 0; } 

/* column widths */
.col1 {width:58px}		.col2 {width:140px}		.col3 {width:222px}		.col4 {width:304px}
.col5 {width:386px}		.col6 {width:468px}		.col7 {width:550px}		.col8 {width:632px}
.col9 {width:714px}		.col10 {width:796px}		.col11 {width:878px}		.col12 {width:960px}

/* Source order */
.push1 {left:82px}		.push2 {left:164px}		.push3 {left:246px}		.push4 {left:328px}
.push5 {left:410px}		.push6 {left:492px}		.push7 {left:574px}		.push8 {left:656px}
.push9 {left:738px}		.push10 {left:820px}		.push11 {left:902px}		
.pull1 {right:82px}		.pull2 {right:164px}		.pull3 {right:246px}		.pull4 {right:328px}
.pull5 {right:410px}		.pull6 {right:492px}		.pull7 {right:574px}		.pull8 {right:656px}
.pull9 {right:738px}		.pull10 {right:820px}	.pull11 {right:902px}

/* 5 equal width columns */
.row5 > div {width:172px; margin-left:25px}
.row5 .push1 {left:197px}	.row5 .push2 {left:369px}	.row5 .push3 {left:541px}	.row5 .push4 {left:713px}
.row5 .pull1 {right:197px}	.row5 .pull2 {right:369px}	.row5 .pull3 {right:541px}	.row5 .pull4 {right:713px}


/********************************
 720 pixels 
 *******************************/
@media only screen and (min-width: 768px) and (max-width: 959px) {
/* row width */
.row, .row5, .lw {width:720px}

/* column widths */
.col1 {width:38px}		.col2 {width:100px}		.col3 {width:162px}		.col4 {width:224px}
.col5 {width:286px}		.col6 {width:348px}		.col7 {width:410px}		.col8 {width:472px}
.col9 {width:534px}		.col10 {width:596px}		.col11 {width:658px}		.col12 {width:720px}

/* Source order */
.push1{left:62px}		.push2{left:124px}		.push3{left:186px}		.push4{left:248px}
.push5{left:310px}		.push6{left:372px}		.push7{left:434px}		.push8{left:496px}
.push9{left:558px}		.push10{left:620px}		.push11{left:682px}
.pull1{right:62px}		.pull2{right:124px}		.pull3{right:186px}		.pull4{right:248px}
.pull5{right:310px}		.pull6{right:372px}		.pull7{right:434px}		.pull8{right:496px}
.pull9{right:558px}		.pull10{right:620px}	.pull11{right:682px}

/* 5 equal width columns */
.row5 > div {width:124px; margin-left:25px}
.row5 .push1 {left:149px}	.row5 .push2 {left:273px}	.row5 .push3 {left:397px}	.row5 .push4 {left:521px}
.row5 .pull1 {right:149px}	.row5 .pull2 {right:273px}	.row5 .pull3 {right:397px}	.row5 .pull4 {right:521px}
}


/********************************
 Mobile 
 *******************************/
@media only screen and (max-width: 767px) {		
body { width: 100%; min-width: 0; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }

.row, .row5, .lw { width: 100%; min-width: 0; margin-left: 0; margin-right: 0; }
.row > div, .row5 > div { margin: 0 !important; float: none !important }

/* Make all columns full width */
.col1, .col2, .col3, .col4, .col5, .col6, 
.col7, .col8, .col9, .col10, .col11, .col12,
.row5 > div	{ width:100% !important; }
	
/* No source ordering on mobile */
.push1, .push2, .push3, .push4, .push5, .push6, 
.push7, .push8, .push9, .push10, .push11, .push12 { left:auto !important; } 
.pull1, .pull2, .pull3, .pull4, .pull5, .pull6, 
.pull7, .pull8, .pull9, .pull10, .pull11, .pull12 { right:auto !important; } 
}
