html, body {
	margin: 0px ;
	height: 100% ;
	font-family: "Roboto", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-variation-settings: "wdth" 100;
}
a {
	text-decoration: none ;
	border: none ;
	outline: 0 ;
	color: inherit;
}
a:visited { color: inherit ; }
a:focus { color: inherit ; }
a:hover, a:active { color: #999 }

.wrap {
	background: #f5f5f5;
	min-height: 100% ;
	margin-bottom: -200px ; 
}
.wrap:after {
	content: "" ;
	display: block ;
	height: 200px ;
}

.header {
	/* background-color: #0f3344 ; */
	background-color: #363839 ;
	color: white ;
	text-align: center ;
	min-height: 200px ;
	padding-top: 20px ;
}
.title {
	margin: 30px ;
}
.underline {
	font-size: x-large ;
	padding-bottom: 30px ;
}

.content {
	padding:60px ;
	margin-left: auto ;
	margin-right: auto ;
	max-width: 1200px ; 
}

.footer {
	color: white ; 
	height: 100px ;
	/* background-color: #0f3344 ; */
	background-color: #363839 ;
	text-align: center ;
	width:100% ;
	padding-top: 50px ;
	padding-bottom: 50px ;
}

h1, h2, h3, h4 { font-weight: 500 ; }
h1 { font-size: 80px ; }
h2 { font-size: 40px ; }
h3 { font-size: 20px ; }

table { margin: 0px auto; text-align: left ; }
th { padding-left: 20px; padding-right: 20px ; padding-bottom: 20px ; font-weight: bolt ; font-size: larger}
td { padding-left: 20px; padding-right: 20px ; }


    .kachel-container {
      display: flex;
      gap: 2rem;
      flex-wrap: wrap;
      justify-content: center;
    }

    .kachel {
      background: white;
      border-radius: 12px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      width: 400px;
      padding: 1.5rem;
      text-align: center;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .kachel:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    }

    .kachel img {
      max-width: 100%;
      height: auto;
      margin-bottom: 1rem;
    }

    .kachel-text {
      font-size: 1rem;
      color: #333;
    }