/*
www.pkdesign.de | Template für Website Baker 2.8
CSS fuer www.lebensweg-zukunft.de
Für den Ausdruck bitte anpassen mit: display: none
*/

/********* B E G I N N **********/
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
@import url(http://fonts.googleapis.com/css?family=Roboto);

@font-face {
 	font-family:'FontAwesome';
	src:url('font/fontawesome-webfont.eot?v=4.2.0');
	src:url('font/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'),
	url('font/fontawesome-webfont.woff?v=4.2.0') format('woff'),
	url('font/fontawesome-webfont.ttf?v=4.2.0') format('truetype'),
	url('font/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
}


/****************************************/
/* Seiteneinstellung allgemein          */
/****************************************/	
header, section, nav, nav-sub, button, links, content, rechts, footer {
	display: block;
}

body {
	margin: 0px;
	padding: 0px;
	color: #383838;
	background: #fcfcfc;	
   font-family:  'Open Sans', sans-serif;
   font-size: 1em;   
 	overflow-y: scroll; 
}

	
/* Überschriften H1 - H6 */
h1 {color: #f69b20; line-height: 1.1em}
h2 {color: #f69b20;}
h3 {color: #f69b20;}		
h4 {color: #f69b20;}
h5 {color: #f69b20;}
h6 {color: #f69b20;}

#footer h1 {
	color: #f5f5f5;
	font-size: 3em;
	font-style: italic;
	margin: 10px;
	}


/* Neutralisation der Containerausrichtung */
.clear{ clear: both; }

/* Hervorhabung z.B. Suchseite Ausgabe */
.highlight {
	background-color: transparent;
	color: #b71132;
	font-weight: bolder;
	text-transform: none; 
}

/* Kein gestrichelter Rand um Links */
a:focus {
	outline: none;
	-moz-outline: none; /*damit verstehen es alle Gecko-Browser */
}

/* Standardlinks */
a:link, a:visited, a:active {
	color: #4169e1;
	text-decoration: none;
	font-weight: normal;
}
a:hover {
	color: navy;
	text-decoration: none;
}

/* Links Inhalt u. Block2 */
#content a:link, #content a:visited, #content a:active,
#links .block a:link, #links .block a:visited, #links .block a:active {
	color: #4169e1;
	text-decoration: none;
	font-weight: normal;
	background: transparent;
/*	padding: 7px 12px !important; */	
	line-height: 2.4em;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;		
}
#content a:hover, 
#links .block a:hover {
	color: #ba4d1c;
	text-decoration: none;
}


/* Links in der Fusszeile */
a.footerlink:link, a.footerlink:visited { 
	font-size:12px; 
	font-family: Roboto;
	font-weight: normal; 
	color: gray;
}
a.footerlink:hover {
	font-size:12px; 
	font-weight: normal; 
	color: #b22222;
}


/* Rundung der Kanten */
.rund {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border: 0px solid transparent;	
}

/* Schatten allgemein */
.schatten {
	-webkit-box-shadow: 0px 0px 18px rgba(50, 50, 50, 0.10);
	-moz-box-shadow:    0px 0px 18px rgba(50, 50, 50, 0.10);
	box-shadow:         0px 0px 18px rgba(50, 50, 50, 0.10);
}

.verlauf {
background: rgb(239, 239, 239);
background: -moz-linear-gradient(90deg, rgb(239, 239, 239) 13%, rgb(255, 255, 255) 51%);
background: -webkit-linear-gradient(90deg, rgb(239, 239, 239) 13%, rgb(255, 255, 255) 51%);
background: -o-linear-gradient(90deg, rgb(239, 239, 239) 13%, rgb(255, 255, 255) 51%);
background: -ms-linear-gradient(90deg, rgb(239, 239, 239) 13%, rgb(255, 255, 255) 51%);
background: linear-gradient(180deg, rgb(239, 239, 239) 13%, rgb(255, 255, 255) 51%);
}


/****************************************/
/* box Seiteneinstellung allgemein      */
/****************************************/
/* aussen page 1200px */	
#wrapper {
	margin: 2% auto;
	width: 1350px;
	max-width: 95%;
	height: auto;
	background-color: #fcfcfc;
	border: 15px solid #ffffff;
}

img {
	max-width: 100%;
	height: auto;
	border: none;
}

article {
	padding: 15px;
	font-size: 0.7em;
	text-align: justify; 
}

.headerpic {
	width: 100%;
	height: auto;
}

/****************************************/
/* LINKE SPALTE                         */
/****************************************/	
/* box linke spalte */
#links {
	float: left;
	width: 20%;
}

#paybutton {
   text-align: center;
   margin-top: 55px;
}


/****************************************/
/* RECHTE SPALTE INHALT                 */
/****************************************/	
/* box mit text-inhalt */
#content {
	float: left;
	width: 57%;
	padding: 10px 30px;
	line-height: 1.5em;	
}

/****************************************/
/* RECHTE SPALTE                        */
/****************************************/	
/* box rechte spalte */
#rechts {
	float: left;
	width: 18%;
	padding-top: 3%;
}


/****************************************/
/* Fusszeile                            */
/****************************************/
/* box Footer */
#footer {
	margin-top: 10px;
	padding: 18px;
	border-top: 1px dotted #eaeaea;
	text-align: center;
	background-color: #d7d7d7;
}

/* box footertext */
#by {
	font-size: 0.9em;
}


/*****************************************/
/* Menue horizontal im footer            */
/*****************************************/	
/* Menü horizontal */
#menue-horizontal {
	background-color: transparent;
}
#menue-horizontal ul{
	list-style-type: none;
	float: right;
}
#menue-horizontal li {
	display: inline;
	margin: 0px;
	padding: 0px;
}
#menue-horizontal a, 
#menue-horizontal a:hover {
	color: #808080;
	padding: 6px 8px;
	margin: 3px 0; 
	font-size: 13px;
	font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
	display: inline-block;
}
/* Link hover und gewählt */
#menue-horizontal a:hover,
#menue-horizontal a.menu-current {
	color: black;
	background-color: white;
	border-radius: 2px; 
}


/****************************************/
/* Menue vertikal links neben Inhalt    */
/****************************************/	
/* Sliderbox */
#boxtog {
	position: relative;
	z-index: 30;
}
/* box vertikal */
#box-menue {
	margin: 31px auto;
	width: 100%;
	background-color: #eaeaea; 
	border: 0px;
	background-color: transparent;
}
#box-menue ul {
	list-style-type: none;
}


/****************************************/
/* SUCHEN                               */
/****************************************/	
/* box suchen */
#suchen {
	width: 100%;
	background-color: black;
}
/* suchformular eingabefeld*/
#suchen input {
	color: #f5f5f5;
	background-color: transparent;
	padding: 12px 16px;
	margin: 3px;
	width: 82.7%;
	border: none;
}


/****************************************/
/* SCROLL-TOP                           */
/****************************************/
.scrollup {
    display: block;
    margin-bottom: 0.7%;
}

.scrollup, .scrolldown {
	z-index: 99999;
	opacity: 0.7;
	margin: 0px;
	padding: 0px 7px;
	position: fixed;
	bottom: 65px;
	right: 1%;
	display: none;
 /*  text-indent: -9999px; */
	background-color: #f5f5f5;
 	-moz-border-radius-topleft: 50%;
	-webkit-border-top-left-radius: 50%;
 	border-top-left-radius: 50%;
	-moz-border-radius-topright: 50%;
	-webkit-border-top-right-radius: 50%;
	border-top-right-radius: 50%;
	-moz-border-radius-bottomright: 7px;
	-webkit-border-bottom-right-radius: 7px;
	border-bottom-right-radius: 7px;
	-moz-border-radius-bottomleft: 7px;
	-webkit-border-bottom-left-radius: 7px;
	border-bottom-left-radius: 7px;
}
.scrollup:before  {
 	font-family: 'FontAwesome';	
	content: "\f106";
	color: #454545;
	font-size: 2em;
}
.scrollup:hover:before, 
.scrolldown:hover:before {
	color: #b22222;
}
.scrollup:hover,
.scrolldown:hover {
  cursor: pointer;
  opacity: 1.0;
}


/****************************************/
/* SCROLL-Down                           */
/****************************************/
.scrolldown {
 	bottom: 3%;
	-moz-border-radius-topleft: 7px;
	-webkit-border-top-left-radius: 7px;
 	border-top-left-radius: 7px;
	-moz-border-radius-topright: 7px;
	-webkit-border-top-right-radius: 7px;
	border-top-right-radius: 7px;
	-moz-border-radius-bottomright: 50%;
	-webkit-border-bottom-right-radius: 50%;
	border-bottom-right-radius: 50%;
	-moz-border-radius-bottomleft: 50%;
	-webkit-border-bottom-left-radius: 50%;
	border-bottom-left-radius: 50%; 
}
.scrolldown:before {
 	font-family: 'FontAwesome';	
	content: "\f107";
	color: #454545;
	font-size: 2em;
}


/********* E N D E **********/


/*****************************************************/
/********* B E G I N N Screen Einstellungen **********/
/*****************************************************/

@media all {
	#div,#wrapper,#inks,#rechts,#content, a {
	transition:all 0.5s linear;
  -o-transition:all 0.5s linear;
  -moz-transition:all 0.5s linear;
  -webkit-transition:all 0.5s linear;
	}
}


/****************************************/
/* 1024px                               */
/****************************************/	
@media only screen and (max-width: 1260px) {
	/* box mit text-inhalt */
	#content {
		width: 56%;
	}
}


/****************************************/
/* 1024px                               */
/****************************************/	
@media only screen and (max-width: 1024px) {
	/* box mit text-inhalt */
	#content {
		font-size: inherit;
		width: 72%;
	}
}


/****************************************/
/* 801px                                */
/****************************************/	
@media only screen and (max-width: 801px) {

	#wrapper {
    	border: 2px solid #FFF;
   }

	#links, #content, #rechts {
		float: none;
		width: auto;
		padding: 5px 25px;
	}

	#box-menue {
	background-color: #eaeaea; 
	}
	
	#menue-horizontal {
    	margin: 10px 0;
    	text-align: center;
	}	
	#menue-horizontal ul {
		float: none;
		margin-bottom: 10px;    	
	}
	#suchen input {
    	width: 80%;
	}			
}


/****************************************/
/*              */
/****************************************/	
@media only screen and (max-width: 641px) {


}

/********* E N D E **********/