@font-face { font-family: 'taz';
             src: url('Taz-Regular.woff') format('woff');} /*pfad muss noch angepasst werden*/
		@font-face { font-family: 'taz';
             src: url('Taz-Bold.woff') format('woff'); /*pfad muss noch angepasst werden*/
             font-weight: bold; }			 
		@font-face { font-family: 'taz';
             src: url('Taz-Black.woff') format('woff'); /*pfad muss noch angepasst werden*/
             font-weight: 900; }	
/* den punkt suche habe ich erstmal außen vorgelassen weil ich nicht weiß inwiefern die stoffsuche an die suche von bauhaus angepasst werden soll*/
body{
		font-family: taz;
		accent-color: #5c8c1e;
		line-height: 1.21875rem;		/* Vorgabe: Schriftgroesse 16px, line-height 19.5px - Die Browser haben eine Standard-Schriftgroesse von 16px. Deshalb definiere ich sie hier erneut und man kann sie im Browser bei Bedarf aendern */
}

input[type=radio], input[type=checkbox] {
		width: 18px;
		height: 18px;
}

button, .primary_button, .primary_button:hover, .primary_button:focus, .primary_button:active {
	background-color:#EE1F26;
	color:#ffffff;
	cursor: pointer;
}
.secondary_button{
	background-color:#666666;
	color:#ffffff;
	cursor: pointer;
}
.disabled_button{
	background-color:#dadada;
	color:#ffffff;
	cursor: pointer;
}
button, .primary_button, .secondary_button, .disabled_button{
	font-weight:bold;
	font-size:16px;
	padding:20.5px 18px; /* im styleguide ist der abstand rechts und links nicht mit angegeben  --> vorübergehend auf 18px belassen damit es nicht am Rand klebt*/
}
a{
	color:#636363;
	text-decoration:none;
}


@media (min-width: 320px) and (max-width: 659px){ 			/* Viewport S */

	h1{
		font-weight:700;
		font-size:22px;
		line-height:1.2;			
	}
	h2{
		font-weight:500;
		font-size:20px;
		line-height:1.2;		
	}
	h3{
		font-weight:700;
		font-size:18px;
		line-height:1.2;
	}
	h4{
		font-weight:700;
		font-size:16px;
		line-height:1.2;
		letter-spacing:0.02em;		
	}
	h5{
		font-weight:700;
		font-size:16px;
		line-height:1.2;		
	}
	p{
		font-weight:500;
		font-size:16px;
		line-height:19.5px;
	}
	.warenkorb_buttons{
		font-weight:bold;
		font-size:18px;
		padding:10px 18px; 		/* im styleguide unter viewport s ist der abstand rechts und links nicht mit angegeben  --> vorübergehend auf 18px belassen damit es nicht am Rand klebt*/
	}
	.preis_detailseite{
		font-size:40px;
		font-weight:900;
		color: #ffffff;
		background-color: #EE1F26;
	}
	
}
@media (min-width: 660px) and (max-width: 960px){			/* Viewport M */
	
	h1{
		font-weight:700;
		font-size:30px;
		line-height:1.2;			
	}
	h2{
		font-weight:500;
		font-size:24px;
		line-height:1.2;		
	}
	h3{
		font-weight:700;
		font-size:20px;
		line-height:1.2;		
	}
	h4{
		font-weight:700;
		font-size:18px;
		line-height:1.2;
		letter-spacing:0.02em;		
	}
	h5{
		font-weight:700;
		font-size:18px;
		line-height:1.2;		
	}	
	p{
		font-weight:500;
		font-size:16px;
		line-height:19.5px;
	}
	.warenkorb_buttons{
		font-weight:bold;
		font-size:18px;
		padding:10px 18px; 		
	}
	.preis_listenseite{
		font-size:40px;
		color:#666666;
	}
	.preis_detailseite{
		font-size:40px;
		font-weight:900;
		color: #ffffff;
		background-color: #EE1F26;
	}	
	
}


@media (min-width: 961px){			/* Viewport L       and (max-width: 1200px)*/
	
	h1{
		font-weight:700;
		font-size:30px;
		line-height:1.2;
	}
	h2{
		font-weight:500;
		font-size:24px;
		line-height:1.2;
	}
	h3{
		font-weight:700;
		font-size:20px;
		line-height:1.2;		
	}
	h4{
		font-weight:700;
		font-size:18px;
		line-height:1.2;
		letter-spacing:0.02em;
	}
	h5{
		font-weight:700;
		font-size:18px;
		line-height:1.2;
	}
	p{
		font-weight:500;
		font-size:16px;
		line-height:19.5px;
	}
	.warenkorb_buttons{
		font-weight:bold;
		font-size:18px;
		padding:10px 18px; 		
	}
	.preis_listenseite{
		font-size:40px;
		font-weight:900;
		color:#666666;
	}
	.preis_detailseite{
		font-size:40px;
		font-weight:900;
		color: #ffffff;
		background-color: #EE1F26;
	}	
	
}