/* --------------------------------------------------------------

   layout.css
   Disposition des blocs principaux
   cf.: http://romy.tetue.net/structure-html-de-base

-------------------------------------------------------------- */

/* Debug
------------------------------------------ */
.RED {
  background: red;
}


/* Elements principaux
------------------------------------------ */
body { text-align: center; background:#fff; position: relative; }
.page { position: relative; width: 1400px; max-width:100%; margin:0 auto; text-align: left;  }
.header {}
.group.cabeca { background: none; padding: 0; position: relative; z-index: 1; }
.group.main { background: white; padding: 0 0 1.5em 0; position: relative; z-index: 1; }
.group.main.depoimentos { padding-bottom: 0; }
.group.chamadaDepoimento { padding-bottom: 2em; }
.section.footer { background: rgb(187,47,57); box-shadow:	0 0 0 12px rgb(187,47,57) inset, 0 0 0 13px white inset; color: white; min-height: 225px; margin-bottom: 2em; margin-top: 4em; padding-bottom: 1.5em; vertical-align: bottom; }
.section.footer::before { background: white; content: " "; height:15px; width: 100%; }
.section.footer h1 { font-family: bebas_neuebold,Helvetica,sans-serif; font-size: 1em; margin-top: 3em; text-transform: uppercase; }
.section.footer p { font-size: 0.8em; line-height: 1.8em; margin-bottom: 3em;  }
.section.footer p a { color: white; font-weight: 600;  }

.cabecalho.miolo img.spip_logos { margin: 2em 0; width: 100%; height: auto; }

/* largeur calculee du wrapper: 960*70%  = 672px */
.wrapper { clear: both; float: left; width: 70%; overflow: hidden; }
.content { min-height: 350px; }
/* largeur calculee du aside: 672px / 3 = 224px = 23.333 %*/
.aside { float: right; width: 23.333%; overflow: hidden; }

.retranca {}
.retranca .bubbleWrap { margin: 3.65em 0 1em 0; }
.retranca h1 { color: rgb(199,197,194); font-size: 3.8em; margin-left: -.25em; }
.retranca h1 a { color: rgb(199,197,194); text-decoration: none; }
.retranca h1 a:hover { background: none; color: rgb(155,153,150); text-decoration: none; }

.conteudo { background: rgb(247,245,242); }
.conteudo .bubbleWrap { margin: 4em 4em 1em 4em; }
.conteudo .cabecalho { background: rgb(247,245,242); margin-top: -35%; min-height: 300px; padding-bottom: 2em; }
.conteudo .cabecalho h1 {
background: rgb(36,46,71);
display: table;
color: white;
font-family: bebas_neuebold,Helvetica,sans-serif;
font-size: 1.2em;
letter-spacing: .1em;
margin: 0 auto 3em;
padding: 0.25em 1em;
text-align: center;
text-transform: uppercase;
min-width: 60%;
}
.conteudo div.depoimento p { margin: 0 0 1em; padding: 0; }
.conteudo .miolo .chapo { color: rgba(36,46,71,.7); font-size: 1em; font-weight: 500; margin-top: 3em; padding-right: 0; text-align: left; }
.conteudo .cartouche { margin-bottom: 2.5em; }
.conteudo hr { background-color: rgb(36,46,71); border:none; height: 4px; margin: 0 auto; width: 50px; }
.conteudo .menu_articles h4 { margin: 3em 0 }
.conteudo .menu_articles li hr { margin: 3em auto 1.5em }
.conteudo .menu_articles li p { margin: 1em 0 0; }
.conteudo small { font-style: italic; line-height: 100% }
.conteudo p.surtitre { font-weight: 300; }
.conteudo p.soustitre { font-weight: 500; }
.conteudo h2 { font-size: 1.25em; line-height: 1.5em; margin: 0; }
.conteudo p.info-publi { line-height: 120%; margin: 0.5em 0 0; }
.conteudo h4 { font-size: 0.85em; font-weight: 700; text-transform: uppercase; }
.conteudo figure figcaption.credito {
  color: rgba(255,255,255,0.8);
  font-size: 0.55em;
  font-weight: 600;
  letter-spacing: .1em;
  margin: -25px .5em 0 0;
  text-align: right;
  text-shadow: -1px -1px 0 rgba(0,0,0,.7),
                1px -1px 0 rgba(0,0,0,.7),
               -1px  1px 0 rgba(0,0,0,.7),
                1px  1px 0 rgba(0,0,0,.7);
  text-transform: uppercase;
}
.conteudo figure figcaption.credito .descriptif {
  color: rgba(0,0,0,0.8);
  font-size: 1.5em;
  font-weight: 300;
  letter-spacing: 0;
  margin: -.5em 0 0;
  text-align: left;
  text-shadow: none;
  text-transform: none;
}
.conteudo.relatorios h1 { border-bottom: 2px solid rgba(36,46,71,0.25); color: rgb(190,50,60); font-size: 5em; margin-top: 1em; padding-bottom: .25em; }

.conteudo #Equipe h3 { font-size: .85em; font-weight: 600; margin-bottom: .25em; text-transform: uppercase; }
.conteudo #Equipe a { text-decoration: none; }

#InfoAdicional {  }
#InfoAdicional h3,
#Anexos { margin: 2em 0 .5em; padding-bottom: .75em; }
#InfoAdicional img { float: none; margin: 10px 0; }
#InfoAdicional a { color: rgb(36,46,71); text-decoration: none; }

#documents_joints h3 { border-bottom: 2px solid rgba(36,46,71,.25); margin: 2em 0 0em; padding: 0 .35em .75em; }
#documents_joints ul { margin-left: 0; }
#documents_joints li { border-bottom: 1px solid rgba(36,46,71,.3); list-style: none; padding: 0.75em 0.5em 1em; }
#documents_joints a { color: rgb(36,46,71); text-decoration: none; }
#documents_joints strong { font-size: 0.9em; font-weight: 400; }
#documents_joints small { font-size: 0.8em; }
#documents_joints i.fa { color: rgba(36,46,71,0.75); float: right; font-size: 1.25em; padding-top: 0.4em; }

.segmentoAzul {
  background: rgb(36,46,71);
  color: white;
}
.segmentoAzul a,
.segmentoAzul a:visited { color: white; }
.segmentoAzul h1 { border-bottom: 2px solid white; color: white; font-size: 3em; margin-bottom: 0; padding: 1em 0 0.2em; }
.segmentoAzul h2 { border-bottom: 2px solid white; font-size: 2em; margin-top: 2em; }
.segmentoAzul .menu { margin-bottom: 1em; }
.segmentoAzul span.titulo { font-size: .9em; font-weight: 700; text-transform: uppercase; }
.segmentoAzul #documents_joints h3 { border-bottom: 2px solid white; margin: 2em 0 0em; padding-bottom: .75em; }
.segmentoAzul #documents_joints li,
.segmentoAzul .menu_articles li { border-bottom: 1px solid white; list-style: none; margin-bottom: 0; padding: 0.75em 0.5em 1em; }
.segmentoAzul .menu_articles a,
.segmentoAzul #documents_joints a { color: white; text-decoration: none; }
.segmentoAzul #documents_joints a abbr,
.segmentoAzul #documents_joints a span { font-style: italic; }
.segmentoAzul #documents_joints strong { font-size: 0.9em; font-weight: 400; }
.segmentoAzul #documents_joints small { font-size: 0.8em; }
.segmentoAzul #documents_joints i.fa { color: white; float: right; font-size: 1.25em; padding-top: 0.4em; }
.busca {
  background: rgb(247,245,242);
  color: rgb(187,47,57);
}

.section.noticias { margin-top: 2em; }
.section.noticias .conteudo { background: white; }
.section.noticias .conteudo .menu_articles li { background: rgb(247,245,242); }
.section.noticias .conteudo .menu_articles .spip_logos { float: none; margin: 0; }
.section.noticias .conteudo .menu_articles h2  { font-size: 1.2em; margin: 40px 40px 10px 40px; }
.section.noticias .conteudo .menu_articles small,
.section.noticias .conteudo .menu_articles div.introduction { padding: 0 40px 20px; }

/* Entete et barre de navigation
------------------------------------------ */
.header {
  background: rgb(187,47,57); box-shadow:	0 0 0 12px rgb(187,47,57) inset, 0 0 0 13px white inset; color: white; padding-bottom: 1.5em; position: relative; }
.header::after { background: white; bottom: 0; content: ""; height: 15px; position: absolute; width: 100%; }
.header .spip_logo_site,
.header .spip_logo_site a,
.header .spip_logo_site a:hover { background: transparent; text-decoration:none;  }
.header .spip_logo_site a:hover  {color:#c85000;}
.header .spip_logo_site a:hover img {opacity:0.7;}
.header .spip_logo_site { margin-left: -10%; }
.header .spip_logo {float: none; margin:35% auto; width: 70%; }
.header #slogan { margin: 0; }

.formulaire_menu_lang { position: absolute; right: 0; top: .9em; display: block; width: 30%; }

.nav { font-family: Lato, Helvetica, sans-serif; font-size: .8em; font-weight: 900; margin-top: 11%; text-transform: uppercase; }
.nav li {display:inline;}
.nav li a {
color: white;
display: inline-block;
padding:0.25em 0.5em;
margin:-0.25em 0.5em -0.25em -0.5em;
text-decoration: none;
}
.nav li.on a { background:rgba(0,0,0,.2);color:#fff;  font-weight: 900; }
.nav li a:focus,
.nav li a:hover,
.nav li a:active { background: rgba(0,0,0,.3); color:#fff; }


.footer .colophon { float: left; height: 40px; width: 70%; margin: 0; }
.footer .generator { float: right; }
.footer .generator a { padding: 0; background: none; }

/* Gabarit d'impression
------------------------------------------ */
@media print {
    .page,
    .wrapper,
    .content { width: auto; }
    .nav,
    .arbo,
    .aside,
    .footer { display: none; }
}

/* Affichage sur petits ecrans
Cf.: http://www.alsacreations.com/astuce/lire/1177
------------------------------------------ */

/* largeur maximum 767px */
@media (max-width: 767px) {
	body {   	width: 100%;		padding: 0 20px;	}
	.page {  	width: 100%;  	max-width: none; 	}
}

/* largeur maximum 640px */
@media (max-width: 640px) {
     /* layout */
    .wrapper,
    .content,
    .aside { width: 100%;}
    .content,
    .aside { clear: both; float: none; width: 100%; }

    /* Passer a une seule colonne (a appliquer aux elements multi-colonnes) */
    .nav ul li a { float: none; border: 0; }
    .arbo { display: none; }
    .footer .colophon { width: auto; float: none; }
    .footer .generator { display: none; }

    /* header du calendrier full-calendar */
    table.fc-header td { display: block; text-align: left; }

}

/* fin */
