102 lines
3.7 KiB
CSS
102 lines
3.7 KiB
CSS
|
/** GRID AND LAYOUT */
|
||
|
|
#page { margin: 0px auto; padding: 0 0.75em; max-width: 62.5em; }
|
||
|
|
|
||
|
|
.header { margin: 62px 0 0 0; padding:0; width:100%; }
|
||
|
|
.header .title { width: 59.200%; margin-left: 10.200%; float: left; }
|
||
|
|
.header .subnavigation { width: 28.600%; float: right; }
|
||
|
|
|
||
|
|
.entry { margin-top: 20px; }
|
||
|
|
.entry .navigation { width: 8.200%; float: left; }
|
||
|
|
.entry .content { width: 89.800%; float: right; }
|
||
|
|
|
||
|
|
.content .main { width: 65.924%; float: left; }
|
||
|
|
.content .meta { width: 31.849%; float: right; }
|
||
|
|
|
||
|
|
.entry .main .left-subsection { width: 13.851%; float: left; }
|
||
|
|
.entry .main .right-subsection { width: 82.770%; float: right; }
|
||
|
|
|
||
|
|
.footer { width: 100%; margin-top: 20px; }
|
||
|
|
|
||
|
|
/** FLUID IMAGES */
|
||
|
|
|
||
|
|
img, object { border: none; max-width: 100%; height: auto; }
|
||
|
|
|
||
|
|
/** UTILS */
|
||
|
|
|
||
|
|
.nettoyeur { clear: both; }
|
||
|
|
.spacer { border-top: thin solid #dddddd; margin: 3em 0 1em 0; }
|
||
|
|
|
||
|
|
/** BACKGROUND */
|
||
|
|
|
||
|
|
body { background-image: url(img/background.jpg); background-repeat: repeat-x; background-position: top; }
|
||
|
|
|
||
|
|
/** TYPO AND COLORS */
|
||
|
|
body { font: normal 100%/1.375 Lucida Grande, Calibri, sans, sans-serif; }
|
||
|
|
h1 { font-size: 1.5em; line-height: 0.91667em; padding-bottom: 10px; border-bottom: thick solid #dddddd; margin: 1em 0 0 0; }
|
||
|
|
h2 { font-size: 1.3em; }
|
||
|
|
h3 { font-size: 1em; line-height: normal; margin: 1em 0 0.4em 0; }
|
||
|
|
ul { font-size: 0.875em; line-height: 1.28571; padding-left: 0px; }
|
||
|
|
li { margin-bottom: 0.42857em; display: block; margin: 1em 0 1em 0; }
|
||
|
|
|
||
|
|
.small { font-size: 0.67em; color: #999999; }
|
||
|
|
.right { text-align: right; }
|
||
|
|
|
||
|
|
a { color: darkblue; text-decoration: none; }
|
||
|
|
a:hover { color: blue; }
|
||
|
|
|
||
|
|
.subnavigation { font-size: 0.786em; }
|
||
|
|
.main { font-size: 0.857em; text-align: justify; }
|
||
|
|
.meta { font-size: 0.786em; }
|
||
|
|
.navigation { font-size: 0.786em; }
|
||
|
|
.footer { font-size: 0.714em; text-align: center; }
|
||
|
|
|
||
|
|
.main h2 { margin-top: 0px; }
|
||
|
|
.main img { padding: 1em 0 1em 0; }
|
||
|
|
.left-subsection img { padding: 0; }
|
||
|
|
.section { padding-bottom: 30px; }
|
||
|
|
.floatandpad { float: right; padding: 1em; max-width: 13.851%; }
|
||
|
|
|
||
|
|
.meta h2 { padding-bottom: 10px; border-bottom: thick solid #dddddd; }
|
||
|
|
.meta .subsection { padding-bottom: 10px; border-bottom: thin solid #dddddd; }
|
||
|
|
.metalogo { height: 42px; float: right; padding: 0; margin: 0; }
|
||
|
|
|
||
|
|
/** SPIP */
|
||
|
|
.subnavigation label { visibility: hidden; }
|
||
|
|
.subnavigation .formulaire_recherche { width: 100%; }
|
||
|
|
.main .puce { padding: 0; }
|
||
|
|
a.spip_in { color: darkblue; text-decoration: none; }
|
||
|
|
|
||
|
|
/** TWITTER API CUSTOM */
|
||
|
|
#twitter_update_list li { margin: 1em 0 1em 0; padding-bottom: 10px; border-bottom: thin solid #dddddd; }
|
||
|
|
|
||
|
|
/** MEDIA QUERIES */
|
||
|
|
.smallscreenonly { display: none; }
|
||
|
|
|
||
|
|
/** iPhone landscape */
|
||
|
|
@media screen and (max-width: 640px) {
|
||
|
|
.header .title { margin-left: 0px; width: 100%; float: none; }
|
||
|
|
.header .subnavigation { width:auto; float: right;}
|
||
|
|
.entry .main, .entry .meta { float: none; width: auto; }
|
||
|
|
.entry .navigation { width: 11.816%; float: left; }
|
||
|
|
.entry .content { width: 85.303%; float: right; }
|
||
|
|
.meta { font-size: 0.7em; }
|
||
|
|
.meta h2 { padding-bottom: 3px; border-bottom: 3px solid #dddddd; }
|
||
|
|
.meta h3 { margin: 0; }
|
||
|
|
.meta .section { padding: 0.5em 0 0.5em 0; }
|
||
|
|
.meta .subsection { padding: 0.5em 0 0.5em 0; border-bottom: thin solid #dddddd; }
|
||
|
|
.formulaire_recherche { display: none; }
|
||
|
|
|
||
|
|
#twitter_update_list li { margin: 0; padding: 0.5em 0 0.5em 0; border-bottom: thin solid #dddddd; }
|
||
|
|
}
|
||
|
|
|
||
|
|
/** iPhone portrait */
|
||
|
|
@media screen and (max-width: 360px) {
|
||
|
|
h1 { margin-left: 0px; margin-right: 0px; width: 100%; text-align: center; }
|
||
|
|
.entry .content, .entry .navigation { float: none; width: auto; }
|
||
|
|
.entry .main .right-subsection { text-align: left; }
|
||
|
|
.navigation { margin: 1em 0 2em 0; text-align: center; }
|
||
|
|
.navigation li { display: inline; }
|
||
|
|
.smallscreenonly { display: inline; }
|
||
|
|
.menu-liste .separator:after { content: "|"; }
|
||
|
|
}
|