@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');

/****************   ****************/
/*** ÉLÉMENTS PRINCIPAUX DE BASE ***/
/****************   ****************/

#bandeauHaut {
min-height: 94px !important; background-color: #fff;}


#ariane {display: none;}
#footer {background: #fff;}
.paragraphe {margin: 0 0 0 0;}
.paragraphe .innerParagraphe h2 {border-bottom: none;}
#document {background: #f1f4f9;}
.paragraphe.txt .innerParagraphe h2 {font-family: 'Roboto';}
#menuHorizontal {display: none;}


#contenu {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
background: #fff;
}

.titrePage {
letter-spacing: 0.08em;
margin: 30px 0 15px 0;
}

#footer a {color: #ff8400;}

/* Cartes */
.map {width: 100% !important;}


/****************   ****************/
/*******  MENU PRINCIPAL  *******/
/****************   ****************/

#menu ul.menuNiv1 li.nav1 .aNiv1 span,
#menu ul.menuNiv1 li.nav1 .aNiv1 {padding: 0 0 0 0;}

#menu ul.menuNiv1 li.nav1 .aNiv1.hasChild .titleNiv1,
#menu ul.menuNiv1 li.nav1 .aNiv1 {
background: none;
text-align: center;
}
#menu ul.menuNiv1 li.nav1 .aNiv1 span, #menu ul.menuNiv1 li.nav1 .aNiv1 span.big {font-family: 'Roboto';}

#menu li.selected {border-bottom-color: #ff8400 !important;}

#menu ul.menuNiv1 li.nav1:nth-child(2):hover {border-bottom-color: #f85f73;}
#menu ul.menuNiv1 li.nav1:nth-child(3):hover {border-bottom-color: #52d681;}
#menu ul.menuNiv1 li.nav1:nth-child(4):hover {border-bottom-color: #ffd200;}
#menu ul.menuNiv1 li.nav1:nth-child(6):hover {border-bottom-color: #3490de;}
#menu ul.menuNiv1 li.nav1:nth-child(7):hover {border-bottom-color: #ff8400;}

/****************   ****************/
/*******  SOUS MENU PARTI "LES ÉLUS"  *******/
/****************   ****************/
#par31134 ul,
#par31138 ul,
#par31142 ul,
#par31144 ul {
display: flex;
margin: 30px 0 10px 0;
overflow: visible;
} 
#par31134 ul li,
#par31138 ul li,
#par31142 ul li,
#par31144 ul li {
background-color: #fff;
background-image: none;
margin: 0 2px;
position: relative;
padding-left: 0px;
background-position: 0% 0%;
} 

#par31134 ul li a,
#par31138 ul li a,
#par31142 ul li a,
#par31144 ul li a {
font-family: 'Roboto';
font-size: 1.1em;
letter-spacing: 0.0625em;
padding: 8px 12px 8px 12px;
color: #000;
} 

#par31134 ul li a:hover, 
#par31138 ul li a:hover, 
#par31142 ul li a:hover, 
#par31144 ul li a:hover {
text-decoration: none;
background-color: #ff8400;
}

#par31134 ul li:nth-child(1),
#par31138 ul li:nth-child(1),
#par31142 ul li:nth-child(1),
#par31144 ul li:nth-child(1) {margin-right: 30px;}

#par31134 ul li:nth-child(1)::after,
#par31138 ul li:nth-child(1)::after,
#par31142 ul li:nth-child(1)::after,
#par31144 ul li:nth-child(1)::after {
content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    background-image: url(http://www.sud-gresivaudan.org/uploads/Image/06/51854_724_arrow-point-to-right.png);
    background-repeat: no-repeat;
    top: 50%;
    margin-top: -8px;
    transform: scale(0.8);
    right: -25px;
    z-index: 2;
}

#par31136 h2, #par31146 h2, #par31148 h2, #par31150 h2 {
font-family: 'roboto-black';
font-size: 2.667em;
letter-spacing: 0.08em;
text-transform: none;
margin: 15px 0 30px 0;
}

.institution-landing #par31134 ul li:nth-child(1) a,
#par31138 ul li:nth-child(2) a,
#par31142 ul li:nth-child(3) a,
#par31144 ul li:nth-child(4) a {font-weight: 700; background-color: #ff8400;}


/****************   ****************/
/*******  PARAGRAPHES  *******/
/****************   ****************/

.PRS_WIDTH_66G {
position: relative;
background: white;
border-bottom: 1px solid #f1f4f9;
}

.PRS_WIDTH_66G .innerParagraphe {padding: 15px; margin: 0 0 5px 0;}

.PRS_WIDTH_66G h2, .TPL_FORMULAIRE h2 {position: relative; margin-left: 30px;}

#par31474 h2 {text-align: center;}

.PRS_WIDTH_66G h2::before, .TPL_FORMULAIRE h2::before  {
content: "";
position: absolute;
width: 16px;
top: 0;
left: 0;
height: 100%;
margin-left: -28px;
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/be/51698_714_diagonal-arrow.png);
background-repeat: no-repeat;
background-position: 50% 50%;
}

.paragraphe .innerParagraphe p {margin: 0 0 0 0;}
.paragraphe .innerParagraphe h2 {font-family: 'Roboto'; text-transform: uppercase;}

.institution-landing .PRS_WIDTH_66G .innerParagraphe {margin-left: 30px;}
.institution-landing .PRS_WIDTH_66G .innerParagraphe::before {
content: "";
position: absolute;
width: 32px;
height: 32px;
background-repeat: no-repeat;
top: 45px;
margin-left: -60px;
}

.institution .PRS_WIDTH_66G h2::before {
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/40/51836_984_diagonal-arrow-orange.png);
}
.PRS_WIDTH_66G h2::before {
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/40/51836_984_diagonal-arrow-orange.png);
}

.institution-landing .PRS_WIDTH_66G .innerParagraphe::before {
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/c7/51837_984_diagonal-arrow-orange-big.png);
}

.institution-landing .PRS_WIDTH_66G h2::before {display: none;}

.institution-landing .PRS_WIDTH_66G h2 {margin-left: 0;}

.PRS_WIDTH_66G .innerParagraphe a:hover {text-decoration: none;}

#par31474 .boutons-landing {
position: relative;
margin: 10px 30px 0 0;
display: flex0
align-items: center;
overflow: hidden;
float: right;
clear: both;
}

#par31474 a {
font-size: 0.95em;
letter-spacing: 0.04em;
color: #333;
padding: 12px 24px 12px 38px;
background-color: #f1f4f9;
}
#par31474 a:hover {text-decoration: none;}

#par31474 a::before {
content: "";
position: absolute;
width: 16px;
height: 16px;
margin-left: -22px;
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/a3/51618_481_arrow-right.png);
transform: scale(0.8);
transform: scale(0.8);
}

#par31474 .boutons-landing::before {
background-color: #ff8400;
}

/****************   ****************/
/*******  CSS des liens LANDING Institution  *******/
/****************   ****************/
.boutons-landing {
position: relative;
margin: 10px 0 0 0;
display: flex;
align-items: center;
overflow: hidden;
float: right;
clear: both;
}
.institution-landing .PRS_WIDTH_66G .innerParagraphe a {
font-size: 0.95em;
letter-spacing: 0.04em;
color: #333;
padding: 12px 24px 12px 38px;
background-color: #f1f4f9;
}

.institution-landing .PRS_WIDTH_66G .innerParagraphe a::before {
content: "";
position: absolute;
width: 16px;
height: 16px;
margin-left: -22px;
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/a3/51618_481_arrow-right.png);
transform: scale(0.8);
transform: scale(0.8);
margin-top: -2px;
}

.institution-landing .PRS_WIDTH_66G .innerParagraphe a.document::before {
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/83/51801_714_download2.png);
}

.boutons-landing::before {
content: "";
position: absolute;
width: 10px;
background-color: white;
height: 100%;
top: 0;
left: 0;
z-index: 10;
margin-left: -10px;
transition: all 0.5s ease;
}


.institution-landing .boutons-landing::before {
background-color: #ff8400;
}


.boutons-landing:hover::before {
margin-left: 0px;
}

/****************   ****************/
/*******  FORMULAIRE DE CONTACT  *******/
/****************   ****************/

.TPL_FORMULAIRE {
width: 65.9597274%;
padding: 15px;
background: white;
margin: 20px 0 20px 0;
}

.groupeQuestion {
margin: 0 0 20px 0;
background-color: #fff;
border: none;
}

.TPL_FORMULAIRE h2 {
font-family: 'Roboto' !important;
text-transform: uppercase;
font-weight: normal;
}

#tpl_formulaire111 p:last-child {margin: 0 0 0 0 !important;}
.groupeQuestion .innerGroupeQuestion p label {
color: #333;
font-size: 1.1em;
padding-right: 10px;
letter-spacing: 0.1em;
font-family: 'Roboto';
}

.paragraphe form p.action {
text-align: center;
}

input, textarea, select {
border-top: 1px solid #e2e9ef;
border-left: 4px solid #f85f73;
border-radius: 0 0 0 0;
-webkit-border-radius: 0 0 0 0;
}

input.submit {
border-radius: 0;
padding: 12px 20px;
font-size: 0.95em;
letter-spacing: 0.04em;
position: relative;
color: #333;
background-color: #f1f4f9;
}

.submit {position: relative; overflow: hidden;}
.submit::before {
content: "";
position: absolute;
width: 10px;
background: #f85f73;
height: 100%;
top: 0;
left: 0;
z-index: 10;
margin-left: -10px;
transition: all 0.5s ease;
}

.submit:hover::before {
margin-left: 0;
}

/**********   **********/
/*******  FOCUS  *******/
/**********   **********/
.PRS_FOCUS.txt {
font-family: 'roboto';
font-weight: normal;
width: 65.9597274%;
font-size: 0.9em;
margin: 10px 0; 
padding: 15px 0; 
background: transparent;
border-bottom: 1px solid #f1f4f9;
border-left: none;
}

.PRS_FOCUS.txt .innerParagraphe {
background-color: #f1f4f9;
padding: 5px 15px;
margin-bottom: 10px;
}


.PRS_FOCUS.txt .innerParagraphe {border-left: 2px solid #ff8400;}

.PRS_FOCUS.txt h2 {
color: #000;
background: none;
padding-left: 0;
}

/****************   ****************/
/*******  CSS des Liens "En savoir plus"  *******/
/****************   ****************/
h3 {
font-family: 'roboto';
font-weight: bold;
color: #212121;
font-size: 1.667em;
margin: 0 0 8px 0;
letter-spacing: 0.0625em;
}

h3.titre_en_savoir_plus {display: none;}
.bloc_par_en_savoir_plus {margin-top: 10px; padding-bottom: 10px;}

.bloc_par_en_savoir_plus span {
width: 24px;
height: 24px;
background-color: #f1f4f9;
background-position: 50% 50%;
float: right;
background-repeat: no-repeat;
margin-bottom: 5px;
}

.bloc_par_en_savoir_plus span {
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/0c/51848_163_add-orange.png);
}

.bloc_par_en_savoir_plus li a {color: #333;}
.bloc_par_en_savoir_plus li a img {display: none;}

/****************   ****************/
/*******  ANNUAIRE DES ÉLUS *******/
/****************   ****************/
.TPL_ELU_TROMBINOSCOPE .informations span a {color: #ff8400;}

.TPL_ELU_TROMBINOSCOPE h4 {
display: flex;
align-items: center;
flex-direction: column;
height: 2.6em;
}

.TPL_ELU_TROMBINOSCOPE .item {max-height: 300px;}


.TPL_COMMISSION ul li, .TPL_ELU_TROMBINOSCOPE .liste ul li, .TPL_COLLECTIVITE .elus li, .TPL_AGENT_ANNUAIRE .liste > ul > li, .TPL_AGENT_ANNUAIRE .listeAgent li.item, .TPL_ELU_LISTE .liste ul .item, .TPL_ELU_ANNUAIRE .liste ul .item {background: #f1f4f9;}

.TPL_ELU .fiche > div, .TPL_AGENT .fiche > div {
background: #f1f4f9;
border-bottom: none;
}
.TPL_ELU .fiche .enteteFiche a, .TPL_AGENT .fiche .enteteFiche a {color: #ff8400;}

.TPL_ELU .commissions > ul > li.item, .TPL_ELU .autresCollectivites > ul > li.item, .TPL_AGENT .commissions > ul > li.item, .TPL_AGENT .autresCollectivites > ul > li.item {
background: #fff;
border-left-color: #ff8400;
}
.TPL_ELU .fiche > div a, .TPL_AGENT .fiche > div a {color: #333;}

.TPL_ELU .commissions > ul > li.item.afficherInfos, .TPL_ELU .autresCollectivites > ul > li.item.afficherInfos, .TPL_AGENT .commissions > ul > li.item.afficherInfos, .TPL_AGENT .autresCollectivites > ul > li.item.afficherInfos {
background-image: url(http://www.sud-gresivaudan.org/uploads/Image/af/51875_010_puce-enSavoirPlus2.png);
}

.TPL_ELU .fiche, .TPL_AGENT .fiche {padding: 30px 0 20px 0;}

.TPL_COMMISSION_ANNUAIRE .listeCommission li.item {background: #f1f4f9;}

/****************   ****************/
/*******  MODULES ÉVÈNEMENTS  *******/
/****************   ****************/

.tpl_evenementListe .recherche {display: none;}

.tpl_evenementListe.actualite .listeEvenement ul li .extra a,
.tpl_evenementListe .listeEvenement ul li .itemInfo h4 a {padding: 0; background: transparent;}

.tpl_evenementListe.actualite .listeEvenement ul li .extra a::before,
.tpl_evenementListe .listeEvenement ul li .itemInfo h4 a::before {
display: none;
}

.tpl_evenementListe.actualite .listeEvenement ul, .tpl_evenementListe.actualite .listeEvenement li {overflow: hidden !important;}
.TPL_EVENEMENTTHEMATIQUE .innerParagraphe .item, 
.TPL_ACTUALITETHEMATIQUE .innerParagraphe .item {
background: #f1f4f9;
border-bottom: none;
}
.tpl_evenementListe.actualite .listeEvenement ul li .extra {top: 14px;}
.tpl_evenementListe.actualite .listeEvenement ul li .thematique {
top: -28px;
left: 0;
bottom: auto;
}
.TPL_EVENEMENTTHEMATIQUE .innerParagraphe .listeEvenement .item, .TPL_ACTUALITETHEMATIQUE .innerParagraphe .listeEvenement .item {
display: flex;
align-items: center;
}


@media (max-width: 640px) {
.institution-landing .PRS_WIDTH_66G .innerParagraphe::before {display: none;}
.institution-landing .PRS_WIDTH_66G h2 {color: #ff8400;}
.institution-landing .PRS_WIDTH_66G .innerParagraphe {margin-left: 0px;}

#par31134 ul, #par31138 ul, #par31142 ul, #par31144 ul {
flex-direction: column;
align-items: center;
}

#par31134 ul li,
#par31138 ul li,
#par31142 ul li,
#par31144 ul li {
margin: 2px 0;
padding: 8px 12px 8px 12px;
} 

#par31134 ul li:nth-child(1)::after,
#par31138 ul li:nth-child(1)::after,
#par31142 ul li:nth-child(1)::after,
#par31144 ul li:nth-child(1)::after {
    top: auto;
    margin-top: auto;
    transform: rotate(90deg);
    right: auto;
bottom: 0;
margin-bottom: -20px;
left: 50%;
margin-left: -8px;
}

#par31134 ul li:nth-child(1),
#par31138 ul li:nth-child(1),
#par31142 ul li:nth-child(1),
#par31144 ul li:nth-child(1) {margin-right: 0px;}

#par31134 ul li:nth-child(2),
#par31138 ul li:nth-child(2),
#par31142 ul li:nth-child(2),
#par31144 ul li:nth-child(2) {margin-top: 20px;}

}

