@charset "UTF-8";

body {
    font-family: "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    background-color: #000;
}

/*span > balise de type inline*/

/*déclaration des INDISPENSABLES*/

/*boites*/

*,
*::before,
*::after {
    box-sizing: border-box;
}

/*Clearfix*/

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

li{
	list-style: square;
}

/*texte caché*/

.no_text {
    font-size: 0;
    margin: 0;
}

/*navigation*/

nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/*images*/

img {
    display: block;
}

.conteneur {
    display: flex;
    flex-wrap: wrap;
}

.spip {
    display: flex;
    flex-wrap: wrap;
}

/*==========================*/

/*==============================================*/

/*--- GRILLE ---*/

/*--- POLICES ET TEXTES ---*/

/*--- BOUTON ET CALL TO ACTION ---*/

/*===HEADER===*/

/*header {*/
/*    !*background-color: #873AB0;*!*/
/*	background-color: #FF7900;*/
/*    height: 85px;*/
/*    width: 100%;*/
/*    color: #fff;*/
/*    position: fixed;*/
/*    left: 0;*/
/*    right: 0;*/
/*    z-index: 995;*/

/*}*/

#background-header {
    background-color: #000000;
    width: 100%;
    height: 80px;
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1000;

}

#topbar {
    height: 54px;
    width: 100%;

}

#logo-top {
    height: 54px;
    width: 250px;
    margin-left: 5%;
    margin-right: 10px;
    margin-top: 20px;
    float: left;

}

.menu-mobile{
    font-size: 0!important;
    margin: 0;
}

.footer-mobile{
    font-size: 0!important;
    margin: 0;
}

#main_nav li {
    margin-top: 35px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
	list-style: none;
}

#main_nav a,
#main_nav a:visited {
    text-decoration: none;
    color: rgba(255, 255, 255, 1);
    font-weight: bold;
    font-size: 1.3em;
    margin-left: 10px;
    margin-right: 10px;

}

#main_nav a:hover,
#main_nav a:focus,
#main_nav a:active {
    transition: all .5s;
    color: rgba(255, 121, 0, 1);
    transition: all .5s;

}

#lien_nav {
    margin-right: 10%;
    margin-top: 30px
}

#search,
#search:visited {
    background: transparent url(../images/search.png) no-repeat left;
    height: 30px;
    width: 30px;
    margin: 0 20px;

}

#search:hover,
#search:focus,
#search:active {
    transition: all .5s;
    background: transparent url(../images/search-color.png) no-repeat left;
}

#connexion,
#connexion:visited {
    background: transparent url(../images/connexion.png) no-repeat left;
    height: 30px;
    width: 30px;
    margin: 0 20px;
}

#connexion:hover,
#connexion:focus,
#connexion:active {
    transition: all .5s;
    background: transparent url(../images/connexion-color.png) no-repeat left;

}

.hierarchie {
	width: 960px;
    padding-top: 10px;
	margin: 0 auto;
}

.hierarchie a,
.hierarchie a:visited {
    text-decoration: none;
    color: rgba(255, 255, 255, 1);
}

.hierarchie a:hover {

    color:#ff7900;

}

/*===FIN HEADER===*/

/*==== PAGE ACCUEIL====*/

/*---Main---*/

/*section Caroussel*/

/*section explication*/

#deco_left{
	position: absolute;
	z-index: 994;
	left: -150px;
	top: 150px;
}

#deco_left img{
	width: 380px;
	height: auto;
}

#deco_right{
	position: absolute;
	z-index: 993;
	right: -150px;
	top: 150px;
}

#deco_right img{
	width: 380px;
	height: auto;
}

#glance{
	z-index: 980;
	position: absolute;
	background-color: white;
	top:85px;
	width: 100%;
	height: 100px;
}

#glance ul{
	text-align: center;
}

#glance li{
	display: inline-block;
	color:#FF7900;
	border-left: solid 5px #FF7900;
	padding-left: 5px;
	font-size: 1.5em;
	font-weight:bolder;
	margin-right: 25px;
	text-align: left;
}

#glance_banner{
	border: none;
    background-color: black;
    width: 100%;
/*	margin-top: 85px;*/
	height: 70px;

}

#background_accueil {

    /*background: transparent url(../images/fond_accueil.png) no-repeat top;*/
    background-size: cover;
    height: 100%;
    width: 100%;
    top:-10px;
    color: #fff;
    min-height: 100%;

}

#logo-explication {
    float: none!important;
    margin: 0 auto;
    width: 100%;
	margin-top: 100px;
	text-align: center;

}

#logo-explication img{
    margin: 0 auto;
	text-align: center;

}

#explication_accueil p {
    text-align: left;
	margin-top: 0px;

    font-size: 1.5em;
    max-width: 940px;
    width: 100%;
    /*margin-bottom: 100px;*/
}

#explication_accueil h2 p{
	margin-top: 25px;
    text-align: left;
    font-size: 1.700em;
    margin-bottom: 50px;
    max-width: 940px;
    width: 100%;
}

.home_iframe {
    border: none;
    background-color: black;
    width: 100%;
    height: 600px;

}

/* section Article*/

#article-accueil article {
    display: flex;
    flex-wrap: wrap;
}

#article_content {
    flex-wrap: wrap;
    z-index: 900;

}

.text_article {
    max-width: 780px;
    width: 100%;
}

.text_article h3 {
    /*color: #873AB0;*/
    font-size: 1.700em;

}

#article_content h3{
    margin-bottom: 0;
}

.text_article li {

    font-size: 1.5em;

}

#logo-home {
    padding-top: 100px;
    max-width: 140px;
    width: 100%;
}

/*====FIN PAGE ACCUEIL====*/

/*====PAGE RUBRIQUE====*/

#background_rubrique {

    /*background: transparent url(../images/fond_pages.png) no-repeat top;*/
    background-size: cover;
    width: 100%;
    color: #fff;
    height: 100%;

}

#rubrique {}

#explication_rubrique {
    box-sizing: content-box;
    width: 100%;
    background-color: rgba(51, 51, 51, 0.4);
    text-align: left;
    height: 100%;
    padding: 0 20px;
    max-width: 940px;
    width: 100%;

    margin-top: 50px;
	background-image:url(../images/charte_IoT2.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size: contain;
    /*padding-bottom: 50px*/
}

#explication_rubrique h2 p{
    font-size: 1.7em;
    text-align: left;
    max-width: 940px;
    width: 100%
}

#explication_rubrique p {
    font-size: 2em;
    padding: 0;
    text-align: left;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-weight: bolder;

}

/*---article rubrique---*/

section#article_rubrique {
    padding: 55px 0;
}

#rubrique_content {
    flex-wrap: wrap;
}

.rotate {
    /* Safari */
    -webkit-transform: rotate(-45deg);
    /* Firefox */
    -moz-transform: rotate(-45deg);
    /* IE */
    -ms-transform: rotate(-45deg);
    /* Opera */
    -o-transform: rotate(-45deg);
    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.5);
}

/* article*/

article.miniature {
    position: relative;
    /*margin-bottom: 100px;*/

}

#article {
    text-decoration: none;
}

article.miniature.col-4,
article.miniature.col-4:visited {}

article.miniature.col-4:hover,
article.miniature.col-4:focus,
article.miniature.col-4:active {
    /*border: solid 5px #FF7900;*/
	/*box-shadow: 5px 5px 0px #FF7900;*/
    /*color: rgba(136, 186, 9, 1);*/
	/*color:#FF7900;*/
   /* transition: all .5s;*/

}
#img-rubrique {
   /* max-width: 300px !important;*/
   /* height: 225px;
    background-color: #000;*/
    background-size:cover;
    width: 300px;
    height: 225px
}

#img-rubrique img {
   display: none;
    /*width: auto;
    height: 225px!important;*/

}

p.new {
    color: #fff;
    background-color: #FF7900;
    text-transform: uppercase;
    position: absolute;
    top: 0;
    left: 0px;
    padding: 0 15px
}

div.infos,
div.infos:visited {
    background-color: #fff;
    padding: 10px 20px;
    text-align: left;
    height: 400px;
    color: rgba(0, 0, 0, 1);
	margin-bottom: 30px;

}

div.infos:hover,
div.infos:focus,
div.infos:active {
/*    transition: all .5s;
    color: rgba(136, 186, 9, 1);
    transition: all .5s;*/
	color:#FF7900;

}

div.infos p,
div.infos p:visited {
    transition: all .5s;
    color: rgba(0, 0, 0, 1);
    transition: all .5s;
}

div.infos h3 {
    font-size: 1.7em;
    padding-bottom: 10px;
    padding-top: 0px;
}

div.infos p {
    margin: 0;
    font-size: 1.5em;
}

div.infos p:last-of-type {
    margin-bottom: 0;
}

/*====FIN PAGE RUBRIQUE====*/

/*====PAGE ARTICLE====*/

#background_article {
    /*background: transparent url(../images/fond_pages.png) no-repeat top;*/
    background-size: cover;
    width: 100%;
    color: #fff;
    min-height: 100%;
    padding-bottom: 50px;

}

#explication_article {
    margin-top: 50px;
    margin-bottom: 30px;

}

.background-div {
    background-color: rgba(51, 51, 51, 0.5);
    text-align: left;
    height: 100%;
    padding-bottom: 50px;
    padding-top: 50px
}

#background_article div#img-article{
    padding-top: 0;
    padding-bottom: 0;
}

#explication_article h2 {
    font-size: 2.5em;
    margin-top: 50px;
    text-align: left;
	margin-left: 50px;
    max-width: 940px;
    width: 100%
}

#explication_article p {
    font-size: 1.2em;
    padding: 0 0 20px 0;
    text-align: left;
    padding: 0 100px;
    max-width: 900px;
    width: 100%;
}

#explication_article h3 {
    font-size: 1.6em;
    margin-top: 50px;
	margin-left: 40px;
    text-align: left;
    max-width: 860px;
    width: 100%;
}

#explication_article li {
    font-size: 1.2em;
}

#explication_article ul li {
    font-size: 1.2em;
    max-width: 780px;
    width: 100%;
    margin: 0 auto;
    text-align: left;
}

#img-article img {
    max-width: 100%;
    height: auto;
    border: 0;
    margin: 0 auto;
    margin-bottom: -20px;
}

dl dt img{
    max-width: 100%;
    height: auto;
    border: 0;
}

dl dt a img{
   min-height: 100%;
    text-align: center;
    /*margin: 50px;*/
    margin: 0 50%;
    }

/*---developpeur---*/

.spip_code {
    background-color: #fff;
    white-space: inherit;
    color: #000;
    margin: 20px;
    padding: 20px;
    width: 900px;
    border-radius: 5px;
    font-size:1em;
}

#explication_article div p {
    margin: 20px 0;
}

#explication_article div p strong {
    font-size: 1.6em;
}

#explication_article div p a {
    text-decoration: none;
    color: #ff7900;
}

#explication_article div p a#logo-telechargement img {
    display: inherit;
}

/*---*document---*/
#document{
    background-color: rgba(255,255,255,.3);

}

.spip_documents img {
    margin: 0 auto;
}

/*====FIN PAGE ARTICLE====*/

/*====PAGE DEMOS====*/

#rub {
    right: 0;
    bottom: 0;
    border: none;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: 800px;
    z-index: -100;
    background-size: cover;
    overflow-y: scroll !important;
    overflow-x: hidden !important;

}

#rub-2 {
    width: 100%;
    border: 0;
    height: 500px;
    margin-bottom: 0px;
    overflow-y: hidden!important;
    overflow-x: hidden !important;
}

iframe img {
    max-height: 640px;
    max-width: 940px;
}

/*====FIN PAGE DEMOS====*/

/*===FOOTER===*/

footer {
    background-color: #000000;
    padding-bottom: 0px;
    height: 60px;
    width: 100%;
    color: #fff;
	border-top: solid 1px #333333;
/*    left: 0;
    right: 0;*/

}

/*#footer_nav img{
	position: absolute;
	right: 20px;
	margin-bottom: 20px;
	margin-top: 20px;
	width: 50px;
	height: auto;
}*/

#footer_nav {

    height: 60px;
    width: 960px;
	text-align: center;
/*    max-width: 540px;*/
/*    margin-left: auto;
    margin-right: auto;*/
}

#footer_nav li {
    margin-top: 25px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
	list-style: none;
}

#footer_nav ul{
	margin: 0 auto;
}

#footer_nav a,
#footer_nav a:visited {
    text-decoration: none;
    color: rgba(255, 255, 255, 1);
    font-weight: bold;
    font-size: 1em;
    padding: 0 10px;
   /* border-left: 1px solid #fff;*/
    text-align: center;

}

#footer_nav li:first-child a {
    border-left: none;
}

#footer_nav a:hover,
#footer_nav a:focus,
#footer_nav a:active {
    transition: all .5s;
    color: rgba(255, 121, 0, 1);
    transition: all .5s;

}

/*===FIN FOOTER===*/

/*===FORMULAIRE===*/

fieldset {
    max-width: 940px;
    width: 100%;
    margin-left: -50px;
    padding: 0 0;
    text-align: left;
    margin-bottom: 20px;
    border: 0px;
}

fieldset legend {
    font-size: 1.500em;
    position: relative;
    text-align: center;
    width: 940px;
    margin-left: 10px;
    margin-right: 10px;
    margin: 0 auto;
}

li fieldset legend {
    font-size: 0;
    text-align: left;
    margin-bottom: 50px;
    /*background-color: aqua;*/
}

/*---Edition du formulaire---*/

fieldset ul li{
    flex-wrap: wrap;
    max-width: 860px;
    width: 100%;
    /*background-color: aqua;*/
}

label {
    display: flex;
    font-size: 1em;
    /* background-color: blueviolet;*/
    font-weight: 400;
    max-width: 400px;
    width: 100%;
    float: left;
    margin-bottom: 0px;
    padding-bottom: 15px;
}

li input {
    flex-wrap: wrap;
    font-size: 1em;
    margin-bottom: 50px;
    max-width: 350px !important;
    width: 100%;
    border-color: #FF7900;
	border: 0;
    padding: 10px 20px;
}

p.editer.editer_civilite.saisie_civilite {

    font-size: 0px !important;

}
#formulaire_contact h2{
    text-align: center;
}

label[for=civilite_madame] {
    max-width: 200px !important;
}
label[for=civilite_madame] input {
    margin-right: 20px;
}

label[for=civilite_monsieur] {
    max-width: 200px !important;
    padding-bottom: 50px;
}

label[for=civilite_monsieur] input {
    margin-right: 20px;
}

li textarea {
    font-size: 1em;
    margin-bottom: 50px;
    border-color: #FF7900;
	border:0;
    padding: 10px 20px;
}

label[for=infolettre] {
    max-width: 900px !important;

}

label[for=infolettre] input {
    margin-bottom: 10px;
    margin: 0;
    width: 50px;
}

.choix {
    margin-top: 0px;

}

fieldset .editer-groupe li {
    list-style-type: none;
    /*background-color: aquamarine;*/
}

ul.editer-groupe{
    list-style-type: none;
    list-style: none;
}
/*---Fin de l'édition---*/

/*---Prévisualisation du message à envoyer---*/

fieldset.previsu {
    padding-left: 0;
}

.previsu ul {
    list-style: none;
}

.previsu li {
    font-weight: 400;
}

.previsu li strong {
    font-weight: 400;
    /*background-color: aqua;*/
    color: #FF7900;
    display: block;
    font-size: 1em;
    font-weight: 400;
    max-width: 900px;
    width: 100%;
    float: left;
    margin-bottom: 0px;
    text-decoration: underline;
}

.previsu li div strong {
    width: 300px;
    float: none;
}

.previsu li p {
    font-weight: 400;
    font-size: 1em !important;
    text-align: left !important;
    margin-top: 0 !important;
    max-width: 900px !important;
    width: 100% !important;
}

/*---Fin de Prévisualisation---*/

/*===FIN FORMULAIRE===*/

/*===PAGE RECHERCHE===*/

#rechercher {
    color: #fff;
    padding-top: 120px;
    background-color: rgba(51, 51, 51, 0.4);

}

#background-rechercher {
   /* background: transparent url(../images/fond_pages.png) no-repeat top;*/
    background-size: cover;
    height: 100%;
    width: 100%;
}

label[for=recherche] {
    max-width: 0 !important;
    font-size: 0 !important;
    margin-left: 20px;
}

#rechercher h1 {

    text-align: center;
}

#rechercher ul {
    margin-top: 20px;
}

#rechercher h2 {

    margin-left: 20px;
}

#rechercher li,
#rechercher li:visited {
    font-size: 1.3em;
    margin-bottom: 10px;
}

#rechercher li:hover,
#rechercher li:focus,
#rechercher li:active {
    color: #FF7900;
    transition: 0.5s;
}

#rechercher a,
#rechercher a:visited {
    text-decoration: none;
    color: #fff;
}

#rechercher a:hover,
#rechercher a:focus,
#rechercher a:active {
    color: #FF7900;
    transition: 0.5s;
}

.submit,
.submit:visited {
    background-color: #FF7900;
    margin-left: 20px;
    border-color: #FF7900;
    color: #fff;
    /*border-radius: 10px;*/
    font-size: 1em;
    padding: 10px 20px;
}

.submit:hover,
.submit:focus,
.submit:active {

    /*border-color: #fff;*/
    transition: 0.5s;
    background-color: #fff;
    margin-left: 20px;
    border-color: #FF7900;
    color: #FF7900;
}

#recherche {
    margin-left: 20px;
    /*height: 20px; */
    width: 100%;
    max-width: 250px;
    /*border-radius: 10px;
    border-color: #FF7900;*/
    padding: 10px 20px;
    font-size: 1em;
}

#formulaire-recherche {
    margin-top: 50px;
}

/*===FIN RECHERCHE===*/

/*===VERSION MOBILE===*/

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

  main{
        padding-top: 0;

    }

    header {
        position: static;
        height: 70px;
        z-index: 995;

    }

	#deco_left{
	display: none;
}
	#deco_right{
	display: none;
}

    #background-header {
        background-color:#FF7900;
        width: 100%;
        height: 85px;
        position: fixed;
        left: 0;
        right: 0;
        z-index: 1000;

    }

    .conteneur{
        width: 100%;
        text-align: center;
    }
    #topbar {

        background-color: #000000;
        height: 80px;
        width: 100%;

    }

    .spip_logo{
        float: none!important;
        margin: auto 0;
        margin-top: 15px;

    }

    #logo-top {
        height: 54px;
        width: 250px;
        float: none!important;
        margin: 10px auto;
    }

    .menu-mobile{
    font-size: 1.3em!important;
    padding-top: 30px;
    padding-bottom: 27px;
    margin-left: 20px!important;
    color: #FF7900!important;

    }

    .footer-mobile{
    font-size: 1.3em!important;
    /*padding-left: 12%;*/
    margin: 0 auto;

    }
    #ul-footer-mobile{
        padding-bottom: 0!important;
    }
 /*   .footer-mobile{
    font-size: 1.3em!important;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 12%;
    margin: 0 auto;
    color: #FF7900!important;

    }
    */
    #main_nav{
        /*background-color: rgba(255, 121, 0, 1);*/
        width: 250px!important;
        margin-top: 0px;
        top:0px;
        padding-bottom: 30px;
	    background-color: #000000;
        color: #fff;
        position: absolute;
	    /*margin-left: -270px;*/
        z-index: 990;
        /*top: 55px;*/

        -webkit-transition: all .5s ease-in;
	   transition: all .5s ease-in;

       /* font-size: 1em;*/
        /*top: 100px;*/
        /*min-height: 260px;
        height: 100%;*/
    }

    #main_nav_fermer{
        height: 0;
        /*width: 250px!important;
        margin-top: 0px;
        margin-left: 0px;
        background-color: #333333!important;*/
    }

    #main_nav:target{
        /*margin-*/
        left: 0;
    }

    #main_nav ul{
        flex-direction: column;
        border-collapse: separate;
        border-spacing: 15px 50px;
        border-top: 5px solid #fff;
        padding-bottom: 30px;

    }

    #main_nav li{
        margin-left: 10px;

    }

    /*@include transform(translateX(0px));*/
    #main_nav a,
    #main_nav a:visited{
       /* display: block;
        height: 10px;
        text-align: left!important;*/
/*      line-height: 50px;
        border-bottom: 1px solid #fff;*/
    }

    #main_nav li {
        /*margin-top: 35px;
        float: none!important;*/
    }

    #main_nav a,
    #main_nav a:visited {
        /*float: none!important;
        text-decoration: none;
        color: rgba(255, 255, 255, 1);
        font-weight: bold;
        font-size: 1.3em;*/

    }

    #main_nav a:hover,
    #main_nav a:focus,
    #main_nav a:active {
       /* transition: all .5s;
        color: rgba(255, 121, 0, 1);
        transition: all .5s;*/
    }

    #main_nav a.ouvrir,
    #main_nav a.ouvrir:visited{
        background: transparent url(../images/burger-violet.png) no-repeat top;
    }

    #main_nav a.ouvrir:hover,
    #main_nav a.ouvrir:focus,
    #main_nav a.ouvrir:active{

        background: transparent url(../images/burger.png) no-repeat top;
        transition: all .5s;
    }

    #main_nav_fermer a.fermer,
    #main_nav_fermer a.fermer:visited{
        background: transparent url(../images/fermer-violet.png) no-repeat top;
    }

    #main_nav_fermer a.fermer:hover,
    #main_nav_fermer a.fermer:focus,
    #main_nav_fermer a.fermer:active{
        background: transparent url(../images/fermer.png) no-repeat top;
        transition: all .5s;

    }

    #main_nav_fermer:target #main_nav{
        /* retourne à ta place */
        /*margin-*/
        left: -270px;
    }

    #main_nav a.ouvrir,
    #main_nav a.fermer{
        /* les styles donnés précédemment */
        padding: 30px 30px;
        color: #fff;
        text-decoration: none;
        position: absolute;
        right: -100px;
        top: -45px;
        z-index: 1000;

    }

    #main_nav a.fermer{
        right: 0px;
        top: 30px;
        display: none;
    }

    #main_nav a.ouvrir{
        right: -100px;
        top: 30px;
    }

    #main_nav:target a.ouvrir{
        display: none;
    }

    #main_nav:target a.fermer{
        display: block;
    }





    #lien_nav {
        /*background-color: sandybrown;*/
       /* margin-right: 10%;
        margin-top: -315px;
        max-width: 20%;
        max-height: 60px;
        margin-left: 15%;*/
        position: absolute;
        margin-left: 90%;
        margin-right: 70px;

    }

    #search,
    #search:visited {
        background: transparent url(../images/search-mobile-violet.png) no-repeat left;
        height: 30px;
        width: 50px;
        margin: 0 20px;
        margin-right: 70px;
        padding-top: 0px;

    }

    #search:hover,
    #search:focus,
    #search:active {
        background: transparent url(../images/search-mobile.png) no-repeat left;
        height: 30px;
        width: 50px;
        margin: 0 20px;
        transition: all .5s;

    }

    #connexion {
        height: 50px;
        width: 50px;
        margin: 0 20px;
    }

    .hierarchie {
    padding-top: 30px;
    margin-left: 5%;
    }

    .hierarchie a,
    .hierarchie a:visited {
        text-decoration: none;
        color: rgba(255, 255, 255, 1);
    }

    .hierarchie a:hover,
    .hierarchie a:focus,
    .hierarchie a:active {

        color: rgba(255, 121, 0, 1);
        transition: all .5s;

    }

/*==== PAGE ACCUEIL====*/

/*---Main---*/

/*section Caroussel*/

/*section explication*/

#background_accueil {

    /*background: transparent url(../images/fond_accueil.png) no-repeat top;*/
    background-size: cover;
    height: 100%;
    width: 100%;
    color: #fff;
    min-height: 100%;

}





#explication_accueil p {
    text-align: center;
    font-size: 1.3em;
    max-width: 940px;
    width: 100%;
    margin-bottom: 50px;
    margin-top: 0;
}

#explication_accueil h2 p {
    text-align: center;
    font-size: 1.500em;
    max-width: 940px;
    width: 100%;
    margin-top: 50px;
    margin-bottom: 0;
}

.home_iframe {
    border: none;
    background-color: black;
    width: 100%;
    height: 600px;

}

/* section Article*/

#article-accueil article {
    display: flex;
    flex-wrap: wrap;
}

#article_content {
    flex-wrap: wrap;
    z-index: 900;

}

.text_article {
    max-width: 780px;
    width: 100%;
}

.text_article h3 {
    font-size: 1.500em;

}

.text_article ul.spip li {

    font-size: 1.3em;
    text-align: left;

}

#logo-home {
    padding-top: 100px;
    max-width: 140px;
    width: 100%;
}

/*====FIN PAGE ACCUEIL====*/

 /*====PAGE RUBRIQUE====*/

#background_rubrique {

    /*background: transparent url(../images/fond_pages.png) no-repeat top;*/
    background-size: cover;
    min-width: 100%;
    color: #fff;
    height: 100%;

}

#rubrique {}

#explication_rubrique {
    box-sizing: content-box;
    background-color: rgba(51, 51, 51, 0.4);
    text-align: left;
    height: 100%;
    padding: 0 20px;
    max-width: 940px;
    margin: 0 auto;

    margin-top: 50px;
    padding-bottom: 50px;
    width: 80%;
}

#explication_rubrique h2 p{
    font-size: 1.5em;
    text-align: center;
    max-width: 940px;
    width: 100%
}

#explication_rubrique p {
    font-size: 1.5em;
    padding: 0;
    text-align: left;

}

/*---article rubrique---*/

section#article_rubrique {
    padding: 55px 0;
}

#rubrique_content {
    flex-wrap: wrap;
}

.rotate {
    /* Safari */
    -webkit-transform: rotate(-45deg);
    /* Firefox */
    -moz-transform: rotate(-45deg);
    /* IE */
    -ms-transform: rotate(-45deg);
    /* Opera */
    -o-transform: rotate(-45deg);
    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.5);
}

/* article*/

article.miniature {
    position: relative;
    margin: 0 auto;
    margin-bottom: 100px;

}

#article {
    text-decoration: none;
}

article.miniature.col-4,
article.miniature.col-4:visited {}

article.miniature.col-4:hover,
article.miniature.col-4:focus,
article.miniature.col-4:active {
    /*box-shadow: 5px 5px 0px rgba(136, 186, 9, .8);*/
    color: #FF7900;
    transition: all .5s;

}

#img-rubrique img {
    width: 300px;
    height: 225px;
}

p.new {
    color: #fff;
    background-color: #FF7900;
    text-transform: uppercase;
    position: absolute;
    top: 0;
    left: 0px;
    padding: 0 15px
}

div.infos,
div.infos:visited {
    background-color: #fff;
    padding: 10px 20px;
    text-align: left;
    height: 400px;
    color: rgba(0, 0, 0, 1);

}

div.infos:hover,
div.infos:focus,
div.infos:active {
    transition: all .5s;
    color: #FF7900;
    transition: all .5s;

}

div.infos p,
div.infos p:visited {
    transition: all .5s;
    color: rgba(0, 0, 0, 1);
    transition: all .5s;
}

div.infos h3 {
    font-size: 1.5em;
    padding-bottom: 10px;
    padding-top: 0px;
}

div.infos p {
    margin: 0;
    font-size: 1.3em;
}

div.infos p:last-of-type {
    margin-bottom: 0;
}

/*====FIN PAGE RUBRIQUE====*/

/*====PAGE ARTICLE====*/

#background_article {
    /*background: transparent url(../images/fond_pages.png) no-repeat top;*/
    background-size: cover;
    width: 100%;
    color: #fff;
    min-height: 100%;
    padding-bottom: 50px;

}

#explication_article {
    margin-top: 50px;
    margin-bottom: 30px;

}

.background-div {
    background-color: rgba(51, 51, 51, 0.5);
    /*text-align: left;*/
    height: 100%;
    padding-bottom: 50px;
    padding-top: 0;
    width: 80%;
    margin: 0 auto;

}

#explication_article h2 {
    font-size: 1.5em;
    margin-top: 30px;
    text-align: center;
    max-width: 940px;
    width: 100%;
    margin-bottom: 30px;
}

#explication_article p {
    font-size: 1.3em;
    padding: 0 0 20px 0;
    text-align: left;
    padding: 0 20px;
    max-width: 940px;
    width: 100%
}
#explication_article ul li {
    font-size: 1.3em;
    padding: 0 0 20px 0;
    text-align: left;
    padding: 0 20px;
    max-width: 940px;
    width: 100%
}

#explication_article ul li ul li {
    font-size: 1em;
    padding: 0 0 20px 0;
    text-align: left;
    padding: 0 20px;
    max-width: 940px;
    width: 100%
}

#explication_article li {
    font-size: 1.3em;
}

#img-article img {
    max-width: 100%;
    height: auto;
    border: 0;
}

dl dt img{
    max-width: 100%;
    height: auto;
    border: 0;
}

dl dt a img{
   min-height: 100%;
    text-align: center;
    /*margin: 50px;*/
    margin: 0 50%;
    }






/*===FIN ARTICLE===*/

/*===FORMULAIRE===*/

fieldset {
    max-width: 500px;
    margin-left: 0px;
    padding: 0 0;
    text-align: left;
    margin-bottom: 20px;
    border: 0px;
}

fieldset legend {
    font-size: 1.500em;
    position: relative;
    text-align: center;
    width: 940px;
    padding-right: 50%;
}

li fieldset legend {
    font-size: 1.300em;
    text-align: left;
    margin-bottom: 50px;
    /*background-color: aqua;*/
    max-width: 400px;
}

    form p input{
        margin-right: 50%;
    }
/*---Edition du formulaire---*/

label {
    display: block;
    font-size: 1em;
    /*background-color: blueviolet;*/
    font-weight: 400;
    margin-bottom: 0px;
    padding-bottom: 30px;
    max-width: 400px;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    text-align: center;
}

li input {

    font-size: 1em;
    margin-bottom: 50px;
    max-width: 350px !important;
    border-color: #FF7900;
    border-radius: 10px;
    padding: 10px 20px;
    float: left;
}

label[for=civilite_madame] {
    max-width: 200px !important;
    top: 10px;
    display: contents;

}

    label[for=civilite_madame] #text {
    margin-left: 100px;

}
label[for=civilite_madame] input{
    max-width: 200px !important;
    margin: 0;
    /*margin-right: 350px;*/
    left: 0;
}

label[for=civilite_monsieur] {
    max-width: 200px !important;
    top: 10px;
    display: contents;
}

    label[for=civilite_monsieur] input{
    max-width: 200px !important;
    margin: 0;
    /*margin-right: 350px;*/
    left: 0;
}
li textarea {
    font-size: 1em;
    margin-bottom: 50px;
    border-color: #FF7900;
    border-radius: 10px;
    padding: 10px 20px;
    width: 400px;
    height:200px;
}

/*label[for=infolettre] {
    width: 900px !important;

}*/

label[for=infolettre] input {
    margin-bottom: 10px;

}

.choix {
    margin-top: 0px;

}

ul.editer-groupe li {
    list-style-type: none;

    /*background-color: aquamarine;*/
    max-width: 700px;
    width: 50%;
    /*margin: 0 auto;*/
}

/*---Fin de l'édition---*/

/*---Prévisualisation du message à envoyer---*/

fieldset.previsu {
    padding-left: 0;
}

.previsu ul {
    list-style: none;
}

.previsu li {
    font-weight: 400;
}

.previsu li strong {
    font-weight: 400;
    /*background-color: aqua;*/
    color: #FF7900;
    display: block;
    font-size: 1em;
    font-weight: 400;
    float: left;
    margin-bottom: 0px;
    text-decoration: underline;
    max-width: 940px !important;
    width: 100% !important;
}

.previsu li div strong {
    width: 300px;
    float: none;
}

.previsu li p {
    font-weight: 400;
    font-size: 1em !important;
    text-align: left !important;
    margin-top: 0 !important;
    max-width: 940px !important;
    width: 100% !important;
}

/*---Fin de Prévisualisation---*/

/*===FIN FORMULAIRE===*/

    }

/*===FIN VERSION MOBILE*/

/*HEADER 2*/
	#header2{
		width: 100%;
		height: 160px;

	}

	#containerA{
		width: 100%;
		height: 100px;
		border-bottom: solid 1px #333333;
	}
		#containerB{
		width: 100%;
		height: 60px;
		border-bottom: solid 1px #333333;
	}

	#thinginthefuture{

		width: 960px;
		height: 100px;
		margin: 0 auto;
	}

	#thinginthefuture img{
		float: left !important;
		margin: 25px 25px 25px 0;
	}

	H1 {
		color: white;
		padding-top: 38px;
		margin: 0;
		font-size: 40px;
		font-weight: bolder;
		width: 100%;
	}

	#menu2{

		width: 960px;
		height: 60px;
		margin: 0 auto;
		padding-top: 20px;
	}

	#menu2 li{
		display: inline;
		color: white;
		margin-right: 20px;
	}

	#menu2 li a{
		color: white;
		text-decoration: none;
		font-size: 18px;
		font-weight: bolder;
	}

	#menu2 li a:hover{
		color: #FF7900;
		/*text-decoration: none;*/
	}
	.no_text {
    font-size: 0;
    margin: 0;
}
	#search2 img{
		width: 25px;
		height: auto;
		float: right;
		margin-right: 20px;

	}

/*FIN HEADER 2*/
.titre_hp{
	color:#ff7900;
}

.ico_hp img{
	width: 50px;
	height: auto;
	float: right;
	margin-right: 25px;
	margin-top: 25px;
}

a {
    text-decoration: none;
    color:white;
}
a:hover {
    color:#ff7900;
}