/*
* 	Responsive-1200 grid pixel system - v1.2
* 	Copyright 2014, XXXX
*   Author: XXXX
* 	Created Date : 11-02-2014
*   Updated Date : 10-03-2014
*/
.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}

.clearfix:after {
  clear: both;
}


/*------------------------------------------------------------------*/ 
/*	SKELETON OR GRID
/*------------------------------------------------------------------*/
.container {
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
	height:auto;
}
.row {
	height:auto;
} 
[class*="span"] {
	float: left;
}
.xxxx-col{ margin: 0px 15px; clear:both;}
  
.span12 {  width: 100%;  }
.span10 {  width: 83.333%;   }
.span9  {  width: 75%;   }
.span8  {  width: 66.666%;   }
.span6  {  width: 50%;   }
.span4  {  width: 33.333%;   }
.span3  {  width: 25%;   }
.span2  {  width: 16.666%;   }

.xxxx_sidebar  {  width: 33.333%;  float:left; }


@media (min-width: 980px) and (max-width: 1200px) {
.container{  width:960px;  }
.xxxx-col{ margin: 0px 10px;}
}

@media (min-width: 768px) and (max-width: 979px) {
.container, .span8, .xxxx_sidebar{  width:747px;  }
.xxxx_sidebar{ padding-top:30px; }
.xxxx-col{ margin: 0px 10px;}
}

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

.container, .span8, .xxxx_sidebar{ width:480px; }
.xxxx_sidebar{ padding-top:30px; }
.xxxx-col{ margin: 0px 10px;}

[class*="span"]{
	width:100%;
}
	
}

@media (max-width: 479px) {
.container, .span8, .xxxx_sidebar{ width:300px; }	
.xxxx_sidebar{ padding-top:30px; }
.xxxx-col{ margin: 0px;}
[class*="span"]{
	width:100%;
}	
}

@media (max-width: 320px) {
.container, .span8, .xxxx_sidebar{ width:300px; }	
}



/*------------------------------------------------------------------*/ 
/*	INNER COLUMNS
/*------------------------------------------------------------------*/
.span8 .container{width:100%;}
.xxxx_sidebar .span12, .xxxx_sidebar .span9, .xxxx_sidebar .span8, .xxxx_sidebar .span6, .xxxx_sidebar .span4{width:370px;}

@media (min-width: 1200px) {
	.span8 .container{width:100%;}
	.xxxx_sidebar .span12, .xxxx_sidebar .span9, .xxxx_sidebar .span8, .xxxx_sidebar .span6, .xxxx_sidebar .span4{width:370px;}
}
@media (min-width: 980px) and (max-width: 1199px) {
	.span8 .container{width:100%;}
	.xxxx_sidebar .span12, .xxxx_sidebar .span9, .xxxx_sidebar .span8, .xxxx_sidebar .span6, .xxxx_sidebar .span4{width:300px;}
}
@media (min-width: 768px) and (max-width: 979px) {
	.span8 .container{width:100%;}
	.xxxx_sidebar .span12, .xxxx_sidebar .span9, .xxxx_sidebar .span8, .xxxx_sidebar .span6, .xxxx_sidebar .span4{width:50%;}
	.xxxx_sidebar { float:none; -moz-column-count: 2; -moz-column-gap: 0px; -webkit-column-count: 2; -webkit-column-gap: 0px; column-count: 2; column-gap: 0px; clear: both; }
}