/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/


/* Table of Contents
==================================================
	#Base 960 Grid
	#Tablet (Portrait)
	#Mobile (Portrait)
	#Mobile (Landscape)
	#Clearing */



/* #Base 960 Grid
================================================== */

/* Note: Design for a min width of 996px */
@media only screen and (min-width: 996px){
		.container_12				{width: 960px; margin: 0 auto; padding: 0;}
		.span1, .col-md-1,
		.span2, .col-md-2,
		.span3, .col-md-3,
		.span4, .col-md-4,
		.span5, .col-md-5,
		.span6, .col-md-6,
		.span7, .col-md-7,
		.span8, .col-md-8,
		.span9, .col-md-9,
		.span10, .col-md-10,
		.span11, .col-md-11,
		.span12, .col-md-12			{float: left; display: inline; margin-left: 01.042%; margin-right: 01.042%;}
		.container_12 .alpha		{margin-left: 0; margin-right: 01.042%;}
		.container_12 .omega		{margin-right: 0; margin-left: 01.042%;}

		.container_12 .row .span1, 	.container_12 .row .col-md-1		{width: 06.250%;}
		.container_12 .row .span2, 	.container_12 .row .col-md-2		{width: 14.583%;}
		.container_12 .row .span3, 	.container_12 .row .col-md-3		{width: 22.917%;}
		.container_12 .row .span4, 	.container_12 .row .col-md-4		{width: 31.250%;}
		.container_12 .row .span5, 	.container_12 .row .col-md-5		{width: 39.583%;}
		.container_12 .row .span6, 	.container_12 .row .col-md-6		{width: 47.917%;}
		.container_12 .row .span7, 	.container_12 .row .col-md-7		{width: 56.250%;}
		.container_12 .row .span8, 	.container_12 .row .col-md-8		{width: 64.583%;}
		.container_12 .row .span9, 	.container_12 .row .col-md-9		{width: 72.917%;}
		.container_12 .row .span10, .container_12 .row .col-md-10		{width: 81.250%;}
		.container_12 .row .span11, .container_12 .row .col-md-11		{width: 89.583%;}
		.container_12 .row .span12, .container_12 .row .col-md-12		{width: 97.917%;}
		/* Prefix Extra Space >> 12 Columns */
		.container_12 .prefix_1 	{padding-left: 08.333%;}
		.container_12 .prefix_2 	{padding-left: 16.667%;}
		.container_12 .prefix_3 	{padding-left: 25.000%;}
		.container_12 .prefix_4 	{padding-left: 33.333%;}
		.container_12 .prefix_5 	{padding-left: 41.667%;}
		.container_12 .prefix_6 	{padding-left: 50.000%;}
		.container_12 .prefix_7 	{padding-left: 58.333%;}
		.container_12 .prefix_8 	{padding-left: 66.667%;}
		.container_12 .prefix_9 	{padding-left: 75.000%;}
		.container_12 .prefix_10 	{padding-left: 83.333%;}
		.container_12 .prefix_11 	{padding-left: 91.667%;}
		/* Suffix Extra Space >> 12 Columns */
		.container_12 .suffix_1 	{padding-right: 08.333%;}
		.container_12 .suffix_2 	{padding-right: 16.667%;}
		.container_12 .suffix_3 	{padding-right: 25.000%;}
		.container_12 .suffix_4 	{padding-right: 33.333%;}
		.container_12 .suffix_5 	{padding-right: 41.667%;}
		.container_12 .suffix_6 	{padding-right: 50.000%;}
		.container_12 .suffix_7 	{padding-right: 58.333%;}
		.container_12 .suffix_8 	{padding-right: 66.667%;}
		.container_12 .suffix_9 	{padding-right: 75.000%;}
		.container_12 .suffix_10 	{padding-right: 83.333%;}
		.container_12 .suffix_11 	{padding-right: 91.667%;}

	}
/* #Tablet (Portrait)
================================================== */

/* Note: Design for a min width of 796px */
@media only screen and (min-width: 768px) and (max-width: 995px){
		.container_12				{width: 768px; margin: 0 auto; padding: 0;}
		.span1, .col-md-1,
		.span2, .col-md-2,
		.span3, .col-md-3,
		.span4, .col-md-4,
		.span5, .col-md-5,
		.span6, .col-md-6,
		.span7, .col-md-7,
		.span8, .col-md-8,
		.span9, .col-md-9,
		.span10, .col-md-10,
		.span11, .col-md-11,
		.span12, .col-md-12			{float: left; display: inline; margin-left: 01.042%; margin-right: 01.042%;}
		.container_12 .alpha		{margin-left: 0; margin-right: 01.042%;}
		.container_12 .omega		{margin-right: 0; margin-left: 01.042%;}

		.container_12 .row .span1, 	.container_12 .row .col-md-1		{width: 06.250%;}
		.container_12 .row .span2, 	.container_12 .row .col-md-2		{width: 14.583%;}
		.container_12 .row .span3, 	.container_12 .row .col-md-3		{width: 22.917%;}
		.container_12 .row .span4, 	.container_12 .row .col-md-4		{width: 31.250%;}
		.container_12 .row .span5, 	.container_12 .row .col-md-5		{width: 39.583%;}
		.container_12 .row .span6, 	.container_12 .row .col-md-6		{width: 47.917%;}
		.container_12 .row .span7, 	.container_12 .row .col-md-7		{width: 56.250%;}
		.container_12 .row .span8, 	.container_12 .row .col-md-8		{width: 64.583%;}
		.container_12 .row .span9, 	.container_12 .row .col-md-9		{width: 72.917%;}
		.container_12 .row .span10, .container_12 .row .col-md-10		{width: 81.250%;}
		.container_12 .row .span11, .container_12 .row .col-md-11		{width: 89.583%;}
		.container_12 .row .span12, .container_12 .row .col-md-12		{width: 97.917%;}
		/* Prefix Extra Space >> 12 Columns */
		.container_12 .prefix_1 	{padding-left: 08.333%;}
		.container_12 .prefix_2 	{padding-left: 16.667%;}
		.container_12 .prefix_3 	{padding-left: 25.000%;}
		.container_12 .prefix_4 	{padding-left: 33.333%;}
		.container_12 .prefix_5 	{padding-left: 41.667%;}
		.container_12 .prefix_6 	{padding-left: 50.000%;}
		.container_12 .prefix_7 	{padding-left: 58.333%;}
		.container_12 .prefix_8 	{padding-left: 66.667%;}
		.container_12 .prefix_9 	{padding-left: 75.000%;}
		.container_12 .prefix_10 	{padding-left: 83.333%;}
		.container_12 .prefix_11 	{padding-left: 91.667%;}
		/* Suffix Extra Space >> 12 Columns */
		.container_12 .suffix_1 	{padding-right: 08.333%;}
		.container_12 .suffix_2 	{padding-right: 16.667%;}
		.container_12 .suffix_3 	{padding-right: 25.000%;}
		.container_12 .suffix_4 	{padding-right: 33.333%;}
		.container_12 .suffix_5 	{padding-right: 41.667%;}
		.container_12 .suffix_6 	{padding-right: 50.000%;}
		.container_12 .suffix_7 	{padding-right: 58.333%;}
		.container_12 .suffix_8 	{padding-right: 66.667%;}
		.container_12 .suffix_9 	{padding-right: 75.000%;}
		.container_12 .suffix_10 	{padding-right: 83.333%;}
		.container_12 .suffix_11 	{padding-right: 91.667%;}

		.span8 img, .col-md-8 img { max-width: 64.583% !important;}
	}

/* #Mobile (Landscape)
================================================== */
	
	/* Note: Design for a width of 480px */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		.container_12 {width: 420px; margin: 0 auto; padding: 0;}
		.span1, .col-md-1,
		.span2, .col-md-2,
		.span3, .col-md-3,
		.span4, .col-md-4,
		.span5, .col-md-5,
		.span6, .col-md-6,
		.span7, .col-md-7,
		.span8, .col-md-8,
		.span9, .col-md-9,
		.span10, .col-md-10,
		.span11, .col-md-11,
		.span12, .col-md-12{margin: 0; margin-bottom: 5%; width: 420px;} /*add margin-bottom to space horizontaly on mobile phone*/

		.container_12 .row .span1, .container_12 .row .col-md-1,
		.container_12 .row .span2, .container_12 .row .col-md-2,
		.container_12 .row .span3, .container_12 .row .col-md-3,
		.container_12 .row .span4, .container_12 .row .col-md-4,
		.container_12 .row .span5, .container_12 .row .col-md-5,
		.container_12 .row .span6, .container_12 .row .col-md-6,
		.container_12 .row .span7, .container_12 .row .col-md-7,
		.container_12 .row .span8, .container_12 .row .col-md-8,
		.container_12 .row .span9, .container_12 .row .col-md-9,
		.container_12 .row .span10, .container_12 .row .col-md-10,
		.container_12 .row .span11, .container_12 .row .col-md-11,
		.container_12 .row .span12, .container_12 .row .col-md-12 {width: 420px;}
		/* Prefix Extra Space >> 12 Columns */
		.container_12 .prefix_1,
		.container_12 .prefix_2,
		.container_12 .prefix_3,
		.container_12 .prefix_4,
		.container_12 .prefix_5,
		.container_12 .prefix_6,
		.container_12 .prefix_7,
		.container_12 .prefix_8,
		.container_12 .prefix_9,
		.container_12 .prefix_10,
		.container_12 .prefix_11{margin-bottom: 5%; padding-left:0;}/*add margin-bottom to space horizontaly on mobile phone*/
		/* Suffix Extra Space >> 12 Columns */
		.container_12 .suffix_1,
		.container_12 .suffix_2,
		.container_12 .suffix_3,
		.container_12 .suffix_4,
		.container_12 .suffix_5,
		.container_12 .suffix_6,
		.container_12 .suffix_7,
		.container_12 .suffix_8,
		.container_12 .suffix_9,
		.container_12 .suffix_10,
		.container_12 .suffix_11{margin-bottom: 5%; padding-right:0;}/*add margin-bottom to space horizontaly on mobile phone*/
		
		.span8 img, .col-md-8 img { max-width: 410px !important;}
	}

/*  #Mobile (Portrait)
================================================== */

/* Note: Design for a min width of 311px */
@media only screen and (max-width: 479px){
		.container_12				{width: 300px; margin: 0 auto; padding: 0;}
		.span1, .col-md-1,
		.span2, .col-md-2,
		.span3, .col-md-3,
		.span4, .col-md-4,
		.span5, .col-md-5,
		.span6, .col-md-6,
		.span7, .col-md-7,
		.span8, .col-md-8,
		.span9, .col-md-9,
		.span10, .col-md-10,
		.span11, .col-md-11,
		.span12, .col-md-12{margin: 0; margin-bottom: 5%; width: 100%;}/*add margin-bottom to space horizontaly on mobile phone*/

		.container_12 .row .span1, .container_12 .row .col-md-1,
		.container_12 .row .span2, .container_12 .row .col-md-2,
		.container_12 .row .span3, .container_12 .row .col-md-3,
		.container_12 .row .span4, .container_12 .row .col-md-4,
		.container_12 .row .span5, .container_12 .row .col-md-5,
		.container_12 .row .span6, .container_12 .row .col-md-6,
		.container_12 .row .span7, .container_12 .row .col-md-7,
		.container_12 .row .span8, .container_12 .row .col-md-8,
		.container_12 .row .span9, .container_12 .row .col-md-9,
		.container_12 .row .span10, .container_12 .row .col-md-10,
		.container_12 .row .span11, .container_12 .row .col-md-11,
		.container_12 .row .span12, .container_12 .row .col-md-12 {width: 100%;}
		/* Prefix Extra Space >> 12 Columns */
		.container_12 .prefix_1,
		.container_12 .prefix_2,
		.container_12 .prefix_3,
		.container_12 .prefix_4,
		.container_12 .prefix_5,
		.container_12 .prefix_6,
		.container_12 .prefix_7,
		.container_12 .prefix_8,
		.container_12 .prefix_9,
		.container_12 .prefix_10,
		.container_12 .prefix_11{margin-bottom: 5%; padding-left:0;}/*add margin-bottom to space horizontaly on mobile phone*/
		/* Suffix Extra Space >> 12 Columns */
		.container_12 .suffix_1,
		.container_12 .suffix_2,
		.container_12 .suffix_3,
		.container_12 .suffix_4,
		.container_12 .suffix_5,
		.container_12 .suffix_6,
		.container_12 .suffix_7,
		.container_12 .suffix_8,
		.container_12 .suffix_9,
		.container_12 .suffix_10,
		.container_12 .suffix_11{margin-bottom: 5%; padding-right:0;}/*add margin-bottom to space horizontaly on mobile phone*/

		.span8 img, .col-md-8 img { max-width: 64.583% !important;}
	}

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

	/* Self Clearing Goodness */
	.container_12: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;
	}

	
	
	div.csc-header h1 {
		clear: both;
		float: none;
	}
	
	
/* Smartphones (portrait and landscape) ----------- */
/*@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
/*}

/* Smartphones (landscape) ----------- */
/*@media only screen 
and (min-width : 321px) {
/* Styles */
/*}

/* Smartphones (portrait) ----------- */
/*@media only screen 
and (max-width : 320px) {
/* Styles */
/*}

/* iPads (portrait and landscape) ----------- */
/*@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
/*}

/* iPads (landscape) ----------- */
/*@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
/*}

/* iPads (portrait) ----------- */
/*@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
/* .container_12				{width: 748px;}
		.span1, .col-md-1,
		.span2, .col-md-2,
		.span3, .col-md-3,
		.span4, .col-md-4,
		.span5, .col-md-5,
		.span6, .col-md-6,
		.span7, .col-md-7,
		.span8, .col-md-8,
		.span9, .col-md-9,
		.span10, .col-md-10,
		.span11, .col-md-11,
		.span12, .col-md-12					{margin: 0px; width: 100%;} -- Emanuel: do not understand why we need this, because its done before*/

/*}

/* Desktops and laptops ----------- */
/*@media only screen 
and (min-width : 1224px) {
/* Styles */
/*}

/* Large screens ----------- */
/*@media only screen 
and (min-width : 1824px) {
/* Styles */
/*}

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