
*{margin:0; padding:0;}

/* Containers
----------------------------------------------------------------------------------------------------*/
.row {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/


.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12,
.grid_13,
.grid_14,
.grid_15,
.grid_16 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}




/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* Grid >> 16 Columns
----------------------------------------------------------------------------------------------------*/




.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}


.grid_1 {width: 40px;}
.grid_2 {width: 100px;}
.grid_3 {width: 160px;}
.grid_4 {width: 220px;}
.grid_5 {width: 280px;}
.grid_6 {width: 340px;}
.grid_7 {width: 400px;}
.grid_8 {width: 460px;}
.grid_9 {width: 520px;}
.grid_10 {width: 580px;}
.grid_11 {width: 640px;}
.grid_12 {width: 700px;}
.grid_13 {width: 760px;}
.grid_14 {width: 820px;}
.grid_15 {width: 880px;}
.grid_16 {width: 940px;}



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .row                                  { width: 768px; }

        .container .one.column,
        .grid_1 { width: 28px; }
        .grid_2 { width: 76px; }
        .grid_3 { width: 124px; }
        .grid_4 { width: 172px; }
        .grid_5 { width: 220px; }
        .grid_6 { width: 268px; }
        .grid_7 { width: 316px; }
        .grid_8 { width: 364px; }
        .grid_9 { width: 412px; }
        .grid_10 { width: 460px; }
        .grid_11 { width: 508px; }
        .grid_12 { width: 556px; }
        .grid_13 { width: 604px; }
        .grid_14 { width: 652px; }
        .grid_15 { width: 700px; }
        .grid_16 { width: 748px; }
		
		
    }
	
	
	/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .row  { width: 300px; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
         .grid_1,
        .grid_2,
        .grid_3,
        .grid_4,
        .grid_5,
        .grid_6,
        .grid_7,
        .grid_8,
        .grid_9,
        .grid_10,
        .grid_11,
        .grid_12,
        .grid_13,
        .grid_14,
        .grid_15,
        .grid_16 { width: 300px;  margin: 0;}


    }




/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .row { width: 420px; }
        .container .columns,
        .container .column { margin: 0; }

        .grid_1,
        .grid_2,
        .grid_3,
        .grid_4,
        .grid_5,
        .grid_6,
        .grid_7,
        .grid_8,
        .grid_9,
        .grid_10,
        .grid_11,
        .grid_12,
        .grid_13,
        .grid_14,
        .grid_15,
        .grid_16 { width: 420px;  margin: 0;  }
    }




================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .row                                  { width: 768px; }

        .container .one.column,
        .grid_1 { width: 28px; }
        .grid_2 { width: 76px; }
        .grid_3 { width: 124px; }
        .grid_4 { width: 172px; }
        .grid_5 { width: 220px; }
        .grid_6 { width: 268px; }
        .grid_7 { width: 316px; }
        .grid_8 { width: 364px; }
        .grid_9 { width: 412px; }
        .grid_10 { width: 460px; }
        .grid_11 { width: 508px; }
        .grid_12 { width: 556px; }
        .grid_13 { width: 604px; }
        .grid_14 { width: 652px; }
        .grid_15 { width: 700px; }
        .grid_16 { width: 748px; }
		
		
    }
	
	
	/*  #Mobile (Portrait)
================================================== */
