/*
	CSS - Skype.com
	GRID
*/


/* Wrappers & Page Templates
----------------------------------------------------------------------------------------------------*/

.sectionWrapper {
	max-width: 990px;
	min-width: 320px;
	margin: auto;
	position: relative;
	width: 100%;
    z-index: 1;
}

	/* IE6, IE7, IE8 */
	.ie6 .sectionWrapper,
	.ie7 .sectionWrapper,
	.ie8 .sectionWrapper {
		min-width: 990px;
	}


section .sideWrapper {
	background-color: #00AFF0;
	display: block;
    height: 100%;
    max-width: 240px;
    padding: 0;
    position: absolute;
    top: 0;
	width: 0;
    z-index: -1;
}

	section.templateSideLeft .mainWrapper {
		margin-left: 240px;
	}

	section.templateSideRight .mainWrapper {
		margin-right: 240px;
	}

	section.templateSideLeft .sideWrapper.left,
	section.templateSideRight .sideWrapper.right {
	    width: 240px;
	}

	section .sideWrapper.left {
	    margin: 0 0 0 15px;
	    left: 0;
	}

	section .sideWrapper.right {
	    margin: 0 15px 0 0;
	    right: 0;
	}


/* Content
----------------------------------------------------------------------------------------------------*/

.contentWrapper {
	max-width: 990px;
	min-width: 320px;
	margin: auto;
	position: relative;
	width: 100%;
    z-index: 1;
}

	/* IE6, IE7, IE8 */
	.ie6 .contentWrapper,
	.ie7 .contentWrapper,
	.ie8 .contentWrapper {
		min-width: 990px;
	}

.contentBlock {
	background-color: transparent;
	clear: both;
	overflow: hidden;
	margin: 30px 0 0;
	position: relative;
	padding: 0 15px;
}

.contentBlock > .contentBlock .column {
	padding-top: 0;
}

.contentBlock.container {
	background-color: #FFFFFF;
	margin: 30px 15px 0;
    padding: 0 15px 30px;
}

	.contentBlock.flushTop {
		margin-top: 0;
	}

		.contentBlock.container.flushTop {
			margin-top: -30px;
		}

	.contentBlock.flushBottom {
		margin-bottom: 0;
	}

	.contentBlock.container.flushTopLine {
		margin-top: 1px;
	}

section.templateSideLeft .contentBlock.container,
section.templateSideRight .contentBlock.container {
	margin: -30px 15px 0;
}

.sectionWrapper .contentBlock:first-child,
.contentWrapper .contentBlock:first-child,
section.templateSideLeft .contentBlock.container:first-child,
section.templateSideRight .contentBlock.container:first-child {
	margin-top: 0;
}


/* Rows
----------------------------------------------------------------------------------------------------*/

.contentBlock .row {
	clear: both;
    padding-top: 30px;
}

.contentBlock .row:first-child {
	clear: both;
    padding-top: 0;
}

.contentBlock.container .row {
	clear: both;
    padding-top: 0;
}


/* Columns
----------------------------------------------------------------------------------------------------*/

.column {
    padding: 0;
}

.container .column {
	background-color: #FFFFFF;
	padding: 30px 15px;
}

.column.flush {
	margin-top: 0px;
	margin-bottom: 0px;
}

/* Default Colours */

.container.backgroundWhite .column,
.container.contentBlock.backgroundWhite {
	background-color: #FFFFFF;
}

.container.backgroundFog .column,
.container.contentBlock.backgroundFog {
    background-color: #E4EEF2;
}

.container.backgroundBlue .column,
.container.contentBlock.backgroundBlue {
	background-color: #00AFF0;
}

.container.backgroundNone .column,
.container.contentBlock.backgroundNone {
	background-color: transparent;
}

/* Override Colours */

.grid.backgroundWhite .column {
	background-color: #FFFFFF;
}

.grid.backgroundFog .column {
	background-color: #E4EEF2;
}

.grid.backgroundBlue .column {
	background-color: #00AFF0;
}


/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid {
	float: left;
	margin-left: 0;
	margin-right: 0;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;	
}

	.container .grid {
	    margin-bottom: -30px;
	}

	.rtl .grid {
		float: right;
	}


/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}


/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.contentBlock .grid.unit_1 {
	width: 8.33333%;
	*width: 8.216%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_1,
	.contentBlock.spacingLineWhite .grid.unit_1,
	.contentBlock.spacingLineLight .grid.unit_1,
	.contentBlock.spacingLineDark .grid.unit_1 {
		*width: 8.215%;
	}

.contentBlock .grid.unit_2 {
	width: 16.66666%;
	*width: 16.516%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_2,
	.contentBlock.spacingLineWhite .grid.unit_2,
	.contentBlock.spacingLineLight .grid.unit_2,
	.contentBlock.spacingLineDark .grid.unit_2 {
		*width: 16.499%;
	}

.contentBlock .grid.unit_3 {
	width: 25%;
	*width: 24.916%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_3,
	.contentBlock.spacingLineWhite .grid.unit_3,
	.contentBlock.spacingLineLight .grid.unit_3,
	.contentBlock.spacingLineDark .grid.unit_3 {
		*width: 24.849%;
	}

.contentBlock .grid.unit_4 {
	width: 33.33333%;
	*width: 33.24%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_4,
	.contentBlock.spacingLineWhite .grid.unit_4,
	.contentBlock.spacingLineLight .grid.unit_4,
	.contentBlock.spacingLineDark .grid.unit_4 {
		*width: 33.209%;
	}

.contentBlock .grid.unit_5 {
	width: 41.66666%;
	*width: 41.516%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_5,
	.contentBlock.spacingLineWhite .grid.unit_5,
	.contentBlock.spacingLineLight .grid.unit_5,
	.contentBlock.spacingLineDark .grid.unit_5 {
		*width: 41.515%;
	}

.contentBlock .grid.unit_6 {
	width: 50%;
	*width: 49.916%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_6,
	.contentBlock.spacingLineWhite .grid.unit_6,
	.contentBlock.spacingLineLight .grid.unit_6,
	.contentBlock.spacingLineDark .grid.unit_6 {
		*width: 49.915%;
	}

.contentBlock .grid.unit_7 {
	width: 58.33333%;
	*width: 58.216%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_7,
	.contentBlock.spacingLineWhite .grid.unit_7,
	.contentBlock.spacingLineLight .grid.unit_7,
	.contentBlock.spacingLineDark .grid.unit_7 {
		*width: 58.215%;
	}

.contentBlock .grid.unit_8 {
	width: 66.66666%;
	*width: 66.516%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_8,
	.contentBlock.spacingLineWhite .grid.unit_8,
	.contentBlock.spacingLineLight .grid.unit_8,
	.contentBlock.spacingLineDark .grid.unit_8 {
		*width: 66.515%;
	}

.contentBlock .grid.unit_9 {
	width: 75%;
	*width: 74.916%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_9,
	.contentBlock.spacingLineWhite .grid.unit_9,
	.contentBlock.spacingLineLight .grid.unit_9,
	.contentBlock.spacingLineDark .grid.unit_9 {
		*width: 74.915%;
	}

.contentBlock .grid.unit_10 {
	width: 83.33333%;
	*width: 83.216%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_10,
	.contentBlock.spacingLineWhite .grid.unit_10,
	.contentBlock.spacingLineLight .grid.unit_10,
	.contentBlock.spacingLineDark .grid.unit_10 {
		*width: 83.215%;
	}

.contentBlock .grid.unit_11 {
	width: 91.6667%;
	*width: 91.516%;
}

	/* IE6, IE7 */
	.contentBlock.spacingLine .grid.unit_11,
	.contentBlock.spacingLineWhite .grid.unit_11,
	.contentBlock.spacingLineLight .grid.unit_11,
	.contentBlock.spacingLineDark .grid.unit_11 {
		*width: 91.515%;
	}

.contentBlock .grid.unit_12 {
	width: 100.0%;
}

/* Push & Pull */

.contentBlock .push_1 {
	left: 16.6%;
	*left: 16.516%;
}

.contentBlock .push_2 {
	left: 33.3%;
	*left: 33.216%;
}

.contentBlock .push_3 {
	left: 49.8%;
	*left: 49.716%;
}

.contentBlock .push_4 {
	left: 66.6%;
	*left: 66.516%;
}

.contentBlock .push_5 {
	left: 83.0%;
	*left: 82.916%;
}

	.rtl .contentBlock .push_1 {
		right: 16.6%;
		*right: 16.516%;
	}

	.rtl .contentBlock .push_2 {
		right: 33.3%;
		*right: 33.216%;
	}

	.rtl .contentBlock .push_3 {
		right: 49.8%;
		*right: 49.716%;
	}

	.rtl .contentBlock .push_4 {
		right: 66.6%;
		*right: 66.516%;
	}

	.rtl .contentBlock .push_5 {
		right: 83.0%;
		*right: 82.916%;
	}

.contentBlock .pull_1 {
	left: -16.6%;
	*left: -16.516%;
}

.contentBlock .pull_2 {
	left: -33.2%;
	*left: -33.216%;
}

.contentBlock .pull_3 {
	left: -49.8%;
	*left: -49.716%;
}

.contentBlock .pull_4 {
	left: -66.4%;
	*left: -66.516%;
}

.contentBlock .pull_5 {
	left: -83.0%;
	*left: -82.916%;
}

	.rtl .contentBlock .pull_1 {
		right: -16.6%;
		*right: -16.516%;
	}

	.rtl .contentBlock .pull_2 {
		right: -33.2%;
		*right: -33.216%;
	}

	.rtl .contentBlock .pull_3 {
		right: -49.8%;
		*right: -49.716%;
	}

	.rtl .contentBlock .pull_4 {
		right: -66.4%;
		*right: -66.516%;
	}

	.rtl .contentBlock .pull_5 {
		right: -83.0%;
		*right: -82.916%;
	}


/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
	margin-bottom: 30px;
}

.clear.zero {
	margin-bottom: 0px;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}