﻿@charset "utf-8";

html, body{
    height:100%;
    }

/* MENU */
.navbar {
    margin-bottom: 0;
    background-color: red;
    z-index: 9999;
    border: 0;
    font-size: 12px !important;
    line-height: 1.42857143 !important;
    letter-spacing: 2px;
    border-radius: 0;
    font-family: Montserrat, sans-serif;
    }
.navbar li a, .navbar .navbar-brand {
    color: #fff !important;
    }
.navbar-nav li a:hover, .navbar-nav li.active a {
    color: red !important;
    background-color: #fff !important;
    }
.navbar-default .navbar-toggle {
    border-color: transparent;
    color: #fff !important;
    }
@media screen and (max-width: 765px) {
    .navbar-nav > li > a {
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 20px;
    }
}

.navbar .navbar-header div {
    color:white;
}

/* .container-fluid{
    overflow-y: auto;
    height:100%;
} */

/* DLG infoMunicipale items Années précédentes */
.infoItemsDlgContainer{
    display: flex;
    flex-direction:column;
    /*flex-grow:1; */
    padding-left:10px;
}
.infoItemsDlg{
    flex-grow: 1;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
}




/* MENU DE SECTION */
.NavSection{
    background-color:red;
    width:100%;
    z-index:99;
    }
.NavSection .ButtonContainer{
    width: 32px;
    padding-top: 3px;
    padding-bottom: 3px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    border-radius: 3px;
}
.NavSection .ButtonContainer:hover{
    background-color: black;
}
.NavSection .Container{
    position:absolute;
    color: white;
    width: 100%;
    height:0px;
    overflow: hidden;
    transition: height 0.5s;
}
.NavSection .Container table ul{
    margin:0px;
}
.NavSection .Container table{
    position:absolute; 
    bottom:0px;
    left:0px;
    width:100%;
    background-color:red;
}
.NavSection .Container .Item{
    padding:0px;
    display:block;
    /*min-height: 10px;
    background-color:aqua;*/
}
.NavSection .Container .Item:hover{
    min-height: 10px;
    background-color: black;
    cursor: pointer;
}
.affix {
    top:50px;
    }

/* L'ENTÊTE */
.Entete{
    position:relative;
    text-align: center;
    /*background-attachment:fixed ;*/
    z-index: 1;
    }

.EnteteBig {
    top: 0px;
    height:85%;
    background-size: cover;
    background-position: center;
    min-height:355px;
}

@media screen and (max-width: 1023px) {
    .EnteteBig {
        top: 0px;
        height: 83%;
        background-size: cover;
        background-position: center;
        min-height: 300px;
    }
}
@media screen and (max-width: 400px) {
    .EnteteBig {
        top: 0px;
        height: 20%;
        background-size: cover;
        background-position: center;
        min-height: 355px;
    }
}

/* IPAD PRO */
@media screen and (min-width: 1023px) and (max-width: 1024px)  {
    .Entete {
        position: relative;
        text-align: center;
        background-attachment:local;
        z-index: -1;
    }
    .EnteteBig {
    top: 0px;
    height:73%;
    background-size: cover;
    background-position: center;
    min-height:520px;
}

}
@media screen and (min-width: 1365px) and (max-width: 1366px)  {
    .Entete {
        position: relative;
        text-align: center;
        background-attachment:local;
        z-index: -1;
    }
}

.EnteteSmall {
    height:400px;
    margin-top:30px;
    text-align: center;
    color:aliceblue;
}
.Entete .Pellicule{
    position:absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: RGBA(10,10,10,0.2);
    }

.Entete .HeaderBig {
    margin-top: 25%;
}
@media screen and (max-width: 500px) {
    .Entete .HeaderBig {
        margin-top: 15%;
        /*min-height: 700px;*/
    }
}
.Entete .HeaderSmall {
    margin-top: 5%;
}

.MainHeaderContainer {
    position:relative;
    height:100%;
    min-height: 700px;
    margin-top: 50px;
}
@media screen and (max-width: 500px) {
.MainHeaderContainer {
    position:relative;
    height:700px;
    min-height: 700px;
    margin-top: 50px;
}
}

.Entete .smallHeader{
    font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    text-transform:uppercase;
    position: absolute;
    /*margin-top: 5%;*/
    color:aliceblue;
    width: 100%;
    text-align: center;
    }
.Entete .smallHeader .TitreItem0{
    font-size: 30px;
    position: relative;
    top: 5px;
    }
.Entete .smallHeader .TitreItem1{
    font-weight:700;
    font-size:75px;
    line-height:75px;
    }
.Entete .TitreItem0{
    font-size: 30px;
    text-transform:uppercase;
    position: relative;
    top: 5px;
    }
.Entete .TitreItem1{
    font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    text-transform:uppercase;
    font-weight:700;
    font-size:75px;
    line-height:75px;
    }
.Entete .TitreItem2{
    font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    text-transform:uppercase;
    position: relative;
    left: 0px;
    }
.Entete .Logo{
    position: relative;
    left: 0px;
    top: 0px;
    width: 127px;
    margin-top: 28px;
    }

.Entete_BGImage_1{
    background-image : url('../../IMG/index/office.jpg'); /*La_trinité-des-Monts.jpg');*/
}
.Entete_BGImage_2{ 
    background-image : url('../../IMG/index/DSCF6416.jpg'); /*DSCF6416  DSCF1852*/
    background-repeat:no-repeat;
    background-size:100%;
    background-position: center 35%;
}
.Entete_BGImage_3{
    background-image : url('../../IMG/index/DSCF0443.jpg');
    background-repeat:no-repeat;
    background-size:100%;
    background-position: center 20%;
}
.Entete_BGImage_4{
    background-image : url('../../IMG/index/DSCF4209.jpg');
    background-repeat:no-repeat;
    background-size:100%;
    background-position: center center;
}

@media screen and (max-width: 550px) {
.Entete_BGImage_2{
    background-image : url('../../IMG/index/DSCF6416.jpg'); /* DSCF6416.jpg   DSCF1852.jpg */
    background-repeat:no-repeat;
    background-size:auto 100%;
    background-position: center top;
}
.Entete_BGImage_3{
    background-image : url('../../IMG/index/DSCF0443.jpg');
    background-repeat:no-repeat;
    background-size:auto 100%;
    background-position: center top;
}
.Entete_BGImage_4{
    background-image : url('../../IMG/index/DSCF4209.jpg');
    background-repeat:no-repeat;
    background-size:auto;
    background-position: center center;
}

}

.TitrePage{
    padding-top:50px;
    background-color:red;
    }
.TitrePage h1{
    font-family:Montserrat;
    font-weight:700;
    text-transform:uppercase;
    color:white;
    background-color:red;
    text-align:center;
    margin:0px;
    padding-top:20px;
    }

/* LE CONTAINER PRINCIPALE */
.pageContainer {
    /*overflow-y:auto;*/
}
.pageContainer .SousPageContainer{
    overflow-y:auto;
    position:relative;
    height:100%;
    width:100%;
    top:0px;
    left:0px;
    padding-right: 0px;
    padding-left: 0px;
}

/* NOTE DE BAS DE PAGE */
.MyFooter{
    background-color: darkblue;
    padding-bottom: 123px;
    position:relative;
    /*height:450px;*/
}
.MyFooter table{
    width:100%;
    margin:10px;
    color:  gainsboro;
}
.MyFooter .titre{
    font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    text-transform:uppercase;
    font-weight:700;
    font-size: 39px;
    line-height: 1.1;
}
.MyFooter a img {
    width: 95px;
}


/* TÉLÉCHARGEMENT ET VISUALISATION DES FICHIERS PDF*/
.pdfRow{
    padding:5px;
    color: #0f0f0f;
}
.pdfRow a:hover{
    color:red;
    text-decoration: none;
}
.pdfRow .imageContainer{
    width:40px;
    display: inline-block;
}
.pdfRow .imageContainer:hover{
    background-color:red;
    cursor: pointer;
}
.pdfRow img{
    width:20px;
    position: relative;
    left: 25%;
}


/* LE SÉPARATEUR DE SECTION */
#idSectionContainer .outBar{
    width: 100%;
    overflow: hidden;
}
#idSectionContainer .outBar .bar{
    position: relative;
    left: -5%;
    width: 110%;
    height: 31px;
    /*
    box-shadow: 0px 4px 10px 1px #4c4c4c;
    box-shadow: 0px 4px 8px -6px black inset;
    background-color: rgba(0,0,0,0.02);
    */
    box-shadow: 0px 7px 5px -8px #777 inset;
    /*
    box-shadow: 0px 0px 16px -5px black inset;
    box-shadow: 0px 0px 6px -2px black inset;
    background-color: #FFFDFD;
    background-color: white;
    */
    margin-top:50px;
}


/*  MODIFIER LA PRÉSENTATION DE BOOTSTRAP*/
.container .row h1{
    /*line-height: 50px;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #337ab7;
    font-weight: 700;*/
    /*font-size: 36px;*/
}
.container .row h3 {
    /*color: #818181;
    font-family: Montserrat;
    font-weight: 500;
    line-height: 1.1;*/
}
.container .row h2 {
    /*font-size:18px;*/
}

.carousel-inner div img {
    border: 1px solid gray;
    box-shadow: 0px 0px 5px 0px black;
    padding: 10px;
}
@media screen and (max-width: 500px) {
    .carousel-indicators .active {
        margin:10px;
    }
    .carousel-indicators li {
        margin:10px;
        padding:6px;
    }
}
.carousel .carousel-control {
    background-image: none;
}

/* PHOTO DU MÈRE */
.mairePhoto{
    position: relative;
    border: 10px solid White;
    box-shadow: 0px 0px 6px -1px black;
    max-width: 407px;
}
@media screen and (max-width: 407px) {
    .mairePhoto{
        position: relative;
        max-width: 407px;
        border: 0px solid White;
        max-width: 305px;
    }
    .col-xs-2, .col-md-1{
        padding-left:0px;
        min-width: 407px;
        align-content: center;
    }
}

/* SECTION HISTOIRE */
.HistoireSection {text-align:justify;}
.HistoireSection .col-md-3, .HistoireSection .col-md-9{margin-top:15px;}
@media (max-width: 992px){.HistoireSection .col-md-9 {margin-top:0px;}}
@media (min-width: 992px){.HistoireSection .col-md-3 {text-align:right;}}

.cover-image {
    background-attachment: fixed;
    height:100%;
    z-index: -1;
    position: relative;
    top: 0px;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

.bottomSpace {
    margin-bottom:20px;
}

h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
    margin-bottom: 5px;
}
h1{
    line-height: 50px;
    color: #337ab7;
    font-weight: 700;
}
h2 {
    /*text-transform: uppercase;*/
    color: #303030;
    font-weight: 200;
}
h3 {
    color: #818181;
    font-weight: 500;
}
h4 {
    color: #303030;
    font-weight: 400;
}

.paddingLeftNone {
padding-left:0px;
}
