
/* Surcharge de l'image de fond du plugin html5up */

/* Nombre de tutelles (logos) */

        
        


body, #wrapper.fade-in, #wrapper > .bg {
        background-color: transparent;
        background-image: none;
}
ul {
        list-style-type: square;
}


html { 
        background: url("IMG/jpg/fond_airsea_tor_bleu_web.jpg") no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}


/* --- Font size --- */
/* Surcharge des style de font du plugin html5up */
h1, h2, h3, h4, h5, h6 {
        text-transform: none;
        font-weight: 400;
}
h1 {
                  font-size: 2rem;
                  line-height: 1.1;
                  margin: 0 0 2rem 0;
          }

          h2 {
                  font-size: 1.6rem;
                  line-height: 1.3;
                  margin: 0 0 1.5rem 0;
          }

          h3 {
                  font-size: 1.4rem;
                  margin: 1rem 0 1.5rem 0;
          }

          h4 {
                  font-size: 1rem;
          }

          h5 {
                  font-size: 0.9rem;
          }

          h6 {
                  font-size: 0.8rem;
          }
.sideinfos h4 {
        margin-top: 1rem;
}

span.seminaire h4 {
        font-weight: 400;
        font-style: italic;
}
/* --- Titre page d'accueil du sommaire --- */
#logo-site .spip_logo {
        float: none;
}
#intro a.scrolly {
        text-decoration: none;
        border: none;
} 
#intro a.scrolly:hover {
        color: white;
}
/* --- Titre site sur le sommaire ---*/
#header .logo {
        border: none;
}
#header .logo::before {
        display: inline-block;
        width: 6rem;
        height: 6rem;
        content: " ";
        background: url(IMG/logo/siteon0.svg) no-repeat;
        background-size: contain;
        vertical-align: -70%;
}

header.major {
        margin: 0;
}
header#header {
        justify-content:flex-start;
        height: 13rem;
}
#main > .post > header.major-api {
        padding-top: 2rem;
}
#main > .post > header.major-api a img.traduc {
        float:right;
}
#main > .post > header.major-api h1 {
        display:inline;
}

/* --- Page content --- */
#main {
        display: flex;
        flex-direction: column;
}

/* désactiver le menu naviguation html5 qui n'est pas beau.*/
#sousnav {
        margin: 0;
        display: none;
}

/* lister les articles d'une rubrique (blocs) et gérer les titres sur 2 lignes sans décaller l'image du bloc...*/
.posts > article > header {
        max-height: 2rem;
}

/* --- Plan du site Flex ---*/
.wrapper-plan-flex {
        display: flex;
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        #border: 1px solid red;
}
.plan-flex{
        width: 48%;
        min-width: 230px;
        #border: 1px solid pink;
}
.plan-flex:nth-child(even) {
        margin-left: 1rem;
}
.plan-flex > ul {
        margin-left: 0.2rem;
        padding: .5rem 0 .5rem 1.08rem;
        border-left: 1px solid grey;

        border-bottom-left-radius: 1rem;
}
.plan-flex >h2 {
        margin: 0 0 -.5rem 0;
}

/* --- Logos tutelles --- */
/*--- Gérer le padding des logos des tutelles ---*/
#footer > section.split.tutelles > section:first-child {
        padding: 1rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
}
#footer > section.split.tutelles > section > a.logos {
        display: block;
	text-decoration: none;
        border: none;
        width: calc(80%/4);
}

/* --- Les partenaires --- */
/*--- Gérer les logos des partenaires ---*/

.arbre {
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  width:20rem;
  margin-bottom: 4rem;
}
.partenaire:nth-child(1) .arbre{
        margin:right: 2rem;
}

.feuille {
  display: block;
  border-left: 1px grey solid;
  width: 10rem;
  align-self: flex-end;
  box-sizing: border-box;
  margin-top: -4rem;
}   
.feuille:nth-child(odd){
  align-self: flex-start;
  border-right: 1px grey solid;
  border-left: none;
  margin-left: 1px;
}
.carte {
  /*background-color: rgba(240,240,240,.6);*/
  overflow: hidden;
  padding: .5rem;
  width: 10rem;
  height:10rem;
  border: 1px solid grey;
  box-sizing: content-box;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-evenly;
  margin: 0 0 0 1rem;
  border-radius: 50%;
  transition: transform .3s, color .3s;
}

.feuille:nth-child(odd) .carte {
        margin: 0 0 0 -2.1rem;
        /*background-color: rgba(230,230,230,.8);*/
        background-color: rgba(55,125,210,.05);

}

.carte:before {
  content:" ";
  position: absolute;
  width: 1.1rem;
  height: 1px;
  background-color: grey;
  margin-top: .5rem;
  margin-left: -1.6rem;
}
.feuille:nth-child(odd) .carte:before {
  content:" ";
  position: absolute;
  width: 1rem;
  height: 1px;
  background-color: grey;
  margin-top: .6rem;
  margin-left: 10.5rem;
}

.carte:hover {
        transform: scale(1.2);
        border: 1px dotted #3B87D5; 
        
}

.carte img {
  width: 6rem;
  align-self: center;
}   
.feuille .titre {
  text-align: center;
  line-height: 1rem;
}
.partenaire-flexcont {
  display: flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content: space-evenly;
}
.partenaire-flexitem {
        /* Gérer le passage en colonne */
        max-width: 500px;
        padding: 0 40px;
}
.partenaire-flexitem h2 {
        text-align:center;
        margin-bottom: 5rem;
}

/* --- Surcharge style footer --- */
#footer > section.split > section, #footer > section {
        border: none;
}
#footer > section.split.contact > section, #footer > section.split.contact > section:first-child {
        padding: 2rem 4rem 0 4rem;
        align-items: flex-start;
}
#footer > section.split.contact > section > h3 {
        margin-top: .3rem;
}
#footer > section.split.contact {
        border-top: 1px solid rgba(60,60,60,.8);
}
#footer > section.split > section:last-child {
        padding: 0rem 4rem 3rem 4rem;
}
/* -- Surcharge style de typo -- */
html {
        font-size: 1rem;
}
@media screen and (max-width: 1680px) {

        html {
                font-size: 11pt;
        }

}

body, input, select, textarea {
        /* font-family: "Merriweather Sans", Georgia, serif; */
        font-family: "Roboto", Helvetica, sans-serif;
        font-weight: 300;
        font-size: 1rem;
        line-height: 2.375;
}
#intro{
        padding: 4rem 4rem 6rem 4rem;
}
#intro h1, #intro h2, #intro h3, #intro h4, #intro h5, #intro h6 {
                  /* font-family: "Source Sans Pro", Helvetica, sans-serif; */
                  font-family: "Merriweather Sans", Helvetica, sans-serif;
                  font-weight: 900;
                  line-height: 1.5;
                  letter-spacing: 0.075em;
                  text-transform: none;
                  margin: 0 0 1rem 0;
}

article > header > h2::first-letter {
        text-transform: uppercase;
}
#main > div > .posts > article div.introduction, #main > div > .posts > article div.introduction p {
        text-align: center;
        font-style: italic;
}
/* Titre article en Une */
#main > .post.featured {
        padding: 2rem 2rem 0 2rem;
}
#main > .post header.major h2 {
        font-size: 2rem;
        text-align: left;
}
/* Texte des rubriques */
#main > div.texte > p {
        padding: 0 4rem;
        border: none;
}
#main > div.texte {
        padding: 2rem 0;
}

/* copyright dans le footer */
#copyright, #copyright a {
        color: white;
}
#copyright {
        margin-top: 0;
        background-color: rgb(60,60,60);
        background-color: rgba(60,60,60,.8);
        padding: 1rem;
}

@media screen and (max-width: 480px) {

        #copyright {
                width: 100%;
                margin: 0;
        }

}

/* Titre article */
#main > .post header.major h1 {
        font-size: 2rem;
        text-align: left;
}
#main > .post header.major .introduction {
        text-align: left;
}
#main > div > .posts > article .introduction {
	text-align: justify;
}

#main > .post {
        padding: 0 6rem 2rem 6rem;
}
#main > .post > header.major {
        padding-top: 2rem;
} 
#main > .post p {
        margin: 0;
        line-height: 1.8rem;
}
#main .post h2::first-letter {
        text-transform: capitalize;
}
/*
#main .post.featured .introduction article#actu {
        background: url("") 1.6rem -.2rem no-repeat;
        background-size: 6rem;
        padding-top: 2rem;
}
#main .post.featured .introduction article#actu h2 {
        background-color: rgba(255,255,255,.7);
}*/
/*--- Images logos rubriques ---*/

.image.fit img
{
        width: auto;
        height: auto;
        margin: auto auto;
        max-height: 15rem;
        <!-- max-width: 100%; -->
}


/* --- Cartes web / images --- */
.card {
        border-radius: .6em;
        width: 30%;
        background-color: #f5f5f5;
        position: relative;
        border: 1px solid rgb(113,121,129);
        display: inline-block;
        margin: 1rem;
        vertical-align: middle;
}

.card h1 {
        line-height: 2.4em;
        vertical-align: bottom;
        font-size: 1.2em;
        color: white;
        background-color: rgb(85,85,85);
        text-align: center;
        margin: 10rem auto 0 auto; 
}
.card .phone {text-align: left;}
.card .phone .fa {
        font-size: 1.5rem;
        padding: 1rem;
}
.card .card-content {
        padding: 1rem;
        text-align: left;
        min-height: 9rem;
}
.card .card-content p {
        margin: 0;
}

/* ------------------ Liste API ------------------ */
.flexinfos {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 90%;
}
span.date, span.lieu, span.auteur, span.lien,span.nomseminaire {
        white-space: nowrap;
        text-align: left;
        margin-right: .5rem;
}
span.nomseminaire {
	color: rgb(98,145,214);
	margin:0;
	}
.calendrier {
        display: inline-block;
}
.calendrier::before {
        font-family:"Font Awesome 5 Free";
        content: "\f073";
        display: inline-block;
        height: 1rem;
        width: 1rem;
        margin-right: 1rem;
        color: rgb(98,145,214);
}	
li.event p.desc b.titre-event {
        display: block;
        text-align: left;
}
ul#faitsmarquants , ul#presentations, ul#events {
        display: inline-block;
        padding-left:0;
        width: 100%;
}
ul#presentations {
        margin-left: .5rem;
}
ul#events li.event, ul#presentations li.event {
        list-style-type: none;
        margin: 1rem 0 0 0;
        font-size: 1rem;
        display: inline-block;
        padding-left: 0;
}
header.major ul#events li.event, header.major ul#presentations li.event {
        font-size: 0.9rem;
        width: 100%;
}
ul#presentations li.event {
        border-left: .2rem solid #367DD2;
        border-radius: .8rem/2rem 0 0 2rem;
        width: 100%;
}
ul#presentations li.event p.desc {
        margin-left: 1rem;
}
ul#faitsmarquants li.event {
        list-style-type: none;
        margin: .5rem 0;
        padding: 1rem;
        float: left;
}
ul#faitsmarquants li.event:nth-child(odd) {
        background-color: rgba(54,125,210,.1);
        border-radius: .2rem;
}
ul#faitsmarquants li.event p {
        /*margin: 0 0 0 9rem;*/
}
ul#faitsmarquants li.event img.img {
        float: left;
        max-width: 8rem;
        max-height: 12rem;
        margin-top: .8rem;
        margin-right: 1rem;
}
ul#events li.event.These {
        list-style-type: square;
}
ul#events li.event.Seminaire {
        list-style-type: circle;
}
ul#events .event .titre {
        font-weight: bold;
}
ul#events .event i.fa,
ul#presentations .event i.fa,
ul#faitsmarquants .event i.fa
{
        font-size: 1rem;
        margin: 0 .3rem 0 0;
}
ul#events .event .date, ul#events .event .lieu, ul#events .event .auteur, ul#events .event .lien, 
ul#faitsmarquants .event .date, ul#faitsmarquants .event .lieu, ul#faitsmarquants .event .auteur, ul#faitsmarquants .event .lien,
ul#presentations .event .date, ul#presentations .event .lieu, ul#presentations .event .auteur, ul#presentations .event .lien, {
        margin: 0 .8rem 0 0;
}
ul#events .event .auteur, ul#faitsmarquants .event span.desc {
        font-style: italic;
}
ul#events .event .lieu i.fa, ul#faitsmarquants .event .lieu i.fa, ul#presentations .event .lieu i.fa {
        color: red;
}
ul#events .event .date i.fa, ul#faitsmarquants .event .date i.fa, ul#presentations .event .date i.fa {
        color: rgb(98,145,214);
}

/* ---- Visuel différent pour chaque type de news ---- */
/* ------------------ Detail evenement API ------------------ */

.table.annuaire td {
        padding: 0;
}

.container {
        padding: 0;
	margin: 0 0 4rem 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}
.sideinfos {
        display: flex;
	flex-grow:1; 
	flex-direction: column;
        align-content: space-between;
        padding:  0 0 1rem 0;
}
.colinfos {
	display: flex;
	flex-direction: row;
	align-items: space-between;
}
.illustration {
        min-width: 15rem;
        max-width: 25rem;
        object-fit: scale-down;
        object-position: top;
        margin: .8rem 1rem 0 0;
}
.infos, .lien {
        //width: 100%;
        margin-right: 1rem;
}

.sideinfos .colinfos .infos ul, .sideinfos .colinfos .lien ul {
        list-style-type: none;
        padding-left: 0;
        margin-bottom:0;
}
.sideinfos .colinfos .infos ul li {
        padding-left: 0;
}
.publication {
        font-size: .9rem;
        font-style: italic;
        color: #717981;
}
#main .container div.description p {
        margin: 0 0 1rem 0;
}
#main .container div.description pre {
        text-align: justify;
        font-family: "Roboto", Helvetica, sans-serif;
        font-weight: 300;
        font-size: 1rem;
        margin: 0;
        white-space: pre-wrap;
}
span.motscle {
        font-weight: 400;
}
ul.motscle {
        list-style-type: none;
        display:inline-block;
        padding-left: 0;
        margin: 0;
}
.motcle {
        background-color: tomato;
        display: inline-block;
        color: white;
        padding: 0 .3rem;
        border-radius: .2rem;
        line-height: 1.8rem;
}
.motcle:first-letter {
        text-transform: capitalize;
}

.description ul.icon-item {
        list-style-type:none;
}
.description span.auteur {
        margin: 0 0 0 1.5rem;
}
@media (max-width: 768px) {

        .container {
                flex-direction: column;
        }
        .sideinfos {
                flex-direction: column;
                padding: 0;
        }
        .illustration {
                margin: 0 auto;
        }

        .plan-flex:nth-child(even) {
                margin:0;
        }
        .plan-flex {
                width:100%;
        }
}

.container .lieu i.fa, 
.container .auteur i.fa, 
.container .lien i.fa, 
.container .date i.fa
 {
        font-size: 1rem;
        margin: 0 .8rem 0 0;
}
.container .lieu i.fa {
        color: red;
}
.container .date i.fa {
        color: rgb(98,145,214);
}

/* --- PORTFOLIO documents --- */
/* PORTFOLIO GRID */
.projects{
  display: flex;
  display: -webkit-flex;
  flex-direction: row;
  -webkit-flex-direction: row;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  justify-content: center;
  -webkit-justify-content: center;
  width:100%;
  margin:0 auto;
}

.projects .item{
  background-size:cover;
  background-position:center center;
  min-height:20rem;
  min-width:6rem;
  margin: .5rem;
}

.item-info{
  /*background:rgba(0,0,0,0.6);*/
  display: flex; display: -webkit-flex;
  flex-direction: column; -webkit-flex-direction: column;
  flex-wrap: wrap; -webkit-flex-wrap: wrap;
  justify-content: center; -webkit-justify-content: center;
  align-items: center; -webkit-align-items: center;
  min-width:15rem;
  min-height:6rem;
}

.item-info h2{
  font-weight:900;
  color:#ffffff;
}

.item-info span{
  color:#cfcfcf;
  font-family:Arial;
  font-style:italic;
  font-size:0.9em;
  padding-top:5px;
}


        .projects div#item-17.item {
                background-image: url('IMG/jpg/couv-fm-09-10.jpg');
        }

        .projects div#item-20.item {
                background-image: url('IMG/jpg/couv-fm-11-12.jpg');
        }

        .projects div#item-21.item {
                background-image: url('IMG/jpg/couv-fm-13-14.jpg');
        }

        .projects div#item-22.item {
                background-image: url('IMG/jpg/couv-fm-15-16.jpg');
        }

        .projects div#item-26.item {
                background-image: url('IMG/jpg/couv-fm-17-18.jpg');
        }

        .projects div#item-49.item {
                background-image: url('IMG/jpg/couvs-web-2019-2020.jpg');
        }

        .projects div#item-16.item {
                background-image: url('IMG/jpg/couv-fm-07-08.jpg');
        }



/* --- surcharge du plugin html5 massively ---*/

.button.icon.solo:before {
font-weight: 900;}

input[type="submit"], input[type="reset"], input[type="button"], button, .button {
margin: .8rem 0;
padding: 0 1 rem;
}

img {
        height: auto;
        max-width: 100%;
}

.center {
        margin: 0 auto;
        display: block;
        max-width: 15rem;
}
#div > .posts > * {
        width: 33%;
}

#main > * {

        padding:0;
        border-top:0;
        margin: 0;
    
}
#main > div > [id^=pagination_] { padding:0; border:0; }

#main > div > * {

        padding: 4rem 4rem 2rem 4rem;
        border-top: solid 2px #eeeeee;
        margin: 0;
    
}

#main > div > .posts {
	display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -moz-align-items: -moz-stretch;
    -webkit-align-items: -webkit-stretch;
    -ms-align-items: -ms-stretch;
    align-items: stretch;
    text-align: center;
    width: 100%;
    padding: 0;
}


#main > div > .posts > * {
        padding: 2rem 2rem 0 2rem;
        width: 33%;
}

#main > div > .posts > article:nth-child(-n+3), #main > div > .posts > article:nth-child(2n - 1) {
        border-left-width: 0px;
        border-right-width: 0px;
}

#main > div > .posts > article, #main > div > .posts > article:nth-child(-n+3)  {
        border-top-width: 0px;
}

#footer > section { 
        padding: 0 4rem;
}

#main > div > .posts > article:nth-child(even) {
        background-color: rgba(55,125,210,.05);
}

@media screen and (max-width: 736px) {
        #main .post {
                padding: 2rem;
        }

        #main > div > .posts > * {
                width: 100%;
        }

        #main > div > .posts > * {
                padding: 2rem;
                width: 100%;
        }

        #main > div > .posts > article, #main > div > .posts > article:nth-child(-n+3) {
                border-top-width: 0px;
        }

        /*#main > div > .posts > article:nth-child(2n-1) {
                border-left-width: 2px;
        }*/

        #main > div > .posts > article:nth-child(-n + 1) {
                border-top-width: 0px;
        }
}

/* --- Pour le plugin FAQ --- */
dl.faq h3 {
        font-size: 1.2rem;
}
dl.faq dt.item-faq-closed::before {
        display: inline-block;
        width: 1rem;
        height: 1rem;
        border: 1px solid pink;
        font-family: 
        content: "\f054";

}

/* --- Pour les pages perso --- */
.photo-trombi {
        width: 14rem;
        height: 14rem;

}

 /* --- Page Erreur 404 --- */

#main > .post header.major h1.error {
        font-size: 5rem;
        text-align: center;
        color: #367DD2;
}

#main > .post header.major h1.error img {
        width: 6rem;
        height: 6rem;
        margin:  2rem auto -1.2rem auto;
        display: inline-block;

}
.notfound {
        white-space: nowrap;
}
.texte.error {
        text-align: center;
        font-size: 1.2rem;
}


/* --- Formulaire recherche seminaires --- */
#recherche-tab {
        display: flex;
        flex: row wrap;
}

#recherche-tab * {
        min-width: 50%;
        flex-grow: 2
}
#recherche-tab .flx-elem:nth-child(odd) {
        margin-right: 1rem;
} 

img.icone-spip {
vertical-align: middle;
}

a.icone-lien {
   text-decoration: none !important;
   border:0px !important;
   outline:none;
   border-width: 0px;
   outline-width:0px;
   border-bottom: none !important;
   float: left;
   margin-right: 0.5rem;
}
