/**
 * Klassen, um Containern ein festes Verhältnis zu geben,
 * über alle Bildschirmgrößen hinweg
 */
*[class*="ratio-"] {
	height: 0;
	width: 100%;
	overflow: hidden;
	position: relative;
}
.ratio-1-1 {
	padding-bottom: 100%;
}
.ratio-1-2 {
	padding-bottom: 200%;
}
.ratio-2-1 {
	padding-bottom: 50%;
}
.ratio-4-3 {
	padding-bottom: 75%;
}
.ratio-3-4 {
	padding-bottom: 133.33%;
}
.ratio-16-9 {
	padding-bottom: 56.25%;
}
.ratio-9-16 {
	padding-bottom: 177.77%;
}
.ratio-16-10 {
	padding-bottom: 62.5%;
}
.ratio-10-16 {
	padding-bottom: 160%;
}
.ratio-din-l {
	padding-bottom: 70.71%;
}
.ratio-din-p {
	padding-bottom: 141.42%;
}

/**
 * Abgerundete Ecken und Container mit Innerem Abstand
 */
.rnd {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.box {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding: 0.5em;
}