/*---------------------------------
	Responsive Grid Media Queries - 1280, 1024, 768, 480
	1280-1024 	- desktop (default grid)
	1024-768 	- tablet landscape
	768-480 	- tablet 
	480-less 	- phone landscape & smaller
-----------------------------------*/
@media all and (min-width: 1280px) {
	
	.grid *[class*="col_"]{}
	.grid{max-width: 1024px;}
	.show-desktop	{display:block !important;}
	.hide-desktop	{display:none !important;}
	.show-tablet	{display:none !important;}
	.hide-tablet	{display:block !important;}
	.show-phone		{display:none !important;}
	.hide-phone		{display:block !important;}
	
}

@media all and (min-width: 1024px) and (max-width: 1280px) {
	
	.grid *[class*="col_"]{}
	.grid{max-width: 1024px;}
	.show-desktop	{display:block !important;}
	.hide-desktop	{display:none !important;}
	.show-tablet	{display:none !important;}
	.hide-tablet	{display:block !important;}
	.show-phone		{display:none !important;}
	.hide-phone		{display:block !important;}
	
}

@media all and (min-width: 768px) and (max-width: 1023px) {
	
	.grid *[class*="col_"]{}
	.grid{max-width: 768px;}
	.show-desktop	{display:none !important;}
	.hide-desktop	{display:block !important;}
	.show-tablet	{display:block !important;}
	.hide-tablet	{display:none !important;}
	.show-phone		{display:none !important;}
	.hide-phone		{display:block !important;}
	
}


@media all and (min-width: 480px) and (max-width: 767px) {

	.grid *[class*="col_"]{
	float:none;
	width:auto;
	clear:both;
	display:block;
	}
	
	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"]{
	margin-left:0;
	margin-right:0;
	width:100%;
	}
	
	.grid{max-width: 480px;}
	.show-desktop	{display:none !important;}
	.hide-desktop	{display:block !important;}
/*	.show-tablet	{display:block !important;}
	.hide-tablet	{display:none !important;}*/
	.show-tablet	{display:none !important;}
	.hide-tablet	{display:block !important;}
	.show-phone		{display:block !important;}
	.hide-phone		{display:none !important;}
/*	.show-phone		{display:none !important;}
	.hide-phone		{display:block !important;}*/
	
}

@media all and (max-width: 479px) {
	
	.grid *[class*="col_"]{
	float:none;
	width:auto;
	clear:both;
	display:block;
	}
	
	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"]{
	margin-left:0;
	margin-right:0;
	width:100%;
	}
	
	.grid{max-width: 100%;/*320*/}
	.show-desktop	{display:none !important;}
	.hide-desktop	{display:block !important;}
	.show-tablet	{display:none !important;}
	.hide-tablet	{display:block !important;}
	.show-phone		{display:block !important;}
	.hide-phone		{display:none !important;}
	
}