﻿/*  ===============================================
Stylesheet für bjr-business-concepts.de
Datei:  navigation.css
Datum:  2015-03-28
Autor:  Christian Reichelt

================================================ */


/* general sytyle */

#stoerer-2 a{
	position:fixed;
	right:-80px;
	bottom:80px;
	width:180px;
	background-color:#25359A;
	color:#ffffff;
	font-weight:bold;
	text-align:center;
	padding:0.5em 0.5em 0.5em 0.5em ;
	
	
	z-index: 10000;
	-moz-box-shadow: 0 0px 20px grey; 
	-webkit-box-shadow: 0 0 20px grey; 
	box-shadow: 0 0 20px grey;
	-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);        
-o-transform: rotate(-90deg);        
transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
		}
		
#stoerer-2 a p{
	color:#ffffff;
}
		

.mb-5 {
	margin-bottom:8em;
}

body {
font-size:100%;
margin:0em;
padding:0em;
}

h1 {
font-size:2.5em;
line-height:1.25em;
font-family:Helvetica;
font-weigth:100;
color:#25359A;
padding:1.25em;
margin:0em;
hyphens: auto;
}

h2 {
display:block;
font-size:1.563em;
line-height:1.2em;
font-family:Helvetica;
font-weight:100;
color:#25359A;
margin:0em;
padding:0.5em 0em 1.25em 1.25em;
text-align:left;
hyphens: auto;

}

h3 {
display:block;
background:#666666;
font-size:1.13em;
line-height:1.3em;
font-family:Helvetica;
font-weight:100;
color:#ffffff;
margin-top:0.5em;
padding:1.25em;
text-align:left;
hyphens: auto;

}


p {
line-height:1.25em;
font-family:Helvetica;
font-weight:100;
color:#666666;
margin:0em;
padding:1.25em;
text-align:justify;
}


ul {
margin:0px;
padding:0px;
}

li {
list-style:none;
font-family:Helvetica;
font-weight:100;
color:#666666;
line-height:1.25em;
margin:0em 0em 0.2em 0em;
padding:0em;
text-align:left;
}

#impressum #main li {
list-style:none;
font-family:Helvetica;
font-weight:100;
color:#666666;
line-height:1.25em;
margin:0em 0em 0.2em 0em;
padding:0em;
text-align:justify;
}


img {
width:90%;
height:auto;
max-width:100%
}

a {
text-decoration:none;
color:#25359A;
}

/* on top bar */

#menuebar {
display: block;
background:#ffffff;
}

#menuebar ul {
display: block;
width:2em;
padding:0.9em;
}

#menuebar ul li {
display:inline;
}


#menuebar ul li a.menuebutton {
display:none;
}


/* header */
header {
display:block;
background:#ffffff;
text-align:center;
}

header img {
max-width:560px;
padding-bottom:5px;
}


/* navigation */

nav {
width:100%;
display:block;
height:2.5em;
background:#ffffff;
font-size:80%;
text-align:center;
box-shadow:0px 10px 5px -10px #4c4948;
  margin:0 auto;
}

nav ul {
display:block;
font-weight:lighter;
  text-transform: uppercase;
  margin:0 auto;

}

nav ul li {
display:inline;
  margin:0 auto;
}

nav ul li a {
color:#454040;
font-size:1.125em;
line-height:2.5em;
padding:0.563em 0.938em 0.375em 0.938em;
transition:background 0.2s;
-webkit-transition:background 0.2s;
}

#index nav ul li a:hover,
#index nav ul li a:focus,
#index nav ul li a:active,
nav ul li a:hover,
nav ul li a:focus,
nav ul li a:active {
background-color:aliceblue;
border-bottom: 0.188em solid #0C73C7;
}
/*
nav ul li a:active {
border-bottom: 0.188em solid #0C73C7;
}


/* content area */


#main {
display:block;
width: 96%;
max-width:980px;
margin:1.25em auto;
padding:0em 3.666% 0em 3.666%;
}

#main a {
text-decoration:none;
}


#main article {
display:inline-block;
width:100%;
background:#fff;
vertical-align:top;
margin:0em auto;
padding:0em;
text-align:center;
}

#main ul {
list-style-type:square;
display:inline-block;
vertical-align:top;
width:65.3%;
margin:0.25em 0em 0.25em 0em;
padding:0em;
}

#main ul li {
list-style-type:square;
margin:0em 0em 0.75em 0em;
}


#main article img {
max-width:100%;
box-shadow:0px 0px 10px -5px #4c4948;
margin:0 auto;
}

/* zweispaltiges Layout */

#chapter_1,
#chapter_3 {
display:inline-block;
width: 50%;
max-width:465px;
margin-right: 2.33%;
vertical-align:top;
border-top: 0.188em solid #0C73C7;
}


#chapter_2,
#chapter_4 {
display:inline-block;
width: 50%;
max-width:465px;
margin-left: 2.33%;
vertical-align:top;
border-top: 0.188em solid #0C73C7;
}


#chapter_1 article ul,
#chapter_2 article ul,
#chapter_3 article ul,
#chapter_4 article ul,
#chapter_5 article ul {
list-style-type:square;
display:inline-block;
vertical-align:top;
width:80%;
margin:0.25em 0em 0.25em 0em;
padding-left:1.25em;
padding-right:1.25em;
}

#chapter_1 article ul li,
#chapter_2 article ul li,
#chapter_3 article ul li,
#chapter_4 article ul li,
#chapter_5 article ul li {
list-style-type:square;
margin:0em 0em 0.75em 0em;
}


#chapter_1 article img,
#chapter_2 article img,
#chapter_3 article img,
#chapter_4 article img,
#chapter_5 article img {
display:block;
max-width:100%;
box-shadow:0px 0px 10px -5px #4c4948;
margin:0px auto;
}


#chapter_5 {
display:inline-block;
width: 60%;
max-width:560px;
margin:0 auto;
padding:1.25em;
vertical-align:top;
}




/* aside */

#main aside {
display:inline-block;
width:30.6%;
margin-left:3%;
margin-top:0px;
padding:1.3em;
vertical-align:top;
border:1px solid #CCCCCC;
}

#main aside section {
margin-bottom:1.563em;
background:#ffffff;
border-bottom: 0.188em solid #0C73C7;
}

#main aside img {
display:block;
max-width:100%;
box-shadow:0px 0px 10px -5px #4c4948;
margin:0px auto;
}

#main aside p {
display:block;
font-size:75%;
max-width:100%;
margin:0px auto;
}


/*
#main aside h2 {
padding:0em 1.875em 1.25em 2.5em;
}
*/

#main aside ul {
padding:0.5em 1.875em 1.25em 3.5em;
}

/* footer */


footer {
display:block;
width:100%;
background:#666666;
  font-weight:bolder;
  color:#ffffff;
  padding: 5px 20px 20px 0;
    margin-top: 20px;
}

footer ul {
display:block;
width:100%;
max-width:960px;
text-align:left;
margin:0em auto;
}

footer ul li {
list-style-type:square;
display:inline;
color:#ffffff;
margin-right:0;
}

footer ul li a {
color:#ffffff;
}


/* = address-block =*/
  
#adress {
font-size:80%;
display:block;
  color:#ffffff;
width: 65.3%;
max-width:980px;
margin:1.25em auto;
padding:0em;
}

#adress p {
padding:0em 0em 0.8em 0px;
  color:#ffffff;
}


footer #adress ul {
margin:0em 1.2em 1.2em  0px;
}

footer #adress ul li {
list-style-type:square;
display:inline-block;
color:#ffffff;
margin-right:1.2em;
}

#adress img {
  padding: 4px 0px 10px 0px;
}

#adress h3 {
  padding: 0px;
  color:#ffffff;
  background-color:transparent;
}



/* mobile style */

@media screen and (max-width:800px) {
body {
	font-size:80%;
margin:0 auto;
padding-right:5%;
}
}
@media screen and (max-width:800px) {
#main aside, #main article,
#chapter_1,
#chapter_2,
#chapter_3,
#chapter_4,
#chapter_5 {
width:100%;
display:block;
margin:0.625em auto;
}
}

@media screen and (max-width:1050px) {
body {
	font-size:90%;
}

header {
	padding-bottom:0.5em;
}

#chapter_1,
#chapter_2,
#chapter_3,
#chapter_4,
#chapter_5 {
width:100%;
max-width:980px;
display:block;
margin:0.625em auto;
}


@media screen and (min-width:1050px) {
	nav.nav {
	display:block !important;
}
}

@media screen and (max-width:1050px) {

	#menuebar ul li a.menuebutton {
	display:inline;
}

nav {
	display:none;
	height:auto;
box-shadow:0px 10px 5px -10px #ffffff;
  margin:0 auto;
  margin-top:3em;
padding:0em 3.666% 0em 3.25%;
}

nav ul {
width:96%;
display:block;
  margin:0 auto;
  padding:0em;
}

nav ul li {
width:96%;
display:block;
  margin:0 auto;
  padding:0em;
height:5em;
}


nav ul li a {
	text-align:center;
	display:block;
	width:96%;
  padding:0em;
  margin:0 auto;
}

	
}



