.cc-col-10,.cc-col-15,.cc-col-20,.cc-col-25,.cc-col-30,.cc-col-40,.cc-col-50,.cc-col-60,.cc-col-70,.cc-col-80,.cc-col-90,.cc-col-100{
	float: left;
	box-sizing: border-box;
}


.cc-col-10{
	width: 10%;
}
.cc-col-15{
	width: 15%;
}
.cc-col-20{
	width: 20%;
}
.cc-col-25{
    width: 25%;
}
.cc-col-30{
	width: 30%;
}
.cc-col-40{
	width: 40%;
}
.cc-col-50{
	width: 50%;
}
.cc-col-60{
	width: 60%;
}
.cc-col-70{
	width: 70%;
}
.cc-col-80{
	width: 80%;
}
.cc-col-90{
	width: 90%;
}
.cc-col-100{
	width: 100%;
}

.cc-50p-width{
    width: 50%;
    box-sizing: border-box;
    float: left;
}


.cc-1-col,.cc-2-col,.cc-3-col,.cc-4-col{
    float: left;
	box-sizing: border-box;
}
.cc-1-col{
    width: 100%;
}
.cc-2-col{
    width: 50%;
}
.cc-3-col{
    width: 33.333333%;
}
.cc-4-col{
    width: 25%;
}
.td-headers{
	display: none;
}
@media screen and (max-width: 700px) {
	.cc-col-10,.cc-col-15,.cc-col-20,.cc-col-25,.cc-col-30,.cc-col-40,.cc-col-50,.cc-col-60,.cc-col-70,.cc-col-80,.cc-col-90,.cc-col-100{
        width: 100%;
    }
    .cc-1-col,.cc-2-col,.cc-3-col,.cc-4-col{
        width: 100%;
    }
	
	
	
	/* Force table to not be like tables anymore */
	table.show-data,.show-data thead,.show-data tbody,.show-data th, .show-data td, .show-data tr { 
		display: block;
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.show-data thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	/*tr > th {
		width: 50%;
		//float: left;
	}*/
	
	.show-data tr { border-bottom: 2px solid #ccc;
		}
	.show-data tr:last-child { border:none;
		}
	.show-data td:last-child { border:none!important;
		
	}
	
	.show-data td { 
		/* Behave  like a "row" */
		border: none!important;
		border-bottom: 1px solid #eee!important; 
		position: relative;
		margin-left: 33%; 
		min-height: 1em;
	}
	
	.show-data .td-headers{
		display: block;
		background-color:#eeeeee;
		padding: inherit;
		position: absolute;
		right:100%;
		top:0px; 
		height: 100%;
		width:50%;
		box-sizing: border-box;
	}
	
	/*.td-headers{

		position: absolute;

		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}*/
	
	.show-data td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 5%; 
		padding-right: 10px; 
		white-space: nowrap;
	}

}

@media screen and (min-width: 700px) and (max-width: 1300px) {
    .cc-col-10,.cc-col-15,.cc-col-20,.cc-col-25,.cc-col-30,.cc-col-40,.cc-col-50,.cc-col-60,.cc-col-70,.cc-col-80,.cc-col-90,.cc-col-100{
	   width: 50%;
    }
    
}