/*******************************/
/*******************************/
/*********** PENSEES ***********/
/*******************************/
/*******************************/
body {
    font-family:  "Gill Sans",Open Sans, sans-serif;
    background: url('../assets/tronc.svg') repeat-y center;
}
strong {
    font-weight: bold;
}
header {
    background: url('../assets/cime.svg') no-repeat center;
    height: 555px;
    margin-bottom: 50px;
}
footer {
    background: url('../assets/racine.svg') no-repeat center;
    height: 510px;
}
/*fond blanc derriere le titre principal*/
header div#fondBlanc{
    font-size: 1em;
    background-color: rgba(255, 255, 255, 0.8);
    max-width: 26em;
    padding-top: 2em;
    margin-left: 2em;
}
header div#fondBlanc div#logo{
    font-size: 3em;
    font-weight: bold;
    /*float: left;
    position: absolute;
    overflow: visible;*/
    /*background: url('../assets/logo-Nevers-Pensees.png') no-repeat center;*/
    color: #2526A9;
    margin-left: 0.33em;
    margin-top: 0.55em;
}
header div#fondBlanc h1 {
    font-size: 3em;
    font-weight: bold;
    color: #2526A9; /*#39b54a;*/
    /*padding-top: 1em; */
    margin-left: 0.33em; /* 3.5em;*/
    max-width: 12em;
}
header div#fondBlanc h2 {
    font-size: 1em;
    font-style: italic;
    color: #333333;
    padding-top: 1em;
    margin-left: 1em;
    margin-top: -0.5em;
    max-width: 25em;
}

header a#affForm {
    margin-left: 3em;
    padding: 1em;
    color: #fff;
    background-color: #2526A9;
    border-radius: 1em;
    display: inline-block;
    margin-top: 1em;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.5s ease-in;
}
header a#affForm:hover {
    background-color: rgba(57,181,94, 0.8);
    transition: background-color 0.5s ease-in;
}

/* Branches */
div.branche {
    background-image : url('../assets/branche.svg');
    background-position: center;
    background-repeat: no-repeat;
    height: 200px;
    width: 630px;
    margin-top: -50px;
}
div.branche.droite {
    margin-left: calc((100%/2) + (20px));
}
div.branche.gauche {
    background-image : url('../assets/branche-gauche.svg');
    margin-left: calc((100%/2) - (650px));
}
div.branche span.numbranche {
    color: beige;
    font-weight: bold;
    font-size: 1.5em;
}
div.branche.droite span.numbranche {
    margin-left: -1em;
}
div.branche.gauche span.numbranche {
    margin-left: 102%;
}
div.branche span.pensee {
    display: inline-block;
    height: 48px;
    width: 48px;
    background-color: #cfa586;
    margin-left: 50px;
    margin-top: 15px;
    cursor: pointer;
    border-radius: 24px;
}
div.branche.droite span:nth-of-type(2) {
    margin-left: 75px;
}
div.branche.gauche span:first-of-type {
    margin-left: 130px;
}

/* Recherche */
form#recherche {
    background-color: #2526A9;;
    padding: 1.5em;
    position: fixed;
    color:#fff;
    right: 20px;
    top: calc((100%/2) - (30px));
}
form#recherche label {
    display: block;
    margin-bottom: 0.5em;
    font-weight: bold;
}
form#recherche a#navLink {
    display: inline-block;
    text-decoration: none;
    color: #fff;
    padding-left: 1em;
    padding-right: 1em;
}

/* Fenêtre d'ajout */
div#masque {
    display: none;
    position: fixed;
    top:0; right:0; bottom:0; left:0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}
div#masque:target {
    display: block;
}
div#masque div#fenetre {
    width: 570px;
    background-color: #fff;
    margin: 220px auto; /*300*/
    border-radius: 5px;
}
div#masque div#fenetre a#btn_close {
    color: #fff;
    background-color: saddlebrown;
    display: block;
    float: right;
    width: 32px;
    height: 32px;
    padding-top: 1em;
    text-align: center;
    font-weight: bold;
    text-decoration: none;
}
div#masque div#fenetre a#btn_close:hover {
    background-color: #2526A9;
}
div#masque div#fenetre h2 {
    background-color: #2526A9;
    padding: 1em 1em 1em 1em;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}
div#masque div#fenetre form {
    padding: 1em 2em;
}
div#masque div#fenetre form fieldset {
    margin-top: 1em;
}
div#masque div#fenetre form input[type="text"] {
    margin-top: 1em;
    display: inline-block;
}
div#masque div#fenetre form label.text {
    display: inline-block;
}
div#masque div#fenetre form input[type="submit"] {
    display: block;
    margin-top: 1em;
    cursor: pointer;
    margin-left: 11em;/**/
    padding: 1em;
    color: #fff;
    background-color: #2526A9;
    border-radius: 1em;
    display: inline-block;
    margin-top: 1em;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.5s ease-in;
}
/*mentions dans le formulaire*/
div#masque div#fenetre div.mentionsForm{
    font-size: 0.8em;
    font-style: italic;
    color: #333333;
    padding-top: 1em;
    padding-bottom: 1em;
}
div#fenetre div#reponse {
    padding: 1em;
    text-align:center;
}

/* Affichage de la pensée */
div.affPensee {
    position: absolute;
    text-align: center;
    background-color: #39b54a;
    padding: 1em;
    border-radius: 5px;
    margin-top: 0;
}
div.affPensee br {
    margin: 0.25em 0;
}

/* Affichage des icones dans le formulaire d'ajout*/
span.saisiepensee {
    display: inline-block;
    height: 48px;
    width: 48px;
    background-color: #2526A9;;
    margin-left: 7px;
    cursor: pointer;
    border-radius: 24px;
}

span.saisiepensee input {
    margin-top: 34px;
}

/* Affichage icone pensée*/
span.ange {
    background-image : url('../assets/icons/ange.svg');
}
span.bougie {
    background-image : url('../assets/icons/bougie.svg');
}
span.coeur {
    background-image : url('../assets/icons/coeur.svg');
}
span.colombe {
    background-image : url('../assets/icons/colombe.svg');
}
span.orchidee {
    background-image : url('../assets/icons/orchidee.svg');
}
span.pensees {
    background-image : url('../assets/icons/pensees.svg');
}
span.rose {
    background-image : url('../assets/icons/rose.svg');
}
span.ruban {
    background-image : url('../assets/icons/ruban.svg');
}
span.visage {
    background-image : url('../assets/icons/visage.svg');
}

/*mentions en bas de page*/

/* Fenêtre des mentions légales */
div#masqueMentions {
    display: none;
    position: fixed;
    top:0; right:0; bottom:0; left:0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}
div#masqueMentions:target {
    display: block;
}
div#masqueMentions div#fenetreMentions {
    width: 950px;
    background-color: #fff;
    margin: 60px auto; 
    border-radius: 5px;
    padding-bottom: 3em;
}
div#masqueMentions div#fenetreMentions a#btn_closeMentions,
div#masqueMentionsDP div#fenetreMentionsDP a#btn_closeMentionsDP,
div#masqueMentionsCookies div#fenetreMentionsCookies a#btn_closeMentionsCookies {
    color: #fff;
    background-color: saddlebrown;
    display: block;
    float: right;
    width: 32px;
    height: 32px;
    padding-top: 1em;
    text-align: center;
    font-weight: bold;
    text-decoration: none;
}
div#masqueMentions div#fenetreMentions a#btn_closeMentions:hover,
div#masqueMentionsDP div#fenetreMentionsDP a#btn_closeMentionsDP:hover,
div#masqueMentionsCookies div#fenetreMentionsCookies a#btn_closeMentionsCookies:hover {
    background-color: #2526A9;
}
div#masqueMentions div#fenetreMentions h2 {
    background-color: #2526A9;
    padding: 1em 1em 1em 1em;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}
div#masqueMentions div#fenetreMentions h3 {
    padding: 1.5em 1em 1em 1em;
    font-weight: bold;
    text-transform: uppercase;
}
div#masqueMentions div#fenetreMentions p{
    font-size: 1em;
    font-style: italic;
    color: #333333;
    margin-left: 2em;
    margin-right: 1em;
    margin-bottom: 0.3em;
}

/* Fenêtre des mentions Données Personnelles */
div#masqueMentionsDP {
    display: none;
    position: fixed;
    top:0; right:0; bottom:0; left:0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}
div#masqueMentionsDP:target {
    display: block;
}
div#masqueMentionsDP div#fenetreMentionsDP {
    width: 950px;
    background-color: #fff;
    margin: 60px auto; 
    border-radius: 5px;
    padding-bottom: 3em;
}
div#masqueMentionsDP div#fenetreMentionsDP h2 {
    background-color: #2526A9;
    padding: 1em 1em 1em 1em;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}
div#masqueMentionsDP div#fenetreMentionsDP h3 {
    padding: 1.5em 1em 1em 1em;
    font-weight: bold;
    text-transform: uppercase;
}
div#masqueMentionsDP div#fenetreMentionsDP p{
    font-size: 1em;
    font-style: italic;
    color: #333333;
    margin-left: 2em;
    margin-right: 1em;
    margin-bottom: 0.5em;
}

/* Fenêtre des mentions Cookies */
div#masqueMentionsCookies {
    display: none;
    position: fixed;
    top:0; right:0; bottom:0; left:0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}
div#masqueMentionsCookies:target {
    display: block;
}
div#masqueMentionsCookies div#fenetreMentionsCookies {
    width: 950px;
    background-color: #fff;
    margin: 60px auto; 
    border-radius: 5px;
    padding-bottom: 3em;
}
div#masqueMentionsCookies div#fenetreMentionsCookies h2 {
    background-color: #2526A9;
    padding: 1em 1em 1em 1em;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}
div#masqueMentionsCookies div#fenetreMentionsCookies h3 {
    padding: 1.5em 1em 1em 1em;
    font-weight: bold;
    text-transform: uppercase;
}
div#masqueMentionsCookies div#fenetreMentionsCookies p{
    font-size: 1em;
    font-style: italic;
    color: #333333;
    margin-left: 2em;
    margin-right: 1em;
    margin-bottom: 0.5em;
}

/* Liens en bas de page Mentions, nous contacter... */
footer div#mentionsAboveLinks {
    height: 1em;
}

footer div#mentionsLinks {
    font-size: 1em;
    font-style: italic;
    text-decoration: none;
    background-color: #2526A9;
    color: #fff;
    margin-top: 23em;
    margin-left: 3em;
    padding-left: 2em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    width: 40em;
}
footer div#mentionsLinks a {
    text-decoration: none;
    color: #fff;
    margin-right: 2em;
}
footer div#mentionsLinks a:hover {
    text-decoration: underline;
    color: #eee;
}