article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 0.8em; line-height: 1.8em; }
body, button, input, select, textarea { font-family: "Lato", Arial, sans-serif !important; color: #89867e;overflow-x:hidden; }


/* WELCOME + NAVI */
section.welcome h1, section.welcome h3 {color:#fff; text-transform:uppercase;text-align:center;}
section.welcome h3 {letter-spacing:7px;}
section.welcome {background-image:url('/img/head.jpg');background-repeat:no-repeat;background-position:top center;min-height:670px;padding-top:210px;}

jumbotron {background:none!important;}

nav ul {padding-top: 50px;}
nav ul li {float:left;text-transform:uppercase;list-style:none;}
nav ul li a {color:#fff}
ul {-webkit-padding-start: 0!important;}


h1.jumbo {font-size: 4.3em;letter-spacing: 10px;}
.blue {border-color: #0e83cd;}
.topheading {text-align: center;margin-top:100px;text-transform:uppercase;}


/* SECONDNAV */

section.secondnav {
	display:none;
	background:#333;
}

/* BCKTOTOP */

#back-top {
	position: fixed;
	bottom: 2%;
	right: 2%;
	z-index:9999!important;
}

#back-top a {
	width: 64px;
	line-height:64px;
	font-weight: 500;
	display: block;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	color: #333;
	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
	background-color: #aaa;
	padding: 1% 3%;
	border-radius: 60px;
	
}
#back-top a:hover {
	background-color: #f1f1f1;
}

#back-top-full {
	width: 100%;
	bottom: 0;
	margin: 0;
	z-index: 999;
	display: block;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	color: #121212;
	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
	background-color: #c1c1c1;
}


/* ABOUT */

section.zitat {padding:2% 0;}

.about {width:50%;padding: 20px 50px;font-size:120%;}


/* PROFIL */

section.profil {background-image:url('/img/9.jpg');background-attachment: fixed;color: #fff;background-size:100% 100%;min-height:100%;padding-bottom:5%; }

.profil-wrap {margin-top:100px;float:left;}
.profil-wrap table {color: #fff;}
.profilimg {border:4px solid #fff;border-radius: 155px;margin: 0 auto;display:block;}

section.profil table {font-size:110%;margin-top:20px;}

/* VITA */

section.vita {background: #f1f1f1;padding-bottom:5%;}

section.vita h3 {
	text-align:center;
	padding:20px 0 10px;
}
section.vita p {font-size:120%;}

.vita-icon {padding: 10px;}

.path {
	display: inline-block;
	padding: 2.5em 0 0 0;
	list-style-type: none;
	text-align: left;
	background: transparent url(/img/path.jpg) top center repeat-y;
	width:100%;
	
}

.path>li {
	position: relative;
	display: inline-block;
	width: 50%;
	margin-bottom: 3em;
	background: transparent url(/img/path.jpg) 0 2em repeat-x;
	padding: 0;
}

.path>li .wrap {
	width: 100%;
	text-align: center;
	margin-top:-20px;
}


.path>li h3 {
	background: #f1f1f1;
	font-size: 1.8em;
}

.path>li.right {margin-left: 50%;}

.path>li.extramargin {margin-top: -8em;}

.path>li.left h3 {margin-right: 5em;}
.path>li.left p, .path>li.left img  {margin-right: 6em;}

.path>li.right p, .path>li.right img {margin-left: 6em;}

.path>li.right h3  {margin-left: 4em;}

.path>li img {border: 20px solid #fff;margin-bottom:10px;}

.path>li .icon  {
	position: absolute;
	width: 16px;
	height: 16px;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	-ms-border-radius: 16px;
	-o-border-radius: 16px;
	border-radius: 16px;
	font-size: 16px;
	display: block;
	background: #f1f1f1;
	border: 5px solid #333;
	color:#fff;
	text-align: center;
	
}

.path>li .icon i {
	float: left;
	width: 100%;
	height: 32px;
	color: #fff;
	font-style: normal;
}

.path>li.left .icon {
	right: -0.6em;
	top: 1.3em;
}
.path>li.right .icon {
	left: -0.4em;
	top:1.2em;
}


/* GALLERY */




/* FORM */

section.contactform {padding:4% 0;}


form {
	display: block;
	margin-top: 0em;
	font-size:120%;
}

form p {
	clear: left;
	text-align: center;
}

input, textarea {
	display: inline-block;
	
}
textarea {	padding: 8px !important;}
input[type=text]{width:100%;padding:10px!important;}
.form-container  {
    text-decoration: none;
   }  

.form-field {
   border: 1px solid #aaa;
   background: #fff;
   color: #333;
   margin-bottom:10px;
   }
 
.form-container textarea {
	height: 100px;
	width:100%;
}    

.form-container h2 {
   font-size:18px;
   margin: 0 0 10px 0;
   font-weight:bold;
   text-align:center;
   color: #333;
    }
    
.form-container label {
   color: #aaa;
   width:100%;
   font-weight:400;
   text-transform: uppercase;
   display: inline-block;
   }

input[type=submit] {border: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 15px 55px;
	display: inline-block;
	margin-top: 11px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	border: 3px solid #333;
	color: #333;
}

input[type=submit]:hover {
	border: 3px solid #d44600;
	color: #d44600;
}

/* FOOTER */

section.footer {padding: 2% 0;color:#fff;background:#333;}
section.footer a {color:#fff;text-transform:uppercase;}

section.footer .modal-body a {
	color: #333;
	text-transform: none !important;
	text-decoration: underline;
}

.modal-content {color: #333!important;}

/* ==|== media queries ======================================================
   PLACEHOLDER Media Queries for Responsive Design.
   These override the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */
   
.desktophide {
	display: none;
	visibility: hidden;
}

@media screen and (max-width:1366px) {
	.bttn {padding: 10px 40px!important;}
}

@media screen and (max-width:1340px) {
	.bttn {padding: 10px 30px !important;}
}

@media screen and (max-width:1280px) {
	section.welcome {min-height:620px;padding-top:190px;}
	h1.jumbo {font-size: 3.4em;letter-spacing: 10px;}
	.bttn {padding: 10px 23px !important;}
}

@media screen and (max-width:1080px) {
	.bttn {padding: 10px 15px!important;}
}


@media screen and (max-width:1024px) {
	section.welcome {background-position:center -50px;min-height:590px;padding-top:170px;}
	.bttn {padding: 10px 12px!important;}
}


@media screen and (max-width:1000px) {
	.bttn {padding: 10px 21px;margin: 8px 7px;}
}

@media screen and (max-width:980px) {
	.bttn {padding: 10px 15px;margin: 8px 7px;}
}


@media screen and (max-width:960px) {
	section.welcome {background-size:100%;min-height:400px;padding-top:30px;}
	h1.jumbo {font-size: 3em;letter-spacing: 10px;}
	.bttn {padding: 8px 19px;}
}

@media screen and (max-width:800px) {
	section.welcome {background-size: 160%;min-height: 400px;padding-top:70px;}
	section.zitat {padding:1% 0;}
	section.welcome nav {display:none;}
	section.secondnav {display:block;}
	.secondnav nav ul {padding-top: 5px;}
	.secondnav nav ul li a .bttn {border:0px;}
	h1.jumbo {font-size: 2em;letter-spacing: 10px;}
}

@media screen and (max-width:480px) {
	section.welcome {min-height: 305px;padding-top: 79px;background-size: 141%;background-position: 45%;}
	section.profil table {font-size:90%;}
	.profil-wrap {margin-top: 29px;}
	.path {	background: transparent url(/img/path.jpg) top left repeat-y;}
	.path li {padding-left: 10%;background:none;}
	.path li .wrap {text-align:left!important;margin-top:0;}
	.path>li h3 {text-align:left;}
	.path li.left, .path li.right {width: 100%;margin-right: 0;margin-bottom: 0;}
	.path li.right{margin-left:0px;}
	.path>li.left h3 {margin:0;padding:0;}
	.path>li.right h3 {margin-left: 0px;margin-bottom: 0px;padding-left: 0px;padding-bottom: 0;}
	.path li.extramargin {margin:0;}
	.path>li.right p {margin-left: 0;}
	.path>li.right .icon {left: -0.4em;top: 2.8em;}
	.path>li.left .icon {left: -0.6em;top: 0.4em;}
	.path li.right img {padding:0; margin:0;}
	.bttn { padding: 10px 15px; margin: 8px 3px;}
}

@media screen and (max-width:320px) {
	section.welcome {min-height: 355px;padding-top: 141px;background-size: 239%;background-position: 65%;}
	section.secondnav .bttn {padding: 0px;margin:0;padding:10px 10px!important;}
	h1.jumbo  {font-size:1.5em;}
	section.welcome h3 {font-size:1em;}
}

.modal-body ul {
	margin-left: 30px;
}