/* feuille de style réalisé par Antoine Bardelli sous licence Artlibre 3.0. -----------------------------*/ /* fonts-----------------------------*/ @font-face { font-family: 'League Spartan'; src: url('../webfonts/leaguespartan-bold.eot'); src: url('../webfonts/leaguespartan-bold-1.eot') format('embedded-opentype'), url('../webfonts/leaguespartan-bold.woff2') format('woff2'), url('../webfonts/leaguespartan-bold.woff') format('woff'), url('../webfonts/leaguespartan-bold.ttf') format('truetype'), url('../webfonts/leaguespartan-bold.svg') format('svg'); font-weight: bold; font-style: normal; } /* generiques----------------------------*/ .top-bar, .top-bar-section li:not(.has-form) a:not(.button) { background-color: #332B2B; } h1, h2, h3, h3, h5, h6 { color: #332B2B; font-family:League Spartan, arial, sans-serif; } h2{ font-size: 2rem; } .accueil h2 { font-size: 2rem; text-transform: uppercase; letter-spacing: 0.05em; } h3{ font-size: 1.3em; padding-top: 2rem; } .theme { font-family: League Spartan, arial, sans-serif; } p{ font-family:Cambria, georgia, serif; line-height: 1.8em; } p span{ font-weight: bold; padding-bottom: 2em; } /*p a{ font-size: 0.9em; font-style: italic; }*/ ul{ margin-bottom: 2rem; } li{ font-family:Cambria, georgia, serif; } .inline-list { font-size: 0.7em; } .columns li { list-style: outside none square; line-height: 1.8em; } a { color: #332B2B; } a:hover{ color: #ff4d00; } a:visited { color: #0B05B0; } a.button{ color: #fff; font-weight:bold; } a:focus {   color: #0004ff !important;   border: 2px solid #0004ff; } button, .button { background: #332B2B url("../img/bouton-or.png") no-repeat scroll 0 0em; color: #fff; } button:hover, .button:hover, button:focus, .button:focus{ color:#fff; background-color: #ff4d00; background-position: -2em -25em; } button:visited, .button:visited{ } a.button:visited{ } .column, .columns { padding: 2rem 0.9375rem 0rem; } .scroll-container { padding-top: 3em; } ul.spip { margin-left: 0; } ul.spip li { list-style: none; } .lien-texte, ul.spip li a{ background: rgba(0, 0, 0, 0) url("../img/rayures.png") no-repeat scroll 0 0.2em; font-size: 0.9em; font-style: italic; padding: 0 0 0 3em; } a span{ font-size: 0.8em; } .menu_lang_item strong { color: #ccc; padding: 0 0.9375rem; line-height: 2.8125rem; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-size: 0.8125rem; } /* menu import----------------------*/ .top-bar-section ul li > a { background: #332B2B none !important ; } .top-bar-section ul li > a:hover { background: #ff4d00 none !important ; } /* menu-----------------------------*/ .top-bar .toggle-topbar a { font-family: Arial, verdana, sans-serif; } /* footer---------------------------*/ .footer{ padding-top: 0rem; } .footer ul li{ font-family: Arial, verdana, sans-serif; } .footer ul li a{ padding: 0 0.7em; color: #332B2B; } .footer ul li a:hover { background: #ff4d00 none repeat scroll 0 0; color: #fff; } .footer .row { padding-bottom: 3em; } .logoapril img { display: block; float: right; margin: 0.2em 1em 0; padding: 0; width: 5em; } /* page d'accueil--------------------------*/ .accueil .panel { background: transparent none repeat scroll 0 0; border: medium none; text-align: center; min-height: 15em; } .panel > p { font-size: 0.9em; font-style: italic; } /* pages generiques-----------------------------*/ .exposer .row, .telecharger .row, .credits .row, .a-propos .row, .exposition .row .accueil.row .exposition .row { padding-bottom: 3rem; } .adresse > li { list-style: outside none none; } ul.adresse { margin-left: 0rem; } .fichier > li { list-style: outside none none; } .icon-bar > a:hover { background: #ff4d00 none repeat scroll 0 0; } /* fond pages generiques-----------------------------*/ .scroll-container { background:url("../img/fond-blanc.png") repeat scroll 0 0 rgba(0, 0, 0, 0) ; } .telecharger{ background-color: #E7D08B; background-position: -6em 3em; } .exposer{ background-color: #C1DCBE; background-position: -2em -4em; } .credit{ background-color: #EBC2DB; background-position: -2em -8em; } .contact{ background-color: #FBE3DF; background-position: 1em 7em; } .exposition{ background-color: #C6EAFA; background-position: 3em -5em; } .a-propos{ background-color: #FFEBA7; background-position: -8em -5em; } .scroll-container.accueil{ background: /* url("../img/arbre.png") no-repeat -13em top / 70%, */ url("../img/city.png") no-repeat -0.3em bottom / 101%, url("../img/fond-blanc-50.png") no-repeat scroll 0 0 ; background-color: #E1A3C9; } .accueil .large-8 { background: url("../img/fond-crenele.svg") repeat-y scroll center top / 100% transparent ; padding: 5em; } .accueil p.intro { font-size: 1.1em; } /* pages panneaux x 8-----------------------------*/ .collection p{ background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0; font-size: 0.9em; font-style: italic; text-align: center; } /* fin pages generique-----------------------------*/ /* pages panneaux-----------------------------*/ .panneau-1 { background: url("../img/fond-001.jpg") no-repeat scroll center top / 100% #c7e9fb ; } .panneau-1 .large-8{ padding-top: 0; } .theme span{ font-size: 1.4em; display: inline-block; } .panneau-1 .theme span{ color:#9C4D00; font-size: 1.7em; } .panneau-2 { background: url("../img/fond-002.jpg") no-repeat scroll center top / 100% #ffebeb ; } .panneau-2 .theme span { color: #800000; display: block; font-size: 2em; } .panneau-3 { background: url("../img/fond-003.jpg") no-repeat scroll center top / 100% #441650 ; } .panneau-3 .theme span { color: #4e1452; font-size: 2em; display: block; } .panneau-4 { background: url("../img/fond-004.jpg") no-repeat scroll center top / 100% #f6ecbe ; } .panneau-4 .theme span { color: #aa4400; font-size: 2em; display: block; } .panneau-5 { background: url("../img/fond-005.jpg") no-repeat scroll center top / 100% #c9eef7 ; } .panneau-5 .theme span { color: #0044aa; font-size: 1.8em; display: block; } .panneau-6 { background: url("../img/fond-006.jpg") no-repeat scroll center top / 100% #feeae4 ; } .panneau-6 .theme span { color: #e25050; font-size: 2em; display: block; } .panneau-7 { background: url("../img/fond-007.jpg") no-repeat scroll center top / 100% #c9efc5 ; } .panneau-7 .theme span { color: #008080; font-size: 2em; line-height: 1.2em; display: block; } .panneau-8 { background: url("../img/fond-008.jpg") no-repeat scroll center top / 100% #fbffff ; } .panneau-8 .theme span { color: #005184; font-size: 2em; line-height: 1.2em; display: block; } .contenu-texte { background-color: rgba(255,255,255,0.5); background: url("../img/fond-crenele.svg") repeat-y scroll center top / 100% transparent ; padding: 7em; /*3.5em;*/ } .icon-bar { background-color: transparent; } .icon-bar a{ } a.right { background-position :3em top ; } .navigation a{ font-size: 0.7em; padding: 0.7rem 1.4rem 0.5rem; } .aller { float: right; } /* pages a propos-----------------------------*/ .accueil .logoapril img { display: block; margin: 3em 0 7em; width: 6em; } /* adaptation css de spip */ ul.spip { margin-left: 1.1rem; } ul.spip li { list-style: outside none square; line-height: 1.8em; font-family: Cambria, georgia, serif; } .li_expo ul { margin: 0px; } .li_expo ul li { list-style: none; } .li_expo > ul.spip { margin: 0px; } .li_expo > ul.spip li {list-style: none; } /* Screen */ @media screen and (max-width: 1140px){ .contenu-texte { padding: 3.5em; } .column, .columns { padding: 2rem 0.9375rem 0rem; } } @media screen and (max-width: 1020px){ .accueil .panel { min-height: inherit; } .accueil .large-2.columns, .panneau-1 .large-2.columns, .panneau-2 .large-2.columns, .panneau-3 .large-2.columns, .panneau-4 .large-2.columns, .panneau-5 .large-2.columns, .panneau-6 .large-2.columns, .panneau-7 .large-2.columns, .panneau-8 .large-2.columns { display: none; } .column, .columns { padding: 0rem 0.9375rem 0rem; } } .panel { margin-bottom: -1rem; } } @media screen and (max-width: 970px){ } @media screen and (max-width: 630px){ .contenu-texte { padding: 3.5em; } h2 { font-size: 1.5rem; margin-bottom: 0.4rem; } .small-block-grid-2.collection { margin-top: 2em; } .small-block-grid-2 > li { width: 100%; } } @media screen and (max-width: 580px){ .theme span{ font-size: 1em; } .panneau-1 .theme span, .panneau-2 .theme span, .panneau-3 .theme span, .panneau-4 .theme span, .panneau-5 .theme span, .panneau-6 .theme span, .panneau-7 .theme span, .panneau-8 .theme span { font-size: 1em; } .accueil .large-8 { padding: 3em 2em 2em; } .contenu-texte { padding: 3em 2.5em; /*2em;*/ } h2 { font-size: 1.8rem; line-height: 1em; margin-bottom: 0; } h3 { font-size: 1.2em; line-height: 1em; padding-top: 1rem; } }