/* ################################################################## */
/* CSS fuer allgemeine Formatierungen - Ergebnisseite Finswimming	  */
/* ################################################################## */

*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-moz-transition: width .75s ease-out;
	-webkit-transition: width .75s ease-out;
	transition: width .75s ease-out;
}

.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}

.section { 
	clear: both;
	margin: 0rem;
}

html, body {
	font-family: Verdana, Helvetica, Arial, Geneva, sans-serif;
	font-size: 62.5%;
	line-height: 1.4;
	height: 100%;
}

body {
	font-size: 1.4rem;
	margin: 0 auto;
	color: #333;
	background: #d1e0ff;
}

/* überschriften */
h1, h2 {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
	font-weight: normal;
	color: #2272c5;
}

h2 {
	font-size: 2.2rem;
	line-height: 2.8rem;
	margin-top: 0rem;
	margin-bottom: 3rem;
	letter-spacing: .1rem;
	text-align: left;
}

h3 {
	font-size: 1.6rem;
	line-height: 2.3rem;
	margin-top: 3rem;
	margin-bottom: 1rem;
	letter-spacing: .0rem;
}

p {
	padding: 1rem 0rem 1rem 0rem;
}


ul.indent {
	padding-left: 3rem;
}

ul.ldetails {
	list-style-type: square;
	padding-left: 3rem ;
}

/* Liste ohne Listenpunkt */
ul.olp {
	list-style-type: none;
}

li {
	padding: 1rem 0rem 1.5rem 0rem;
}

/* Links */
a {
	color: #333;
	text-decoration: underline;
}

a.va-titel {
	color: #333;
	text-decoration: none;
}

a:hover  {
	color: #333;
	text-decoration: none;
	font-style: normal;
}

/* Hauptcontainer  */
.wrapper {
	margin: 0 auto;
/*	height: 100%;   */
	width: 100%;
}

/* Kopfbereich mit Titel, Buehne und Navigation / Header  */
.header {
	min-height: 20rem;
	margin: 0 auto;
	background: #d1e0ff;
	color: #333;
	text-align: center;
	padding: 0rem 0rem 0rem 0rem;
}

.head-titel {
	padding: 2.5rem 5rem 2rem 4rem;
	text-align: left;
	display: block;
}

.navigation {
	padding: 1.0rem 3rem 0.5rem 3rem;
	text-align: right;
	height: 4rem; 
}

/* Buehnenbild */
.buehne {
	background: ghostwhite;
	min-height: 24rem;
	margin: 0 auto;
	color: #333;
	text-align: center;
	padding: 0rem 0rem 0rem 0rem;
	background-image: url(../images/logo.jpg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	border-bottom: 0.5rem solid #f58229;
}

.titel {
	display: block;
	letter-spacing: 0.2rem;
	padding: 0rem 0rem 0rem 0rem;
	font-size: 3.5rem;
	line-height: 3.5rem;
	color: #2272c5;
	text-transform: uppercase;
}

.titel-zusatz {
	display: block;
	letter-spacing: 0.2rem;
	padding: 0.5rem 0rem 0rem 0rem;
	font-size: 1.8rem;
	line-height: 2.2rem;
	color: #1c7ec6;
	text-transform: none;
}

.stitel-mobil {
	display: inline;
	letter-spacing: 0.2rem;
	padding: 0rem 1rem 0rem 1rem;
	font-size: 1.8rem;
	line-height: 3rem;
	height: 6rem;
	color: #f58229;
	text-transform: none;
}

/* Inhaltsbereich / Content   */
.inhalt {
	width: 100%;
	margin: 0 auto;
	min-height: 50rem;
	background: #d1e0ff;
	text-align: center;
	padding: 0rem 0rem 0rem 0rem;
}

.contentbox {
	min-height: 23rem;
	text-align: left;
	padding: 2rem 0.5rem 2rem 0.5rem;
}

/* footer */
.footer{
	margin: 0 auto;
	min-height: 5rem;
	background: #036;
	color: #919191;
	text-align: center;
	padding: 1rem 3rem 0.5rem 3rem;
	text-shadow: none;
	border-top: solid .5rem #f58229;
}

.footer-content {
/*	height: 5rem; */
	line-height: 2rem;
	font-size: 1.4rem;
	letter-spacing: 1px;
}

.footer-content a {color: #919191;}

/* Sonstiges */
.center {
	text-align: center;
}
.right {
	text-align: right;
}
.inaktiv {
	color: #666666;
}
.noborder {
	border: none;
}
.vereinsdaten {
	padding: 2em 0 0 0;
}

/******************* M E D I A   Q U E R I E S ********************/

/*  ab 360 pixel  */
@media (min-width: 360px) {
	.head-titel {padding: 2.5rem 6rem 2rem 6rem;	}
}

/*  ab 480 pixel  */
@media (min-width: 480px) {
	.head-titel {padding: 2.5rem 6rem 2rem 6rem;}
}

/*  ab 600 pixel  */
@media (min-width: 600px) {
	.logo-bottom {padding: 0rem 8rem 0rem 8rem;}
	.head-titel {padding: 2.5rem 6rem 2rem 6rem;}
	.navigation, .footer  {padding: 1.0rem 6rem 0.5rem 6rem;}
	.contentbox  {padding: 3rem 6rem 3rem 6rem;}
	.footer-content {font-size: 62%;}
}

/*  ab 640 pixel  */
@media (min-width: 640px) {
	/* nichts */
}

/*  ab 680 pixel  */
@media (min-width: 680px) {
	html {font-size: 64%;}
	.footer-content {font-size: 62%;}
}

/*  ab 768 pixel  */
@media (min-width: 768px) {
	html {font-size: 68%;}
	.header {min-height: 16rem;}
	.head-titel {padding: 2rem 0rem 1.5rem 3rem;}
	.stitel-mobil {display: none;}
	.footer-content {font-size: 66%;}
}

/*  ab 800 pixel  */
@media (min-width: 800px) {
	html {font-size: 69%;}
	.contentbox {text-align: justify;}
	.footer-content {font-size: 67%;}
}

/*  ab 1024 pixel  */
@media (min-width: 1024px) {
	html {font-size: 70%;}
	.head-titel  {padding: 2.5rem 4rem 2rem 4rem;}
	.navigation, .footer  {padding: 1.0rem 4rem 0.5rem 4rem;}
	.contentbox  {padding: 3rem 4rem 3rem 4rem;}
	.footer-content {font-size: 68%;}
}

/*  ab 1100 pixel  */
@media (min-width: 1100px) {
	.head-titel  {padding: 2.5rem 9rem 2rem 9rem;}
	.navigation , .footer {padding: 1.0rem 9rem 0.5rem 9rem;}
	.contentbox  {padding: 3rem 9rem 3rem 9rem;}
}

/*  ab 1200 pixel  */
@media (min-width: 1200px) {
	html {font-size: 74%;}
	.head-titel  {padding: 2.5rem 12rem 2rem 12rem;}
	.navigation, .footer {padding: 1.0rem 12rem 0.5rem 12rem;}
	.contentbox {padding: 4rem 12rem 4rem 12rem;}
	.footer-content {font-size: 72%;}
}

/*  ab 1480 pixel  */
@media (min-width: 1480px) {
	html {font-size: 82%;}
	.head-titel {padding: 2.5rem 15rem 2rem 15rem;}
	.navigation , .footer {padding: 1.0rem 15rem 0.5rem 15rem;}
	.contentbox  {padding: 4rem 15rem 4rem 15rem;}
	.footer-content {font-size: 80%;}
}