/*////////////////////////////////////////////////////////////////////*/
/*
  1224 Grid System ~ For Massive Use Only ~ Thanks
  Developed by @LyleHebel @Massive
*/
/*////////////////////////////////////////////////////////////////////*/
/* 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 {
	display:inline;
	float:left;
	margin-left:10px;
	margin-right:10px;
}

img {
	max-width: 100%;
	height: auto;
}


/*//////////////////////////////// Mobile Version Update ////////////////////////////////*/

/* Break 1 (iPhone 4, 4S & 5 Portrait)----------- */
@media only screen and (max-width : 360px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:300px;
	}
	
	.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {
		display:inline;
		float:left;
		margin-left:10px;
		margin-right:10px;
		width:280px;
	}
	
	/* --- No Margin --- */
	#subSection,
	#noLeftMargin,
	#noRightMargin {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
}

/*//////////////////////////////// Mobile Version Update ////////////////////////////////*/

/* Break 2 (iPhone 4, 4S - Landscape)----------- */
@media only screen and (min-width : 361px)
and (max-width : 450px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:341px;
	}
	
	.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {
		display:inline;
		float:left;
		margin-left:10px;
		margin-right:10px;
		width:321px;
	/* Allows Margin on Right Side of Content in Android Browsers */
	}

	/* --- No Margin --- */
	#subSection,
	#noLeftMargin,
	#noRightMargin {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
	
}

/*//////////////////////////////// Mobile Version Update ////////////////////////////////*/

/* Break 2.5 ----------- */
@media only screen and (min-width : 451px)
and (max-width : 580px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:431px;
	}
	
	.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {
		display:inline;
		float:left;
		margin-left:10px;
		margin-right:10px;
		width:411px;
	/* Allows Margin on Right Side of Content in Android Browsers */
	}

	/* --- No Margin --- */
	#subSection,
	#noLeftMargin,
	#noRightMargin {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
	
}

/*//////////////////////////////// Mobile Version Update ////////////////////////////////*/

/* Break 3 (Non Apple Smart Phones/Tablets & Iphone 5 Landscape) ----------- */
@media only screen and (min-width : 581px)
and (max-width : 767px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:561px;
	}
	
	.grid_1, #blogPicThumb {
		width:28.998%;
	}
	
	.grid_2 {
		width:45%;
	}
	
	.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {
		display:inline;
		float:left;
		margin-left:10px;
		margin-right:10px;
		width:96%;
	/* Allows Margin on Right Side of Content in Android Browsers */
	}
	
	/* --- No Margin --- */
	#subSection,
	#noLeftMargin,
	#noRightMargin {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
}

/* Break 4(iPad Portrait)----------- */
@media only screen and (min-width : 768px)
and (max-width : 1023px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:768px;
	}
	
	/* --- Grid 1 --- */
	.container_12 .grid_1 {
		width:44px;
	}
	
	/* --- Grid 2 --- */
	.container_12 .grid_2 {
		width:108px;
	}
	
	/* --- Grid 3 --- */
	.container_12 .grid_3, .compareProducts #productThumb {
		width:172px;
	}
	
	/* --- Grid 4 --- */
	.container_12 .grid_4, #footer .grid_3, #productThumb, #sideBar {
		width:236px;
	}
	
	/* --- Grid 5 --- */
	.container_12 .grid_5 {
		width:300px;
	}
	
	.grid_5#subSection {
		margin-left: 0;
		margin-right: 0;
		width: 320px;
	}
	
	/* --- Grid 6 --- */
	.container_12 .grid_6, #blogThumb, .userAccount .grid_4#accountLogin {
		width:364px;
	}
	
	.grid_6#subSection {
		margin-left: 0;
		margin-right: 0;
		width: 384px;
	}
	
	.grid_6#noLeftMargin {
		margin-left: 0;
		width: 374px;
	}
	
	.grid_6#noRightMargin {
		margin-right: 0;
		width: 374px;
	}
	
	/* --- Grid 7 --- */
	.container_12 .grid_7 {
		width:428px;
	}

	.grid_7#subSection, #productHeader  {
		margin-left: 0;
		margin-right: 0;
		width: 448px;
	}
	
	/* --- Grid 8 --- */
	.container_12 .grid_8, .products #breadcrumbs {
		width:492px;
	}
	
	/* --- Grid 9 --- */
	.container_12 .grid_9 {
		width:556px;
	}
	
	/* --- Grid 10 --- */
	.container_12 .grid_10 {
		width:620px;
	}
	
	/* --- Grid 11 --- */
	.container_12 .grid_11 {
		width:684px;
	}
	
	/* --- Grid 12 --- */
	.container_12 .grid_12, #productDescription.grid_6, .userAccount .grid_8#accountLogin {
		width:748px;
	}
	
	.grid_12#subSection, #productImages.grid_6 {
		margin-left: 0;
		margin-right: 0;
		width:768px;
	}
}

/* Break 5 (iPad Landscape and Smaller Screen Computers) ----------- */
@media only screen
and (min-width : 1024px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:1024px;
	}
	
	/* --- Grid 1 --- */
	.container_12 .grid_1 {
		width:65px;
	}
	
	/* --- Grid 2 --- */
	.container_12 .grid_2 {
		width:150px;
	}
	
	/* --- Grid 3 --- */
	.container_12 .grid_3 {
		width:235px;
	}
	
	/* --- Grid 4 --- */
	.container_12 .grid_4, #blogThumb {
		width:320px;
	}
	
	/* --- Grid 5 --- */
	.container_12 .grid_5 {
		width:405px;
	}
	
	.grid_5#subSection {
		margin-left: 0;
		margin-right: 0;
		width: 425px;
	}
	
	/* --- Grid 6 --- */
	.container_12 .grid_6 {
		width:490px;
	}
	
	.grid_6#subSection {
		margin-left: 0;
		margin-right: 0;
		width: 512px;
	}
	
	.grid_6#noLeftMargin {
		margin-left: 0;
		width: 500px;
	}
	
	.grid_6#noRightMargin {
		margin-right: 0;
		width: 500px;
	}
	
	/* --- Grid 7 --- */
	.container_12 .grid_7 {
		width:575px;
	}
	
	.grid_7#subSection, #productHeader {
		margin-left: 0;
		margin-right: 0;
		width: 595px;
	}
	
	/* --- Grid 8 --- */
	.container_12 .grid_8 {
		width:660px;
	}
	
	/* --- Grid 9 --- */
	.container_12 .grid_9 {
		width:745px;
	}
	
	/* --- Grid 10 --- */
	.container_12 .grid_10 {
		width:830px;
	}
	
	/* --- Grid 11 --- */
	.container_12 .grid_11 {
		width:915px;
	}
	
	/* --- Grid 12 --- */
	.container_12 .grid_12 {
		width:1000px;
	}
}

/* Break 6 (Desktop)----------- */
@media only screen
and (min-width : 1224px) {
	.container_12 {
		margin-left:auto;
		margin-right:auto;
		width:1224px;
	}
	
	/* --- Grid 1 --- */
	.container_12 .grid_1 {
		width:82px;
	}
	
	
	/* --- Grid 2 --- */
	.container_12 .grid_2 {
		width:184px;
	}
	
	
	/* --- Grid 3 --- */
	.container_12 .grid_3, #blogThumb {
		width:286px;
	}
	
	/* --- Grid 4 --- */
	.container_12 .grid_4 {
		width:388px;
	}
	
	
	/* --- Grid 5 --- */
	.container_12 .grid_5 {
		width:490px;
	}
	
	.grid_5#subSection {
		margin-left: 0;
		margin-right: 0;
		width: 510px;
	}

	/* --- Grid 6 --- */
	.container_12 .grid_6 {
		width:592px;
	}
	
	.grid_6#subSection {
		margin-left: 0;
		margin-right: 0;
		width: 612px;
	}
	
	.grid_6#noLeftMargin {
		margin-left: 0;
		width: 602px;
	}
	
	.grid_6#noRightMargin {
		margin-right: 0;
		width: 602px;
	}
	
	
	/* --- Grid 7 --- */
	.container_12 .grid_7 {
		width:694px;
	}
	
	.grid_7#subSection, #productHeader {
		margin-left: 0;
		margin-right: 0;
		width: 714px;
	}
	
	/* --- Grid 8 --- */
	.container_12 .grid_8 {
		width:796px;
	}
	
	
	/* --- Grid 9 --- */
	.container_12 .grid_9 {
		width:898px;
	}
	
	
	/* --- Grid 10 --- */
	.container_12 .grid_10 {
		width:1000px;
	}
	
	
	/* --- Grid 11 --- */
	.container_12 .grid_11 {
		width:1102px;
	}
	
	
	/* --- Grid 12 --- */
	.container_12 .grid_12 {
		width:1204px;
	}
}

/* Use these if you want to Swap Content Based on Pixel Ratio ----------- */

/* iPhone 4 & 4s ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),only screen and (min-device-pixel-ratio : 1.5) {
	/* Styles */
	
}

/* Retnia Devices ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 2.0),only screen and (min-device-pixel-ratio : 2.0) {
	/* Styles */
	
}