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

body {
    font-family: 'RocheSans-Light', sans-serif;
}

html, body {
	background-image: url("../img/roche.gif");
	background-repeat: no-repeat;
	background-position: 40px 40px;
	background-color: #fff7f5;
    height: 100%;
    margin: 0;
}

/* Linke Spalte – Bild soll 100% Höhe füllen */
.image-column {
    height: 100%;
    overflow: hidden;
	position: relative; /* wichtig fürs absolute Logo */
}

/* Bild skaliert proportional, füllt die Spalte */
.full-img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Wichtiger Unterschied zu Bootstrap 4 */
	object-position: top;
}

h1 {
	color: #0b41cd;
	font-size: 46px;
	font-weight: lighter;
	padding-bottom: 60px;
}

.content-box {
	margin-top: -100px;
	}

.list-group-item {
	background-color: #fff7f5;
	padding: 0;
  	border: 0 none;
}

.list-group-item img {
	max-width: 40px;
	margin-right: 20px;
	margin-bottom: 4px;
}

.list-group-item a {
	color: #000000;
	font-size: 26px;
	text-decoration: none;
}

.list-group-item a hover {
	color: #0b41cd;
}

/* Tablets = kleinste Geräte (z. B. iPad Mini, iPad, Android Tablets) */
@media (max-width: 1024px) {
   h1 {
	font-size: 26px;
	padding-bottom: 10px;
	}
	
	.list-group-item {
	padding: 0;
	}
	
	.list-group-item img {
	max-width: 30px;
	margin-right: 10px;
	margin-bottom: 4px;
	}
	
	.list-group-item a {
	font-size: 16px;
	}
}

/* Smartphones */
@media (max-width: 768px) {
  .content-box {
	margin: 30px 0 30px 240px;
	}
}