* {
	box-sizing:border-box; 
	-ms-box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
}

body { 
	margin:0 auto; 
	color:#666666;
}
.container-1500{margin:0 auto; max-width:1500px; width:100%;}
.container{margin:0 auto; max-width:1200px; width:100%;}
.row{width:100%; margin:0 auto;}

.one.column{width:8.33%;}
.two.columns{width:16.66%;}
.three.columns{width:25%;}
.four.columns{width:33.33%;}
.five.columns{width:41.66%;}
.six.columns{width:50%;}
.seven.columns{width:58.33%;}
.eight.columns{width:66.66%;}
.nine.columns{width:75%;}
.ten.columns{width:83.33%;}
.eleven.columns{width:91.66%;}
.twelve.columns{width:100%; min-height:1px; float:left; position:relative;}

.half.column { width: 50%; }

.one.column,
.two.columns,
.three.columns,
.four.columns,
.five.columns,
.six.columns,
.seven.columns,
.eight.columns,
.nine.columns,
.ten.columns,
.eleven.columns,
.half.column { 
	min-height:1px; 
	float:left; 
	padding-left:10px; padding-right:10px; 
	position:relative;
}
	
.one.column.alpha,
.two.columns.alpha,
.three.columns.alpha,
.four.columns.alpha,
.five.columns.alpha,
.six.columns.alpha,
.seven.columns.alpha,
.eight.columns.alpha,
.nine.columns.alpha,
.ten.columns.alpha,
.eleven.columns.alpha, 
.half.column.alpha {
	padding-left: 0; 
	position:relative;
}

.one.column.omega,
.two.columns.omega,
.three.columns.omega,
.four.columns.omega,
.five.columns.omega,
.six.columns.omega,
.seven.columns.omega,
.eight.columns.omega,
.nine.columns.omega,
.ten.columns.omega,
.eleven.columns.omega,
.half.column.omega {
	padding-right: 0; 
	position:relative;
}

/* Media query for 960 Screens - sets nested grids to 100% */
@media only screen and (max-width:960px){

	.row .row .one.column,
	.row .row .two.columns,
	.row .row .three.columns,
	.row .row .four.columns,
	.row .row .five.columns,
	.row .row .six.columns,
	.row .row .seven.columns,
	.row .row .eight.columns,
	.row .row .nine.columns,
	.row .row .ten.columns,
	.row .row .eleven.columns,
	.row .row .twelve.columns,
	.row .row .half.column {
		width:100%;
		margin-bottom:20px;margin-left:0px;margin-right:0px; 
	}
	.row .row > div:last-child {
		margin-bottom:0 !important
	}
	
}

/* Media query for iPad and tablets */
@media handheld, only screen and (max-width: 768px), only screen and (max-device-width: 768px) and (orientation:portrait){

	body{font-size:90%}
	.row{margin-bottom:0!important}
	
	.one.column,
	.two.columns,
	.three.columns,
	.four.columns,
	.five.columns,
	.six.columns,
	.seven.columns,
	.eight.columns,
	.nine.columns,
	.ten.columns,
	.eleven.columns,
	.twelve.columns,
	.half.column {
		width:100%;
		margin-right:0;margin-left:0;margin-bottom:20px; 
		padding:0 10px;
	}
		
	.one.column.alpha,
	.two.columns.alpha,
	.three.columns.alpha,
	.four.columns.alpha,
	.five.columns.alpha,
	.six.columns.alpha,
	.seven.columns.alpha,
	.eight.columns.alpha,
	.nine.columns.alpha,
	.ten.columns.alpha,
	.eleven.columns.alpha,
	.half.column.alpha {
		padding-left: 10px; 
		position:relative;
	}
	
	.one.column.omega,
	.two.columns.omega,
	.three.columns.omega,
	.four.columns.omega,
	.five.columns.omega,
	.six.columns.omega,
	.seven.columns.omega,
	.eight.columns.omega,
	.nine.columns.omega,
	.ten.columns.omega,
	.eleven.columns.omega,
	.half.column.omega {
		padding-right: 10px; 
		position:relative;
	}
}

/* Quick Device Hide/Show
================================================== */
@-ms-viewport {
  width: device-width;
}
.hidden {
  display: none;
  visibility: hidden;
}
.visible-phone {
  display: none !important;
}
.visible-tablet {
  display: none !important;
}
.hidden-desktop {
  display: none !important;
}
.visible-desktop {
  display: inherit !important;
}
@media (min-width: 768px) and (max-width: 979px) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important ;
  }
  .visible-tablet {
    display: inherit !important;
  }
  .hidden-tablet {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important;
  }
  .visible-phone {
    display: inherit !important;
  }
  .hidden-phone {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: inherit !important;
  }
  .hidden-print {
    display: none !important;
  }
}

/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }
