body { height: 100%; width:100%; margin: 0; padding: 0; color:#404040; font-family: "Trebuchet MS", Helvetica, sans-serif; font-size: 1.2rem; background-image:url('../img/feuer.webp'); background-position:center bottom; background-size: 100%; 	background-repeat: no-repeat; font-family: Montserrat;}

a { color:#000000; text-decoration: none; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; }
a:hover { color:#404040; }
a.navigation { color:#FFFFFF; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; }
a.navigation:hover { color:#404040; }
a.hauptnavigation { color:#FFFFFF; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; background-image:url('../img/stripeblack.webp'); background-size:cover; background-position: center; }
a.hauptnavigation:hover { color:#FFFFFF; }
a.footernavigation { color:#000000; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; }
a.footernavigation:hover { color:#404040; }



@font-face { font-family: Montserrat; src: url(../Montserrat-Black.ttf); }

h1 { text-align:center; font-size: 3rem; 65%; background-image:url('../img/logobackground.webp'); background-size: 850px; background-position:center center; background-repeat: no-repeat; }
h2 { text-align:center; font-size: 2rem; }
h3 { color:#FFFFFF; font-size: 1.8rem; }

header { width: 100%; height: calc(100vh - 40px); margin: auto; padding-bottom: 0px; text-align:center; background-image:url('../img/IMG_5607.webp'); background-position: center top; background-size: cover; background-attachment: fixed; position:relative; z-index: 99; }

nav { width:100%; height:40px; position:sticky; top: 0; margin: 0; text-align: center; background-color:rgba(0,0,0,1); font-size: 1.2em; font-family: Montserrat; }
/* top:0px; z-index: 98; */

footer { margin: 0 auto; padding:20px 0px; text-align:center; font-size: 0.8em; color:#000000; }

.parallax1 { width: 100%; margin: 0 auto; height: 300px; background-image: url('../img/IMG_5591.webp'); background-size: cover; background-attachment: fixed; background-position: center; }

.parallax2 { width: 100%; margin: 0 auto; height: 300px; background-image: url('../img/IMG_5178.webp'); background-size: cover; background-attachment: fixed; background-position: center; }

.parallax3 { width: 100%; margin: 0 auto; height: 300px; background-image: url('../img/IMG_5400.webp'); background-size: cover; background-attachment: fixed; background-position: center; }

section { width:100%; padding-top: 25px; padding-bottom: 25px; display:inline-block; margin: 0 auto; text-align:center; }
section.venceremos { width:100%; font-size:0.9em; display: inline-block; text-align: center; background-image: url('../img/backgroundr.webp'); background-size: contain; background-position: center; color:#FFFFFF; font-size: 1.8rem; }
section.dates { width:95%; font-size:0.9em; display: inline-block; text-align: center; }


article { padding:25px; font-size:0.9em; }
article.venceremos { margin-top: 70vh; }

div.flex { display: flex; flex-wrap : wrap; align-items: center; }
div.inside { margin: auto; }

img { border:0; }
img.logo { width:60%; margin-top: 10%; }
img.footer { margin-right:5px; margin-left:5px; margin-bottom:20px; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; }
img.footer:hover { opacity: 0.4; filter: alpha(opacity=40); }
img.venceremos { margin: auto; display:block; width:100%; max-width: 700px; }
img.albums { margin: auto; display:block; width:100%; max-width: 400px; }

@media only screen and (min-width: 200px) and (max-width: 930px) {

h1 { font-size: 3rem; }
section.venceremos { background-size: contain; }
img.logo { width:85%; }

}

@media only screen and (min-width: 200px) and (max-width: 500px) {

header { height: 50vh; }
h1 { font-size: 2rem; }
img.logo { width:85%; }
nav { font-size: 1.0em; }

}