/* #SPACER
--------------------------------------------*/
	.spacer {
		margin: 0;
		padding: 0;
		clear: both;
		height: 0px;
	}
	
	.spacer.h6 	{ height: 6px; }
	.spacer.h12 { height: 12px; }
	.spacer.h18 { height: 18px; }
	.spacer.h24 { height: 24px; }
	.spacer.h30 { height: 30px; }
	.spacer.h36 { height: 36px; }
	.spacer.h42 { height: 42px; }
	.spacer.h48 { height: 48px; }
	.spacer.h54 { height: 54px; }
	.spacer.h60 { height: 60px; }
	.spacer.h66 { height: 66px; }
	.spacer.h72 { height: 72px; }
	.spacer.h78 { height: 78px; }
	.spacer.h84 { height: 84px; }
	.spacer.h90 { height: 90px; }
	.spacer.h96 { height: 96px; }
	
/*------------------------------------------*/


/* #GRID- / BLOCKSYSTEM */
	
	div.block, div.block_left, div.block_right {
		position:relative;
		margin:12px;
		padding:0px;
		min-height:12px;
	}
	
	div.block, div.block_left {
		float:left;
	}
	
	div.block_right {
		float:right;
	}	
	
	div.block.nospacer, div.block_left.nospacer, div.block_right.nospacer {
		margin:0px 12px;
	}
	
	div.block.nospacer2, div.block_left.nospacer2, div.block_right.nospacer2 {
		margin:12px 0px;
	}
		
	div.block.nospace, div.block_left.nospace, div.block_right.nospace {
		margin:0px;
	}

	div.block.w720, div.block { width:720px; }
	div.block.w534 { width:534px; }
	div.block.w472 { width:472px; }
	div.block.w348, div.block_left, div.block_right { width:348px; }
	div.block.w224 { width:224px; }
	div.block.w162 { width:162px; }

	div.block.w720.nospace, div.block.nospace { width:744px; }
	div.block.w534.nospace { width:558px; }
	div.block.w472.nospace { width:496px; }
	div.block.w348.nospace, div.block_left.nospace, div.block_right.nospace { width:372px; }
	div.block.w224.nospace { width:248px; }
	div.block.w162.nospace { width:186px; }
	

	div.block.first, div.block_left.first, div.block_right.first { 
		margin-left:0px !important;
	}
	
	div.block.last, div.block_right.last, div.block_left.last { 
		margin-right:0px !important;
	}
	
	div.block p:last-child, div.content p:last-child { margin-bottom:0px !important; }
	
	div.block.border-bottom {
		border-bottom: 1px solid #d5d5d5;
		padding-bottom: 24px;
	}
	
	
/*------------------------------------------*/	

/* Farben: 
--------------------------------------------*/
	
	.grey { color:#888888 !important; }
	.lightgrey { color:#e9e9e9 !important; }
	.darkgrey { color:#999999 !important; }
	
	.bg-grey { color:#FFF !important; background-color:#888888 !important; }
	.bg-lightgrey { color:#FFF !important; background-color:#e9e9e9 !important; }
	.bg-darkgrey { color:#FFF !important; background-color:#999999 !important; }	
	
/*------------------------------------------*/	



/* TOOLS: 
--------------------------------------------*/
		

	
	/* JS: Accordion */
	ul.js-accordion { 
		list-style:none; 
		margin:0px;
		padding:0px;
	}
	
	ul.js-accordion > li {
		display:block;
		margin-bottom:1px;
		transition: all .3s ease-in-out;
	}	

	ul.js-accordion > li > div.content {
		padding:12px;
		display:none; 
		margin:0px;
	}
	ul.js-accordion  > li > div.content.nopadding {
		padding:0px !important;
	}
	ul.js-accordion > li > div.content.nopadding-tb {
		padding:0px 12px !important;
	}
	ul.js-accordion > li > div.content.nopadding-lr {
		padding:12px 0px !important;
	}	
			
	ul.js-accordion.border > li  > div.content {
		padding:11px;
		border:1px solid #d5d5d5;
	}
	
	ul.js-accordion > li.active > div.content { 
		display:block; 
	}

	ul.js-accordion > li > a { 
		background-color: #f9f9f9;
		padding:6px 12px;
		font-weight:normal;
		color:#464646;
		font-size:13px;
		line-height: 18px;
		display:block;
		margin:0px;
		font-weight:bold;
		text-decoration:none;
	}
	
	ul.js-accordion.icon > li > a {
		padding-left:24px;
		background-position:9px 10px;
		background-repeat:no-repeat;
		background-size:10px;
	}
	
	ul.js-accordion.icon.arrow1 > li > a {
		background-image: url(http://img1.jalousiescout.de/symbole/icon_accordion_arrow1_a.svg);	
	}
	
	ul.js-accordion.icon.arrow1 > li.active > a {
		background-image: url(http://img1.jalousiescout.de/symbole/icon_accordion_arrow1_b.svg);	
	}	
	
	ul.js-accordion.icon.arrow2 > li > a {
		background-image: url(http://img1.jalousiescout.de/symbole/icon_accordion_arrow3_a.svg);	
	}
	
	ul.js-accordion.icon.arrow2 > li.active > a {
		background-image: url(http://img1.jalousiescout.de/symbole/icon_accordion_arrow3_b.svg);	
	}	
		
	
	ul.js-accordion li.active > a, ul.js-accordion > li:hover > a { 
		background-color: #d5d5d5;
		border-color: #d5d5d5;
	}


	/* -- */	


	/* JS: READMORE */
	.js-readmore {
		clear:both;
	}
	
	.js-readmore > blockquote {
		width:100%;
		margin:0px; padding:0px;
		display:none;
	}
	
	.js-readmore > button { 
		border:0px;
		padding:6px 12px;
		line-height:14px;
		font-size:11px;
		color:#888888;
		background-color: #E9E9E9;
		cursor:pointer;
		min-width:120px;
	} 
	
	.js-readmore > button.spacer_right {
		margin-right:12px;
	}
	.js-readmore > button.spacer_left {
		margin-left:12px;
	}
	
	.js-readmore > button.right { 
		float:right;
	} 
	
	.js-readmore > button:after { 
		content: "mehr erfahren ?";
	}
	
	.js-readmore > button.active:after { 
		content: "weniger";
	}
	
	.js-readmore > button:hover { 
		background-color: #888888;
		color:#FFF;
	} 
	
	/* -- */

	/* JS: IMAGEBOX */
	.js-imgbox {
		overflow:hidden;
		outline: 1px solid #d5d5d5;
		border: 5px solid #FFF;
		box-sizing:border-box;
		margin:0px 1px;
		display:block;
	}
	
	.js-imgbox img { 
		text-align:right; 
		border:0px;
	}
	
	.js-imgbox img, .js-imgbox img.height { 
		height:100%;
	}
	
	.js-imgbox img.width { 
		width:100%;
		height:auto;
	}	
	
	/* -- */


	
	/* JS: VIDEOBOX mit Videopic */
	
	.js-videobox {
		border:1px solid #ccc;
		position:relative;
	}
	.js-videobox.style1 {
		padding:5px;
	}


	.js-videobox.w162 iframe, .js-videobox.w162 {
		width:160px;
	}
	
	.js-videobox.w162.style1 iframe, .js-videobox.w162.style1 {
		width:150px;
	}

	
	.js-videobox.w224 iframe, .js-videobox.w224 {
		width:222px;
	}
	
	.js-videobox.w224.style1 iframe, .js-videobox.w224.style1 {
		width:212px;
	}
	
	.js-videobox.w348 iframe, .js-videobox.w348 {
		width:346px;
	}
	
	.js-videobox.w348.style1 iframe, .js-videobox.w348.style1 {
		width:336px;
	}

	.js-videobox.h120 iframe, .js-videobox.h120 {
		height:120px;
	}
	.js-videobox.h120.style1 iframe, .js-videobox.h120.style1 {
		height:110px;
	}	

	.js-videobox.h144 iframe, .js-videobox.h144 {
		height:142px;
	}
	.js-videobox.h144.style1 iframe, .js-videobox.h144.style1 {
		height:132px;
	}
	

	.js-videobox.h168 iframe, .js-videobox.h168 {
		height:166px;
	}
	.js-videobox.h168.style1 iframe, .js-videobox.h168.style1 {
		height:156px;
	}



	.js-videobox.h240 iframe, .js-videobox.h240 {
		height:238px;
	}
	.js-videobox.h240.style1 iframe, .js-videobox.h240.style1 {
		height:228px;
	}

	.js-videobox.h396 iframe, .js-videobox.h396 {
		height:394px;
	}

	.js-videobox.h396.style1 iframe, .js-videobox.h396.style1 {
		height:384px;
	}


	.js-videobox.videopic iframe { 
		display:none; 
	}
	

	.js-videobox.videopic { 
		background-position:center center; 
		background-repeat: no-repeat;
		opacity:0.85;
		background-size: 100% 100%;
	}
	.js-videobox.videopic.style1 { 
		background-size: 97% 96%;
	}

	.js-videobox.videopic:hover {
		opacity:1;
		cursor:pointer; 
	}
	
	.js-videobox.videopic > button { 
		background-color:transparent;
		border:0px;
		padding:9px 21px;
		color:#FFF;
		font-size:18px;
		font-weight:bold;
		border-radius:6px;
		text-align:center;
		position:absolute;
		width:100%; height:100%;
		cursor:pointer; 
		background-image: url(http://img1.jalousiescout.de/symbole/icon_videobox_play.svg);
		background-position: center center;
		background-size:24% 24%;
		background-repeat:no-repeat;
	}
	
	.js-videobox.videopic:hover {
		border-color:rgba(0,0,0,1);
		box-shadow: 0px 0px 6px #ccc;
	}
	
	/* -- */
	
	
	
	/* VIDEOINFOBOX */

	.js-videoinfobox {
		padding:0px;
		position:relative;
		background-color:#888888;
	}
	
	.js-videoinfobox.border {
		border: 6px solid #888888;
	}
	
	.js-videoinfobox.border2 {
		border-top: 6px solid #888888;
	}	
	
	.js-videoinfobox.border3 {
		border: 1px solid #888888;
		padding:5px;
	}	
	
	.js-videoinfobox.infotitle {
		margin-top:28px !important;
	}
	
	.js-videoinfobox.infotitle > h5 {
		padding:6px !important;
		background-color:#888888;
		font-size:13px; 
		color:#FFF !important;
		line-height:18px;
		font-weight:bold;
		position:absolute;
		top:-30px;
	}
	
	.js-videoinfobox.infotitle h5.left {
		left:0px;
	}
	
	.js-videoinfobox.infotitle h5.right {
		right:0px;
	}
		
	.js-videoinfobox.infotitle.border h5.left {
		left:-6px;
	}
	
	.js-videoinfobox.infotitle.border h5.right {
		right:-6px;
	}
	
	.js-videoinfobox.infotitle h5 span {
		position:absolute;
		width: 0px;
		height: 0px;
		border-style: solid;
		top:0px;
		display:block;
		z-index:3;
	}

	.js-videoinfobox.infotitle h5.left span {
		border-width: 30px 0 0 24px;
		border-color: transparent transparent transparent #888888;
		right:-24px;
	}
	
	.js-videoinfobox.infotitle h5.right span {
		border-width: 0 0 30px 24px;
		border-color: transparent transparent #888888 transparent;
		left:-24px;
	}


	.js-videoinfobox.infotitle span.info {
		padding: 6px !important;
		margin:0px !important;
		font-size:11px;
		color:#FFF;
		display:block;
	}

	.js-videoinfobox.infotitle.border span.info {
		padding:6px 0px 0px 0px !important;
	}
	
	
/*------------------------------------------*/

	.js-link-button { 
		background-color:#F90;
		padding:5px 12px;
		font-size:11px;
		line-height:14px;
		min-width:24px;
		text-decoration:none !important;
		color:#FFF !important;
		transition: all .3s ease-in-out;
		border: 1px solid #FFFFFF;
		opacity:0.85;
		text-align:center;
	}
	
	.js-link-button:hover {
		cursor: pointer;
		opacity:1;
		box-shadow: 0px 0px 4px #ccc !important;
		border-color:#888;
	}
	
	.js-link-button.right { 
		float:right;
	}

	.js-link-button > span {
		display: block;
		padding-bottom:3px;
	
	}
	
	.js-link-button > span.text_small { 
		font-size:15px;
		line-height:18px;
	}

	.js-link-button > span.text_big { 
		font-size:19px;
		line-height:22px;
	}

/*------------------------------------------*/
		
	.js-listblock {
		
		padding: 12px;
	
	 }	
	
	.js-listblock.nospacer-top {
		
		padding-top:0px;
	
	 } 
	 
	 .js-listblock.small {
		
		font-size:11px;
		padding: 6px;
	
	 }
	 
	 .js-listblock.orange, .js-listblock.orange > h3 {
		
		background-color:#bf6916 !important; 
		color:#fff !important;
	
	 }	

	 .js-listblock ul.listblock {
		list-style: none;
		margin:0px;
		padding:0px;
	 }
	 
	 .js-listblock ul.listblock.square {
		list-style:square;
		margin-left:18px;
	 }
	
	 .js-listblock ul.listblock li {
		padding:3px 0px;
		background-repeat:no-repeat;
		background-position:left top;
		background-size: 12px 12px;
		background-position:0px 7px;
	}

	
	 .js-listblock ul {
		padding: 6px;
	 }
	 
	  
	ul.list.square li {
		background-image: url(http://img1.jalousiescout.de/symbole/icon_listing_square.svg);	
	}