@charset "UTF-8";
/* CSS Document */

/* grid */
.grid{
	overflow:hidden;   
}
.grid.overflow{
	overflow:visible;   
}


.row{
	margin:0px -10px;
	//background:rgba(0,255,255,0.2);
	//border: 1px solid #f0f;
}
.row:after{
	content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    
}
.row > div{
	position:relative;
	padding:0px 10px;
	float:left;
	min-height:1px;
}

.row.padding-small{
	margin:0px -1px;
}
.row.padding-small > div{
	padding:0px 1px;	
}

.grid.col5 .row > div{
    width:20%;
}
.grid.col4 .row > div{
    width:25%;
}
/* gutter (spacing) */
.gutter-none .row, .row.gutter-none{
	margin:0px;
}
.gutter-none .row > div, .row.gutter-none > div{
	padding:0px;
}
.row.gutter-40{
	margin:0px -20px;
}
.row.gutter-40 > div{
	padding:0px 20px;
}


/* 12 er*/
.col-1, .col-1\/12, .block-12 > *{
	width:8.333%;
}
.col-1\/10, .block-10 > *, .width-10{
	width:10%;
}
.col-1\/8, .block-8 > *{
	width:12.5%;
}
.col-2, .col-1\/6, .col-2\/12, .block-6 > div{
	width:16.666%;
}
.col-1\/5, .col-2\/10, .block-5 > *, .width-20{
	width:20%;
}
.col-3, .col-1\/4, .col-2\/8, .col-3\/12, .block-4 > *, .width-25{
	width:25%;
}
.col-3\/10, .width-30{
	width:30%;
}
.col-4, .col-1\/3, .col-2\/6, .col-4\/12, .block-3 > *, .width-33{
	width:33.333%;
}
.col-3\/8{
	width:37.5%;
}
.col-2\/5, .col-4\/10, .width-40{
	width:40%;
}
.col-5, .col-5\/12{
	width:41.666%;
}
.col-6, .col-1\/2, .col-2\/4, .col-3\/6, .col-4\/8, .col-5\/10, .col-6\/12, .block-2 > *, .width-50{
	width:50%;
}
.col-7, .col-6\/12{
	width:58.333%;
}
.col-3\/5, .col-6\/10, .width-60{
	width:60%;
}
.col-5\/8{
	width:62.5%;
}
.col-8, .col-2\/3, .col-4\/6, .col-8\/12, .width-66{
	width:66.666%;
}
.col-7\/10, .width-70{
	width:70%;
}
.col-9, .col-3\/4, .col-6\/8, .col-9\/12, .width-75{
	width:75%;
}
.col-4\/5, .col-8\/10, .width-80{
	width:80%;
}
.col-10, .col-5\/6, .col-10\/12{
	width:83.333%;
}
.col-7\/8{
	width:87.5%;
}
.col-9\/10, .width-90{
	width:90%;
}
.col-11, .col-11\/12{
	width:91.666%;
}
.col-12, .col, .col-1\/1, .col-2\/2, .col-3\/3,  .col-4\/4, .col-5\/5, .col-6\/6, .col-8\/8, .col-10\/10, .col-12\/12, .width-100 {
	width:100%;
}


/* center */
.row > div.col-center{
	margin-left:auto;
	margin-right:auto;
	float:none;
}


/* offset */
.off-1{
	margin-left:8.333%;
}
.off-2{
	margin-left:16.666%;
}
.off-3{
	margin-left:25%;
}
.off-4{
	margin-left:33.333%;
}
.off-5{
	margin-left:41.666%;
}
.off-6{
	margin-left:50%;
}
.off-7{
	margin-left:58.333%;
}
.off-8{
	margin-left:66.666%;
}
.off-9{
	margin-left:75%;
}
.off-10{
	margin-left:83.333%;
}
.off-11{
	margin-left:91.666%;
}


/* fill */

.col-fill{

}
/* push */
.push-1 {
  left: 8.333333333333332%;
}
.push-2 {
  left: 16.666666666666664%;
}
.push-3 {
  left: 25%;
}
.push-4 {
  left: 33.33333333333333%;
}
.push-5 {
  left: 41.66666666666667%;
}
.push-6 {
  left: 50%;
}
.push-7 {
  left: 58.333333333333336%;
}
.push-8 {
  left: 66.66666666666666%;
}
.push-9 {
  left: 75%;
}
.push-10 {
  left: 83.33333333333334%;
}
.push-11 {
  left: 91.66666666666666%;
}
/* pull */
.pull-1 {
  right: 8.333333333333332%;
}
.pull-2 {
  right: 16.666666666666664%;
}
.pull-3 {
  right: 25%;
}
.pull-4 {
  right: 33.33333333333333%;
}
.pull-5 {
  right: 41.66666666666667%;
}
.pull-6 {
  right: 50%;
}
.pull-7 {
  right: 58.333333333333336%;
}
.pull-8 {
  right: 66.66666666666666%;
}
.pull-9 {
  right: 75%;
}
.pull-10 {
  right: 83.33333333333334%;
}
.pull-11 {
  right: 91.66666666666666%;
}
/* broder */

.v-borders > div{
	border-right:1px solid #ccc;
}

/* just for testing */
.test{
	background:#eee;
	padding:5px 10px;
	color:#999;
}

.w20{
	width:20px;
}
.w40{
	width:40px;
}
.w60{
	width:60px;
}
.w50{
	width:50px;
}
.w80{
	width:80px;
}
.w100{
	width:100px;
}
.w120{
	width:120px;
}
.w140{
	width:140px;
}
.w150{
	width:150px;
}
.w160{
	width:160px;
}
.w180{
	width:180px;
}
.w200{
	width:200px;
}
.w240{
	width:240px;
}
.w300{
	width:300px;
}
.w320{
	width:320px;
}


.scroll{
}

@media screen and (max-width: 1200px) {
	.row > div{
	//	width:100%;	
	}
    
    /* gutter (spacing) */
    .gutter-m-none .row, .row.gutter-m-none{
	   margin:0px;
    }
    .gutter-m-none .row > div, .row.gutter-m-none > div{
	   padding:0px;
    }
	.col-m-1\/5, .col-m-2\/10, .block-m-5 > *, .width-m-20{
		width:20%;
	}
    .col-m-3, .col-m-1\/4, .col-m-2\/8, .col-m-3\/12, .block-m-4 > *, .width-m-25{
	   width:25% !important;
    }
	.col-m-4, .col-m-1\/3, .col-m-2\/6, .col-m-4\/12, .block-m-3 > *, .width-m-33{
		width:33.333% !important;
	}
    .col-m-6, .col-m-1\/2, .col-m-2\/4, .col-m-3\/6, .col-m-4\/8, .col-m-5\/10, .col-m-6\/12, .block-m-2 > *, .width-m-50{
	   width:50% !important;
    }
	.col-m-8, .col-m-2\/3, .col-m-4\/6, .col-m-8\/12, .width-m-66{
		width:66.666% !important;
	}
    .col-m-9, .col-m-3\/4, .col-m-6\/8, .col-m-9\/12, .width-m-75{
	   width:75% !important;
    }
    .col-m-12, .col-m-1\/1, .col-m-100, .width-m-100{
	   width:100% !important;
    }
	
	.push-m-8 {
  		left: 66.66666666666666%;
	}
}
@media screen and (max-width: 900px) {
	.row > div{
		width:100%;	
	}
	.row.padding-m-small{
		margin:0px -1px;
	}
	.row.padding-m-small > div{
		padding:0px 1px;	
	}
    
    /* gutter (spacing) */
    .gutter-s-none .row, .row.gutter-s-none{
	   margin:0px;
    }
    .gutter-s-none .row > div, .row.gutter-s-none > div{
	   padding:0px;
    }
	.col-s-1\/5, .col-s-2\/10, .block-s-5 > *, .width-s-20{
		width:20% !important;
	}
    .col-s-3, .col-s-1\/4, .col-s-2\/8, .col-s-3\/12, .block-s-4 > *, .width-s-25{
	   width:25% !important;
    }
	.col-s-4, .col-s-1\/3, .col-s-2\/6, .col-s-4\/12, .block-s-3 > *, .width-s-33{
		width:33.333% !important;
	}
    .col-s-6, .col-s-1\/2, .col-s-2\/4, .col-s-3\/6, .col-s-4\/8, .col-s-5\/10, .col-s-6\/12, .block-s-2 > *, .width-s-50{
	   width:50% !important;
    }
    .col-s-9, .col-s-3\/4, .col-s-6\/8, .col-s-9\/12, .width-s-75{
	   width:75% !important;
    }
    .col-s-12, .col-s-1\/1, .col-s-100, .width-s-100{
	   width:100% !important;
    }
}