@charset "utf-8";

/* CSS-Datei - JSW-Jahresberichte */

/* Reset   */ 
*{margin: 0; padding: 0;} 

html { 
position: relative; 
min-height: 100%;
}

body{
font: 300 20px/26px 'Lato', sans-serif;
color: #3D3935;
}

img{
max-width: 100%;
}

.wrapper{
max-width:1200px; 
min-width: 240px;
margin: 0 auto;
overflow: hidden;
}

#footer a{
color: #fff;
font: 400 16px/24px 'lato', sans-serif;
text-decoration: none;
} 

#footer a:hover{
text-decoration: underline;	
}

#header{
padding: 20px 10px;
}

#teaser{
margin-bottom: 20px;
padding-bottom: 2em;
}

ul#ul_list_jb{
list-style: disc;
margin: 20px;
}

ul#ul_list_jb li{
margin-bottom: 15px;
}

.jb_icon{
margin: 0 40px 40px 0;
float: left;
}


#footer{
background: #e5007d;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
padding-top: 1em;
padding-bottom: 1em;
}

.index img{
margin: 0;
}

.index a:hover img{
/*Responsivetransform: scale(1.1);
transition: transform .20s ease;*/
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
opacity: 0.9;
}



.col_1_1{
width: 100%;
text-align: center;
}

.jb1{
width: 100%;
text-align: left;
}


.jb1 a{
text-decoration: underline;
}

.jb1 a:hover{
font-weight: 400;
}

.jb_img_left
{
margin: 5px 10px 5px 0;
float:left;
}

.jb_img_right{
margin: 5px 0 5px 10px;
float:right;
}

.jb_img_right_s{
margin: 5px 0 5px 10px;
float:right;
}

.icon img{
  transition: transform .10s ease;
}
.icon:hover img{
transform: scale(1.1);
}

h1{
font: 700 27px/45px 'Lato', sans-serif;
color: #3D3935;	
}

h2{
font: 700 27px/45px 'Lato', sans-serif;
color: #3D3935;	
}


h3{
font: 700 20px/30px 'Lato', sans-serif;
color: #3D3935;	
}

.magenta_helpnet{
float:right;
background: #e5007d;
color: #fff;
padding:20px;
max-width: 440px;
font-weight: 400;
margin:30px 0 30px 30px;
}

.magenta_helpnet a{
color: #fff;
}

.magenta_helpnet a:hover{
font-weight: 700;
}

.gray{
background: #d3d3d3;
padding:40px;
margin:30px auto;
}

.magenta{
background: #e5007d;
color: #fff;
padding:40px;
margin:30px auto;
}

.magenta a{
color: #fff;
}

.magenta a:hover{
font-weight: 700;
}

.video_left{
		float:left;
	height: 400px;
}
.video_right{
		float:right;
	height: 400px;
}


/*Responsive*/
@media only screen and (max-width: 1200px){ 
 
.wrapper, .col_1_1, .col_1_2, .col_1_3, .jb_icon, .index{
width: 95%;
text-align: center;
}

.jb_img_right, .jb_img_left, .video_left, .video_right{
		margin: 10px auto;
		width: 100%;
	}
.jb_img_right_s{
		margin: 10px auto;
	padding-left: 20px;	
	max-width: 40%;
	display: block;
	}
	
	 .magenta_helpnet{
		margin: 20px 40px;
		text-align: center;
		display: block;
	} 

.index{
	margin: 5px auto;
	}

.index img{
	margin: 10px auto;
	}
	
.index a:hover img{
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
opacity: 1.0;
}	
	
#footer{
position: relative;
} 

}

	
	