/* CSS Document | lead and more STEFAN WIESWEG */  


/***  font 
Hinzugefügte Schriftarten:
typekit: Market Pro Bold + Regular | Regulator Nova
***/

:root {
	font-size: 28px;
}


html, body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
	font-family: regulator-nova, sans-serif;
	font-weight: 400;
	color: #494949;
}

section {
	min-height: 100%; /** section hat 100%-ansicht, egal welches BROWSER-FORMAT **/
} 

a {
	text-decoration: none;
	color: #494949;	
}

li {list-style-type: none;}

h3 {
	font-family: regulator-nova, sans-serif;
	font-weight: 300;
	font-size: 1.5rem;
	padding-top: 8%;
	margin-bottom: .2rem;
	color: #2a5a97;
}
	

hr {
	width: 2rem;
	height: .05rem;
	background-color:#ff6700;
	border: 0;
	margin: 0 auto 1.2rem auto;
	z-index: 5;
}

	
/*** HEADER ********************************************/

header {
	width: 100%;
	height: 3rem;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #fff;
	box-shadow: 0 .02rem .2rem rgba(0,0,0, 0.45); /** schatten unter dem header **/
	z-index: 10;
}

#logo {
	width: 8rem;
	float: left; 
	margin: 0.5rem 0 auto 2rem;
	transition: all 350ms;
	-webkit-transition: all 350ms;
	-moz-transition: all 350ms;
	-o-transition: all 350ms;
	}

#logo:hover {
	opacity: 0.6;
}

#logo img {
	width: 100%; 
}

header nav {
	float: right;
	margin: auto 2rem auto 0;
}


header nav ul li {
	float: left;
  	margin-left: 1.5rem;
	font-size: 0.75rem;
}


header nav ul li:hover {
	padding-top: .25rem;
	transition: all 350ms;
	-webkit-transition: all 350ms;
	-moz-transition: all 350ms;
	-o-transition: all 350ms;
}

/*** HOME ********************************************/


#home {
	background-image: url("../images/leadandmore_FUEHRUNGSKRAFT_stefanwiesweg.png"); 
	width: 100%;
	background-position: center center;
	background-attachment: fixed;  /** bild bleibt im hintergrund fixiert, scrollt nicht mit **/
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#home img {
	opacity: 0.95;
	position: sticky;
	width: 5%;
	right: auto;
	left: auto;
	top: 5em;
}

#home img:hover {
  	width: 6.5%;
	opacity: 1;
	transition: all 500ms;
	-webkit-transition: all 500ms;
	-moz-transition: all 500ms;
	-o-transition: all 500ms;
}


/*** ABOUT ********************************************/

#about img {
	width: 35%;
	margin: .5rem auto .5rem auto;
}

#about h4 {
    font-family: ff-market-web, sans-serif; 
	font-weight: 400;
	font-size: 2.8rem;
	color: #2a5a97;
	line-height: 2.8rem;
 /*   text-transform: uppercase; */
	margin-bottom: 0;
}


.about-article {
/*	background-color: red; */
	width: 80%;
	margin: 0 auto 3rem auto;
	padding-bottom: 3rem;
	font-size: 1.3rem;
}

/* aufzählungszeichen UL (unordered list) */

.ul-custom li {
	line-height: 2.8rem;
	list-style-type: disc;
}


 .about-article	ul li::marker {
	color: #2a5a97;
	font-family: ff-market-web, sans-serif;
	}


/*** LEAD AND MORE ******************************************/

#leadandmore1 {
	background: url("../images/leadandmore_VERSTEHEN_stefanwiesweg.png");
	width: 100%;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-ms-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
} 


/*** WORK ****************************************************/

.work-flexbox {
	width: 90%;
	margin: 5%;
/*	background-color: red; */
	display: flex;
	flex-direction: row;
	justify-content: center;  /** die kindelemente (work-flexelement) sind zentriert IM elternelement **/
	flex-wrap: wrap;  /** umbruch, wenn mehrere kindelemente nebeneinander --> definiert durch widht!  **/
	align-items: center;  /** ausrichtung: center = mittig  |  strecht = alle boxen werden gleich gross gezogen **/
}

	.work-flexelement {
		color: #494949;
		width: 45%;
		margin: 1%;
		line-height: 1.5rem;
	}

		.work-flexelement img {
				width: 70%;
		}


/*** LEAD AND MORE ********************************************/

#leadandmore2 {
	background: url("../images/leadandmore_MOTIVATION_stefanwiesweg.png");
	width: 100%;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed; 
	background-repeat: no-repeat;
}


/*** STEFAN WIESWEG lang ********************************************/

.stefanwiesweg-article1 {
	width: 70%;
	margin: 3% auto 10% auto;
	text-align: justify;
	line-height: 1.5;
}

.stefanwiesweg-article1 h3 {
	text-align: left;
	margin-bottom: 0;
	margin-top: -2rem;
}

.stefanwiesweg-article1 p {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-weight: lighter;
	color: #666;
	font-size: .75rem;
	margin-top: 0;
}

.stefanwiesweg-article1 h2 {
	font-family: regulator-nova, sans-serif;
	font-weight: 300;
	font-size: .95rem;
	text-align: left;
	margin-bottom: 0;
	margin-top: -0.25rem;
}


/*** LEAD AND MORE ********************************************/

#leadandmore3 {
	background: url("../images/leadandmore_UEBERZEUGUNG_stefanwiesweg.png");
	width: 100%;	
	background-position: center center;
	background-size: cover;
	background-attachment: fixed; 
	background-repeat: no-repeat;

}


/*** CONTACT ********************************************/

#contact img {
	width: 3%;
	margin: 5rem auto -3.5rem auto;
}

#contact p {
/*	color: #28527C; */
	line-height: 2.5;
}


/*** FOOTER ********************************************/


footer {
	width: 100%;
	height: 2.5rem;
	background-color: #fff;
	box-shadow: 0 .02rem .2rem rgba(0,0,0, 0.45);
}

footer p {
	font-size: .4rem;
	color: #28527C; 
	padding-top: .75rem;
}


/********************** MEDIA QUERIES ********************************************/

/*** TABLET ********************************************/


@media screen and (max-width: 1300px) {
	
	:root {
		font-size: 20px;
	}
	
	section {
		min-height: 100%;
	}  
	
	#home {
		background-size: 100% auto;  /** 100% breite = querformat landscape **/
		background-position: center top;
		background-attachment: scroll;  /** iOS fehler ipad/iphone mit attachment:fixed -> deshalb scroll; important! **/
	} 
	
	#about img {
		width: 40%;
	}
	
	.work-flexelement img {
		max-width: 55%;
	}
	
	footer p {
		font-size: .5rem;
	}

	#leadandmore1 {
		background-size: 120% auto;
		background-attachment: scroll;  /** iOS fehler ipad/iphone mit attachment:fixed -> deshalb scroll; important! **/
	}
	
	#leadandmore2 {
		background-size: 120% auto;
		background-attachment: scroll;  /** iOS fehler ipad/iphone mit attachment:fixed -> deshalb scroll; important! **/
	}
	
	#leadandmore3 {
		background-size: 120% auto;
		background-attachment: scroll;  /** iOS fehler ipad/iphone mit attachment:fixed -> deshalb scroll; important! **/
	}
	
	.stefanwiesweg-article1 p {
		font-weight: 400;
		color: #888;
	}
}



@media screen and (max-width: 1300px) and (orientation:portrait) {
	
	section {
		min-height: 80%;
	}  
	
	#home {
		background: url("../images/leadandmore_FUEHRUNGSKRAFT_stefanwiesweg_portrait.png"); 
		background-size: 100% auto;  
		background-repeat: no-repeat;
	} 

	#leadandmore1 {
		background: url("../images/leadandmore_VERSTEHEN_stefanwiesweg_portrait.png"); 
		background-size: 100% auto;
		background-repeat: no-repeat;
	}
	
	#leadandmore2 {
		background: url("../images/leadandmore_MOTIVATION_stefanwiesweg_portrait.png"); 
		background-size: 100% auto;
		background-repeat: no-repeat;
	}
	
	#leadandmore3 {
		background: url("../images/leadandmore_UEBERZEUGUNG_stefanwiesweg_portrait.png"); 
		background-size: 100% auto;
		background-repeat: no-repeat;
	}
}


@media screen and (max-width: 780px) {
	
	
	:root {
		font-size: 18px;
	}
	
	section {
		min-height: 100%;
	}
	
	#about img {
		width: 40%;
	}
	
	
	.work-flexbox {
		flex-direction: column;
	}
	
	.work-flexelement {
		width: 80%;
		flex: 1;
	}
	
	.work-flexelement.flex-1 {
		order: 1;
		margin-bottom: 0;
	}

	.work-flexelement.flex-2 {
		order: 1;
		margin-top: 0;
	}

	
	.work-flexelement.flex-3 {
		order: 3;
		margin-top: 0;
	}
	
	.work-flexelement.flex-4 {
		order: 2;
		margin-bottom: 0;
		margin-top: 5%;
	}
	
	.work-flexelement.flex-5 {
		order: 4;
		margin-bottom: 0;
		margin-top: 5%;
	}

	.work-flexelement.flex-6 {
		order: 5;
		margin-top: 0;
	}
	
	.work-flexelement img {
			width: 70%;
		}
	
	
	footer p {
		font-size: .5rem;
	}
	
}


@media screen and (max-width: 780px) and (orientation: portrait) {
	
	section {
		min-height: 80%;
	}  
	
	h3 {
		padding-top: 0%;
		margin-top: 5%;
}
	
	.stefanwiesweg-article1 h3 {
		margin-bottom: 0;
		margin-top: 0;
}
	#contact img {
		width: 3%;
		margin: 2rem auto 1rem auto;
}
}


/*** MOBILE ********************************************/


@media screen and (max-width: 520px) {

	:root {
		font-size: 16px;
	}	
		
	section {
		min-height: 100%;
	}
	
	#home {
		background-size: 100% auto;
		background-position: center top;  
	}
	
	#logo {
		width: 8rem;
		margin: 0.3rem 0 auto 1rem;
	}
	
	header nav {
		margin: auto 1rem auto 0;
	}

	header nav ul li {
  		margin-left: .5rem;
	}

	
	#about img {
		width: 50%;
	}

	#about h4 {
		font-size: 1.8rem;
		line-height: 2.0rem;
	}

	.about-article {
		width: 100%;		
	}
	
	.ul-custom {
		padding: 0;
	}
	
	.ul-custom li {
		line-height: 2.0rem;
		font-size: .95rem;
	}

	.work-flexelement {
		width: 90%;
	} 
	
	.work-flexelement img {
			width: 60%;
		}
	

	.stefanwiesweg-article {
		margin: 3% 0 10% 5%;
	}

	#contact img {
		width: 8%;
		margin: 5rem auto -1.5rem auto;
	}
	
}

@media screen and (max-width: 520px) and (orientation:portrait) {
	
	section {
		min-height: 70%;
	}  
	
}