/* 
 * These selection declarations have to be separate
 * No text-shadow: twitter.com/miketaylr/status/12228805301
 * Also: hot pink!
 */

::-moz-selection { background: #59a9ff; color: #fff; text-shadow: none; }
::selection { background: #59a9ff; color: #fff; text-shadow: none; }


/* =============================================================================
   Links
   ========================================================================== */

a:hover, a:active { outline: 0; }

/*=========================================
	Main Styles
=========================================*/

.container {
width: 940px;
margin: 0 auto;
}

.clear {
clear: both;
}

/*=========================================
	Blu Boxes
=========================================*/
.blu_0 {
float: left;
width: 3%;
margin-left: 1%;
margin-right: 1%;
}

.blu_1 {
float: left;
width: 8%;
margin-left: 1%;
margin-right: 1%;
}

.blu_2{
float: left;
width: 18%;
margin-left: 1%;
margin-right: 1%;
}

.blu_3{
float: left;
width: 28%;
margin-left: 1%;
margin-right: 1%;
}

.blu_4{
float: left;
width: 38%;
margin-left: 1%;
margin-right: 1%;
}

.blu_5{
float: left;
width: 48%;
margin-left: 1%;
margin-right: 1%;
}

.blu_6{
float: left;
width: 58%;
margin-left: 1%;
margin-right: 1%;
}

.blu_7{
float: left;
width: 68%;
margin-left: 1%;
margin-right: 1%;
}

.blu_8{
float: left;
width: 78%;
margin-left: 1%;
margin-right: 1%;
}

.blu_9{
float: left;
width: 88%;
margin-left: 1%;
margin-right: 1%;
}

.blu_10{
float: left;
width: 98%;
margin-left: 1%;
margin-right: 1%;
}

/* Floats */

.floatleft {
float: left;
}

.floatright {
float: right;
}


/*=========================================
	Offsets
=========================================*/
.offset_0 {
margin-left: 5%;
}

.offset_1 {
margin-left: 10%;
}

.offset_2 {
margin-left: 20%;
}

.offset_3 {
margin-left: 30%;
}

.offset_4 {
margin-left: 40%;
}

.offset_5 {
margin-left: 50%;
}

.offset_6 {
margin-left: 60%;
}

.offset_7 {
margin-left: 70%;
}

.offset_8 {
margin-left: 80%;
}

.offset_9 {
margin-left: 90%;
}

/*=========================================
	Afters
=========================================*/
.after_0 {
margin-right: 5%;
}

.after_1 {
margin-right: 10%;
}

.after_2 {
margin-right: 20%;
}

.after_3 {
margin-right: 30%;
}

.after_4 {
margin-right: 40%;
}

.after_5 {
margin-right: 50%;
}

.after_6 {
margin-right: 60%;
}

.after_7 {
margin-right: 70%;
}

.after_8 {
margin-right: 80%;
}

.after_9 {
margin-right: 90%;
}





/*=========================================
	Media Queries
=========================================*/

/* Here, all the elements are the same size.  This way, mobile users can also use the site. */

@media screen and (max-width: 579px) {

	.blu_1 {
		width: 98%;
	}
	
	.blu_2 {
		width: 98%;
	}
	
	.blu_3 {
		width: 98%;
	}
	
	.blu_4 {
		width: 98%;
	}
	.blu_5 {
		width: 98%;
	}
	
	.blu_6 {
		width: 98%;
	}
	
	.blu_7 {
		width: 98%;
	}
	
	.blu_8 {
		width: 98%;
	}
	.blu_9 {
		width: 98%;
	}
	
	.blu_10 {
		width: 98%;
	}
	
}