/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 2%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }


/*  GRID OF TWELVE  */
.span-12 { width: 100%; }
.span-11 { width: 91.5%; }
.span-10 { width: 83%; }
.span-9 { width: 74.5%; }
.span-8 { width: 66%; }
.span-7 { width: 57.5%; }
.span-6 { width: 49%; }
.span-5 { width: 40.5%; }
.span-4 { width: 32%; }
.span-3 { width: 23.5%; }
.span-2 { width: 15%; }
.span-1 { width: 6.5%; }

.span-nl {margin-left:0;clear:left;}


.tablet-show, .mobile-show { display: none; }

@media only screen and (min-width: 901px) 
{
    .desktop-hide
    {
        display:none !important;
    }
    .desktop-show
    {
        display:block !important;
    }
}

/* TABLET */
@media only screen and (max-width: 900px) 
{
    .wrap {max-width:90% !important;}
    .tablet-hide { display: none !important; }
    .tablet-show { display: block !important; }
    
    .tablet-span-12 { width: 100%; margin-left: 0; }
    .tablet-span-11 { width: 91.5%; }
    .tablet-span-10 { width: 83%; }
    .tablet-span-9 { width: 74.5%; }
    .tablet-span-8 { width: 66%; }
    .tablet-span-7 { width: 57.5%; }
    .tablet-span-6 { width: 49%; }
    .tablet-span-5 { width: 40.5%; }
    .tablet-span-4 { width: 32%; }
    .tablet-span-3 { width: 23.5%; }
    .tablet-span-2 { width: 15%; }
    .tablet-span-1 { width: 6.5%; }
    
    .tablet-span-nl {margin-left:0;clear:left;}
}

/*  MOBILE */
@media only screen and (max-width: 480px)
{
	.mobile-hide {display:none;}
	.tablet-show.mobile-hide {display:none !important;}
	.mobile-show {display: block !important;}
	
	.col {  margin: 1% 0 1% 0%; }
    
    .span-1, .span-2, .span-3, .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10, .span-11, .span-12 {
	width: 100%; 
	}
	
	.mobile-span-12 { width: 100%; }
    .mobile-span-11 { width: 91.5%; }
    .mobile-span-10 { width: 83%; }
    .mobile-span-9 { width: 74.5%; }
    .mobile-span-8 { width: 66%; }
    .mobile-span-7 { width: 57.5%; }
    .mobile-span-6 { width: 49%; }
    .mobile-span-5 { width: 40.5%; }
    .mobile-span-4 { width: 32%; }
    .mobile-span-3 { width: 23.5%; }
    .mobile-span-2 { width: 15%; }
    .mobile-span-1 { width: 6.5%; }
    
    .mobile-span-nl {margin-left:0;clear:left;}
	
}