/*
Wenn Sie schlau genug wären dies selbst zu Programmieren dann müssten Sie nicht versuchen dies hier zu kopieren!
Da Sie aber wahrscheinlich nicht schlau genug sind werden Sie das was hier steht auch nicht verstehen!
*/


<style>





/* Kopf */

 img {
    max-width: 100%;
  }



kopf {
display:block;
background:#6F6;
text-align:left;
}
kopf ul {
display:block;
width:100%;
max-width:980px;
text-align:left;
margin:0px auto;
}
kopf ul li {
display:inline;
font-size:0.8em;
line-height:2.8em;
color:#000000;
padding:0em 0.625em 0em 0.625em;
}
kopf ul li a {
color:#6F6;
}


/* Gereral Style*/
/*
body {
background: #DCDCDC;
font-size:100%
font-weight: bold;
margin:0em;
padding:0em;
}
*/
h1 {
font-size:1.5em;
line-height:1.8em;
font-family:Arial;
font-weight: bold;

color:#000000;
margin:0em;
}
h2 {
font-size:1.563em;
line-height:0.8em;6F6
font-family:Arial;
font-weight: bold;
color:#000000;
margin:0em;
padding:1.25em;
text-align:left;
}

p {
line-height:1.25em;
font-family:Arial;
font-weight: bold;
margin:0em;
padding:1.25em;
text-align:left;
}

ul {
margin:0px;
padding:0px;
}
li {
list-style:square;  
font-family:Arial;
font-weight: bold;
color:#2F2D2C;
line-height: 1.25em;
margin:0em;
padding:0em;
margin:0.313em 0em 0.313em 0em;
}



a {
text-decoration: none;
}
/*on top Bar */


#menubar img {
	display: block;
width:0%; /* Hier die größe auf 0% wenn klein/ unsichtbar oder 90% für Sichtbar */
height:auto;
	
/* max-width:560px; */
border-radius: 25px;
max-width: 100%;
}


#menubar {
display:block;
margin: 0 auto;
}
#menubar ul {
display:block;
width: 90%;	
padding:0.2em;
}
#menubar ul li{
display:inline;
}

/* Header */
header {
display:none;
background: #6F6;
text-align: left;
}
/* nav */
nav {
display:none;
height:2.5em;
background:#FFFFFF;
text-align:left;
}
nav ul {
display:none;
}
nav li {
display:inline;
margin:0em 0.188em 0em 0.188em
}
nav ul li a {
color:#454040;
font-size:1.125em;
line-height:2.5em;
padding:0.563em 0.938em 0.375em 0.983em;
transition: backround 10.2s;
-webkit-transition:background 0.2s;
}
/*----------------------*/
nav ul li a:hover {
background: #DBD9D8;
border-bottom: 0.188em solid #6F6;
}
nav ul li a.active {
border-bottom: 0.188em solid #6F6;
}
/* Content */
#main {
display:block;
width:100%;
max-width:980px;
margin:1.25em auto;
padding:0em;
}
#main article {
display:inline-block ;
width:65.3%;
background:#FFFFFF;
vertical-align:top;
margin:0em;
padding:0em;
text-align:left;
}

img.B1 {
width:90%;
height:auto;
max-width:100%;
}


img.Zooma1 {
 transition: transform 0.8s;
 -moz-transition: transform 0.8s;
 -webkit-transition: transform 0.8s;
 -o-transition: transform 0.8s;
 -ms-transition: transform 0.8s;
}
img.Zooma1:hover {


 cursor: zoom-in;
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 
transform: translate(+30%,+0%) scale(1.5, 1.5);


 -moz-transform:  translate(+30%,+0%) scale(1.5, 1.5);
 -webkit-transform: translate(+30%,+0%) scale(1.5, 1.5);
 -o-transform:  translate(+30%,+0%) scale(1.5, 1.5);
 -ms-transform:  translate(+30%,+0%) scale(1.5, 1.5);






}

#main article img {
	
width:90%;
height:auto;
max-width:100%;	
	
	
/* max-width:560px; */
box-shadow:-10px -10px 25px -5px #000000;
border-radius: 25px;
}
#main aside {
display: inline-block;
width:30.6%;
margin-left:3%;
padding:0em;
vertical-align:top;
}
#main aside section {
margin-top: bottom;
background:#FFFFFF;
border-bottom: 0.188em solid #6F6;
}
#main article h2 {
padding:1em 1.8em 1em 1.8em;
}
#main aside section ul {
padding:0em 1.875em 1.25em 2.5em;
}
#main aside ul {
padding:0em 1.875em 1.25em 2.5em;
}
/* Footer */
footer {
display:block;
background:#6F6;
text-align:right;
}
footer ul {
display:block;
width:100%;
max-width:980px;
text-align:right;
margin:0px auto;
}
footer ul li {
display:inline;
font-size:0.8em;
line-height:2.8em;
color:#000000;
padding:0em 0.625em 0em 0.625em;
}
footer ul li a {
color:#6F6;
}
/* Mobile Style */

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

font-size:120%;
font-weight: bold;
text-align:left;
}


 


}




@media screen and (max-width:800px) {
body {
/*font-size:90%;*/
text-align:left;
}
}
@media screen and (max-width:600px) {
#main aside, #main article {
width:100%;
display:block;
margin:0.625 0em 0.625em 0em;
text-align:left;
}
}
@media screen and (max-width:550px) {
body {
/*font-size:86%;*/
}
}
@media screen and (min-width: 550px) {
nav.nav {
display:block !important;
}
}
@media screen and (max-width: 550px) {
nav ul {
display:block;
}
header {
display:block;
font-size:70%;
background: #6F6;
text-align:center;
}
nav {
display:block;
text-align:left;
height:auto;
}
nav ul li {
display:block;
margin:0.3em 0em 0.3em 0em;
}
display:block;
}





#samplecontent {
}

#samplecontent table td, #samplecontent table th {
padding: 2px 10px;
border: 1px solid #000;
}
#samplecontent table th {
background-color: #666;
color: #fff;
}
#samplecontent table tr:nth-child(1n+2) {
background-color: #fff;
color: #000;
}
#samplecontent table tr:nth-child(2n+3) {
background-color: #ccc;
color: #000;
}
#samplecontent table tr:hover {
background-color: #f00;
color: #fff;
}


#borderDemo {
border: 5px solid #cf6;
border-radius: 16px;
}

#borderDemoRED {
border: 5px solid #f00;
border-radius: 16px;
}

</style>