body, html {
font-family: 'Roboto Condensed', sans-serif;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	color: #777;
	width: 100% !important;
	height: 100% !important;
}
h1 {
    font-size: 24px;
	font-weight: 100;
	color: #ccc;
}
h1 strong {
	font-weight: 400;
}
h2 {
	line-height: 30px;
	font-weight: 100;
	margin: 0;
	color: #fff;
}
h3 {
	font-size: 24px;
	font-weight: 100;
	color: #fff;
}
h4 {
	font-weight: 300;
	color: #555;
}
h5 {
	text-transform: uppercase;
	font-weight: 00;
	line-height: 20px;
}
p {
	font-size: 14px;
}
a {
	color: #999999;
}
a:hover, a:focus {
	text-decoration: none;
}
ul, ol {
	list-style: none;
}
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #ddd;
	z-index: 99999;
	height: 100%;
}
#status {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 64px;
	height: 64px;
	margin: -32px 0 0 -32px;
	padding: 0;
}
ul, ol {
	padding: 0;
	webkit-padding: 0;
	moz-padding: 0;
}
hr {
	height: 4px;
	width: 70px;
	text-align: center;
	position: relative;
	background: #E75926;
	margin: 0 auto;
	margin-bottom: 30px;
	border: 0;
}
.small {
  font-size: 95%;
  color: #ffffff;
}

/* Home Section */
#intro {
	display: table;
	width: 100%;
	height: 100%;
	text-align: center;
	color: #fff;
	background: url(../img/intro-hg.jpg) no-repeat center center fixed;
	background-color: #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
}
#intro .intro-body {
	display: table-cell;
	vertical-align: middle;
}
}

@media (min-width:1024px) {
#intro  {
	height: 100%;
	padding: 0;
}
#intro .intro-body .intro-text {
	font-size: 24px;
	letter-spacing: 1px;
	margin-bottom: 100px;
	color: rgba(255,255,255,0.9);
}
}
.btn-default {
	color: #f6f6f6;
	background-color: rgba(250, 250, 250, 0.2)!important;
	border: 0;
	padding: 12px 24px;
	margin: 0 8px;
	font-size: 18px;
	transition: all 0.5s;
}
.btn-default:hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active {
	color: #f6f6f6;
	background-color: rgba(250, 250, 250, 0.2)!important;
}
.round-button {
	text-align: center;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    border-radius: 50%;
    overflow: hidden;
    background: #464646;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.round-button:hover {
	color: #fffff;
		opacity: 0.6;
			transition: all 0.5s;
}
.round-button img {
    display: block;
    width: 100%;
    padding-top: 0%;
    height: auto;
}
.btn-scroll {
	width: 50px;
	height: 58px;
    	margin-top: 30px;
		text-align: center;
		background: url(../img/scroll.png);
		border: 0;
		transition: all 1.5s;
}
.btn-scroll:hover, .btn-scroll:focus, .btn-scroll.focus, .btn-scroll:active, .btn-scroll.active {
	color: #f6f6f6;
	background: url(../img/scroll1.png);
}
.btn-top {
	width: 50px;
	height: 58px;
	margin-top: 30px;
	text-align: center;
	background: url(../img/top.png);
	border: 0;
	transition: all 1.5s;
}
.btn-top:hover, .btn-top:focus, .btn-top.focus, .btn-top:active, .btn-top.active {
	color: #f6f6f6;
	background: url(../img/top1.png)
}
.bilder {
	margin-top: -100px;
}

/* Sections */
#inhalt {
	padding: 30% 0;
	text-align: center;
	-webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}
#map1a {
	height: 20%;
	width: 100%;
	padding: 1px 0;
	color:#CCC;
	font-size: 24px;
	background-color: rgba(55, 51, 102, 0.7)!important;	
}
#map {
	display:table;
	width: 100%;
	height: 100%;
	 padding: 1px 0;
	background: url(../img/map-hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#port1a {
	width: 100%;
	padding: 100px 0;
	margin-top: 500px;
	background-color: rgba(153, 5, 101, 0.7)!important;	
}
#port1 {
	width: 100%;
	padding: 1px 0;
	background: url(../img/port1-hg.jpg)  center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover
}
#port2a {
	width: 100%;
	padding: 100px 0;
	margin-top: 470px;
	background-color: rgba(35, 33, 35, 0.7)!important;	
	background-size: cover;
}
#port2 {
	width: 100%;
	padding: 1px 0;
	background: url(../img/port2-hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover
}
#port3a {
	width: 100%;
	padding: 100px 0;
	margin-top: 500px;
	background-color: rgba(102, 102, 102, 0.7)!important;	
}
#port3 {
	width: 100%;
	padding: 1px 0;
	background: url(../img/port3-hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover
}
#port4a {
	width: 100%;
	padding: 100px 0;
	margin-top: 480px;
	background-color: rgba(90, 46, 79, 0.7)!important;	
}
#port4 {
	width: 100%;
    padding: 1px 0;
	background: url(../img/port4-hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover
}
#port5a {
	width: 100%;
	padding: 100px 0;
	margin-top: 500px;
	background-color: rgba(10, 88, 137, 0.7)!important;	
}
#port5 {
	width: 100%;
	padding: 1px 0;
	background: url(../img/port5-hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover
}
#port6a {
	width: 100%;
	padding: 100px 0;
	margin-top: 480px;
	background-color: rgba(90, 46, 79, 0.7)!important;	
}
#port6 {
	width: 100%;
	padding: 1px 0;
	background: url(../img/port6-hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover
}
#port7a {
	padding: 20% 0;
	text-align: center;
	-webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}
#port7 {
	width: 100%;
	padding: 1px 0;
	text-align: center;
	background: url(../img/port7-1hg.jpg) center center no-repeat #000;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
}
/* Footer Section*/
.footer {
	width: 100%;
	height:auto;
	background: #000;
	color: #777;
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: center;
}
.footer a {
	color: #999999;
}
.footer a:hover, a:focus {
	color: #e75926;
}
.footer p {
	font-size: 13px;
	margin-top: 10px;
}
}
@media (max-width: 767px) {
h1 {
	text-align: center;
    font-size: 18px;
	font-weight: 100;
	color: #ccc;
}
h2 {
    font-size: 18px;
	font-weight: 100;
	margin: 0;
	color: #fff;
}
h3 {
	font-size: 16px;
	font-weight: 100;
	color: #CCC;
}
.bilder {
	margin-top: -10px;
}
#inhalt {
	padding-top: 20% 0;
}
#map1a {
	height: 180px;
	width: 100%;
	font-size: 16px;
}
#map {
	height: 100%;
	padding: 0px 0;
	color:#CCC;
	font-size: 16px;
}
#port1 {
	background-position: 70% 0%;
}
#port2 {
	background-position: 80% 0%;
}
#port3 {
	background-position: 68% 0%;
}
#port4 {
	background-position: 35% 0%;
}
#port5 {
	background-position: 65% 0%;
}
#port6 {
	background-position: 48% 0%;
}

}

@media (max-width: 640px) {
#intro .intro-body H1 {
	font-size: 5em;
}
#intro {
	height: auto;
}
.round-button {
    max-width: 100%;
    height: 0;
    padding-bottom: 100%;
    border-radius: 50%;
    overflow: hidden;
}
.round-button img {
    display: block;
    max-width: 100%;
    padding-top: 0%;
    height: auto;
	text-align:center
}

h2 {
	font-size: 22px;
}
.bilder {
	margin-top: -10px;
}
#map1a {
	height: 160px;
	width: 100%;
	padding: 0px 0;
	color:#CCC;
	font-size: 16px;
}
#map {
	min-height: 720px;
}
#port1 {
	background-position: 60% 0%;
}
#port2 {
	background-position: 73% 0%;
}
#port3 {
	background-position: 60% 0%;
}
#port4 {
	background-position: 40% 0%;
}
#port5 {
	background-position: 60% 0%;
}
#port6 {
	background-position: 48% 0%;
}
#port1a {
	padding-top: 10px;
	margin-top: 450px;

}
#port2a {
	padding-top: 10px;
	margin-top: 350px;

}
#port3a {
	padding-top: 10px;
	margin-top: 450px;

}
#port4a {
	padding-top: 10px;
	margin-top: 400px;

}
#port5a {
	padding-top: 10px;
	margin-top: 500px;

}
#port6a {
	padding-top: 10px;
	margin-top: 320px;

}
#port7a {
	padding-top: 10px;
	margin-top: 1px;
}
}

@media (max-width: 380px) {
#intro .intro-body H1 {
	font-size: 5em;
}
h2 {
	font-size: 20px;
}
h3 {
	font-size: 18px;
}
#port1 {
	background-position: 60% 0%;
}
#port2 {
	background-position: 68% 0%;
}
#port3 {
	background-position: 58% 0%;
}
#port4 {
	background-position: 48% 0%;
}
#port5 {
	background-position: 60% 0%;
}
#port6 {
	background-position: 48% 0%;
}
}