diff --git a/css/main.css b/css/main.css index c15d885..884b8f5 100644 --- a/css/main.css +++ b/css/main.css @@ -1,9 +1,10 @@ body { - background: #fff; + background: url(http://www.piratenpartei.de/wp-content/themes/piratenkleider_1_2/assets/bg-tags.png) #fff; color: #2B2926; font-family: 'Open Sans', 'Opensans', sans-serif, sans; font-size: 14px; line-height: 1.5; + width: 1005px; } h1, h2, h3, h4, h5, h6 { @@ -13,9 +14,26 @@ h1, h2, h3, h4, h5, h6 { border-bottom: 1px dotted #bbb; } +#logowrapper { + position: absolute; + z-index: 1000; + background: #fff; + display: inline; + padding: 10px; + right: 20px; + top: 14px; + box-shadow: 1px -2px 1px #222; + transform:rotate(45deg); + -webkit-transform:rotate(3deg); +} + +#logo { + +} + header { height: 112px; - background: #222; + background: #FFbb00; } header > * { @@ -67,7 +85,9 @@ body > [role="slider"] { position: relative; height: 360px; width: 100%; - background: url(../img/erfolge.jpg) #4D535F no-repeat center; + background: url(../img/erfolge.jpg), url(http://www.piratenpartei.de/wp-content/themes/piratenkleider_1_2/assets/bg-tags_gray.jpg); + background-repeat: no-repeat, repeat; + background-position: center; } body > [role="slider"] > .box { @@ -96,10 +116,37 @@ body > [role="slider"] > .box > h1 { border-bottom: 1px dotted #fff; } -body > [role="main"] { - padding: 10px 30px; +#wrapper { + position: relative; + margin: 0 23px; + padding: 10px 0; + min-height: 500px; + background: #fff; +} + +#wrapper > aside { + float: right; + clear: both; + width: 30%; + padding: 10px; + min-height: 500px; + height: 100%; + border-left: 3px solid #eee; +} + +#wrapper > div { + padding: 0 20px; + width: 60%; } footer { - background: #ccc; + background: url(http://www.piratenpartei.de/wp-content/themes/piratenkleider_1_2/assets/bg-tags_gray.jpg); +} + +footer > p { + margin: 0 23px; + color: #fff; + background: rgba(0,0,0,0.5); + min-height: 180px; + padding: 10px 20px; } diff --git a/index.html b/index.html index 63eb7a9..0f098b5 100644 --- a/index.html +++ b/index.html @@ -19,9 +19,11 @@ +
+ +

- Lorem ipsum dolor sit amet

@@ -43,22 +45,28 @@

WER WIR SIND

DIE JUNGEN PIRATEN UND WAS SIE WOLLEN
-
-

MISSION POSSIBLE

-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla consectetur dictum est vitae tristique. Nulla dictum pretium mi. Morbi egestas egestas tempus. Sed fringilla erat quis nisl gravida at sollicitudin sapien eleifend. Nullam sit amet nunc felis. Cras neque risus, varius ut laoreet vel, convallis non dui. Curabitur quis ligula dui, ut vestibulum enim. Fusce ut augue eu magna commodo auctor et vitae velit. Aliquam pharetra metus sit amet neque dictum sed euismod purus condimentum. Nullam quis mauris in libero rhoncus viverra. Fusce ullamcorper magna ut dui tincidunt eget dictum lacus condimentum. Nunc et enim enim, id consectetur metus.

+
+ -

UNTERÜBERSCHRIFT

-

In congue consequat rutrum. Phasellus nec leo nunc. Donec eu tellus sed enim sagittis commodo tristique vitae augue. Cras ultricies interdum magna eu pretium. Fusce sollicitudin orci nec lorem aliquam vehicula. Integer elementum consequat massa, at lacinia enim fermentum dapibus. Duis sodales mauris ut massa faucibus luctus varius turpis dictum. Proin sed nulla in dui suscipit vehicula a quis arcu. Vivamus at erat magna. In placerat vestibulum odio quis tincidunt. Suspendisse varius rutrum velit, sit amet bibendum eros volutpat in. Donec mattis, nibh eu ultrices sagittis, diam nulla facilisis orci, ut varius tortor libero id ante. Integer aliquam suscipit accumsan.

+
+

MISSION POSSIBLE

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla consectetur dictum est vitae tristique. Nulla dictum pretium mi. Morbi egestas egestas tempus. Sed fringilla erat quis nisl gravida at sollicitudin sapien eleifend. Nullam sit amet nunc felis. Cras neque risus, varius ut laoreet vel, convallis non dui. Curabitur quis ligula dui, ut vestibulum enim. Fusce ut augue eu magna commodo auctor et vitae velit. Aliquam pharetra metus sit amet neque dictum sed euismod purus condimentum. Nullam quis mauris in libero rhoncus viverra. Fusce ullamcorper magna ut dui tincidunt eget dictum lacus condimentum. Nunc et enim enim, id consectetur metus.

-

Vivamus ultricies purus ut eros imperdiet elementum. Aliquam rhoncus aliquet mollis. Vivamus consectetur sagittis urna, id pellentesque nunc hendrerit quis. Vestibulum semper fringilla egestas. Integer consectetur eleifend ipsum, nec faucibus enim porta quis. Nunc tincidunt, magna quis luctus interdum, nulla velit sodales neque, id faucibus mauris lorem sed tortor. Curabitur blandit cursus sapien, ut lacinia odio accumsan ac. Aenean lorem augue, hendrerit a accumsan nec, pellentesque quis sapien.

+

UNTERÜBERSCHRIFT

+

In congue consequat rutrum. Phasellus nec leo nunc. Donec eu tellus sed enim sagittis commodo tristique vitae augue. Cras ultricies interdum magna eu pretium. Fusce sollicitudin orci nec lorem aliquam vehicula. Integer elementum consequat massa, at lacinia enim fermentum dapibus. Duis sodales mauris ut massa faucibus luctus varius turpis dictum. Proin sed nulla in dui suscipit vehicula a quis arcu. Vivamus at erat magna. In placerat vestibulum odio quis tincidunt. Suspendisse varius rutrum velit, sit amet bibendum eros volutpat in. Donec mattis, nibh eu ultrices sagittis, diam nulla facilisis orci, ut varius tortor libero id ante. Integer aliquam suscipit accumsan.

-

Sed in enim a mauris feugiat dignissim ut quis lectus. Aenean pretium semper porttitor. Sed id lectus quam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin in enim eu nulla placerat sodales. Sed aliquam diam sit amet nibh tristique ac tempus elit varius. Duis volutpat ullamcorper quam vitae consectetur. Curabitur a pretium eros. Mauris in est vel quam malesuada commodo. Duis pulvinar magna a ligula fermentum non ullamcorper sem euismod.

+

Vivamus ultricies purus ut eros imperdiet elementum. Aliquam rhoncus aliquet mollis. Vivamus consectetur sagittis urna, id pellentesque nunc hendrerit quis. Vestibulum semper fringilla egestas. Integer consectetur eleifend ipsum, nec faucibus enim porta quis. Nunc tincidunt, magna quis luctus interdum, nulla velit sodales neque, id faucibus mauris lorem sed tortor. Curabitur blandit cursus sapien, ut lacinia odio accumsan ac. Aenean lorem augue, hendrerit a accumsan nec, pellentesque quis sapien.

-

Maecenas vehicula luctus velit at adipiscing. Donec massa tortor, adipiscing vitae posuere nec, aliquet a orci. Sed lorem lorem, gravida non ultricies quis, vestibulum quis urna. Maecenas eu velit mi. Sed vitae dui lorem, et fermentum leo. Aliquam erat volutpat. Vivamus dictum, nunc quis bibendum aliquet, metus lacus blandit metus, in congue mauris dui nec nunc.

-
+

Sed in enim a mauris feugiat dignissim ut quis lectus. Aenean pretium semper porttitor. Sed id lectus quam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin in enim eu nulla placerat sodales. Sed aliquam diam sit amet nibh tristique ac tempus elit varius. Duis volutpat ullamcorper quam vitae consectetur. Curabitur a pretium eros. Mauris in est vel quam malesuada commodo. Duis pulvinar magna a ligula fermentum non ullamcorper sem euismod.

+

Maecenas vehicula luctus velit at adipiscing. Donec massa tortor, adipiscing vitae posuere nec, aliquet a orci. Sed lorem lorem, gravida non ultricies quis, vestibulum quis urna. Maecenas eu velit mi. Sed vitae dui lorem, et fermentum leo. Aliquam erat volutpat. Vivamus dictum, nunc quis bibendum aliquet, metus lacus blandit metus, in congue mauris dui nec nunc.

+
+
+