
	body {
		background: #5e94b2;
	}

	body, #st-container {
		overflow: auto;

		-webkit-overflow-scrolling: touch;
  		-moz-overflow-scrolling: touch;
  		-o-overflow-scrolling: touch;
  		overflow-scrolling: touch;
	}

	.text-page {
		color: #fff;
	}

	.fallball-container.text-page p,
	.fallball-container.text-page h1,
	.fallball-container.text-page h2,
	.fallball-container.text-page h3 {
		text-align: left;
	}

	.fallball-container.text-page h1 {
		font: bold 24px 'Exo', sans-serif;
		margin: 30px 0;
	}

	.fallball-container.text-page h2, .fallball-container.text-page h3 {
		font: bold 20px 'Exo', sans-serif;
	}

	.fallball-container.text-page p, .fallball-container.text-page ul, .fallball-container.text-page ol {
		font: normal 18px 'Exo', sans-serif;
		margin: 20px;
	}

	.fallball-container.text-page p.link {
		text-align: center;
	}

	.fallball-container .fallball {
		padding: 5%;
	}

	.text-page .img {
		display: block;
		width: 200px;
		margin: 0 !important;
	}

	.text-page .img img {
		width: 200px;
	}

	.text-page ul li, .text-page ol li {
		text-align: left;
		padding-left: 10px;
		margin-left: 30px;
	}

	.text-page h1, .text-page h2, .text-page h3, .text-page h4 {
		display: block;
		width: 100%;
	}

	p.link a,
	.link-back {
		background: #fff;
		display: inline-table;
		border: 1px solid #fff;
		font: bold 15px 'Exo', sans-serif;
		line-height: 25px;
		text-decoration: none;
		color: #29c7ec;
		padding: 15px;
		margin: 0 15px;

		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
	}

	p.link a:hover,
	.link-back:hover {
		background: #b5e2ed;
		color: #379db7;
	}

	span.desc {
		font: 400 12px 'Exo', sans-serif;
	}

	.desc-img {
		width: 300px;
		border: 2px solid #fff;

		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-o-border-radius: 50%;
		border-radius: 50%;
	}

	/* contact */

	.contact {
		display: block;
		width: 50%;
		margin: 0 auto;
	}

	.fallball-container.text-page .contact h1 {
		text-align: center;
	}

	.contact .uiForm, .contact textarea {
		background: #fff;
		display: block;
		width: 96%;
		border: 0;
		font: normal 24px 'Exo', sans-serif;
		margin: 10px auto;
		padding: 2%;

		-webkit-box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		-moz-box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		-o-box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
	}

	.contact textarea {
		height: 200px;
	}

	.contact .uiSubmit {
		background: rgba(255,255,255,0);
		border: 1px solid #fff;
		font: normal 15px 'Exo', sans-serif;
		color: #fff;
		cursor: pointer;
		padding: 15px;

		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
		-webkit-transition: 250ms ease-in 0s;
		-moz-transition: 250ms ease-in 0s;
		-ms-transition: 250ms ease-in 0s;
		-o-transition: 250ms ease-in 0s;
		transition: 250ms ease-in 0s;
	}

	.contact .uiSubmit:hover {
		background: #fff;
		color: #379db7;

		-webkit-transition: 250ms ease-in 0s;
		-moz-transition: 250ms ease-in 0s;
		-ms-transition: 250ms ease-in 0s;
		-o-transition: 250ms ease-in 0s;
		transition: 250ms ease-in 0s;
	}

	.contact .submit {
		display: table;
		width: 100%;
		margin-top: 25px;
	}

	.contact .submit .submit-content {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
		width: 50%;
	}

	.contact .submit .submit-content:last-child {
		text-align: right;
	}

	.recaptchatable { line-height: 0!important; }

	.fallball .failure {
		display: block;
		font: bold 32px 'Exo', sans-serif;
		text-align: center;
		padding: 20px;
		margin: 0;

		-webkit-animation: vibrate 1s ease-in-out infinite;
		-moz-animation: vibrate 1s ease-in-out infinite;
		-o-animation: vibrate 1s ease-in-out infinite;
		animation: vibrate 1s ease-in-out infinite;
	}

	/* help */

	.help {
		background: #266b7c;
	}

	.elems {
		display: table;
		width: 100%;
	}

	.elem {
		display: table-cell;
		vertical-align: middle;
		text-align: right;
		padding: 20px 0;
	}

	.elem.elem-text {
		padding: 20px;
	}

	.elem h3 {
		max-width: 100% !important;
		width: 100% !important;
		font-weight: bold;
		font-size: 35px !important;
		text-align: left !important;
	}

	.elem p {
		text-align: left !important;
		margin: 0 !important;
	}

	.elem.elem-img, .elem img {
		width: 250px;

		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
	}

	.elem img {
		width: 200px;
		border: 3px solid #fff;

		-webkit-border-radius: 125px;
		-moz-border-radius: 125px;
		-o-border-radius: 125px;
		border-radius: 125px;
	}

	.ribbon-mother {
		margin: 10px 0;
	}

	.ribbon-mother .elem-img {
		text-align: center;
		padding: 0;

		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		-o-border-radius: 0;
		border-radius: 0;
	}

	.ribbon-mother .elem-img .ribbon-container {
		position: relative;
		width: 150px;
		height: 194px;
		margin: 0 auto;
	}

	.ribbon-mother .elem-img .ribbon-container .ribbon-status {
		background: #fff;
		position: absolute;
		width: 50px;
		height: 50px;
		top: 0;
		left: 0;
		font-size: 40px;

		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-o-border-radius: 50%;
		border-radius: 50%;
	}

	.ribbon-mother .elem-img .ribbon-container .ribbon-status.green {
		color: #17d80e;
	}

	.ribbon-mother .elem-img .ribbon-container .ribbon-status.red {
		color: #e52121;
	}

	.ribbon-mother .elem-img .ribbon-container .ribbon-status i {
		margin-top: 5px;
	}

	.ribbon-mother .elem-img img {
		width: 110px;
		border: 0;
		margin-top: 20px;
	}

	.index-menu-container {
		text-align: center;
	}

	.index-menu-container p {
		text-align: center !important;
		font-weight: bold !important;
		font-size: 12px !important;
		margin: 0 !important;
	}

	@media screen and (max-width: 900px), screen and (max-height: 500px) {

		h2 {
			margin: 15px 0;
		}

		.elem {
			display: block;
		}

		.elem.elem-img {
			text-align: left;
		}

		.text-page .img img, .text-page .img, .elem img {
			width: 100px;
		}

		.index-menu a,
		.impressum-links a {
			width: 100px !important;
			height: 100px !important;
			margin: 10px !important;
		}

	}

	@media screen and (max-width: 700px), screen and (max-height: 400px) {

		.contact {
			width: 100%;
		}

	}

	/* forgotten */

	.forgotten {
		margin: 40px 0;
	}

	.forgotten input[type|=text], .forgotten input[type|=password] {
		background: #fff;
		display: block;
		width: 96%;
		border: 0;
		font: normal 24px 'Exo', sans-serif;
		margin: 10px auto;
		padding: 2%;

		-webkit-box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		-moz-box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		-o-box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		box-shadow: 5px 5px 0px rgba(0, 0, 0, 0.20);
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
	}

	.forgotten input[type|=submit] {
		background: rgba(255,255,255,0);
		border: 1px solid #fff;
		font: normal 15px 'Exo', sans-serif;
		color: #fff;
		padding: 15px;

		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
	}

	.forgotten input[type|=submit]:hover {
		background: #fff;
		color: #379db7;
	}
