/* ############################################## */
/* ############################################## */
/* GENERAL */
/* ############################################## */
/* ############################################## */

/*EFFET DU HEADER EN MODE NAVIGATION*/
.pageHeaderForPageOn {
    position: fixed;
    z-index: 5000;
    margin-top: -200px;
}

body {
    margin: 0;
    padding: 0;
    position:relative;
    background-image: url('/img/customer/welcomeVisual.jpg');
    background-attachment: fixed;
    background-position: center top;
    background-repeat: no-repeat;
}
ul li,
p.error,
span.txt,
.filterResult,
p {
    color: #252523;
    font-size: 16px;
    font-family: robotolight, sans-serif;
    line-height: 180%;
    margin: 0;
}
.intro p.big{
    font-size: 22px;
}
.intro p.medium{
    font-size: 22px;
}
p.error {
    margin-bottom: 20px;
}
p.center {
    text-align: center;
}
a.error:link,
a.error:visited {
    color: #252523;
}

/* ############################################## */
/* ############################################## */
/* HEADER
/* ############################################## */
/* ############################################## */
.headerConnectedMessage{
    float:left;
    height:auto;
    width:96%;
    font-size: 16px;
    font-family: robotolight, sans-serif;
    color:#B1CD44;
    line-height: 100%;
    margin-top:10px;
    margin-left:4%;
}

.headerDisconnectLink:link,
.headerDisconnectLink:visited {
    font-size: 12px;
    font-family: robotolight, sans-serif;
    color:#B1CD44;
    text-decoration: underline;
}
.headerDisconnectLink:hover{
text-decoration: none;
}

/* ############################################## */
/* ############################################## */
/* PICTURE
/* ############################################## */
/* ############################################## */
.picture.mainPicture{
    float:left;
    width:100%;
}
.picture.thumbnailContainer{
    float: left;
    width: 100px;
    height: 100px;
    margin-right: 10px;
    margin-bottom: 10px;
}
/* ############################################## */
/* ############################################## */
/* SPECIFIC COLORS */
/* ############################################## */
/* ############################################## */
.darkGreenETF {
    color: #011110;
}

.darkGreenETFHover:hover {
    color: #011110;
}

.bgDarkGreenETF {
    background-color: #011110;
}

.borderDashedTopDarkGreenETF {
    border-top: 1px dashed #011110;
}

.borderDashedBottomDarkGreenETF {
    border-bottom: 1px dashed #011110;
}

.bgGrey {
    background-color: #E6E4E7;
}
/* ############################################## */
/* ############################################## */
/* WELCOME */
/* ############################################## */
/* ############################################## */
.welcomeHamburgerMenuContainer {
    font-size: 40px;
    cursor: pointer;
}

.welcomeMenuButton {
    font-family: dosismedium, sans-serif;
    color: #ffffff;
    font-size: 1em;
}

.welcomeGlyphiconHamburger {
    font-size: 1em;
    color: #ffffff;
}

.welcomeTitleContainer {
    font-size: 55px;
    line-height: 80%;
    height: 105%;
}

.welcomeTitleContainer_smallScreen {
    font-size: 45px;
    line-height: 80%;
}

.smartphoneLogoContainer {
    font-size: 30px;
}

.welcomeSiteTitle {
    color: #ffffff;
    font-family: dosisextrabold, sans-serif;
    font-size: 1em;
}

.welcomeSiteTitle.rightPart {
    font-family: dosisregular, sans-serif;
}

.welcomeSubSiteTitle_tablet,
.welcomeSubSiteTitle {
    font-family: dosisregular, sans-serif;
    font-size: .68em;
    color: #87888B;
}

.welcomeSubSiteTitle.rightPart {
    color: #ffffff;
}

.welcomeTitleMoreBurron {
    font-family: dosismedium, sans-serif;
    font-size: .68em;
    color: #ffffff;
}

.welcomeGlyphiconPLus {
    font-size: .68em;
    color: #70A32D;
    margin-top: 8px;
    margin-left: -3px;
}

.welcomeGlyphiconPLus_tablet {
    color: #70A32D;
    font-size: 1em;
}

.welcomeImg:hover {
    opacity: 0.6;
}

.welcomeCommand {
    font-family: dosisbold, sans-serif;
    font-size: 24px;
    color: #011110;
}

.welcomeIconCommand:hover {
    opacity: 0.7;
}

.welcomeAdressTitle {
    font-family: dosisbold, sans-serif;
    font-size: 30px;
    color: #6CA644;
}

.welcomeAdress {
    font-family: dosisregular, sans-serif;
    font-size: 25px;
    color: #282525;
}

.welcomePhone {
    font-family: dosisbold, sans-serif;
    font-size: 29px;
    color: #282525;
}

.welcomeContactButton {
    float: left;
    width: auto;
    font-weight: normal;
    font-family: dosisregular, sans-serif;
    font-size: 22px;
    color: #ffffff;
    background-color: #2D3131;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    padding-left: 18px;
    padding-right: 18px;
    border: none;
}

.welcomeContactButton:hover {
    background-color: #606565;
}

.welcomeMentionsLink:link,
.welcomeMentionsLink:visited {
    font-family: dosismedium, sans-serif;
    font-size: 20px;
    color: #282525;
}

.welcomeMentionsLink:hover {

}

.welcomeETFguideButton {
    background-position: center;
    background-image: url('/img/customer/etfGuideButton.jpg');
    height: 242px;
}

.smallDeviceMenu{
    background-color:#252523;
}

/* ############################################## */
/* ############################################## */
/* TITLES H */
/* ############################################## */
/* ############################################## */
h1.welcome {
    color: #93CF17;
    font-family: robotoLight, sans-serif;
    font-size: 27px;
    text-align: left;
    margin: 0;
}

h1.welcome.center {
    text-align: center;
    color: #93CF17;
    font-weight: normal;
}

h1.titlePage {
    color: #13603D;
    font-family: robotoCondensed, sans-serif;
    font-size: 35px;
    text-align: center;
    margin-bottom: 60px;
}

h2 {
    color: #252523;
    font-family: dosislight, sans-serif;
    font-size: 25px;
    margin: 0;
    font-style: normal;
}
h3 {
    color: #63635e;
    font-family: dosisregular, sans-serif;
    font-size: 20px;
    margin: 0;
    font-style: normal;
}
h2.mentions {
    color: #252523;
    font-family: robotoLight, sans-serif;
    font-size: 25px;
    margin-bottom: 0;
    margin-top: 30px;
    font-style: normal;
}

h2.welcome {
    color: #011110;
    font-family: dosisregular, sans-serif;
    font-size: 45px;
    margin-bottom: 20px;
}

h2.contact {
    color: #4B6C1D;;
    font-size: 22px;
    margin-right: 5px;
    margin-left: 5px;
}
h3.title{
    margin: 0;
}
h3.listing.carousel.actusAndNews.title
{
    color: #2D3838;
}
h3.listing.carousel.agenda2.title
{
    color: #6DA845;
}
h3.listing.carousel.offresEmploi.title
{
    color: #13603D;
}
/* ############################################## */
/* ############################################## */
/* TITLE  */
/* ############################################## */
/* ############################################## */
.title.content {
    float: left;
    width: 100%;
    height: auto;
}

.title h2.content {
    color: #252523;
    font-family: robotoLight, sans-serif;
    font-size: 25px;
    margin: 0;
    font-style: normal;
}

/* ############################################## */
/* ############################################## */
/* SUBTITLE  */
/* ############################################## */
/* ############################################## */
.contact.subTitle {
    font-weight:bold;
    margin-bottom:10px;
}

/* ############################################## */
/* ############################################## */
/* INTRO  */
/* ############################################## */
/* ############################################## */
.intro {
    float: left;
    padding: 1%;
    width: 98%;
    height: auto;
    margin-top: 20px;
    text-align: left;
    background-color: #fbfbfb;
    -webkit-border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
}

.intro p {
    color: #444444;
    font-family: robotoCondensed, sans-serif;
    font-size: 16px;
    line-height: 150%;
}

/* ############################################## */
/* ############################################## */
/* TEXTE  */
/* ############################################## */
/* ############################################## */
.text:not(.inputField):not(.formInputField) {
    float: left;
    height: auto;
    width: 100%;
    font-size: 16px;
    font-family: robotoLight, sans-serif;
    line-height: 180%;
    color: #707173;
    text-align: justify;
    margin-top: 20px;
    padding: 12px 0 12px 0;
}

/* ############################################## */
/* ############################################## */
/* MAIN PICTURE  */
/* ############################################## */
/* ############################################## */
.pictureContainer.main {
    float: left;
    width: 30%;
    margin-bottom: 20px;
}

.picture.mainPicture {
    float: left;
    max-width: 90%;
    height: auto;
}

.pictureGroupContainer {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 15px;
    margin-bottom: 15px;
}
.picture.actusAndNews img,
.picture.offresEmploi img,
.picture.agenda2 img,
.picture.actusAndNews .thumbnailContainer,
.picture.offresEmploi .thumbnailContainer,
.picture.agenda2 .thumbnailContainer {
    float: left;
    width: 100%;
    height: auto;
    margin: 0;
}
.picture.listing.thumbnailContainer:not(.carousel) {
    float: left;
    width: 100px;
    height: 100px;
    margin-right: 10px;
    margin-bottom: 10px;
    margin-top:10px;
}
/* ############################################## */
/* ############################################## */
/* MEDIAS CONTAINER  */
/* ############################################## */
/* ############################################## */
.mediasContainer {
    font-family: robotolight, sans-serif;
    font-size: 16px;
    text-align: left;
    font-style: italic;
    /*background-color: #FDF7E8;*/
    border: solid 1px #dfdfd9;
    margin-top: 20px;
    -webkit-border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
}

.mediasContainer.content.contenuEditorial{
    float: left;
    width: 96%;
    padding: 2%;
}

.mediasLabel {
    font-family: robotoCondensed, sans-serif;
    font-size: 20px;
    color: #c5c5bf;
    font-style: normal;
    margin-bottom: 15px;
}
.contenuEditorial.glyphicons{
    font-size:18px;
}
.contenuEditorial.glyphicons:before{
    padding:2px 0 0 0;
}
.fileContainer.contenuEditorial{
    margin-bottom:10px;
}
.fileContainer.newsLetter{
    float:left;
    width:18%;
    margin-right:2%;
}
.fileTitle.default.contenuEditorial{
    float:left;
    width:100%;
    height:auto;
}
/* ############################################## */
/* ############################################## */
/* STRUCTURE D'UN PARAGRAPHE  */
/* ############################################## */
/* ############################################## */
.contentParagrafsGroup {
    float: left;
    width: 100%;
    height: auto;
}

.contentParagrafsGroup .leftCol {
    float: left;
    width: 66%;
    height: auto;
}

.contentParagrafsGroup .rightCol {
    float: right;
    width: 30%;
    height: auto;
}

/* ############################################## */
/* ############################################## */
/* PARAGRAF SEPARATOR  */
/* ############################################## */
/* ############################################## */
.paragrafSeparator {
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 80px;
    margin-top: 80px;
    text-align: center;
}
.paragrafSeparator.listing {
    margin-bottom: 40px;
    margin-top: 40px;
}
.squareDecorationContainer {
    width: 47px;
    height: 10px;
    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
}

.squareDecoration {
    float: left;
    width: 10px;
    height: 10px;
    background-color: #13603D;
}

.squareDecoration.first,
.squareDecoration.second {
    margin-right: 7px;
}

/* ############################################## */
/* ############################################## */
/* FILTERS LIST */
/* ############################################## */
/* ############################################## */

.filtersListingContainer {
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    margin-top: 30px;
}
.fileContainer.contenuEditorial {
    float: left;
    width: 96%;
    padding-left:2%;
    padding-right:2%;
    height: auto;
    margin-bottom: 30px;
}
.content.contenuEditorial.newsLetter .fileContainer.contenuEditorial {
    width: 21%;
}
/* ############################################## */
/* ############################################## */
/* LINK MODELS*/
/* ############################################## */
/* ############################################## */
.link.linkGlyphicon {
    margin-left: -8px;
}
a.link:visited,
a.link:link {
    font-family: dosislight, sans-serif;
    color: #252523;
    font-size: 18px;
    text-decoration: underline;
    font-style: normal;
}
a.link:link.contact {
    font-size: 20px;
}
a.link:hover {
    text-decoration: none;
    font-style: normal;
}
a.link.annuaire:visited,
a.link.annuaire:link {
    color:#a9a9a9;
}
.itemMyAccount{
    font-family: dosislight, sans-serif;
    color:#a9a9a9;
    font-size: 18px;
    font-style: normal;
}
/* ############################################## */
/* ############################################## */
/* INPUT */
/* ############################################## */
/* ############################################## */
.inputButtonPopUp.confirmButton.confirmOk,
.inputTraditionalButton {
    font-weight: normal;
    font-family: dosisregular, sans-serif;
    font-size: 22px;
    color: #ffffff;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    padding-left: 18px;
    padding-right: 18px;
    border: none;
}
.inputButtonPopUp.confirmButton.confirmOk:hover,
.inputTraditionalButton:hover,
.inputTraditionalButton.welcomeMenuOn {
    -webkit-transition: all 400ms ease-in;
    -ms-transition: all 400ms ease-in;
    -moz-transition: all 400ms ease-in;
    transition: all 400ms ease-in;
}
.inputTraditionalButton:not(.agenda):not(.emploi):not(.news):not(.materiel):not(.filterOn),
.inputButtonPopUp.confirmButton.confirmOk,
.inputTraditionalButton.filtersList.annuaireProForet,
.inputTraditionalButton.newPassword,
.inputTraditionalButton.message,
.inputTraditionalButton.createAccount,
.inputTraditionalButton.connect,
.inputTraditionalButton.cancel{
    border: 1px solid #13603D;
    background-color: #7BA692;
    color: #ffffff;
    margin-bottom: 5px;
}
.inputTraditionalButton:hover,
.inputButtonPopUp.confirmButton.confirmOk:hover,
.inputTraditionalButton.newPassword:hover,
.inputTraditionalButton.message:hover,
.inputTraditionalButton.createAccount:hover,
.inputTraditionalButton.connect:hover,
.inputTraditionalButton.cancel:hover,
.inputTraditionalButton.filtersList.annuaireProForet.filterOn,
.inputTraditionalButton.filtersList.annuaireProForet:hover {
    background-color: #13603D;
}
.inputTraditionalButton.testStatus{
    cursor:default;
    opacity:0.5;
}
.inputTraditionalButton.testStatus:hover{
    -webkit-transition: all 400ms ease-in;
    -webkit-transform: scale(1);
    -ms-transition: all 400ms ease-in;
    -ms-transform: scale(1);
    -moz-transition: all 400ms ease-in;
    -moz-transform: scale(1);
    transition: all 400ms ease-in;
    transform: scale(1);
}

.inputTraditionalButton.message{
    margin-top:30px;
}
.inputTraditionalButton.news {
    background-color: #858a89;
    margin-right: 15px;
}

.inputTraditionalButton.news.welcomeMenuOn,
.inputTraditionalButton.news:hover {
    background-color: #2D3838;
    color: #ffffff;
}

.inputTraditionalButton.agenda {
    background-color: #ADCE97;
    margin-right: 15px;
}
.inputTraditionalButton.agenda.welcomeMenuOn,
.inputTraditionalButton.agenda:hover {
    background-color: #6DA845;
    color: #ffffff;
}

.inputTraditionalButton.emploi {
    background-color: #7BA692;
    margin-right: 15px;
}

.inputTraditionalButton.emploi.welcomeMenuOn,
.inputTraditionalButton.emploi:hover {
    background-color: #13603D;
    color: #ffffff;
}
.inputTraditionalButton.materiel {
    background-color: #f0af88;
}

.inputTraditionalButton.materiel.welcomeMenuOn,
.inputTraditionalButton.materiel:hover {
    background-color: #F0702C;
    color: #ffffff;
}
.inputTraditionalButton.list {
    color: #282525;
    font-family: dosismedium, sans-serif;
}
.inputTraditionalButton:hover,
.inputTraditionalButton.list:hover {
    color: #93CF17;
}
.inputTraditionalButton.myAccount{
    margin-right:10px;
}
.inputBoxLinks{
    font-family: dosisregular, sans-serif;
    font-size:16px;
    text-align: center;
    color:#13603D;
    padding-top:20px;
    padding-bottom:20px;
}
.accountLink{
    text-decoration:none;
    cursor: pointer;
}
.accountLink:hover{
    text-decoration:underline;
}
.inputLabel {
    float:left;
    font-family: dosisregular, sans-serif;
    font-size:16px;
    text-align:right;
    padding-top:3px;
}
.inputLabel.connect {
    width:25%;
}
.inputLabel.forgetPassword,
.inputLabel.createAccount {
    width:40%;
}
.inputLabel.newPassword{
    width:50%;
}
.inputFieldContainer {
    float:left;
    margin-left:4%;
}
.inputFieldContainer.connect {
    width:71%;
}
.inputFieldContainer.forgetPassword,
.inputFieldContainer.createAccount {
    width:56%;
}
.inputFieldContainer.newPassword{
    width:46%;
}
.inputBoxField{
    float:left;
    width:100%;
    height:auto;
}
.inputBoxField.buttonsContainer,
.inputBoxField.first{
    margin-top:25px;
}
.inputBoxField{
    margin-bottom:10px;
}
.inputBoxField.buttonsContainer{
    text-align: center;
}

.inputField {
    float: left;
    width: 94%;
    font-weight: normal;
    font-family: 'robotolight', sans-serif;
    color: #a3a3a3;
    font-size: 16px;
    padding: 5px 2% 5px 2%;
    border: 1px solid #d7d7d7;
    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
}
/* ############################################## */
/* ############################################## */
/* MY ACCOUNT */
/* ############################################## */
/* ############################################## */
.myAccount.glyphicons{
    margin-top:-3px;
}
h2.myAccount.mesDeclarations{
    color:#13603D;
}
h2.myAccount.mesDocuments{
    color:#65503C;
}
.myAccount.declarationDetail{
    font-size: 16px;
    font-family: robotoLight, sans-serif;
    line-height: 180%;
    color: #707173;
}
.myAccount.declarationDetail.value{
    font-family: robotoCondensed, sans-serif;
    color: #000000;
}
.myAccount.col.declarationDetail{
    width:48%;
    padding:1%;
}
.myAccount.declarationDetail.pair{
    background-color: #f3f4f6;
}
.myAccount.documentsListContainer,
.myAccount.declarationListContainer{
    margin-top:20px;
}
.myAccount.declarationEnvoyeeLe{
    font-size:12px;
}
.myAccount.documentsListContainer{
    color: #252523;
    font-size: 16px;
    font-family: robotolight, sans-serif;
    line-height: 180%;
}
.myAccount.intro{
    margin-top:0;
}
.myAccount.inputField {
    float: left;
    width: auto;
    font-weight: normal;
    font-family: 'robotolight', sans-serif;
    color: #a3a3a3;
    font-size: 16px;
    padding: 5px 2% 5px 2%;
    border: 1px solid #d7d7d7;
    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
}
/* ############################################## */
/* ############################################## */
/* POP UP */
/* ############################################## */
/* ############################################## */
.popUpWindows {
    background-image: url('/_lib/img/backgrounds/bgBlack80.png');
}
.popUpWindowsContainer{
    width:30%;
}
.popUpWindowsCloseButton{
    right:15px;
    color:#ffffff;
    font-size:20px;
}
.popUpWindowsCloseButton:hover{
    color:#6DA845;
}
.popUpWindowsPanel{
    width:92%;
    padding:15px 4%;
    background-color: #13603D;
    color:#ffffff;
    font-family: dosisregular, sans-serif;
    font-size:20px;
    text-align: left;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    border-radius:8px 8px 0 0;
}
.popUpWindowsTitle{
    display: inline;
}
.popUpWindowsContainer{
    top:160px;
}
.popUpWindowsContent{
    color: #252523;
    font-family: dosisregular, sans-serif;
    font-size:16px;
    background-color:#ffffff;
    padding-top:30px;
    padding-bottom:30px;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border-radius:0 0 8px 8px;
}
/* ############################################## */
/* ############################################## */
/* CONFIRME BOX */
/* ############################################## */
/* ############################################## */
.confirmBox {
    background-color: #ffffff;
    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    color:#13603D;
    font-family: dosisregular, sans-serif;
    font-size:20px;
    text-align: center;
}

/* ############################################## */
/* ############################################## */
/* FLIP FLAP */
/* ############################################## */
/* ############################################## */
.flipFlapContainer{
    background-color: #29292A;
}
.flipflapPanel {
    float:left;
    width:96%;
    height:auto;
    color: #ffffff;
    font-family: dosismedium, sans-serif;
    font-size: 30px;
    padding:2%;
    padding-top:35px;
    padding-bottom:20px;
}
.flipflapTitle{
    float:left;
    width:70%;
    margin-left:15%;
}
.flipflapCloseButton{
    display:block;
    width:auto;
    cursor: pointer;
    position:absolute;
    right:10px;
    top:10px;
    font-size:20px;
    color:#ffffff;
}
.flipflapPanel,
.flipFlapContent {
    background-color: #29292A;
}
/* ############################################## */
/* ############################################## */
/* MESSAGE */
/* ############################################## */
/* ############################################## */
.messageTitle{
    float:left;
    width:100%;
    text-align: center;
    padding-top:15px;
    padding-bottom:15px;
    color: #13603D;
    font-family: dosismedium, sans-serif;
    font-size: 25px;
}
.messageContainer{
    float:left;
    width:100%;
    height:auto;
    font-family: dosisregular, sans-serif;
    font-size: 18px;
    color: #000000;
    text-align: center;
}
.messageGlyphicon{
    margin-top:-4px;
    font-size:25px;
}
.messageButtons{
    text-align: center;
}
.inputTraditionalButton.message{
    margin-right:10px;
}

/* ############################################## */
/* ############################################## */
/* FOOTER */
/* ############################################## */
/* ############################################## */
.footerTxt {
    color: #5a5a56;
    text-align: center;
    font-size: 16px;
    font-family: robotoLight, sans-serif;
}

/* ############################################## */
/* ############################################## */
/* SPEED BUTTON */
/* ############################################## */
/* ############################################## */
.speedButtonsContainer {
    position: fixed;
    right: 0;
    top: 200px;
    z-index: 5;
}

.speedButton {
    width: 55px;
    height: 55px;
    background-image: url('/_lib/img/backgrounds/bgBlack70.png');
    margin-bottom: 2px;
    text-align: center;
    color: #ffffff;
}

.speedButton:hover {
    background-image: url('/_lib/img/backgrounds/bgBlack90.png');
}

.speedButton.logIn {
    background-image: none;
    background-color: #F0702C;
    opacity: 1;
}

.speedButton.logIn:hover {
    background-color: #F0702C;
    opacity: 0.7;
}


/* ############################################## */
/* ############################################## */
/* SECTION */
/* ############################################## */
/* ############################################## */
.section.access {
    background-color: #D6D6D6;
    padding: 0;
}

.section .accesInfos {
    position: absolute;
    right: 3%;
    top: 40px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    color: #ffffff;
    padding: 1%;
    font-family: dosisregular, sans-serif;
    background-image: url('/_lib/img/backgrounds/bgBlack80.png');
    z-index: 10000;
    font-size: 12px;
}
.section{
    padding-top:100px;
    padding-bottom:100px;
}
.section.welcome{
    padding-top:0;
    padding-bottom:0;
}
/* ############################################## */
/* ############################################## */
/* CAROUSEL */
/* ############################################## */
/* ############################################## */
.carouselInfosContainer {
    float: left;
    width:100%;
    height: auto;
    font-family: dosisregular, sans-serif;
    border-top: dashed 1px #011110;
    border-bottom: dashed 1px #011110;
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.carousel.listingContentContainer{
    width:98%;
    margin-left:1%;
    height:auto;
}
.carousel.listing.col1{
    float: left;
    width: 76%;
    font-size: 16px;
    font-family: dosisregular, sans-serif;
    line-height: 180%;
    color: #707173;
    text-align: justify;
}
.carousel.listing.col2{
    float: right;
    width: 20%;
}
.carousel.listing.col2 img{
    max-width: 100%;
}
.carousel.noRecordingTxt{
    float:left;
    width:96%;
    padding:2%;
    font-size: 16px;
    font-family: dosisregular, sans-serif;

}
/* ############################################## */
/* ############################################## */
/* BUTTON */
/* ############################################## */
/* ############################################## */
.button.listing:link,
.button.listing:visited,
.button.carousel:link,
.button.carousel:visited {
    text-decoration: none;
    font-family: dosissemibold, sans-serif;
    color: #3B4240;
    font-size: 1.4em;
}
.button.listing:hover,
.button.carousel:hover {
    text-decoration: underline;
    color: #3B4240;
    font-size: 1.4em;
}
.buttonMore {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 10px;
}
/* ############################################## */
/* ############################################## */
/* FORM */
/* ############################################## */
/* ############################################## */
.formContainerCol{
    float:left;
    width:96%;
    margin-left:2%;
    margin-right:2%;
    height:auto;
}
.formContainerCol.newsletter,
.formContainerCol.contact{
    float:left;
    width:100%;
    margin-left:0;
    margin-right:0;
}
.formGroupLabel,
.formLine {
    float:left;
    width:100%;
    height:auto;
    margin-bottom: 15px;
}
.formGroupFieldsContainer{
    float:left;
    width:100%;
    height:auto;
    margin-bottom: 30px;
}
.formLine.sendButton {
    margin-top: 30px;
}

.formLabel {
    font-family: dosisregular, sans-serif;
    font-size: 22px;
    padding: 5px 0 5px 2%;
    color: #282525;
}
.formLabel.customerAccount{
    float:left;
    width:100%;
    height:auto;
}
.formInputContainer.customerAccount{
    float:left;
    width:100%;
    height:auto;
    margin-bottom:15px;
}
/*input:-webkit-autofill,*/
.formInputField {
    float: left;
    width: 96%;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    padding: 12px 2% 12px 2%;
    background-color: #CECECE;
    border-style: none;
    color:#000000;
    font-size: 16px;
    font-family: robotoLight, sans-serif;
    line-height: 180%;
}
.formInputField.disabled,
.formInputField.readonly{
    color: #8a8a8a;
}
.formInputField.text.readonly {
    background-color: #e9e9e9;
}
.formInputField.text{
    margin-top:0;
}
.formSendButton {
    float: right;
    width: auto;
    font-weight: normal;
    font-family: dosisregular, sans-serif;
    font-size: 22px;
    color: #ffffff;
    background-color: #2D3131;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    padding-left: 18px;
    padding-right: 18px;
    border: none;
}

.formSendButton:hover {
    background-color: #606565;
}
/* ############################################## */
/* ############################################## */
/* CONNEXION */
/* ############################################## */
/* ############################################## */
.connectingPanel{
    font-family: robotoLight, sans-serif;
    font-size: 18px;
    background-color: #13603D;
    color:#ffffff;
}
/* ############################################## */
/* ############################################## */
/* AGENDA */
/* ############################################## */
/* ############################################## */
.agenda2.glyphicons.eventDateTime{
    font-size:18px;
    margin-top:-2px;
    margin-left:-6px;
}
.agenda2.glyphicons.eventEndDateTime{
    font-size:18px;
    margin-top:-2px;
    margin-left:40px;
}
/* ############################################## */
/* ############################################## */
/* ANNUAIRE*/
/* ############################################## */
/* ############################################## */
.annuaireProForet.filterResult{
    float:left;
    width:100%;
    height:auto;
    font-family: "dosisregular", sans-serif;
    font-size: 20px;
    font-style: italic;
    margin-bottom:20px;
}
.annuaireProForet.box{
    margin-bottom:30px;
}
.annuaire-etf.label{
    font-family:dosismedium, sans-serif;
    font-size:18px;
}
.annuaire-etf.value{
    font-family:dosisregular, sans-serif;
    font-size:18px;
    color: #a9a9a9;
}
.annuaireProForet.categsHtag{
    float:left;
    width:100%;
    height:auto;
    font-family: "dosisregular", sans-serif;
    font-size: 20px;
    font-style: italic;
    color: #a9a9a9;
}
.annuaireProForet.contentText{
    float:left;
    width:100%;
    height:auto;
}
.annuaireProForet.thumbnailContainer {
    float: left;
    width: 100px;
    height: 100px;
    margin-right: 10px;
    margin-bottom: 0;
}
.annuaireProForet.field {
    margin-bottom:15px;
}
.annuaireProForet.social.social-facebook{
    font-size:30px;
}

.annuaireProForet.listingContentContainer {
    float: left;
    width: 96%;
    height: auto;
    margin-bottom: 30px;
}

h2.annuaireProForet.listing {
    float: left;
    width: 100%;
    text-decoration: none;
    font-size:20px;
    margin-top:10px;
}
.annuaireProForet.listing.col2{
    float: left;
    width: 91%;
    height: auto;
}
.annuaireProForet.listing.buttonMore{
    float: left;
    width: 100%;
    height:auto;
}
.annuaireProForet.listing.inputTraditionalButton{
    font-weight: normal;
    font-family: dosisregular, sans-serif;
    font-size:20px;
    color: #13603D;
    background: none;
    background-color: #ffffff;
    padding: 5px 15px;
    border: none;
}
.annuaireProForet .glyphicons-user.listing{
    margin-top: -4px;
}

.annuaireProForet.categsHtag.listing {
    float: left;
    width: 100%;
    height: auto;
    font-family: "dosisregular", sans-serif;
    font-size: 20px;
    font-style: italic;
    color: #a9a9a9;
}
.annuaireProForet.adherentName{
    float:left;
    width:100%;
    height:auto;
    font-family: "dosisbold", sans-serif;
    font-size: 20px;
    color: #13603D;
}
.object.annuaireProForet.contentText.field{
    margin-bottom:0;
}
.listPublicationDate {
    float: left;
    width: 100%;
    height: auto;
}
.listSubTitle {
    font-family: robotoCondensed, sans-serif;
    font-size: 20px;
    color: #707173;
    font-style: italic;
}

.listContentContainer {
    margin-top: 20px;
    font-family: robotolight, sans-serif;
    line-height: 150%;
    font-size: 16px;
    text-align: left;
    /*background-color: #fdfdfd;*/
    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
}

.listContentContainer:first-child {
    margin-top: 0;
}

.listPicturesGroup {
    margin-top: 15px;
}


.fileContainer.content{
    margin-bottom:10px;
}
/* ############################################## */
/* ############################################## */
/* GLYPHICONS */
/* ############################################## */
/* ############################################## */


.glyphiconList.annuaireProForet {
    margin-left: -5px;
    margin-top: -7px;
}
.glyphicons.default.content{
    font-size:20px;
    margin-left: -7px;
    margin-top: -4px;
    margin-right: -4px;
}
/* ############################################## */
/* ############################################## */
/* OFFRES D'EMPLOI */
/* ############################################## */
/* ############################################## */
.offresEmploi.listing.inputTraditionalButton{
    border: 1px solid #13603D;
    background-color: #7BA692;
    color: #ffffff;
    margin-bottom: 5px;
}
.offresEmploi.listing.inputTraditionalButton:hover{
    background-color: #13603D;
}

/* ############################################## */
/* ############################################## */
/* PARTENAIRES */
/* ############################################## */
/* ############################################## */
.partenairesProForet.parternContainer{
    float:left;
    width:100%;
    height:auto;
    margin-bottom:60px;
}
.partenairesProForet.title{
    float:left;
    width:100%;
    height:auto;
}
.partenairesProForet.parternDesc{
    margin-top:15px;
}
.text.listing.partenairesProForet{
    margin-top:0;
}
.partenairesProForet .label{
    font-family: robotoCondensed, sans-serif;
}
.partenairesProForet.contentEmail a:link,
.partenairesProForet.contentEmail a:visited{
    font-size: 16px;
    font-family: robotoLight, sans-serif;
    color: #252523;
    text-decoration: none;
}
.partenairesProForet.contentEmail a:hover{
    text-decoration: underline;
}
.partenairesProForet.parternContainer .col1{
    float:left;
    width:20%;
    margin-right:2%;
    height:auto;
}
.partenairesProForet.parternContainer .col1 img{
    max-width: 100%;
}
.partenairesProForet.parternContainer .col2{
    float:left;
    width:78%;
    height:auto;
}

/* ############################################## */
/* ############################################## */
/* OBJECT */
/* ############################################## */
/* ############################################## */
.object.dateTime{
    float:left;
    width:100%;
    height:auto;
    font-family: robotolight, sans-serif;
    margin-top:5px;
}
span.object.dateTime.textBefore{
    float:none;
    width:auto;
}
h1.title{
    color: #13603D;
    font-family: robotoCondensed, sans-serif;
    font-size: 35px;
    text-align: center;
    margin-top:0;
    margin-bottom:5px;
}
h1.object.title{
    color: #13603D;
    font-family: robotoCondensed, sans-serif;
    font-size: 35px;
    text-align: left;
    margin-bottom:5px;
}
.object.subTitle{
    float: left;
    width: 100%;
    height: auto;
    color: #13603D;
    font-family: robotoCondensed, sans-serif;
    font-size: 16px;
}
.object.facebookShareButton{
    float:left;
    width:100%;
    height:auto;
    margin-top:40px;
}
a:visited .object.inputTraditionalButton.comeBackButton,
a:link .object.inputTraditionalButton.comeBackButton{
    border: 1px solid #13603D;
    background-color: #7BA692;
    color: #ffffff;
    margin-bottom: 30px;
}
a:hover .object.inputTraditionalButton.comeBackButton{
    background-color: #13603D;
}
.object.defaultModel.pictureGroupContainer{
    margin-top:20px;
    margin-bottom:35px;
}
.object.categsHtag{
    float:left;
    width:100%;
    height:auto;
    font-family: "dosisregular", sans-serif;
    font-size: 20px;
    font-style: italic;
    color: #a9a9a9;
}
.object.eventDateTimeContainer{
    float:left;
    width:100%;
    height:auto;
    text-align: left;
    margin-top:5px;
    margin-bottom:15px;
    font-family:dosismedium, sans-serif;
    font-size:20px;
    color:#6DA845;
}
.object.field{
    float:left;
    width:100%;
    height:auto;
}
/* ############################################## */
/* ############################################## */
/* LISTING  */
/* ############################################## */
/* ############################################## */
.listing.line1{
    float: left;
    width: 100%;
    font-size: 16px;
    font-family: robotoLight, sans-serif;
    line-height: 180%;
    color: #707173;
    text-align: justify;
}
.listing.line3{
    margin-top: 0;
}
.listing.pictureGroupContainer{
    margin-top: 5px;
    margin-bottom: 0;
}
.listing.pictureGroupContainer .thumbnailContainer {
    margin-bottom: 7px;
}
.listing.glyphicons {
    margin-left: -8px;
    margin-top: -2px;
}
.listing.buttonGlyphicon{
    margin-top: -2px;
    margin-left: -2px;
}
.listing.buttonMore{
    margin-top:10px;
}
.listing.listingContentContainer:not(.carousel):not(.annuaireProForet){
    Float:left;
    width:100%;
    height:auto;
    /*margin-bottom:30px;*/
}
.listing.eventDateTimeContainer{
    float:left;
    width:100%;
    height:auto;
    text-align: left;
    margin-top:5px;
    margin-bottom:15px;
    font-family:dosismedium, sans-serif;
    font-size:20px;
    color:#6DA845;
}
.listing.resume {
    margin-top: 10px;
}
/* ############################################## */
/* ############################################## */
/* OWL */
/* ############################################## */
/* ############################################## */
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
    opacity: 1;
    background: #13603D;
}
.owl-theme .owl-controls{
    margin-top:30px;
    text-align: center;
}
.owl-theme .owl-controls .owl-page span{
    filter: Alpha(Opacity=50);/*IE7 fix*/
    opacity: 0.5;
    background: #7BA692;
}

/* ############################################## */
/* ############################################## */
/* CONTACT */
/* ############################################## */
/* ############################################## */
.contactLine{
    background-image: url('http://typos.zebulon-creation.com/motifs/fabric_plaid.png');
}

.contactFormIntro,
.contactLeftColTxt{
    font-family: dosislight, sans-serif;
    font-size:20px;
}
.contactLinks.contact{
    font-size:20px;
}

.glyphicons-earphone.contact{
    margin-top:-1px;
    margin-right:-1px;
    margin-left:-7px;
}
.glyphicons-iphone.contact{
    margin-top:-5px;
    margin-right:-1px;
    margin-left:-7px;
}
.glyphicons-envelope.contact{
    margin-top:-4px;
    margin-right:-1px;
    margin-left:-7px;
}
.glyphicons-clock.contact{
    margin-top:-4px;
    margin-right:-1px;
    margin-left:-7px;
}
.glyphicons-pencil.contact{
    margin-top:-4px;
    margin-right:-1px;
    margin-left:-7px;
}
.social-facebook.contact{
    margin-top:-4px;
    margin-right:-1px;
    margin-left:-7px;
}
.contact.googleMap{
    float:left;
    width:100%;
    height:auto;
}
section#access{
    margin-top:0;
}
/* ############################################## */
/* ############################################## */
/* ANTISPAM */
/* ############################################## */
/* ############################################## */
.form.antispamControleContainer{
    font-family: dosislight, sans-serif;
    font-size:18px;
    margin-top:30px;
}
.form.antispamControleNumbers{
    font-size:22px;
    font-family: dosissemibold, sans-serif;
}
.form.antispamControleInformation{
    float:left;
    width:90%;
}
.form.antispamControleInputContainer{
    float:left;
    width:10%;
    margin-top:20px;
    text-align: right;
}

.form.antispamResult.antispamResult{
    float:left;
    width:90%;
    text-align: center;
}
/* ############################################## */
/* ############################################## */
/* CONTACT */
/* ############################################## */
/* ############################################## */
.contact.fieldset:not(:first-child) {
    margin-top: 40px;
}

.contactFormContainer {
    display: inline-block;
    height: auto;
    text-align: left;
}

.contactFormLine {
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

.contactFormLabel {
    float: left;
    width: 100%;
    font-family: dosismedium, sans-serif;
    font-size: 16px;
    padding: 5px 0 10px 2%;
    color: #252523;
}

.contactButtonLine {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 0;
}

.contactFormRecapLine {
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 30px;
}

.contactFormRecapLine.message {
    margin-bottom: 0;
}

.contactFormResponseContainer {
    float: left;
    width: 100%;
    height: auto;
    font-family: dosislight, sans-serif;
    font-size: 16px;
}

.contact.col1 {
    float: left;
    width: 46%;
    margin-right: 4%;
    color: #252523;
}

.contact.col2 {
    float: left;
    width: 46%;
    margin-left: 4%;
    color: #252523;
}

.contact.contactInfos.webSiteResponsable {
    margin-bottom: 10px;
    font-weight: bold;
}

h3.contact {
    padding: 0 15px;
}
.contact.glyphicons{
    margin-top:-3px;
}
.fieldset {
    border: 1px solid #dadada;
    font-family: dosislight, sans-serif;
    font-size: 20px;
    background-repeat: repeat;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    padding: 4%;
}

/* ############################################## */
/* ############################################## */
/* MAIN NAV */
/* ############################################## */
/* ############################################## */
.navButton{
    position:fixed;
    z-index:220;
    right:0;
}
nav.mainNav {
    float: right;
    width: 100%;

}
ul.subNav,
ul.mainNav{
    display: inline;
    list-style-type: none;
    padding: 0;
    margin:0;
    height:100%;
}
.mainNavBg {
    /*background-image: url('../../../../../img/backgrounds/bgWhite70.png');*/
    background-image: url('/img/background/bgPurple50.png');
}

nav.mainNav {
    width: 100%;
    padding: 0;
}

ul.mainNav {
    float: left;
    display: block;
    width: 100%;
    list-style-type: none;
}

ul.mainNav li {
    display: list-item;
    float: left;
    width: 70%;
    position: relative;
    padding: 10px 15% 10px 15%;
    text-align: left;
    /*margin-left: 2.5%;*/
}
ul.mainNav li,
ul.mainNav a li {
    text-decoration: none;
    font-family: robotoLight, sans-serif;
    color: #ffffff;
}
ul ul.subNav li{
    text-decoration: none;
    font-family: robotoLight, sans-serif;
    border-bottom:1px solid #3f3e3e;
    color: #919191;
}

.mainNavOn{
    background-color: #3f3e3e;
}

ul.mainNav li.logIn{
    background-color: #F0702C;
    color: #ffffff;
}
ul.mainNav li.logIn:hover{
    background-color: #ffffff;
    color: #F0702C;
}
ul.subNav a li.subNavLi:hover{
    /*color: #F0702C;*/
}
ul.mainNav a li.last {
    border-bottom:none;
}
ul.subNav li.menuOn,
ul.mainNav li.menuOn {
    text-decoration: none;
    font-family: robotoLight, sans-serif;
    background-color: #6DA845;
    color: #ffffff;
}
ul.mainNav li:hover,
ul.mainNav a li:hover {
    text-decoration: none;
    font-family: robotoLight, sans-serif;
    background-color: #6DA845;
    color: #ffffff;
}
ul.mainNav li.myAccount {
    background-color: #13603D;
}

ul.mainNav li.myAccount:hover {
    background-color: #6DA845;
}
.glyphicons.mainNav{
    position:absolute;
    right:5%;
    font-size:20px;
}
/* ############################################## */
/* ############################################## */
/* COOKIES */
/* ############################################## */
/* ############################################## */
.cookiesMessageFlat{
    position:fixed;
    width:96%;
    text-align: left;
    z-index:6000;
    height:auto;
    padding:1% 2%;
    bottom:0;
    left:0;
    background-color: #252523;
    font-family:dosismedium, sans-serif;
    font-size:18px;
    color:#ffffff;
    border-top: 4px solid #6DA845;
}
.cookiesLink.link:visited,
.cookiesLink.link:link{
    color:#ffffff;
}
.cookiesMessageFlat .line1 {
    float: left;
    width: 100%;
    height: auto;
    padding-top: 10px;
}

.cookiesMessageFlat .line2 {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 15px;
}

.cookieButtonTxt {
    float: left;
    margin-top: 5px;
}

.inputTraditionalButton.cookieButton {
    margin-right: 10px;
}

.cookiesNok {
    margin-top: 3px;
}

.glyphicons.cookies {
    float: left;
}

p.cookies {
    margin-bottom: 20px;
}

.inputTraditionalButton.cookieButton {
    font-weight: normal;
    font-family: dosisregular, sans-serif;
    font-size: 16px;
    color: #ffffff;
    -moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    border-radius: 18px;
    padding-left: 18px;
    padding-right: 18px;
}

.inputTraditionalButton.cookieButton {
    background: none;
    color: #ffffff;
    border: 1px solid #ffffff;
}

.inputTraditionalButton.cookieButton:hover {
    background-color: #ffffff;
    color: #252523;
    border: 1px solid #ffffff;
}
/* ############################################## */
/* ############################################## */
/* DO LAODING */
/* ############################################## */
/* ############################################## */
.barlittle {
    background-color: #13603D;
    background-image: -moz-linear-gradient(45deg, #13603D 25%, #6DA845);
    background-image: -webkit-linear-gradient(45deg, #13603D 25%, #6DA845);
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    width: 10px;
    height: 10px;
    float: left;
    margin-left: 5px;
    opacity: 0.1;
    -moz-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -moz-animation: move 1s infinite linear;
    -webkit-animation: move 1s infinite linear;
}

/* ############################################## */
/* ############################################## */
/* SCROLLBAR */
/* ############################################## */
/* ############################################## */
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #CACACA;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
    background-color: #6DA845;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #6DA845;
}
.mCSB_inside > .mCSB_container {
    margin-right: 30px;
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
    background-image: url('/img/customer/mCSB_buttons.png'); /* css sprites */
    background-repeat: no-repeat;
    opacity: 0.4;
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover {
    opacity: 0.75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
    background-image: url('/img/customer/mCSB_buttons.png'); /* css sprites */
}

.contentScroll.autocompleteResults{
    float:left;
    width:88%;
    margin-left:6%;
    max-height:150px;
    background-color: #E9E9E9;
    margin-top:2px;
    font-family: dosisregular, sans-serif;
    font-size: 14px;
    padding:0;
}
.autocompleteLine{
    float:left;
    width:96%;
    padding-top:1px;
    padding-bottom:1px;
    padding-left:2%;
    padding-right:2%;
    cursor:pointer;
}
.autocompleteLine:hover{
    background-color: #7BA692;
    color:#ffffff;
}
.noContent{
    float:left;
    width:96%;
    padding-left:2%;
    padding-right:2%;
    font-family: dosisregular, sans-serif;
    font-size: 16px;
}
.mediasContainersContainer{
    float:left;
    width:100%;
    height:auto;
    margin-bottom:50px;
}
.object.mediasContainer{
    float:left;
    width:100%;
    height:auto;
    margin-top:0;
    margin-bottom:15px;
    padding-bottom:30px;
}
.object.mediasLabel{
    float:left;
    width:96%;
    padding-left:2%;
    padding-right:2%;
    height:auto;
    margin-top:15px;
}
.fileContainer,
.movieContainer,
.linkContainer{
    float:left;
    width:96%;
    padding-left:2%;
    padding-right:2%;
    height:auto;
    margin-top:15px;
}
.userInformationContainer{
    float:left;
    width:100%;
    height:auto;
    font-family: dosisregular, sans-serif;
    font-size: 16px;
    color: #ff605b;
    text-align: center;
    margin-bottom:30px;
}
.glyphicons.userInformation{
    margin-top:-7px;
    font-size:25px;
}