CSS Styles für LEO

Allgemeine Stile

body { margin: 0; font: 1em/1.5 Roboto, sans-serif; background: #efefef }
img { width: 100%; height: auto}
h1, h2, h3, h4, h5, h6 { font-weight: 400; }
p, li { color: #777; }


@font-face {
    font-family:'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), 
    url(fonts/roboto-v18-latin/roboto-v18-latin-regular.woff2) format('woff2'),
    url(fonts/roboto-v18-latin/roboto-v18-latin-regular.woff) format('woff');
}

@font-face {
    font-family:'Roboto';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), 
    url(fonts/roboto-v18-latin/roboto-v18-latin-300.woff2) format('woff2'),
    url(fonts/roboto-v18-latin/roboto-v18-latin-300.woff) format('woff');
}

Banner Titel und Untertitel

#banner .site-title {
   text-align: center; 
   margin-top: 2vh; 
   margin-bottom: 0.5em; 
   font-size: 1.6em;
}
#banner .slogan {
   text-align: center; 
   font-size: 1.2em; 
   max-width: 480px; 
   margin-left: auto; 
   margin-right: auto;
}

@media only screen and (min-width: 980px ) {
   #banner .site-title { font-size: 2.5vw; margin-top: 5vh}
   #banner .slogan { font-size: 1.5vw }
}

Überschriften

Überschrift h1

Überschrift h2

Überschrift h3

Überschrift h4

Überschrift h5

Überschrift h6

Text

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

p, li {
   color: #777;
}