/*------------------------------------*\
    $GRIDS
\*------------------------------------*/
.span_12_small, .span_11_small, .span_10_small, .span_9_small, .span_8_small, .span_6_small, .span_5_small, .span_4_small, .span_3_small, .span_2_small, .span_2_1_small, .span_1_small {
        float: left;
        border: 10px solid rgba(0,0,0,0);
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        position: relative;
	/*margin-right: 3%;*/
}

.row {
    margin-left: -20px;
    margin-right: -20px;
    /*zoom: 1;*/
    zoom: 1;
}

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

.row:after {
    clear: both;
}

.ie8 .row { /* margin-left: 0 */}

/* Reusable column setup */
.col {
	position: relative;
	float: left;
	border: 0px solid transparent;
	/*border-left-width: 24px;*/
    border-left-width: 6px;
	/*border-left-width: 1.5rem;*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-moz-background-clip: padding-box !important;
	-webkit-background-clip: padding-box !important;
	background-clip: padding-box !important;
}

.ie8 .col { /* padding: 0 24px; */}

.col_1_ie8 { width: 8.33333333333%;}
.col_2_ie8 { width: 16.6666666667%;}
.col_3_ie8 { width: 25.0%;}
.col_4_ie8 { width: 33.3333333333%;}
.col_5_ie8 { width: 41.6666666667%;}
.col_6_ie8 { width: 50.0%;}
.col_7_ie8 { width: 58.3333333333%;}
.col_8_ie8 { width: 66.6666666667%;}
.col_9_ie8 { width: 75.0%;}
.col_10_ie8 { width: 83.3333333333%;}
.col_11_ie8 { width: 91.6666666667%;}
.col_12_ie8 {
	margin-left: 0;
	width: 100%;
}

.pull_1_ie8 { left: -8.33333333333%;}
.pull_2_ie8 { left: -16.6666666667%;}
.pull_3_ie8 { left: -25.0%;}
.pull_4_ie8 { left: -33.3333333333%;}
.pull_5_ie8 { left: -41.6666666667%;}
.pull_6_ie8 { left: -50.0%;}
.pull_7_ie8 { left: -58.3333333333%;}
.pull_8_ie8 { left: -66.6666666667%;}
.pull_9_ie8 { left: -75.0%;}
.pull_10_ie8 { left: -83.3333333333%;}
.pull_11_ie8 { left: -91.6666666667%;}
.pull_12_ie8 { left: -100%;}

.push_1_ie8 { right: -8.33333333333%;}
.push_2_ie8 { right: -16.6666666667%;}
.push_3_ie8 { right: -25.0%;}
.push_4_ie8 { right: -33.3333333333%;}
.push_5_ie8 { right: -41.6666666667%;}
.push_6_ie8 { right: -50.0%;}
.push_7_ie8 { right: -58.3333333333%;}
.push_8_ie8 { right: -66.6666666667%;}
.push_9_ie8 { right: -75.0%;}
.push_10_ie8 { right: -83.3333333333%;}
.push_11_ie8 { right: -91.6666666667%;}
.push_12_ie8 { right: -100%;}



/* FLUID Column Layout */
/*
.g_1 { width: 10.66%; }
.g_2_1 { width: 12.66%; } 
.g_2 { width: 16.66%; }
.g_3 { width: 25%; }
.g_4 { width: 33.33%; }
.g_5 { width: 46.66%; } 
.g_6 { width: 50%; }
.g_7 { width: 50%; } 
.g_8 { width: 66.66%; }
.g_9 { width: 75%; }
.g_10 { width: 83.33%; }
.g_11 { width: 50%; } 
.g_12 { width: 100%; }
*/

.w-0 { width: 0px; }
.h-0 { height: 0px; }


/*-- FIXED Column Layout --*/
.col-fixed_1 { width: 60px; }
.col-fixed_2 { width: 140px; }
.col-fixed_3 { width: 220px; }
.col-fixed_4 { width: 300px; }
.col-fixed_5 { width: 380px; }
.col-fixed_6 { width: 460px; }
.col-fixed_7 { width: 540px; }
.col-fixed_8 { width: 620px; }
.col-fixed_9 { width: 700px; }
.col-fixed_10 { width: 780px; }
.col-fixed_11 { width: 860px; }
.col-fixed_12 { width: 940px; }

/* Fixed Height */
.h-1 { height:10px; }
.h-2 { height:20px; }
.h-3 { height:30px; }
.h-4 { height:40px; }
.h-5 { height:50px; }
.h-6 { height:60px; }
.h-7 { height:70px; }
.h-8 { height:80px; }
.h-9 { height:90px; }
.h-10 { height:100px; }
.h-20 { height:200px; }
.h-21 { height:210px; }
.h-22 { height:220px; }

/* Fixed Width */
.w-1 { width:10px; }
.w-2 { width:20px; }
.w-3 { width:30px; }
.w-4 { width:40px; }
.w-5 { width:50px; }
.w-6 { width:60px; }
.w-7 { width:70px; }
.w-8 { width:80px; }
.w-9 { width:90px; }
.w-10 { width:100px; }
.w-20 { width:200px; }
.w-30 { width:300px; }
.w-40 { width:400px; }
.w-50 { width:500px; }
.w-60 { width:600px; }
.w-70 { width:700px; }
.w-80 { width:800px; }
.w-90 { width:900px; }
.w-100 { width:1000px; }

/*.visible-phone
.visible-tablet
.visible-desktop
.hidden-phone
.hidden-tablet
.hidden-desktop
*/

@media screen and (max-width: 768px) {
.hidden-phone { display:none !important; }
    
}

	/* 1. 12 Column Grid 0px - SMALL VIEW (applies to all viewports)
	-----------------------------------------------------------------------------
	----------------------------------------------------------------------------- */

	@media screen and (min-width: 0) {

		.decoration:before { content: "\003A\0020\0029";}
        
		.span_1_small { width: 8.33333333333%;}
		.span_2_small { width: 16.6666666667%;}
		.span_3_small { width: 25.0%;}
		.span_4_small { width: 33.3333333333%;}
		.span_5_small { width: 41.6666666667%;}
		.span_6_small { width: 50.0%;}
		.span_7_small { width: 58.3333333333%;}
		.span_8_small { width: 66.6666666667%;}
		.span_9_small { width: 75.0%;}
		.span_10_small { width: 83.3333333333%;}
		.span_11_small { width: 91.6666666667%;}
		.span_12_small {
			margin-left: 0;
			width: 100%;
		}

		.pull_push_0_small { left: auto; right: auto;}

		.pull_1_small { left: -8.33333333333%;}
		.pull_2_small { left: -16.6666666667%;}
		.pull_3_small { left: -25.0%;}
		.pull_4_small { left: -33.3333333333%;}
		.pull_5_small { left: -41.6666666667%;}
		.pull_6_small { left: -50.0%;}
		.pull_7_small { left: -58.3333333333%;}
		.pull_8_small { left: -66.6666666667%;}
		.pull_9_small { left: -75.0%;}
		.pull_10_small { left: -83.3333333333%;}
		.pull_11_small { left: -91.6666666667%;}
		.pull_12_small { left: -100%;}

		.push_1_small { right: -8.33333333333%;}
		.push_2_small { right: -16.6666666667%;}
		.push_3_small { right: -25.0%;}
		.push_4_small { right: -33.3333333333%;}
		.push_5_small { right: -41.6666666667%;}
		.push_6_small { right: -50.0%;}
		.push_7_small { right: -58.3333333333%;}
		.push_8_small { right: -66.6666666667%;}
		.push_9_small { right: -75.0%;}
		.push_10_small { right: -83.3333333333%;}
		.push_11_small { right: -91.6666666667%;}
		.push_12_small { right: -100%;}
        
        /* hide top-menu */
        #top-menu { display:none; }
	}

	/* 2. 12 Column Grid 640px - MEDIUM VIEW (overrides "all" viewport with a tablet view)
	-----------------------------------------------------------------------------
	----------------------------------------------------------------------------- */

	@media screen and (min-width: 40em) {

		.decoration:before {
			content: "\21A2";
		}

		.span_1_small { width: 8.33333333333%;}
		.span_2_small { width: 16.6666666667%;}
		.span_3_small { width: 25.0%;}
		.span_4_small { width: 33.3333333333%;}
		.span_5_small { width: 41.6666666667%;}
		.span_6_small { width: 50.0%;}
		.span_7_small { width: 58.3333333333%;}
		.span_8_small { width: 66.6666666667%;}
		.span_9_small { width: 75.0%;}
		.span_10_small { width: 83.3333333333%;}
		.span_11_small { width: 91.6666666667%;}
		.span_12_small {
			margin-left: 0;
			width: 100%;
		}
    
		.span_1_medium { width: 8.33333333333%;}
		.span_2_medium { width: 16.6666666667%;}
		.span_3_medium { width: 25.0%;}
		.span_4_medium { width: 33.3333333333%;}
		.span_5_medium { width: 41.6666666667%;}
		.span_6_medium { width: 50.0%;}
		.span_7_medium { width: 58.3333333333%;}
		.span_8_medium { width: 66.6666666667%;}
		.span_9_medium { width: 75.0%;}
		.span_10_medium { width: 83.3333333333%;}
		.span_11_medium { width: 91.6666666667%;}
		.span_12_medium {
			margin-left: 0;
			width: 100%;
		}

		.pull_push_0_medium { left: auto; right: auto;}

		.pull_1_medium { left: -8.33333333333%;}
		.pull_2_medium { left: -16.6666666667%;}
		.pull_3_medium { left: -25.0%;}
		.pull_4_medium { left: -33.3333333333%;}
		.pull_5_medium { left: -41.6666666667%;}
		.pull_6_medium { left: -50.0%;}
		.pull_7_medium { left: -58.3333333333%;}
		.pull_8_medium { left: -66.6666666667%;}
		.pull_9_medium { left: -75.0%;}
		.pull_10_medium { left: -83.3333333333%;}
		.pull_11_medium { left: -91.6666666667%;}
		.pull_12_medium { left: -100%;}

		.push_1_medium { right: -8.33333333333%;}
		.push_2_medium { right: -16.6666666667%;}
		.push_3_medium { right: -25.0%;}
		.push_4_medium { right: -33.3333333333%;}
		.push_5_medium { right: -41.6666666667%;}
		.push_6_medium { right: -50.0%;}
		.push_7_medium { right: -58.3333333333%;}
		.push_8_medium { right: -66.6666666667%;}
		.push_9_medium { right: -75.0%;}
		.push_10_medium { right: -83.3333333333%;}
		.push_11_medium { right: -91.6666666667%;}
		.push_12_medium { right: -100%;}
    
	}

	/* 3. 12 Column Grid 960px
	-----------------------------------------------------------------------------
	----------------------------------------------------------------------------- */

	@media screen and (min-width: 60em) {

		.decoration:before {
			content: "\005f\005f\005f \0020 \005f\005f\005f \0020 \005f \0020 \005f \000A \005f \0020 \005f \0020 \005f \0020 \005f\005f\005f\005f\005f \000A \005f\005f\005f\005f\005f \0020 \005f \0020 \005f \0020 \005f \000A \0020 \005f \0020 \005f \0020 \005f\005f\005f \0020 \005f\005f\005f";
		}

		.span_1_large { width: 8.33333333333%;}
		.span_2_large { width: 16.6666666667%;}
		.span_3_large { width: 25.0%;}
		.span_4_large { width: 33.3333333333%;}
		.span_5_large { width: 41.6666666667%;}
		.span_6_large { width: 50.0%;}
		.span_7_large { width: 58.3333333333%;}
		.span_8_large { width: 66.6666666667%;}
		.span_9_large { width: 75.0%;}
		.span_10_large { width: 83.3333333333%;}
		.span_11_large { width: 91.6666666667%;}
		.span_12_large {
			margin-left: 0;
			width: 100%;
		}

		.pull_push_0_large { left: auto; right: auto;}

		.pull_1_large { left: -8.33333333333%;}
		.pull_2_large { left: -16.6666666667%;}
		.pull_3_large { left: -25.0%;}
		.pull_4_large { left: -33.3333333333%;}
		.pull_5_large { left: -41.6666666667%;}
		.pull_6_large { left: -50.0%;}
		.pull_7_large { left: -58.3333333333%;}
		.pull_8_large { left: -66.6666666667%;}
		.pull_9_large { left: -75.0%;}
		.pull_10_large { left: -83.3333333333%;}
		.pull_11_large { left: -91.6666666667%;}
		.pull_12_large { left: -100%;}

		.push_1_large { right: -8.33333333333%;}
		.push_2_large { right: -16.6666666667%;}
		.push_3_large { right: -25.0%;}
		.push_4_large { right: -33.3333333333%;}
		.push_5_large { right: -41.6666666667%;}
		.push_6_large { right: -50.0%;}
		.push_7_large { right: -58.3333333333%;}
		.push_8_large { right: -66.6666666667%;}
		.push_9_large { right: -75.0%;}
		.push_10_large { right: -83.3333333333%;}
		.push_11_large { right: -91.6666666667%;}
		.push_12_large { right: -100%;}
	}



.grid-layer { background-image: url('images/layout/1020_12_10_10.png'); }
.no-grid-layer { background-image: none; }

/* POSITION */
.cross-axis-start { margin-left:20px;vertical-align:middle;overflow:inherit;display: block;position:absolute;top: 0%;margin-top: 0em; /*-1em*/ }
.cross-axis-center { margin-left:20px;vertical-align:middle;overflow:inherit;display: block;position:absolute;top: 50%;margin-top: -0.655em; /*-1em*/ }
.cross-axis-end { margin-left:20px;vertical-align:middle;overflow:inherit;display: block;position:absolute;bottom: 0%;margin-bottom: 0em; /*-1em*/ }

/*main-axis not finished*/
.main-axis-start { margin-left:5px;vertical-align:middle;overflow:inherit;display: block;position:absolute;top: 0%;margin-top: 0em; /*-1em*/ }
/*.main-axis-center { margin-left:30%;vertical-align:middle;overflow:inherit;display:inline-block;position:absolute;top: 0%;margin-top: 0em; }
*/
.main-axis-center {  display: inline-block;
  vertical-align: middle;
 /* padding: 10px 15px;*/
  /*border: #a0a0a0 solid 1px;
  background: #f5f5f5; */
}
.main-axis-end { margin-right: 0%;overflow:inherit;display: inline-block;position:absolute; /*-1em*/ }

.top-0 { top:0px; }
.top-1 { top:-1.5em; }
.top-2 { top:-2.5em; }

.behind { z-index:0; }

.sticked-bottom {         
     position: fixed;
     bottom: -10px;
     right: 10px;
     z-index: 200;
}


/*-- $GUTTER - SPACE AROUND/BETWEEN OBJECTS --*/
.no-gutter { padding:0px; }
.gutter { padding:0px 10px 0px 10px; }

.gutter-0 { margin:0%; }
.gutter-1 { margin:1%; }
.gutter-2 { margin:2%; }
.gutter-3 { margin:3%; }

.gutter-r-0 { margin-right:0%; }
.gutter-r-1 { margin-right:1%; }
.gutter-r-2 { margin-right:2%; }
.gutter-r-3 { margin-right:3%; }
.gutter-r-4 { margin-right:4%; }
.gutter-r-5 { margin-right:5%; }

.gutter-l-0 { margin-left:0%; }
.gutter-l-1 { margin-left:1%; }
.gutter-l-2 { margin-left:2%; }
.gutter-l-3 { margin-left:3%; }
.gutter-l-4 { margin-left:4%; }
.gutter-l-5 { margin-left:5%; }

.gutter-t-0 { margin-top:0%; }
.gutter-t-1 { margin-top:1%; }
.gutter-t-2 { margin-top:2%; }
.gutter-t-3 { margin-top:3%; }
.gutter-t-4 { margin-top:4%; }
.gutter-t-5 { margin-top:5%; }


.gutter-b-0 { margin-bottom:0%; }
.gutter-b-1 { margin-bottom:1%; }
.gutter-b-2 { margin-bottom:2%; }
.gutter-b-3 { margin-bottom:3%; }
.gutter-b-4 { margin-bottom:4%; }
.gutter-b-5 { margin-bottom:5%; }


.padding-0 { padding:0% !important; }
.padding-1 { padding:1%; }
.padding-2 { padding:2%; }
.padding-3 { padding:3%; }
.padding-4 { padding:4%; }
.padding-5 { padding:5%; }

.padding-r-0 { padding-right:0% !important; }
.padding-r-1 { padding-right:1%; }
.padding-r-2 { padding-right:2%; }
.padding-r-3 { padding-right:3%; }
.padding-r-4 { padding-right:4%; }
.padding-r-5 { padding-right:5%; }

.padding-l-0 { padding-left:0% !important; }
.padding-l-1 { padding-left:1%; }
.padding-l-2 { padding-left:2%; }
.padding-l-3 { padding-left:3%; }
.padding-l-4 { padding-left:4%; }
.padding-l-5 { padding-left:5%; }

.padding-t-0 { padding-top:0% !important; }
.padding-t-1 { padding-top:1%; }
.padding-t-2 { padding-top:2%; }
.padding-t-3 { padding-top:3%; }
.padding-t-4 { padding-top:4%; }
.padding-t-5 { padding-top:5%; }


.padding-b-0 { padding-bottom:0% !important; }
.padding-b-1 { padding-bottom:1%; }
.padding-b-2 { padding-bottom:2%; }
.padding-b-3 { padding-bottom:3%; }
.padding-b-4 { padding-bottom:4%; }
.padding-b-5 { padding-bottom:5%; }


.float-r { float:right; }
.float-l { float:left; }

.cf { height: 30px; clear: both; }
.clear{ height: 30px; clear: both; }
.clearline { height: 3px; clear: both; }