#vortexDebugShow, #vortexDebug, .miniConsole { /*display:none;*/} /*--------------------------------------------------------------------------------------- */ /* Polices locales via font-face */ /*--------------------------------------------------------------------------------------- */ @font-face { font-family: 'guifx'; src: url('../font/guifx.eot'); src: url('../font/guifx.eot?#iefix') format('embedded-opentype'), url('../font/guifx.woff2') format('woff2'), url('../font/guifx.woff') format('woff'), url('../font/guifx.ttf') format('truetype'), url('../font/guifx.svg#guifx') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'icons'; src: url('../font/icons.eot'); src: url('../font/icons.eot?#iefix') format('embedded-opentype'), url('../font/icons.woff') format('woff'), url('../font/icons.ttf') format('truetype'), url('../font/icons.svg#icons') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'cantarell'; src: url('../font/cantarell-bold-webfont.eot'); src: url('../font/cantarell-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../font/cantarell-bold-webfont.woff') format('woff'), url('../font/cantarell-bold-webfont.ttf') format('truetype'), url('../font/cantarell-bold-webfont.svg#cantarell-bold-webfont') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'muli'; src: url('../font/muli-light-webfont.eot'); src: url('../font/muli-light-webfont.eot?#iefix') format('embedded-opentype'), url('../font/muli-light-webfont.woff') format('woff'), url('../font/muli-light-webfont.ttf') format('truetype'), url('../font/muli-light-webfont.svg#muli-light-webfont') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'muli'; src: url('../font/muli-semibold-webfont.eot'); src: url('../font/muli-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../font/muli-semibold-webfont.woff') format('woff'), url('../font/muli-semibold-webfont.ttf') format('truetype'), url('../font/muli-semibold-webfont.svg#muli-semibold-webfont') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'nexa'; src: url('../font/nexa_bold-webfont.eot'); src: url('../font/nexa_bold-webfont.eot?#iefix') format('embedded-opentype'), url('../font/nexa_bold-webfont.woff') format('woff'), url('../font/nexa_bold-webfont.ttf') format('truetype'), url('../font/nexa_bold-webfont.svg#nexa_bold-webfont') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'nexa'; src: url('../font/nexa_light-webfont.eot'); src: url('../font/nexa_light-webfont.eot?#iefix') format('embedded-opentype'), url('../font/nexa_light-webfont.woff') format('woff'), url('../font/nexa_light-webfont.ttf') format('truetype'), url('../font/nexa_light-webfont.svg#nexa_light-webfont') format('svg'); font-weight: 300; font-style: normal; } /*--------------------------------------------------------------------------------------- */ /* Style Reset - Normalize */ /*--------------------------------------------------------------------------------------- */ /*! normalize.css v1.1.0 | MIT License | git.io/normalize */abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,picture,html,i,iframe,img,ins,kbd,label,legend,li,main,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:0 0}article,aside,details,figcaption,figure,footer,header,picture,main,nav,section,summary,iframe{display:block}address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:400}caption,th{text-align:left}a:active,embed,object{outline:0}audio,canvas,video{vertical-align:middle;display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}button,html,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus,button:focus{outline:thin dotted}abbr[title]{border:0}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;display:block;height:0;padding:0;border:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:after,q:before{content:'';content:none}small{font-size:100%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}nav ol,nav ul{list-style:none;list-style-image:none;margin:0}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure,form{margin:0}fieldset{border:0;margin:0;padding:0}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button{padding:0;border:0 none;}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} /*--------------------------------------------------------------------------------------- */ /* Styles generaux */ /*--------------------------------------------------------------------------------------- */ /* - - - - - Box-model - - - - - */ *, *:before, *:after{ box-sizing: border-box;} td, th { vertical-align:top; } hr{ margin: 1em 0; border-top: 1px solid #ccc; } img{ display:block; vertical-align: middle; max-width: 100%;} blockquote{ margin:2em 0; font-style:italic; border-left:2px solid #CCC; padding-left: 1em; } blockquote p{margin-bottom:0.5em;} cite{ font-weight:bold; } q{ font-style:italic; } abbr { text-decoration:none;} button:focus { outline: none; text-decoration: none;} #vortexDebugContenu { height: 430px!important;} /* Methode de clear float */ .clear{ clear:both; } .clearfix:after{ visibility:hidden; display:block; font-size:0; content:'.'; clear:both; height:0; } .ie8 .clearfix { zoom:1; } /* Cacher pour les lecteurs d'ecrans et navigateurs */ .hidden, .champCache{ display: none !important; visibility: hidden; } /* Passe la navigation, pour screen reader */ .passeNav { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; } /* Correction pour AddThis */ #_atssh{ top:0; } #at15pf { box-sizing: content-box;} .at-share-tbx-element .at-share-btn:first-child { margin-left: 0;} h1, h2, h3, h4, h5, h6, aside .sousTitre, .titreH1, .titreSousPage { font-family: "nexa"; color: #000;} h1, .titreH1 { font-size: 30px; font-weight: bold; line-height: 1; margin-bottom: 30px;} h2, .titreSousPage{ font-size: 25px; font-weight: bold; line-height: 1.2; margin-bottom: 16px; } h3 { font-size: 18px; margin: 20px 0 10px; font-weight: bold;} h4{ font-size: 15px; margin: 20px 0 4px;} .pageCalculAjustement .titreSousPage { text-transform: uppercase;} a{ color:#245baa; text-decoration:none; transition: color 0.15s linear 0s;} a:focus, a:active { text-decoration: none; outline: none;} a[href^=mailto], .lienCourriel { /*color: #f53e25;*/ color: #245baa;} .incTinyMce a[href^=mailto] { color: #245baa;} .lienCourriel:hover, .lienCourriel:focus, .lienCourriel:active { text-decoration: underline;} .sousTitreLien { text-transform: uppercase; margin-top: 50px;} ul { list-style: none;} .lienImpression:hover, .lienImpression:focus, .lienImpression:active, .lienImpression:hover a, .lienImpression:focus a, .lienImpression:active a{ color: #f53e25;} .lienImpression { background: transparent; color: #245baa;} .lienImpression:before { content: ""; background: url(../gx/m/sprites-icon.png) -40px -160px no-repeat; display: inline-block; width: 23px; height: 23px; vertical-align: middle; margin-right: 8px;} .lienImpression:hover:before, .lienImpression:focus:before, .lienImpression:hover:active { background-position: -74px -160px; } @media screen and (min-width: 768px) { h1, .titreH1 { font-size: 40px; margin-bottom: 40px;} } .anchor { display: block; position: relative; top: -120px; visibility: hidden; } /* Body et HTML --------------------------------------------------------------------------------------- */ body, section{ font: 16px 'muli', Arial, Helvetica, sans-serif; color:black;} /* Conteneurs --------------------------------------------------------------------------------------- */ .conteneur { max-width: 1380px; width: 100%; margin: 0 auto; position: relative; padding: 0 30px;} section .conteneur { margin: 0 auto;} .pageContenu { background: #fff;/* padding-bottom: 50px;*/ } main { min-height:480px; /* overflow: hidden; ?? */ padding-bottom: 50px; } main.noPadding { padding-bottom: 0;} main > .conteneur { font-size: 0;} .contenuCentrer { text-align: center;} /* .textePrincipal { font-size: 16px; display: inline-block; vertical-align: top; width: 100%; position: relative; padding-top: 30px; float:left;} */ .textePrincipal { font-size: 16px; display: inline-block; vertical-align: top; width: 100%; position: relative; padding-top: 30px;} .texteComplementaire { padding: 0 0px 40px 0px;} .textePrincipal.full { width: 100%;} .textePrincipal.etroit { } .textePrincipal.short { min-height: 0; padding-bottom: 34px; width: 100%;} .textePrincipal .center { text-align: center;} .texteComplementaire.bloc { display: inline-block; vertical-align: top; width: 100%;} aside { font-size: 16px; display: inline-block; vertical-align: top; width: 100%; padding-top: 30px; } .lateralSimple .titre { font-size: 24px; font-weight: bold; text-transform: uppercase; color: #000; font-family: 'nexa', arial, sans-serif; margin-bottom: 10px;} .lateralSimple nav > ul { /*border-top: 1px solid #ebebeb;*/ margin-top: 10px;} .lateralSimple li, .listePageInterne li { border-bottom: 1px solid #ebebeb; display: inline-block; width: 100%; vertical-align: top;} .lateralSimple nav a, .listePageInterne li a { color: #000; font-size: 18px; padding: 15px 0 15px 20px; display: inline-block; width: 100%; position: relative; font-weight: bold;} .lateralSimple nav a:hover, .lateralSimple nav a:active, .lateralSimple nav a:focus { color: #999999;} .lateralSimple.actif { color: #999999;} .lateralSimple nav a:hover:before, .lateralSimple nav a:active:before, .lateralSimple nav a:focus:before {content: ">"; font-family: 'guifx', arial, sans-serif; color: #245baa; position: absolute; top: 50%; left: 0; margin-top:-8px;} .lateralSimple nav a.actif:before, .listePageInterne li a:before {content: ">"; font-family: 'guifx', arial, sans-serif; color: #245baa; position: absolute; top: 50%; left: 0; margin-top:-8px;} .listePageInterne .descr { padding: 0 20px 20px;} .listePageInterneCompacte li { font-size: 14px; transition: all 0.2s; } .listePageInterneCompacte li.enteteListe { font-weight: bold; display: flex; align-content: center; flex-direction: column; background: #245baa; color: #fff;} .listePageInterneCompacte li:nth-child(even) { background: #f9f9f9;} .listePageInterneCompacte li a { font-weight: 400; font-size: 14px; display: flex; padding: 0; align-content: center; flex-direction: column;} .listePageInterneCompacte li a:before { content: '';} .listePageInterneCompacte span { flex: 0 1 auto; padding: 0 0 8px 20px; } .listePageInterneCompacte span.statut { flex: 0 1 auto; width: 84px; display: none} .listePageInterneCompacte .identifiant { flex: 0 1 auto; padding: 8px 20px 4px 20px; word-break: break-all;} .checkedIn .statut { background: #c8f2be; } .checkedIn { background: #c8f2be; } .blocInfoParticipant { background: #f8f8f8; padding: 20px; border: 1px solid #ebebeb; font-size: 13px; margin: 30px 0 20px;} .groupeBouton .boutonGeneral, .groupeBouton .boutonCouleur { margin-bottom: 5px; width: 100%;} .checkInEvenemnt { display: inline-block; width: 100%;} .pageCheckIn .note { font-size: 13px;} [class^=message].selectionQteNote { padding: 10px;} .selectionQteNote a { text-decoration: underline;} .selectionQteNote a:hover { color: #000;} @media screen and (min-width: 480px) { .groupeBouton .boutonGeneral, .groupeBouton .boutonCouleur, .checkInEvenemnt { width: auto;} .listePageInterneCompacte li a, .listePageInterneCompacte li.enteteListe { flex-direction: row; } .listePageInterneCompacte .identifiant { width: 150px;} .listePageInterneCompacte span {padding: 8px 0 8px 20px; } .listePageInterneCompacte .nomParticipant { width: calc(100% - 234px);} /*.listePageInterneCompacte .heureValidation { width: calc(40% - 117px);}*/ .listePageInterneCompacte span { border-right: 1px solid #ebebeb;} .listePageInterneCompacte span:last-child { border-right: 0;} .listePageInterneCompacte span.statut { display: block;} .checkedIn { background: none; } } @media screen and (min-width: 1100px) { .menuPrincipalModuleEvenement .menuTiroir { display: none!important;} } .lateralSimple ul ul { padding-bottom: 8px;} .lateralSimple ul ul li { border: none; } .lateralSimple ul ul a { padding: 0 0 8px 36px; font-size: 15px; font-weight: 300; color: #999;} .lateralSimple nav ul ul a:hover, .lateralSimple nav ul ul a:focus, .lateralSimple nav ul ul a:active { color: #f94131;} .lateralSimple nav ul ul a.actifNiveau2 { color: #f94131;} .lateralSimple nav ul ul a:hover:before, .lateralSimple nav ul ul a:focus:before, .lateralSimple nav ul ul a:active:before { content: ""; } .sousPageDesktop { display:none!important;} .menuLateral { display: none;} .menuLateralMobile.customSelect{ font-size: 15px; font-weight: bold; display: inline-block;} @media screen and (min-width: 768px) { aside { padding-top: 40px;} .textePrincipal { padding-top: 40px;} .textePrincipal.etroit, .texteComplementaire.etroit { padding-left: 5%; padding-right: 5%;} .groupe-col { font-size: 0;} .groupe-col * { font-size: 15px; /* remettre une taille par défaut */} [class*=col-] { display: inline-block; vertical-align: middle; } .col-1 { width: 100%;} .col-1-8 { width: 50%;} .col-1-4 { width: 50%;} .col-1-2 { width: 50%;} .col-3-4 { width: 50%;} .col-3-8 { width: 50%;} .col-5-8 { width: 50%;} .offset-3-4 { margin-left:50%;} .col-droite { text-align: right;} } @media screen and (min-width: 1000px) { .textePrincipal { padding: 50px; width: 67%; min-height: 600px; } aside { display: inline-block; vertical-align: top; width: 33%; padding-top: 50px; padding-right: 50px; padding-bottom: 50px;} .menuLateral { display: inline-block;} .menuLateralMobile { display: none!important;} .conteneur { padding: 0 20px;} /* .textePrincipal { padding: 50px; float:left; } */ .textePrincipal { padding: 50px; } .textePrincipal.etroit, .texteComplementaire.etroit { padding-left: 20%; padding-right: 20%;} main.interne { background: url(../gx/m/banniereInterne.jpg) top center no-repeat; padding-top: 50px;} .col-1-8 { width: 12.5%;} .col-1-4 { width: 25%;} .col-1-2 { width: 50%;} .col-3-4 { width: 75%;} .col-3-8 { width: 37.5%;} .col-5-8 { width: 62.5%;} .offset-3-4 { margin-left: 75%;} .offset-5-8 { margin-left: 62.5%;} .texteComplementaire { padding: 0 50px 50px 50px;} .texteComplementaire.bloc { width: 67%;} } /* Textes et CMS --------------------------------------------------------------------------------------- */ .incTinyMce p { margin-bottom: 20px; font-size: 16px; } .incTinyMce abbr[title]{border-bottom:1px dotted; } .incTinyMce img{ max-width:100%; max-height: 100%; } .incTinyMce hr { border-top: 1px solid #e4e4e4;} .incTinyMce iframe { max-width:100%;} .incTinyMce a:hover, .incTinyMce a:focus, .incTinyMce a:active{ /*color:#666;*/ text-decoration: underline; outline:none; } .incTinyMce .intro { font-weight: bold; font-size: 17px;} /* - - - Listes - - - */ .incTinyMce ul, .incTinyMce ol{ margin-bottom:1em; margin-left: 30px;} .incTinyMce ul li{ margin-left:14px; position: relative;} .incTinyMce li { margin-bottom: 6px;} .incTinyMce ul li:before { content: "\2022"; color: #245baa; font-size: 16px; position: absolute; top: 0px; left: -12px; } .incTinyMce ol li{ margin-left:20px; } .incTinyMce ol ol > li{ list-style:lower-alpha; } /* Liste incrementale stylable */ /*.incTinyMce ol { counter-reset: bullet; list-style-type: none;} .incTinyMce ol li{ position:relative; margin-left:20px; } .incTinyMce ol li:before { counter-increment: bullet; content: counters(bullet,".") "."; position:absolute; top:0; left:-20px; color:#000; }*/ /* - - - Image en float - - - */ .mortaise { float:left; margin:0 20px 10px 0; text-align:center; font-size:12px;} .mortaise img { margin-top: 6px; } .note{ font-size:11px; line-height: 1.5em; } /* Points de suspension a la fin de la fonction couperTexte */ .hellip{ white-space:nowrap; color:#245baa; font-size:0.9em;} /* - - - Responsive video - - - */ .videoConteneur{ max-width:100%; } .video{ position: relative; height: 0; overflow: hidden; padding-bottom: 56.25%; /* Ratio 16/9 */ padding-top: 30px; /* Hauteur des controles */} .video iframe, .video object, .video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .incTinyMce iframe[src*=youtube] { max-width:100%;} @media screen and (min-width: 980px) { .videoConteneur{ max-width:520px; } } /* - - - Style par défaut d'un tableau - - - */ .incTinyMce table{ margin-bottom: 1em; border: 1px solid #666;} .incTinyMce table caption{} .incTinyMce table th{ border: 1px solid #666; background: #333; font-weight: bold; color: #fff;} .incTinyMce table td, .incTinyMce table th{ min-width: 50px; padding: 0.25em 0.5em;} .incTinyMce table tr:nth-child(even){ background: #eee; } /* différents styles de boutons */ [class^=bouton], .btn_print.boutonGeneral { display: inline-block; padding: 11px 28px 12px; color: #fff!important; text-align: center; font: 16px 'muli', arial, sans-serif; transition: background-color 0.3s; text-decoration: none!important; cursor: pointer;} .boutonGeneral { background: #3f4d5f;} .ctaProprioEnquete { text-align: center; margin-top: 30px;} .ctaProprioEnquete .boutonGeneral { background: #245baa;} .ctaProprioEnquete .boutonGeneral:hover, .ctaProprioEnquete .boutonGeneral:focus, .ctaProprioEnquete .boutonGeneral:active { background: #0d459c;} .btn_print.boutonGeneral { border: 0; height: auto; width: auto;} .boutonGeneral:hover, .boutonGeneral:focus, .boutonGeneral:active { background: #2f3b4a;} .boutonCouleur { background: #f94131;} .boutonCouleur:hover, .boutonCouleur:focus, .boutonCouleur:active { background: #ee2524;} .boutonCouleurCorpiq { background: #245baa;} .boutonCouleurCorpiq:hover, .boutonCouleurCorpiq:focus, .boutonCouleurCorpiq:active { background: #21529d;} .boutonClair { background: #fff; border: 1px solid #ebebeb; color: #999!important;} .boutonClair:hover, .boutonClair:focus, .boutonClair:active { background: #999; color: #fff!important;} .boutonVide { background: transparent; border: 3px solid #fff;} .boutonVide:hover, .boutonVide:focus, .boutonVide:active { background: #fff; color: #245baa!important; } [class^=bouton].full { display: block; width: 100%;} [class^=bouton].full:disabled { color: #f94131!important; font-weight: bold; font-size: 17px} .lienRetour { position: relative; padding-left: 28px; display: inline-block;} .lienRetour:before, .lienRetour:after { position: absolute; top: 50%; margin-top: -7px; font-family: "guifx"; content: "<";} .lienRetour:before {left: 0;} .lienRetour:after { left: 6px;} .lienRetour:hover, .lienRetour:focus, .lienRetour:active { text-decoration: underline;} .lienSuivant { position: relative; padding-right: 18px; color: #f53e25; display: inline-block;} .lienSuivant:before, .lienSuivant:after { position: absolute; top: 50%; margin-top: -5px; font-family: "guifx"; content: ">";} .lienSuivant:before {right: 0;} .lienSuivant:after { right: 6px;} .pageImpression { padding: 30px 50px 50px;} .pageImpression h2 { margin-top: 20px;} .pageImpression .lienImprimer { text-align: center; font-weight: bold; margin-bottom: 40px;} .pageImpression .bandeauForm button, .pageImpression .groupeActionForm { display: none;} /* Fil d'Ariane --------------------------------------------------------------------------------------- */ #filAriane { color:#3f4d5f; padding: 14px 0px; position: relative;} #filAriane:before { height: 1px; background: #e7eef1; content: ""; position: absolute; top:100%; left: -30px; right: -30px;} #filAriane li{ display:inline; position: relative; padding-left: 15px; margin-right: 7px; font-size: 14px;} #filAriane li:before{ content:'>'; color: #3f4d5f; font-family: "guifx"; position: absolute; top: 6px; left: 0;} #filAriane li:first-child:before{ display: none; } #filAriane li:first-child { padding-left: 0;} #filAriane a { font-size: 14px; } #filAriane a:hover, #filAriane a:focus, #filAriane a:active{ color: #91a3ad; } @media screen and (min-width: 1000px) { #filAriane { padding: 14px 50px; border-bottom: 1px solid #e7eef1;} #filAriane:before { height: 0; background: transparent;} } /* Pagination --------------------------------------------------------------------------------------- */ #pagination { text-align: right; margin-top: 40px; line-height: 1} #pagination a { display: inline-block; vertical-align: top; font-weight: 900; height: 100%; width: 100%; text-align: center; line-height: 1; padding-top: 10px;} .module_pagination { text-align: center; display: inline-block;} .module_pagination span { float: left; margin-left: 1px;} [class~=module_pagination_page] { width: 36px; height: 36px; font-size: 14px; display: inline-block; vertical-align: top; background: #fafafa; transition: all 0.2s;} .module_pagination_pagecourante { background: #9fa6af; color: #fff; padding-top: 10px;} .module_pagination_pagesuivante, .module_pagination_pageprecedente, .module_pagination_pagederniere, .module_pagination_pagepremiere { font-family: "guifx", arial, sans-serif; background: #fafafa; padding-top: 2px;} .module_pagination_pagesuivante a, .module_pagination_pageprecedente a, .module_pagination_pagederniere a, .module_pagination_pagepremiere a{font-weight: normal; padding-top: 2px; color: #245baa;} .module_pagination_page:hover, .module_pagination_page:active, .module_pagination_page:focus { background: #9fa6af; } .module_pagination_page:hover a, .module_pagination_page:active a, .module_pagination_page:focus a { color: #fff; outline: 0; border: 0;} /*--------------------------------------------------------------------------------------- */ /* Formulaires */ /*--------------------------------------------------------------------------------------- */ input, select { vertical-align:middle; } input[readonly]{ background-color:#eee; } label, .noteForm, .noteOubli, .petitCaractere { display:block;font:bold 14px 'muli', arial, sans-serif; color: #000; margin-bottom: 4px;} label abbr, .note abbr{ padding:0 2px; border:0 none !important; color:#f53e25; cursor:help;} input:disabled, select:disabled, .customSelect.customSelectDisabled, .customSelectDisabled .customSelectInner:before { background: #f4f4f4} .btRadio div { width: 50%; float: left; padding: 10px 0;} .btRadio p, .btCheck p { font-size: 14px; display: inline; font-weight: bold; color: #000;} /* - - - Input default - - - */ input, select, textarea, .customSelect{ max-width:100%; height:40px; /* taille du hasCustomSelect à rectifier */ padding:8px 12px; -webkit-appearance: none; font-size:13px; border: 1px solid #e1e1e1; outline: none; background: #fff; color:#333; border-radius: 0; box-sizing: border-box; -webkit-transition:box-shadow ease-in-out 0.3s; transition:box-shadow ease-in-out 0.3s; /*background-color: #fafafa; -ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#fafafa',GradientType=1 ); background: -webkit-linear-gradient(#fff, #fafafa); background: linear-gradient(#fff, #fafafa);*/ } input[type=radio], input[type=checkbox]{ margin-right:5px; width: auto; height: auto; display: inline-block; vertical-align: top; margin-top: 5px; } input[type=checkbox] { -webkit-appearance: checkbox;} input[type=radio] { -webkit-appearance: radio;} input, select, textarea{ width: 100%;} input[name=recherche] { background: #f9f9f9} select { border: none;} select.hasCustomSelect, .customSelect.customSelectDisabled{ cursor: default;} .margeBas{ margin-bottom: 20px;} /*select {opacity: 0} */ .customSelect { position: relative; overflow: hidden;} .hasCustomSelect {height: 40px!important; cursor:pointer; z-index: 2;} .customSelectInner { height: 100%; padding-left: 7px; padding-top: 1px; overflow: hidden; font-size: 15px; line-height: 1.3; } .customSelectInner:before { content: ","; font-family: "guifx", arial, sans-serif; color: #999; position: absolute; right: 0px; top: 0px; font-size: 16px; padding: 10px 10px 10px 4px; background: #fff;} .groupeCheckBox { width: 100%;} .groupeCheckBox li { width: 100%; float: left; padding-right: 30px; } textarea{ resize: none; height: 100px;} form { display: inline-block; width: 100%;} #vortexDebug input, #vortexDebug select, #vortexDebug textarea { height: 20px;} input:focus, select:focus, textarea:focus{ outline:0; border:1px solid #245baa; border:1px solid rgba(36,91,170,0.6); -webkit-box-shadow:0 0 1px rgba(36,91,170,0.6);box-shadow:0 0 1px rgba(36,91,170,0.6);} ::-webkit-input-placeholder{ color:#999; } ::-moz-placeholder{ opacity:1; color:#999; } :-ms-input-placeholder{ color:#999 !important; } [class^=message] { margin-bottom:10px; padding:10px 50px 10px 10px; text-align:center; font-weight:bold; font-size: 15px; position: relative;} .messageInfo{ color:#2b4868; background-color:#cdebfa; } .messageSucces{ color:#005729; background-color:#c8f2be; } .messageAvertissement{ color:#790000; background-color:#feefb3; } .messageErreur{ color:#a9181c; background-color:#fac7c3;} [class^=message] .fermerAlerte { position: absolute; top: 50%; margin-top: -11px; right: 15px; } [class^=message] .fermerAlerte:before { background: url(../gx/m/sprites-icon.png) -156px -196px no-repeat; content: ""; width: 22px; height: 22px; display: inline-block; vertical-align: top;} .accueilMembre [class^=message] { margin-bottom: 0; } [class^=message] h1, [class^=message] h2, [class^=message] h3, [class^=message] h4, [class^=message] h5 { margin: 0;} .messageInfo .fermerAlerte:before { background-position: -156px -98px;} .messageAvertissement .fermerAlerte:before { background-position: -156px -127px;} .messageErreur .fermerAlerte:before { background-position: -156px -161px;} .messageSucces .fermerAlerte:before { background-position: -156px -225px;} .messageInfoAlerte { background: #3f4d5f; color: #fff; text-align: left; padding: 10px 50px 10px 30px; margin-bottom: 0;} .messageInfoAlerte strong { color: #f94131; text-transform: uppercase; font: bold 25px "nexa", arial, sans-serif; margin-right: 10px;} .erreur, .erreur label, .erreur abbr { color:#c00 !important; } .erreur input, .erreur textarea, .erreur select, input.erreur, textarea.erreur, select.erreur{ border:1px solid #c00 !important; } .form .erreur input:focus, .form .erreur textarea:focus, .form .erreur select:focus, .form input.erreur:focus, .form textarea.erreur:focus, .form select.erreur:focus{ -webkit-box-shadow:0 0 5px rgba(204,0,0,0.8); box-shadow:0 0 5px rgba(204,0,0,0.8);} /* - - - Layout - - - */ .col1, .col2 { width:100%; margin-bottom: 12px; position: relative; font-size: 14px; display: inline-block; } .colFull { clear:left; margin-bottom: 12px; position: relative; font-size: 14px; display: inline-block; width: 100%;} .colAction { text-align: right; margin-top: 20px; width: 100%; display: inline-block;} .colAction button { margin-left: 18px; margin-top: 10px;} .special * { display: inline-block; vertical-align: middle;} .special input { width: 30%; } .special label { width: 100%;} .centrer { text-align: center;} @media screen and (min-width: 480px) { .col1, .col2{ float:left; width:49%;} .col1{ clear:left; margin-right: 1%; } .col2{ margin-left: 1%; } .groupeCheckBox li { width: 50%; padding-right: 30px; } } form p { font-size: 14px;} form .sousTitre { font-size: 25px; font-weight: 600; color: #000; font-family: 'nexa', arial, sans-serif;} form .texte { margin: 30px 0; display: inline-block;} /* slick-slider*/ .slick-next, .slick-prev { font-family: "icons", arial, sans-serif; color: #fff; background: transparent; font-size: 24px;} .slick-next:before { content: "\e601"; } .slick-prev:before { content: "\e600";} .carteCredit { margin-top: 6px;} .facebook, .lienMessage { display: inline-block; font-size: 0; padding-top: 3px; transition: all 0.3s;} .facebook:before { content: ""; background: url(../gx/m/sprites-icon.png) -48px 0 no-repeat; display: inline-block; width: 10px; height: 22px; vertical-align: middle;} .facebook:hover, .facebook:focus, .facebook:active, .lienMessage:hover, .lienMessage:focus, .lienMessage:active { background-color: #3f4d5f; } .facebook:hover:before, .facebook:focus:before, .facebook:active:before { background-position: 0px 0; } .linkedin { display: inline-block; font-size: 0; padding-top: 3px; transition: all 0.3s;} .linkedin:before { content: ""; background: url(../gx/m/sprites-icon.png) -82px -244px no-repeat; display: inline-block; width: 23px; height: 22px; vertical-align: middle;} .linkedin:hover, .linkedin:focus, .linkedin:active, .lienMessage:hover, .lienMessage:focus, .lienMessage:active { background-color: #3f4d5f; } .linkedin:hover:before, .linkedin:focus:before, .linkedin:active:before { background-position: -45px -244px; } .lienMessage:before { content: ""; background: url(../gx/m/sprites-icon.png) -60px -33px no-repeat; display: inline-block; width: 24px; height: 24px; vertical-align: middle;} .lienMessage:hover:before, .lienMessage:focus:before, .lienMessage:active:before { background-position: 0 -33px; /* 66 */} .twitter { display: inline-block; font-size: 0; padding-top: 3px; transition: all 0.3s;} .twitter:before { content: ""; background: url(../gx/m/icon_twitter.png) no-repeat; background-size: 22px; display: inline-block; width: 23px; height: 22px; vertical-align: middle;} .twitter:hover, .twitter:focus, .twitter:active, .lienMessage:hover, .lienMessage:focus, .lienMessage:active { background-color: #3f4d5f; } .twitter:hover:before, .twitter:focus:before, .twitter:active:before {background: url(../gx/m/icon_twitter_hover.png) no-repeat; background-size: 22px;} footer .twitter { background: transparent!important; margin-left: 15px; } footer .twitter:hover:before, footer .twitter:focus:before, footer .twitter:active:before {background: url(../gx/m/icon_twitter_hover.png) no-repeat; background-size: 22px;} .youtube { display: inline-block; font-size: 0; padding-top: 3px; transition: all 0.3s;} .youtube:before { content: ""; background: url(../gx/m/icon_youtube.png) no-repeat; background-size: 22px; display: inline-block; width: 23px; height: 22px; vertical-align: middle;} .youtube:hover, .youtube:focus, .youtube:active, .lienMessage:hover, .lienMessage:focus, .lienMessage:active { background-color: #3f4d5f; } .youtube:hover:before, .youtube:focus:before, .youtube:active:before {background: url(../gx/m/icon_youtube_hover.png) no-repeat; background-size: 22px;} footer .youtube { background: transparent!important; margin-left: 10px; } footer .youtube:hover:before, footer .youtube:focus:before, footer .youtube:active:before {background: url(../gx/m/icon_youtube_hover.png) no-repeat; background-size: 22px;} /*--------------------------------------------------------------------------------------- */ /* Menu et entête */ /*--------------------------------------------------------------------------------------- */ .enteteMobile { text-align: center; width: 100%; } .logo{ float: left; margin-top: 10px;} .logo picture { /*width: 100px;*/ height: auto; width: 120px; margin-top: 4px;} #menu, .menuSec { width: 100%; text-align: right;} #menu li, .menuSec li { display: inline-block; position: relative; vertical-align: top;} #menu { display: none;} #menu li:first-child a { margin-left: 0;} .menuTiroir { position: relative; color: #3f4d5f;} .menuTiroir p { display: none; vertical-align: middle; font-size: 15px; font-weight: bold;} #menu ul { display: inline-block; vertical-align: middle;} .menuSec { padding: 5px 0;} .menuSec div { display: inline-block; font-size: 0; vertical-align: top; height: 45px;} #menuMobile .menuSec ul { display: block;} .menuSec a { display: inline-block; vertical-align: middle; font-size: 15px; } .menuSec .nouvelleAlerte a { vertical-align: top; line-height: 1.4;} .menuSec .lien:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;} .menuSec .lien a { font-weight: bold; color: #3f4d5f; margin-right: 26px; display: inline-block; vertical-align: middle;} .menuSec .lien a:hover, .menuSec .lien a:focus, .menuSec .lien a:active { color: #999999;} .menuSec .groupeBouton { margin-right: 8px; } .menuSec .groupeBouton a { border: 1px solid #ebebeb; padding: 9px 0 0; height: 46px; text-align: center; width: 46px;} .menuSec .groupeBouton .facebook, .menuSec .groupeBouton .linkedin { border-left: 0;} .menuSec .boutonGeneral { margin-right: 1px;} #interactionMenu { cursor: pointer;} #interactionMenu .profil:before { display: none; } .profil { position: relative; } .profil .identifiant p { font-size: 15px; text-align: left; padding-left: 10px; color: #000; font-weight: bold; line-height: 1.4;} .profil .identifiant p:first-child { text-transform: uppercase;} .profil .identifiant:before { content: ""; background: url(../gx/m/sprites-icon.png) -252px -15px no-repeat; display: inline-block; width: 24px; height: 24px; margin-left: 10px; margin-top: 10px;} .profil .identifiant:hover:before, .profil .identifiant:focus:before, .profil .identifiant:active:before { background-position: -200px -3px ;} .profil.actif .identifiant:before { background-position: -200px -3px ;} .voirAlerte .icone { position: relative; margin-right: 5px;} .voirAlerte .icone:before { background: #3f4d5f; background: url(../gx/m/sprites-icon.png) -252px -65px no-repeat; display: inline-block; width: 24px; height: 24px; position: relative; cursor: pointer; content: ""; margin-left: 10px; margin-top: 10px;} .voirAlerte .icone:hover:before, .voirAlerte .icone:focus:before, .voirAlerte .icone:active:before { background-position: -201px -55px;} .voirAlerte ul { display: none; position: absolute; top: 100%; width: 290px; right: -48px; font-size: 16px; background: #fff; z-index: 2; margin-top: 16px; border-radius: 6px; transition: all 0.2s;} .voirAlerte ul:before { content: url(../gx/m/fleche-alerte-bleue.png); display: inline-block; position: absolute; top: -17px; left: 54%; z-index: 3; width: 290px; height: 17px;} .voirAlerte ul.actif { display: inline-block;} .voirAlerte ul { text-align: left; border: 1px solid #ebebeb; } .voirAlerte li { padding: 10px 20px; font-size: 15px; font-weight: bold; color:#000; position: relative; display: inline-block; width: 100%;} .voirAlerte li { border-top: 1px solid #ebebeb;} .voirAlerte li:first-child { border: 0;} /*.voirAlerte li:hover, .voirAlerte li:focus, .voirAlerte li:active { background: #f4f4f4;} */.voirAlerte li p:first-child { font-size: 14px; color: #999;} .voirAlerte .icone span { display: none; position: absolute; top: 4px; right: 7px; background: #f53e25; border-radius: 20px; color: #fff; font-size: 11px; width: 18px; height: 18px; text-align: center;} .voirAlerte.nouvelleAlerte span { display: block;} .voirAlerte .fermer { position: absolute; top: 8px; right: 14px; color:#999; cursor: pointer;} .voirAlerte .nouvelleAlerte { position: relative; background: #fff;} .voirAlerte .nouvelleAlerte p:first-child:after { content: ""; background: #f53e25; width: 7px; height: 7px; border-radius: 30px; display: inline-block; margin-left: 10px; margin-top: -3px; vertical-align: middle;} .voirAlerte .enteteIcone { color: #fff; font-size: 12px; text-transform: uppercase; background: #245baa; display: inline-block; width: 100%;} .voirAlerte .center { text-align: center;} .voirAlerte .noBorder { border-top: 0!important;} .voirAlerte .zeroEvent { font-size: 14px; color: #999;} .voirAlerte .zeroEvent a{ display: inline-block; width: 100%; /*font-size: 12px;*/ margin-top: 8px;} .menuSec .lien, .menuSec .groupeBouton, .menuSec .ctaEntete { display: none;} #menuMobile .mobileReseauxSociaux { color: #fff;} #menuMobile .mobileReseauxSociaux a { display: inline-block; width: auto; border-bottom: 0; border-top: 0;} #menuMobile .mobileReseauxSociaux a:hover, #menuMobile .mobileReseauxSociaux a:focus, #menuMobile .mobileReseauxSociaux a:active { background: transparent!important; color: #fff;} #menuMobile .mobileReseauxSociaux a:before { margin-right: 0;} #menuMobile .mobileReseauxSociaux span { display: inline-block; vertical-align: middle;} #menuMobile .mobileReseauxSociaux .facebook { padding-right: 8px;} #menuMobile .mobileReseauxSociaux .linkedin { padding-right: 16px; padding-left: 8px;} #menuMobile .lienMessage:before { background-position: 0 -33px; margin-right: 10px;} #menuMobile .facebook:before { background-position: 0px 0; margin-right: 10px;} #menuMobile .facebook:hover:before{ background-position: -25px 0;} #menuMobile .linkedin:before { background-position: -45px -244px; margin-right: 10px;} #menuMobile .linkedin:hover:before{ background-position: -6px -244px;} @media screen and (min-width: 480px) { .profil .identifiant:before { background-position: -151px -3px; width: 45px; height: 45px; margin-left: 0; margin-top: 0px;} .profil .identifiant:hover:before, .profil .identifiant:focus:before, .profil .identifiant:active:before { background-position: -200px -3px ;} .profil.actif .identifiant:before { background-position: -200px -3px ;} .voirAlerte .icone:before { background-position: -151px -55px ; width: 45px; height: 45px; margin-left: 0; margin-top: 0px;} .voirAlerte .icone:hover:before, .voirAlerte .icone:focus:before, .voirAlerte .icone:active:before { background-position: -201px -55px;} .logo picture { width: 200px; margin-top: 17px; } .menuSec { padding: 30px 0;} } @media screen and (min-width: 768px) { .enteteMobile { text-align: left; } .menuSec .ctaEntete { display: inline-block;} .profil { padding-left: 24px; margin-left: 20px;} .menuTiroir p { display: inline-block;} .menuTiroir { margin-left: 20px;} } @media screen and (min-width: 1100px) { .menuSec .lien, .menuSec .groupeBouton { display: inline-block;} .profil:before { content: ""; display: inline-block; font-size: 16px; background: #c2c2c2; width: 1px; position: absolute; top: 8px; left: 0px; bottom: 8px;} } @media only screen and (min-width: 1160px) { .logo picture { /*width: 220px; height: 75px;*/ width: 300px; height: 76px; margin-top: 0;} } /*--------------------------------------------------------------------------------------- */ /* Contenu principal */ /*--------------------------------------------------------------------------------------- */ /* Popup contact flottant intrusif */ .popupContactConteneur { position: fixed; top: 160px; right: 0; z-index:11; height: 90px; } #ouvrirFormContact { position: absolute; top: 0; right: 0; bottom: 0; background: #f94131; color: #fff; width: 50px; z-index: 11; cursor: pointer; height: 90px;} #ouvrirFormContact p { transform: rotate(90deg); transform-origin: left top 0; position: absolute; top: 64px; left: 46px; width: 300px; font-size: 17px; font-family: "Muli", arial; display: none; line-height: 1.2;} .popupContactConteneur .respo { position: absolute; top: 0; right: 0; bottom: 0; left: 0;} .modalContact { background: #ebebeb; padding: 20px 70px 20px 20px; width: 280px; position: absolute; top: 0; right: -280px; transition: all 0.3s; display:none!important;} .modalContact.actif { right: 0;} .modalContact .intro { font-weight: 700; font-size: 13px; margin-bottom: 10px; color: #000;} .modalContact textarea { height: 70px;} .modalContact .messageErreur { padding-right: 10px;} .modalContact .col2.extra { margin-bottom: 0;} .iconF-bulleContact { position: absolute; top: 0; right: 0; left: 0; padding: 10px 0 4px; background: #f98631; text-align: center;} .iconF-bulleContact:before { content: ""; display: inline-block; width: 32px; height: 24px; background: url('../gx/m/sprites-icon.png') -242px -108px; display: inline-block; } #iconF-closePopup { position: absolute; right: 0; bottom: 0; padding: 10px 15px 10px; cursor: pointer; z-index: 12; } #iconF-closePopup:before { content: ""; display: inline-block; width: 20px; height: 20px; background: url('../gx/m/sprites-icon.png') -155px -196px; display: inline-block; } .popupContactConteneur .colAction { margin-top: 0px;} @media only screen and (min-width: 768px) { .popupContactConteneur .respo { display: none!important;} .popupContactConteneur { height: 410px; } #ouvrirFormContact { height: auto;} #ouvrirFormContact p { display: block;} #iconF-closePopup { padding: 12px 15px 12px;} .modalContact { height: 410px; width: 560px; padding: 20px 80px 20px 30px; right: -560px; display: inline-block!important;} .popupContactConteneur.bigger, .bigger .modalContact { height: 465px;} } /* Popup renseignements et coordonnées */ .popupMesInfo{ background: #FFF; border: 1px solid #e1e1e1; box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.25); position: fixed; top: 50%; left: 50%; transform: translate(-50%, -51%); padding: 20px; z-index: 10; display: none; } .popupMesInfo.actif{ display: block;} .popupMesInfo p{ font-size: 16px; padding: 5px 0;} .popupMesInfo a{ margin: 0 3px;} /* général */ .bandeau { border: 1px solid #ebebeb; border-radius: 3px; color: #999; position: relative; display: inline-block; width: 100%;} .bandeau .titre { padding-right: 20px; display: inline-block; color: #999; padding: 10px 40px 10px 20px; width: 100%; cursor: pointer; font-size: 15px; font-weight: bold; position: relative; z-index: 2; margin: 0; font-family: "muli", arial, sans-serif} .bandeau:hover, .bandeau:active, .bandeau:focus { border: 1px solid #3f4d5f; color: #3f4d5f; } .bandeau.actif { border: 1px solid #3f4d5f; color: #3f4d5f; } .bandeau:hover .titre, .bandeau:active .titre, .bandeau:focus .titre { color: #3f4d5f;} .bandeau.actif .titre { color: #3f4d5f;} .bandeau:hover:before, .bandeau:active:before, .bandeau:focus:before { content: ","; color: #3f4d5f;} .bandeau.actif:before { content: ","; color: #3f4d5f;} .bandeau:before { content: ">"; font-family: 'guifx', arial, sans-serif; position: absolute; top: 14px; right: 18px; color: #999;} .bandeauEvenement { border-color: #f53e25; } .bandeauEvenement .titre { color: #3f4d5f;} .bandeauEvenement:hover, .bandeauEvenement:active, .bandeauEvenement:focus, .bandeauEvenement.actif { border: 1px solid #f53e25; } .ctaInfoDetail { background: #f53e25; color: #fff; padding: 11px 20px 12px; text-align: center; margin-bottom: 20px; cursor: pointer;} .plusInfo { display: none; transition: all 0.2s; padding: 0 20px 20px;} .plusInfo ul { margin: 0 0 10px 0; } .plusInfo li:first-child { border: none;} .plusInfo li { border-top: 1px solid #ebebeb; display: inline-block; width: 100%; color: #000; padding: 10px 0;} .plusInfo li span, .plusInfo li p { display: inline-block; vertical-align: middle; width: 50%;} .plusInfo li span { text-align: right;} .actif .plusInfo { display: block;} .plusInfo .liste { padding: 0 12px;} /* carrousel de témoignages */ .moduleTemoignage { margin: 40px 0 0; background: #3f4d5f; padding: 40px 15%; color: #fff;} .moduleTemoignage .titreH1 { color: #fff;} .listeTemoignage { position: relative; font-style: italic; font-size: 14px;} .listeTemoignage:before, .listeTemoignage:after { position: absolute; top: 0; left: -50px; content: ""; background: url(../gx/m/citation.png) 0 0 no-repeat; width: 54px; height: 32px; display: none; } .listeTemoignage:after { background-position: -69px 0; top: auto; left: auto; bottom: 90px; right: -50px;} .listeTemoignage.fr:before { background-position: 0 -44px;} .listeTemoignage.fr:after { background-position: -69px -44px;} .slick-dots { margin-top: 20px;} .slick-dots button { content: ""; width: 8px; height: 8px; display: inline-block; vertical-align: middle; font-size: 0; background: #fff; transition: all 0.2s;} .slick-dots li { display: inline-block; vertical-align: middle; margin: 0 3px;} .slick-dots li:hover button, .slick-dots li:focus button, .slick-dots li:active button { background: #f94131;} .slick-dots .slick-active button { background: #f94131;} @media screen and (min-width: 600px) { .listeTemoignage:before, .listeTemoignage:after { display: block; } } @media screen and (min-width: 768px) { .listeTemoignage { font-size: 16px;} .moduleTemoignage .temoignageItem { padding: 0 20px;} } /* publicité intrusive */ .modalAd {position: fixed; bottom: 10%; left: -300px; background: #fff; width: 300px; display: block; font-size: 0px; transition: all 0.4s; z-index: 9999; display: none;} #boutonFermer, #boutonMin { position: absolute; top: 0; left: 100%; z-index:200; background: #245baa; cursor: pointer; padding-top: 8px; padding-left: 8px; width: 38px; height: 38px;} #boutonFermer:before { background: url(../gx/m/sprites-icon.png) -156px -196px no-repeat; content: ""; width: 22px; height: 22px; display: inline-block; vertical-align: top;} .modalAd.actif { left: 0px;} .modalAd.fermeture { left: -340px;} #boutonMin { top: 38px; background: #21529d;} #boutonMin:before { font-family: "icons", arial, sans-serif; color: #fff; background: transparent; font-size: 22px; content: "\e601"; font-weight: 900} #boutonMin.actif:before { content: "\e600";} .pub.bordureSup.invisible { display: none!important;} .modalAdLeaderBoard { position: fixed; bottom: 0; left: 0; right: 0; z-index: 20; text-align: center; font-size: 0;} .modalAdLeaderBoard > div { display: inline-block; vertical-align: bottom;} .contenuTexteGalerie .lg-video { padding: 0!important; position: static; } .contenuLightGallery { background: #fff; padding: 20px; border: 1px solid #ebebeb; font: 14px/1.7 "muli", arial, sans-serif; position: relative; } .btFermer { position: absolute; top: 0; right:0; z-index:200; background: #245baa; cursor: pointer; padding: 8px; border-top-right-radius: 4px;} .btFermer a:before { background: url(../../gx/m/sprites-icon.png) -118px -196px no-repeat; content: ""; width: 22px; height: 22px; display: inline-block; vertical-align: top;} .btFermer a { display: inline-block; position: relative;} .contenuLightGallery .lienRetour { display: block; line-height: 1; margin-top: 20px;} .contenuLightGallery h3 { margin-top: 0;} .contenuLightGallery .boutonCouleur { margin-top: 20px;} @media screen and (min-width: 768px) { .modalAdLeaderBoard { display: none;} .modalAd { display: block;} .contenuLightGallery { padding: 30px;} } @media screen and (min-width: 1000px) { } /* 00_888 : Plan du site --------------------------------------------------------------------------------------- */ #plan ul { margin-bottom: 10px; width: 100%;} #plan ul ul { margin-left: 20px; } #plan li { margin-bottom: 2px;} #plan > ul > li { margin-bottom: 12px;} #plan > ul a { color: #000; font-weight: bold} #plan ul ul a { color: #888;} #plan ul ul ul a { color: #a1a1a1;} #plan ul ul ul ul a { color:#bbb;} #plan a:hover { color: #004ea6;} @media screen and (min-width: 768px) { #plan > ul { display: inline-block; vertical-align: top; font-size: 0; width: 49%; padding-right: 40px;} #plan ul li { font-size: 15px;} } /* 00_1X0 : Actualités --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .formRechercheActualite, .formRechercheEvenement { margin-bottom: 10px; position: relative;} .formRechercheActualite button, { position: absolute; top: 0; right: 0; bottom: 0; width: 40px; padding: 0;} .formRechercheActualite button:before, .formRechercheEvenement button:after { content: ""; background: url(../gx/m/sprites-icon.png) -127px -66px no-repeat; width: 20px; height: 20px; display: inline-block; vertical-align: top; margin-top: 1px;} .formRechercheActualite input { padding-right: 50px;} .formRechercheEvenement button:after { margin-left: 10px;} .formRechercheEvenement button { width: 100%; } .formRechercheEvenement .colFull { margin-bottom: 6px;} .formRechercheEvenement .customSelect { vertical-align: top;} .listeNouvelle { list-style: none;} .listeNouvelle li { border-bottom: 1px solid #ebebeb; padding: 24px 0 18px;} .listeNouvelle li:first-child { padding-top: 0;} .listeNouvelle h2 { margin-bottom: 10px; line-height: 1;} .listeNouvelle h2 a { color: #000; font-weight: 600; font-size: 19px;} .listeNouvelle .suite { font-weight: bold; font-size: 17px;} .listeNouvelle .info { margin-bottom: 18px; font-size: 0;} .listeNouvelle figure { width: 100%; margin-top: 20px; margin-bottom: 6px;} .listeNouvelle time { display: block; margin-left: 0; margin-top: 8px; font-size: 14px; color: #999;} .lateralSimple .listeActualite { margin-bottom: 30px; margin-top: 20px; display: block;} .lateralSimple .listeActualite li { padding-left: 0; padding-right: 0; border-top: 0; } .lateralSimple .listeActualite li:first-child { padding-top: 0;} .detailNouvelle p { line-height: 1.7;} .detailNouvelle .intro span { color: #245baa; text-transform: uppercase; font-size: 11px; font-weight: bold} .detailNouvelle .intro span time { color: #999; text-transform: none; font-size: 14px; font-weight: 300;} /*.detailNouvelle .intro span time:after { content: "|"; margin: 0 8px 0 14px; display: inline-block; } */ .detailNouvelle figure { margin-top: 20px;} .detailNouvelle .texteNouvelle { margin-top: 20px;} .contenuLimite { background: #fafafa; border: 1px solid #ececec; text-align: center; padding: 20px 20px 10px 20px; margin-top: 20px; display: inline-block; width: 100%;} .contenuLimite [class^=bouton] { max-width: 260px; margin: 12px 0 28px; width:100%;} .contenuLimite .sousTitre { font-size: 17px; font-weight: bold; color: #000; margin-bottom: 20px;} .addthis_sharing_toolbox { margin: 30px 0;} @media screen and (min-width: 768px) { .listeNouvelle figure { width: 40%; margin-top: 4px; float: right; padding-left: 30px; } .listeNouvelle .sommaire.avecImage { width: 60%; float: left; } .listeNouvelle time { display: inline-block; margin-left: 10px; margin-top: 0; vertical-align: middle;} .contenuLimite { padding: 40px 40px 10px 40px; margin-top: 40px; } } /* 01_100 : Accueil --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /* bannière */ /***********************************/ /***********************************/ .bannierePrincipale .boite { background: rgba(255,255,255,0.65); font-size: 0; padding: 0; margin: 20px 0; display: inline-block; /*width: 99.9%;*/} .bannierePrincipale .descriptionComplement { width: 33%; display: inline-block; vertical-align: middle; font-size: 16px; background: #fff;} .bannierePrincipale .groupeBouton { width: 100%; font-size: 0; display: none;} .bannierePrincipale .groupeBouton a { width: 50%;} .bannierePrincipale .groupeBouton a:first-child { border-right: 1px solid #fff;} .bannierePrincipale .texte { display: inline-block; vertical-align: middle; width: 100%; font-size: 22px; padding: 30px 20px; color: #000; } .bannierePrincipale .texte .titre { font: normal 22px 'nexa', arial, sans-serif; text-transform: uppercase; line-height: 1.1; margin: 0;} .bannierePrincipale .texte a { margin: 16px 0 0;} .bannierePrincipale .extra { font-size: 14px; margin-top: 20px; } .icon-calendrier:before { content: ""; background: url('../gx/m/sprites-icon.png') -203px -148px; display: inline-block; width: 47px; height: 48px; margin-top:4px; } .flecheScroll { font-size: 0; text-align: center; cursor: pointer; display: none; margin-bottom: 20px; position: fixed; bottom: 0; left: 50%; margin-left: -30px;} .flecheScroll span { background: #245baa; height: 60px; width: 60px; display: inline-block; border-radius: 60px;} .flecheScroll span:before { font-family: "FontAwesome"; content: "\f107"; font-size: 46px; color: #fff; display: inline-block; margin-top: 8px; font-weight: 400!important;} .groupeVignette { padding: 0; margin: 0; font-size: 0; display: inline-block; vertical-align: middle;} .listeActualite { display: none;} .listeActualite li { border-top: 1px solid #ebebeb; padding: 26px 25px 24px; line-height: 1.4; font-size: 15px; color: #000; font-weight: bold;} .listeActualite li:first-child { border-top: 0;} .listeActualite [class^=vignette], .listeNouvelle [class^=vignette] { background: #ecf3f5; font-size: 12px; padding: 5px 10px; display: inline-block; text-transform: uppercase; color: #000; font-weight: bold; vertical-align: middle;} .listeActualite .vignetteExclusive, .listeNouvelle .vignetteExclusive { background: #9fa6af; color: #fff;} .listeActualite a { color: #000; margin-top: 5px; display: inline-block; font-weight: bold; } .listeActualite .note { color: #999; font-size: 14px; margin-top: 4px; font-weight: 300;} .listeActualite .unEvenement time { background: #9fa6af; display: inline-block; font-family: 'cantarell', arial, sans-serif; line-height: 1.2; font-size: 16px; width: 80px; height: 80px; text-align: center; color: #fff; float: left; margin-right: 18px; text-transform: uppercase; padding-top: 12px;} .listeActualite .unEvenement div { overflow: hidden; font-weight: bold;} .listeActualite .uneActualite div, .listeNouvelle .info div { font-size: 0;} .listeActualite .uneActualite time { font-size: 14px; color: #999; display: block; vertical-align: middle; padding: 5px 0; } .listeActualite .uneActualite .vignette { margin-right: 10px;} .listeActualite .uneActualite a span { color: #245baa;} .listeActualite .uneActualite a span:hover, .listeActualite .uneActualite a span:focus, .listeActualite .uneActualite a span:active, .suite:hover, .suite:focus, .suite:active { /*color: #f94131;*/ text-decoration: underline;} .groupeBoutonTablette { width: 100%; font-size: 0;} .groupeBoutonTablette a { width: 50%;} .groupeBoutonTablette a:first-child { border-right: 1px solid #fff;} @media screen and (min-width: 768px) { .bannierePrincipale .texte .titre { font-size: 40px;} .bannierePrincipale .texte {padding: 80px 40px;} .bannierePrincipale .texte a { margin: 26px 0;} .bannierePrincipale .extra { display: block;} .listeActualite .uneActualite time { display: inline-block;} .bannierePrincipale .extra { font-size: 22px; margin-top: 0; } } @media screen and (min-width: 1000px) { .bannierePrincipale .boite { margin: 50px 0px 20px;} .bannierePrincipale.membre .boite { margin: 26px 0 26px;} .flecheScroll { display: block;} .bannierePrincipale .texte { width: 67%; padding: 40px 15% 40px 50px; } .listeActualite, .bannierePrincipale .groupeBouton { display: block;} .groupeBoutonTablette { display: none;} } /* CTA */ /***********************************/ /***********************************/ .carrouselTexte { width: 100%; } .carrouselTexte > div { margin-bottom: 20px;} .carrouselTexte .unTexte {background: #245baa; padding-top: 46px; padding-bottom: 40px; transition: background 0.2s; min-height: 220px;} .carrouselTexte .unTexte.couleur1 { background: #3f4d5f;} .carrouselTexte .unTexte.couleur2 { background: #f94131;} .carrouselTexte .unTexte:hover { background: #21529d;} .carrouselTexte .unTexte.couleur1:hover { background: #2f3b4a;} .carrouselTexte .unTexte.couleur2:hover { background: #ee2524;} .carrouselTexte a { display: inline-block; width: 100%; height: 100%; font-size: 0; color: #fff;} .carrouselTexte a:before { content: ''; display: inline-block; height: 100%; vertical-align: middle;} .carrouselTexte p { display: inline-block; vertical-align: middle; text-transform: uppercase; font: 300 15px 'nexa', arial, sans-serif; padding: 0 40px 25px;} .slick-track { position: relative;} .appelAction { padding: 20px 0 0;} .appelAction ul { font-size: 0;} .appelAction .cta { width: 100%; } .appelAction li { width: 100%; display: inline-block; height: 130px; vertical-align: top; margin-bottom: 20px;} .appelAction li a { display: inline-block; vertical-align: middle; outline: 1px solid #d0d6dd; height: 100%; max-width: 100%; width: 100%; position: relative; background: #fff; font-size: 0; color: #000;} .appelAction li a:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;} .appelAction h2 { font: 300 18px 'nexa', arial, sans-serif; text-transform: uppercase; color: #000; margin-bottom: 10px;} .appelAction .image { position: absolute; top: 0; bottom: 0; left: 0; width: 72px; text-align: center; transition: background 0.2s;} .appelAction .image:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;} .appelAction .image img, .appelAction .image .imageRemplissage { display: inline-block; vertical-align: middle; max-width: 100%; padding: 10px;} .appelAction .texte { padding: 20px 10px 20px 80px; display: inline-block; vertical-align: middle; font-size: 14px;} .appelAction .texte div { display: none; color: #555;} .appelAction .slick-prev, .appelAction .slick-next { bottom: 18px; position: absolute; right: 40px; z-index: 10;} .appelAction .slick-next { right: 14px;} .appelAction li:hover .image, .ctaMembreListe li:hover .image, .appelAction li:focus .image, .ctaMembreListe li:focus .image, .appelAction li:active .image, .ctaMembreListe li:active .image { background: #245baa;} .imageRemplissage { width: 80px; height: 80px;} .appelAction .image .etatSurvol, .ctaMembreListe .image .etatSurvol { display: none;} .appelAction li:hover .etatSurvol, .ctaMembreListe li:hover .etatSurvol, .appelAction li:focus .etatSurvol, .ctaMembreListe li:focus .etatSurvol, .appelAction li:active .etatSurvol, .ctaMembreListe li:active .etatSurvol { display: inline-block;} .appelAction li:hover .etatNormal, .ctaMembreListe li:hover .etatNormal, .appelAction li:focus .etatNormal, .ctaMembreListe li:focus .etatNormal, .appelAction li:active .etatNormal, .ctaMembreListe li:active .etatNormal { display: none;} .appelAction li .titre { text-transform: uppercase; font-size: 16px; line-height: 1.2; display: block; font-family: "nexa", arial, sans-serif; color: #000;} /* section dans l'accueil des MEMBRES */ .appelAction .sousTitre { font-size: 26px; font-weight: bold; font-family: 'nexa', arial, sans-serif; color: #000; text-transform: uppercase;} .appelAction.membre { padding: 30px 0;} .ctaMembre { margin-top: 26px;} .ctaMembre ul { width: 100%; text-align: center; } .ctaMembre ul .image { width: 100px; padding-left: 5px; padding-right: 5px;} .ctaMembre ul .texte { padding: 20px 10px 20px 110px; } .ctaMembre ul .texte h2 { font-size: 14px;} .ctaMembre ul li { width: 100%; height: 130px; margin-bottom: 20px; text-align: left;} .ctaMembre li a { margin: 0;} .ctaMembreListe { margin-top: 40px; border-top: 1px solid #ebebeb} .ctaMembreListe a { color: #555; display: inline-block; width: 100%; height: 100%; position: relative;} .ctaMembreListe li { border-bottom: 1px solid #ebebeb; padding: 20px 0;} .ctaMembreListe .image { width: 80px; float: left; margin-right: 20px;} .ctaMembreListe .texte { padding-top: 8px;} .ctaMembreListe h2 { font-size: 20px;} .ctaMembreListe .image img, .ctaMembreListe .image .imageRemplissage { display: inline-block; vertical-align: middle; max-width: 100%; padding: 10px;} .appelAction .lienCourriel { float: right; display: inline-block; margin: 15px 0; } @media screen and (min-width: 400px) { .carrouselTexte p { font-size: 24px; } } @media screen and (min-width: 600px) { .ctaMembreListe .texte { overflow: hidden; padding-left: 100px; padding-top: 0; min-height: 80px;} .ctaMembreListe .image { margin-right: 0; position: absolute; top: -20px; bottom: -25px; left: 0; } .ctaMembreListe .image .etatSurvol, .ctaMembreListe .image .etatNormal { position: absolute; top: 50%; margin-top: -40px;} .ctaMembreListe h2 { font-size: 25px;} } @media screen and (min-width: 768px) { .carrouselTexte p { font-size: 30px; padding: 0 100px 0px 30px;} .carrouselTexte .unTexte { padding-top: 26px; padding-bottom: 20px;} .appelAction { padding: 20px 0;} .appelAction .slick-prev, .appelAction .slick-next { top: 50%; margin-top: -12.5px ; bottom: auto; right: 50px;} .appelAction .slick-next { right: 24px;} .appelAction ul:first-child { margin-bottom: 20px;} .appelAction li { width: 48.7%; height: 200px; margin-left: 2.6%; margin-bottom: 0;} .appelAction li:first-child { margin-left: 0;} .appelAction .texte div { display: inline-block; font-size: 14px;} .appelAction li .titre { font-size: 17px; margin-bottom: 6px; color: #000;} .appelAction .image { width: 114px;} .appelAction .texte { padding: 20px 10px 20px 130px;} .ctaMembre ul li { width: 48.7%; margin-left: 2.6%; height: 120px; } .ctaMembre ul:first-child { margin-bottom: 0px;} .ctaMembre ul li:first-child, .ctaMembre ul li:nth-child(odd) { margin-left: 0;} } @media screen and (min-width: 1000px) { .carrouselTexte { width: 33%; float: left;} .carrouselTexte div {height: 430px; padding: 0; margin-bottom: 0;} .carrouselTexte p { font-size: 20px; padding: 0 50px 25px;} .appelAction { padding: 50px 0;} .appelAction .slick-prev, .appelAction .slick-next { bottom: 18px; margin-top: 0; top: auto; right: 40px;} .appelAction .slick-next { right: 14px;} .appelAction ul:first-child { margin-bottom: 30px;} .appelAction .cta { width: 67%; float: left;} .appelAction li { width: 46%; height: 200px; margin-left: 4%; margin-bottom: 0;} .appelAction li:first-child { margin-left: 4%;} .ctaMembre ul.layoutAlternatif li, .ctaMembre ul.layoutAlternatif li:nth-child(odd) { width: 32%; margin-left: 2%; text-align: left; height: 200px;} .ctaMembre ul.layoutAlternatif .image { width: 100px;} .ctaMembre ul.layoutAlternatif .texte { padding: 20px 10px 20px 130px;} .ctaMembre ul:first-child { margin-bottom: 0px;} .ctaMembre ul li, .ctaMembre ul li:nth-child(odd) { width: 23.5%; margin-left: 2%; height: 120px; } .ctaMembre ul li:first-child, .ctaMembre ul.layoutAlternatif:first-child, .ctaMembre ul.layoutAlternatif li:nth-child(1) { margin-left: 0;} } @media screen and (min-width: 1200px) { .appelAction .texte div { font-size: 16px; } .appelAction li .titre { font-size: 20px; } } @media screen and (min-width: 1400px) { .carrouselTexte p { font-size: 30px; padding: 0 50px 25px;} } /* TEXTE SUR LES BÉNÉFICES */ /***********************************/ /***********************************/ .texteBenefice { text-align: center; padding: 50px 0; background: #0e1319; /* Old browsers */ background: linear-gradient(to bottom, #0e1319 0%,#245ba9 51%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e1319', endColorstr='#245ba9',GradientType=0 ); /* IE6-9 */ } .texteBenefice h2 { text-transform: uppercase; font-size: 20px; font-family: 'nexa', arial, sans-serif; font-weight: 300; line-height: 1.2; margin: 0 0 10px;} .texteBenefice p { font: 18px 'muli', arial, sans-serif;} .texteBenefice h3, .texteBenefice h3 p { text-transform: none; display: inline-block; font: 24px/1.2 'muli', arial, sans-serif; width: 100%; position: relative; font-weight: bold;} .texteBenefice h3 p { margin-top: 10px; text-transform: uppercase;} .texteBenefice h3 { min-height: 50px; } .texteBenefice h3 span { width: 50px; display: inline-block; height: 50px; position: relative; font-size: 22px; font-family: arial; padding-top: 8px; text-align: center;} /*.texteBenefice h3 .chiffre:before { margin: 3px 10px 0 0; border: 4px solid #fff; border-radius: 50px; content: ""; color: #fff; display:inline-block; width: 50px; height: 50px; text-align: center; position: absolute; top: -8px; left: 50%; margin-left: -25px; z-index: 2;}*/ .texteBenefice h4 { text-transform: none; margin: 20px 0; display: inline-block; font: 600 16px 'nexa', arial, sans-serif; width: 100%;} .texteBenefice * { color: #fff;} .texteBenefice .listeBenefice { font-size: 0; text-align: left; margin: 30px 0 10px;} .texteBenefice .listeBenefice > li { width: 100%; display: inline-block; vertical-align: top; text-align: center; margin-bottom: 10px;} .texteBenefice ul ul li { line-height: 1.8; margin-bottom: 4px;} .texteBenefice ul ul p { position: relative; font-size: 16px; display: inline; padding-left: 16px;} .texteBenefice ul ul p:before { position: absolute; top: 0; left: 0; content: "\2022";} .listeBenefice ul { display: none; } .listeBenefice .note { font-style: italic; font-size: 14px; margin-top: 20px;} .listeBenefice li a { text-decoration: underline;} .listeBenefice li a:hover, .listeBenefice li a:focus, .listeBenefice li a:active { color: #ccc;} .texteBenefice .chiffre { display: none;} .texteBenefice .mobile { padding-top: 0px; height: 50px; width: 50px; border: 4px solid #fff; border-radius: 50px; cursor: pointer; } .texteBenefice .mobile:before { border: none; border-radius: 0; content: ""; padding-top: 6px; background: url(../gx/m/sprites-icon.png) -120px -251px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: 20px; width: 20px; margin-top: 10px; margin-left: 10.5px;} .texteBenefice .mobile.actif { background: #fff; } .texteBenefice .mobile.actif:before { content: ""; background: url(../gx/m/sprites-icon.png) -156px -251px; margin-top: 11px; margin-left: 11px;} @media screen and (min-width: 768px) { .texteBenefice h2 { font-size: 40px; } .texteBenefice p { font-size: 22px;} .texteBenefice h4 { font-size: 18px;} } @media screen and (min-width: 1000px) { .texteBenefice {background: #171a20 url(../gx/01/banniere-benefice.jpg) bottom center no-repeat;} .texteBenefice .listeBenefice > li { width: 25%; margin-left: 12.5%; display: inline-block; font-size: 16px; vertical-align: top; text-align: left;} .texteBenefice .listeBenefice > li:first-child { margin-left: 0;} .texteBenefice h4 { margin: 30px 0;} .texteBenefice .listeBenefice > li { margin-bottom: 0;} .texteBenefice h3 span { position: absolute; top: 0; left: 0; padding-top: 6px;} .texteBenefice h3 p { padding-left: 60px; } .texteBenefice h3 .chiffre:before { top: 0;} .texteBenefice .listeBenefice { margin: 40px 0 60px;} .texteBenefice ul ul p { display: inline-block;} .listeBenefice { padding-left: 30px; padding-right: 30px;} .listeBenefice ul { display: inline-block !important; } .texteBenefice h3 p { margin-top: 0px;} .texteBenefice .chiffre { display: block;} .texteBenefice .mobile { display: none;} } /* CARROUSEL DES PARTENAIRES */ /***********************************/ /***********************************/ .textePrincipal .carrouselPartenaire{ background: transparent;} .carrouselPartenaire { background: #fafafa; position: relative; font-size: 0; padding: 30px 0;} .carrouselPartenaire li { text-align: center; height: 100px;} .carrouselPartenaire li:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;} .carrouselPartenaire li div { display: inline-block; vertical-align: middle; width: 100%;} .carrouselPartenaire li img { filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 3.5+ */ display: inline; max-height: 100px; padding: 12px 30px; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); transition: all 0.2s; opacity: 0.7; } .carrouselPartenaire li img:hover { -webkit-filter: none; -moz-filter: none; -ms-filter: none; -o-filter: none; opacity: 1; } .carrouselPartenaire li img:focus, .carrouselPartenaire li img:active { -webkit-filter: none; -moz-filter: none; -ms-filter: none; -o-filter: none; opacity: 1; } .carrouselPartenaire:before { content: url(../gx/01/icone-pointe.png); position: absolute; top: -12px; left: 50%; margin-left: -12px;} .carrouselPartenaire.interne:before { content: "";} .carrouselPartenaire .slick-prev, .carrouselPartenaire .slick-next, .listeTemoignage .slick-prev, .listeTemoignage .slick-next { color: #000; top: 50%; position: absolute; right: 0px; z-index: 10; margin-top: -12.5px;} .carrouselPartenaire .slick-prev, .listeTemoignage .slick-prev { left: 0px; right: auto;} .carrouselPartenaire .sousTitre { font-size: 30px; text-align: center; color: #000; font-family: "nexa", arial, sans-serif; margin-bottom: 20px; margin-top: 10px; text-transform: uppercase; font-weight: bold;} .carrouselPartenaire.interne .sousTitre { font-size: 22px; text-align: left;} /* BANDEAU PUBLICATAIRE */ /***********************************/ /***********************************/ .pub { text-align: center; padding: 30px 0; display: none;} .pub730-90 { background: #ccc; display: inline-block; width: 730px; height: 90px;} #div-gpt-ad-Leaderboard { display: inline-block;} .bordureSup {border-top: 1px solid #ebebeb; } @media screen and (min-width: 768px) { .pub { display: block;} } /* TEXTE GÉNÉRAL */ /***********************************/ /***********************************/ .texteInfo { padding: 40px 0; border-top: 1px solid #ebebeb;} .texteInfo .sousTitre { margin-bottom: 26px; font: 300 20px 'nexa', arial, sans-serif; color: #000; text-transform: uppercase; line-height: 1.2;} .texteInfo .texte { text-align: center; } .texteInfo ul { margin-top: 40px;} .texteInfo li { width: 100%; text-align: center; font-size: 25px; color: #000; font-family: 'nexa'; line-height: 1; margin-top: 40px;} .texteInfo li:first-child { margin-top: 0;} .texteInfo li div { color: #7db7a3; font-size: 40px; font-weight: 400; font-family: 'nexa', arial, sans-serif; font-weight: 300; line-height: 0.8} .texteInfo li span { color: #245baa; font-weight: bold; margin-right: 5px;} @media screen and (min-width: 768px) { .texteInfo li div { font-size: 45px;} .texteInfo li { float: left; width: 33.33%; margin-top: 0; } .texteInfo .sousTitre { font-size: 40px;} .texteInfo .texte { text-align: center; padding: 0 5%;} } @media screen and (min-width: 1000px) { .texteInfo li div { font-size: 60px;} .texteInfo { padding: 70px 0;} .texteInfo ul { margin-top: 70px;} .texteInfo .texte { text-align: center; padding: 0 10%;} } /*COORDONNÉES */ /***********************************/ /***********************************/ .localisation { color: #fff; text-align: right; position: relative; font-size: 15px; line-height: 1.7; background: #245baa; display: none;} .localisation .titre { text-transform: uppercase;} .localisation .image { background:#fff url(../gx/01/map-accueil.png) 830px -60px no-repeat; position: absolute; top: 0; right: 50%; bottom: 0; left: -1274px; border-top: 1px solid #ebebeb; display: inline-block; } .localisation .texte { width: 50%; padding: 30px; text-align: left; display: inline-block; background: #245baa; position: relative; z-index: 2;} .localisation .texte > div { margin-bottom: 20px;} @media screen and (min-width: 768px) { .localisation { display: block;} } @media screen and (max-width:1079px) and (min-width:1000px){ .localisation .image { background-position: 915px -167px;} .localisation .texte { width: 33.33%; padding: 60px 10px 40px 30px;} } @media screen and (max-width:999px){ .localisation .image {background-position: 1048px; background-size: 46%;} } @media screen and (min-width: 1000px) { .localisation .image { right: 33.33%; } /* .localisation .texte { width: 33.33%; padding: 40px 10px 40px 30px;} */ /* .localisation .image { background-position: 1000px -188px; background-size:50%;} */ } @media screen and (min-width:1080px){ .localisation .image { background-position: 1000px -165px;} .localisation .texte { width: 33.33%; padding: 60px 10px 40px 30px;} } @media screen and (min-width: 1100px) { .localisation .texte { width: 33.33%; padding: 60px 10px 40px 40px;} } /* 02_XX0 - 03_XX0 - 04_XX0 : Pages texte --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .pageBlocs { margin-top: 40px;} .pageBlocs ul { font-size: 0; text-align: center;} .pageBlocs li { width: 50%; display: inline-block; vertical-align: middle; position: relative; max-width: 270px;} .pageBlocs span { position: absolute; right: 0; left: 0; bottom: 0; padding: 0 10px 6px; line-height: 1.4;} .pageBlocs li div { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.5); font-size: 14px; font-weight: bold; color: #fff; text-align: center; transition: opacity 0.3s; opacity: 0;} .pageBlocs li:hover div, .pageBlocs li.touchEnabled div { opacity: 1;} .pageBlocs li h2 { text-transform: uppercase; display: block; margin: 0; color: #fff; font-size: 14px; font-weight: 300; font-family: "muli", arial, sans-serif;} .pageBlocs.styleClair li div { background: transparent; outline: 1px solid #ebebeb; color: #000;} .pageBlocs.styleClair li:hover { outline: 1px solid #ebebeb;} .pageBlocs.styleClair p { padding: 0 10px 16px;} .serieAccordeon { margin-top: 20px; } .serieAccordeon .bandeau { margin-bottom: 10px; } .serieAccordeon .plusInfo { padding: 20px 40px;} .serieAccordeon .plusInfo .incTinyMce p { margin-bottom: 20px;} .serieAccordeon .sousTitre { color: #000; font-weight: bold; font-size: 15px; display: inline-block; width: 100%; border-bottom: 1px solid #ebebeb; padding-bottom: 10px; margin-bottom: 10px; } .serieAccordeon li, .serieAccordeon ul { border: none;} .serieAccordeon li { padding: 2px 0 2px 22px; position: relative;} .serieAccordeon .listeDocument { margin: 0; } .serieAccordeon .listeDocument li:before { content: url(../gx/m/icone-pdf.png); position: absolute; top: 3px; left: 0;} .listeDocument.telechargeable { color: #000; margin-top: 40px; } .listeDocument.telechargeable h2 { display: block; font: 16px 'muli', Arial, Helvetica, sans-serif; margin: 0;} .listeDocument.telechargeable time { font-weight: 300; color: #999} .listeDocument.telechargeable li { position: relative; border-bottom: 1px solid #ebebeb; padding: 15px 50px 15px 0px; font-weight: bold; font-size: 15px} .listeDocument.telechargeable a:before { content: url(../gx/m/icone-pdf.png); position: absolute; top: 50%; right: 0; margin-top: -10px; } .listeDocument h3 { margin: 0; font-weight: 300; font-size: 16px; font-family: "muli", arial, sans-serif;} .listePartenaire { margin-top: 34px;} .listePartenaire ul { font-size: 0;} .listePartenaire li { display: inline-block; vertical-align: middle; width: 100%; margin-bottom: 16px;} .listePartenaire li:nth-child(odd) { margin-left: 0;} .listePartenaire li img { padding: 30px;} .listePartenaire .categorie { margin-bottom: 50px; text-align: center} .telBureau{ display: none;} .moduleSousPage { margin-top: 40px;} .ctaEconomie { background: #3f4d5f; padding: 40px; color: #fff;} .ctaEconomie .texte { overflow: hidden; font-size: 16px;} .ctaEconomie .sousTitre { font: 600 25px "nexa", arial, sans-serif;} .ctaEconomie .boutonCouleur { margin-top: 20px;} .ctaEconomie .image { margin-bottom: 20px; text-align: center;} .ctaEconomie img { display: inline;} .ctaEconomieTitre { text-transform: uppercase; margin-top: 40px;} @media screen and (min-width: 400px) { .listePartenaire li { width: 48%; margin-left: 4%; } } @media screen and (min-width: 600px) { /*.pageBlocs li { width: 33.33%;}*/ .pageBlocs li h2 { font-size: 18px; } .listePartenaire li:nth-child(odd), .listePartenaire li { margin-left: 2%; width: 32%;} .listePartenaire li:nth-child(3n+1) { margin-left: 0;} .listeDocument.telechargeable time { width: 200px; position: absolute; top: 15px; left: 0;} .listeDocument.telechargeable h2 { padding-left: 200px; display: inline-block;} .listeDocument.telechargeable time { font-weight: bold; color: #000} .ctaEconomie .image { float: left;} .ctaEconomie .texte { padding-left: 40px; } } @media screen and (min-width: 768px) { .pageBlocs li { width: 25%;} .serieAccordeon ul { width: 100%; float: left; padding-right: 20px;} } @media screen and (min-width: 1000px) { .serieAccordeon { margin-top: 40px; } /*.pageBlocs li { width: 33.33%;}*/ .telBureau{ display: inline!important;} .telMobile{ display: none!important;} } /* 05_X00 : Listing des partenaires et page détail d'un partenaire --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .formPartenaire .groupeChamp { padding: 20px; background: #000; font-size: 0; margin-top: 10px; } .formPartenaire input, .formPartenaire select, .formPartenaire .customSelect { width: 100%; vertical-align: top; color: #000; font-family: "muli"; background: #fff;} .formPartenaire .customSelectInner { font-size: 14px; font-family: "muli"} .formPartenaire [class^=bouton] { padding: 8px 28px 9px;} .formPartenaire .groupeChamp input, .formPartenaire .groupeChamp select, .formPartenaire .customSelect { margin-bottom: 6px;} .conteneurSelect { position: relative; width: 100%; display: inline-block; vertical-align: top;} .formPartenaire .boutonGeneral { width: 100%;} .filtrerPartenaire { margin: 20px 0;} .filtrerPartenaire ul { display: inline-block; vertical-align: middle;} .filtrerPartenaire li { transition: all 0.3s; background: #f9f9f9; padding: 8px 12px; border: 1px solid transparent; display: inline-block; vertical-align: top; font-size: 14px; color: #999; cursor: pointer; border-radius: 3px; margin-right: 4px; margin-top: 6px; text-transform: none;} .filtrerPartenaire li:hover, .filtrerPartenaire li:focus, .filtrerPartenaire li:active { background: #ebebeb; border: 1px solid #e1e1e1;} .filtrerPartenaire li.actif { color: #fff; background: #3f4d5f; border: 1px solid #3f4d5f;} .filtrerPartenaire li.actif [class^=iconePartenaire] span:before { background-position: -30px -92px;} .filtrerPartenaire li.actif .iconePartenaireCertifie span:before { background-position: -62px -92px;} .filtrerPartenaire li.actif .iconePartenaireRabais span:before { background-position: -94px -92px;} .filtrerPartenaire li.actif .iconePartenaireFiltreTout span:before { background-position: 0px -92px;} .filtrerPartenaire > p { display: inline-block; vertical-align: middle; font-weight: bold; text-transform: uppercase; margin-right: 6px;} .rechPartenaireListe { font-size: 0;} .rechPartenaireListe li { width: 100%; display: inline-block; vertical-align: top; font-size: 14px; margin-bottom: 30px; word-break: break-word; background: #f9f9f9; transition: all 0.2s;} .rechPartenaireListe .image { background: #fff;} .rechPartenaireListe .texte { padding: 18px 10px; position: relative; } .rechPartenaireListe li:hover .lienCourriel, .rechPartenaireListe li:focus .lienCourriel, .rechPartenaireListe li:active .lienCourriel { color: #fff;} .rechPartenaireListe li.vedette {outline: 3px solid #245baa;} .rechPartenaireListe li:hover, .rechPartenaireListe li:focus, .rechPartenaireListe li:active {outline: 3px solid #245baa;} .rechPartenaireListe li.vedette .image { border: 1px solid transparent; border-bottom: 1px solid #ececec;} .rechPartenaireListe li:hover .image, .rechPartenaireListe li:focus .image, .rechPartenaireListe li:active .image { border: 1px solid transparent; border-bottom: 1px solid #ececec;} .rechPartenaireListe li:hover .texte, .rechPartenaireListe li:focus .texte, .rechPartenaireListe li:active .texte, .rechPartenaireListe li:hover, .rechPartenaireListe li:focus, .rechPartenaireListe li:active { background: #245baa; color: #fff;} .rechPartenaireListe li:hover .sousTitre, .rechPartenaireListe li:focus .sousTitre, .rechPartenaireListe li:active .sousTitre { color: #fff;} .rechPartenaireListe li.vedette .texte { background: #245baa; color: #fff; transition: all 0.2s;} .rechPartenaireListe li.vedette .sousTitre { color: #fff;} .rechPartenaireListe li.vedette a { color: #fff;} .rechPartenaireListe li a:hover, .rechPartenaireListe li a:focus, .rechPartenaireListe li a:active { color: #fff;} .rechPartenaireListe li.vedette .iconePartenaireCertifie span:before { background-position: -62px -92px;} .rechPartenaireListe li.vedette:hover, .rechPartenaireListe li.vedette:focus, .rechPartenaireListe li.vedette:active { outline: 3px solid #21529d; background: #21529d;} .rechPartenaireListe li.vedette:hover .texte, .rechPartenaireListe li.vedette:focus .texte, .rechPartenaireListe li.vedette:active .texte { background: #21529d;} .rechPartenaireListe li.vedette .sousTitre:hover, .rechPartenaireListe li.vedette .sousTitre:focus, .rechPartenaireListe li.vedette .sousTitre:active { text-decoration: underline;} .rechPartenaireListe .image { height: 160px; text-align: center; font-size: 0; border: 1px solid #ececec; position: relative;} .rechPartenaireListe .image a { position: absolute; top: 0; right: 0; bottom: 0; left: 0;} .rechPartenaireListe .image:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;} .rechPartenaireListe .image span { display: inline-block; width: 100%; height: 100%; background: #ebebeb;} .rechPartenaireListe img { display: inline-block; vertical-align: middle; padding: 20px; max-height: 100%; width: auto;} .rechPartenaireListe .sousTitre { font-size: 17px; color: #000; font-weight: bold; padding-right: 76px; display: inline-block; line-height: 1.2; width: 100%; } .rechPartenaireListe .texte p { margin-bottom: 9px; line-height: 1.3;} .groupeIcone { position: absolute; top: 20px; right: 10px;} .groupeIcone > div { float: right;} .groupeIcone [class^=iconePartenaire] span:before { margin-right: 0; margin-left: 4px;} #map-partenaire { max-width: 100%; margin-bottom: 30px; height: 240px;} [class^=iconePartenaire] { font-size: 0;} [class^=iconePartenaire] p { display: inline-block; vertical-align: middle; margin: -2px 0 0 0;} [class^=iconePartenaire] span { font-size: 0; display: inline-block; vertical-align: middle;} [class^=iconePartenaire] span:before { content:""; background: url(../gx/m/sprites-icon.png) -30px -66px no-repeat; display: inline-block; vertical-align: middle; width: 20px; height: 20px; margin-right: 8px;} .iconePartenaireCertifie span:before { background-position: -62px -66px;} .iconePartenaireRabais span:before { background-position: -94px -66px;} .iconePartenaireFiltreTout span:before { background-position: 0px -66px;} .detailPartenaire h1 { margin-bottom: 10px;} .detailPartenaire h3 { margin-top: 26px; margin-bottom: 0;} .detailPartenaire .logoPartenaire { max-width: 280px; width: 100%; height: auto; border: 1px solid #ebebeb; padding: 20px; margin-top: 10px;} .detailPartenaire .texteDescription { margin-top: 30px; font-size: 16px; color: #000;} .servicePartenaire { margin-top: 20px; margin-bottom: 0;} .unContact p { margin-bottom: 0;} .unRabais { margin-top: 26px; background: #245baa; padding: 20px; color: #fff;} .unRabais .titre { font-size: 25px; font-weight: bold; margin-bottom: 0;} aside .sousTitre { font-size: 18px; font-weight: bold; margin: 0; text-transform: uppercase;} /* Liste succursales */ .surccursalesListe{} .surccursaleItem { background: #245baa; color: #fff; font-size: 15px; margin-bottom: 5px; padding: 15px 42px 15px 20px; position: relative;} .surccursaleItem .titreItem { display: inline-block; font-size: 18px; font-weight: bold; line-height: 1.1; margin-bottom: 8px;} .surccursaleItem .iconePartenaireRabais{ position: absolute; right: 10px; top: 17px;} .surccursaleItem a{ color: #FFF; display: inline-block; margin-top: 5px; text-decoration: underline;} .surccursaleItem a:hover{ color: #BBB; } .surccursaleItem .blocLiens a{ margin-right: 10px;} @media screen and (min-width: 600px) { .rechPartenaireListe li { width: 48%;} .rechPartenaireListe li:nth-child(even) { margin-left: 4%;} .formPartenaire input, .conteneurSelect, .formPartenaire [class^=bouton] { width: 49.5%; margin-left: 1%;} .formPartenaire .selectMotCle, .selectCat { margin-left: 0;} } @media screen and (min-width: 768px) { .detailPartenaire .logoPartenaire { position: absolute; top: 40px; right: 50px; margin-top: 0;} .detailPartenaire h1, .detailPartenaire .servicePartenaire, .detailPartenaire .texteDescription { padding-right: 350px; margin-bottom: 10px;} .detailPartenaire #map-partenaire { float: left; width: 50%; } .detailPartenaire aside .contenuTexte { float: left: 50%; padding-left: 30px; overflow: hidden;} } @media screen and (min-width: 1000px) { .rechPartenaireListe li, .rechPartenaireListe li:nth-child(even) { width: 31%; margin-left: 3.5%;} .rechPartenaireListe li:nth-child(3n+1) { margin-left: 0;} .formPartenaire input, .conteneurSelect, .formPartenaire [class^=bouton] { width: 24.5%; margin-left: 0;} .formPartenaire input, .conteneurSelect{ margin-right: 0.66%;} .formPartenaire .groupeChamp input, .formPartenaire .groupeChamp select { margin-bottom: 0px;} .filtrerPartenaire li { margin-top: 0;} .filtrerPartenaire { margin: 30px 0;} .formPartenaire .groupeChamp { padding: 30px; margin-top: 0;} .unRabais { margin-top: 36px; padding: 40px 30px;} .detailPartenaire h3 { margin-top: 36px; } .servicePartenaire { margin-top: 10px;} .detailPartenaire .logoPartenaire {top: 50px; } .detailPartenaire h1, .detailPartenaire .servicePartenaire, .detailPartenaire .texteDescription { padding-right: 300px; } .detailPartenaire #map-partenaire, .detailPartenaire aside .contenuTexte { float: none; width: 100%; padding-left: 0;} } @media screen and (min-width: 1100px) { .rechPartenaireListe li, .rechPartenaireListe li:nth-child(even), .rechPartenaireListe li:nth-child(3n+1) { width: 23%; margin-left: 2.66%;} .rechPartenaireListe li:nth-child(4n+1) { margin-left: 0;} } .logoImpression { display: none; width: 160px; position:absolute; top: 0; left: 20px;} /* 06_XX0 : Événements et formations --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .detailNouvelle .introEvenement { font-size: 17px; font-weight: bold; color: #000; margin-bottom: 30px;} .infoEvenement .semi div { width: 33%; float: left; position: relative; text-align: left;} .infoEvenement .semi div:first-child:before { } .infoEvenement ul { border-top: 1px solid #ebebeb; border-right: 1px solid #ebebeb; border-left: 1px solid #ebebeb; font-size: 0;} .infoEvenement li { font-size: 17px; position: relative; padding: 10px; color: #000; font-weight: bold;} .infoEvenement li span { font-size: 13px; color: #555; text-transform: uppercase; display: block;} .infoEvenement li .infoFormateur { text-transform: none; font-size: 17px} .infoEvenement [class^=icone] { padding-right: 50px;} .infoEvenement [class^=icone]:before { content: ""; position: absolute; top: 50%; right: 10px; margin-top: -16px; display: inline-block; width: 28px; height: 32px; background: url(../gx/m/sprites-icon.png) 0 -118px no-repeat;} .infoEvenement .iconeLieu:before { background-position: 0 -155px;} .resumeEvenementConfirmation { text-align: center; margin: 50px 0;} .resumeEvenementConfirmation .bloc { border: 1px solid #d7d7d7; display: inline-block; padding: 20px; } .resumeEvenementConfirmation h3 { margin-top: 0;} .galerieEvenement { margin-top: 21px; } .galerieEvenement .lienSuivant { margin-top: 10px; float: right; } .galerie { font-size: 0;} .galerie li { display: inline-block; width:100%; vertical-align: middle; border: 1px solid #ebebeb; cursor: pointer; position: relative; text-align: center; margin-bottom: 20px;} .galerie li:nth-child(odd) { margin-left: 0;} .btWebinaire{ display: inline-block; max-width: 450px; position: relative;} .galerie li[data-src*=youtube]:before, .galerie li[data-src*=vimeo]:before, .btWebinaire:before { background: url(../js/jQuery/lightGallery/img/youtube-play.png) 0 -60px no-repeat; position: absolute; left: 50%; margin-left: -42px; top: 50%; margin-top: -30px; content: ""; width: 84px; height: 60px; } .galerie li[data-src*=vimeo]:before, .btWebinaire:before{ background: url(../js/jQuery/lightGallery/img/vimeo-play.png) 0 -58px no-repeat; height:59px; } .galerie li[data-src*=youtube]:hover:before, .galerie li[data-src*=vimeo]:hover:before, .btWebinaire:hover:before { background-position: 0 0 ; } .galerieListe header, .titreBouton, .interaction { position: relative; } .galerieListe a, .titreBouton a, .interaction a { margin-bottom: 10px;} .detailMobile { width: 100%; margin-top: 30px; display: block; font-size: 16px;} .lateralDetailEvenement { padding-top: 10px;} .lienRetour.desktop { display: none;} .titreBouton a { margin-top: -23px; width: 100%;} .colonneInfo { position: relative;} #participantQte select { opacity: 0;} .modifBillet { margin-top: 30px;} .blocListeBillet { margin-top: 30px; } .evenementInfoBillet { color: #fff; background: #3f4d5f; padding: 13px 20px; font-weight: 600; font-size: 17px; text-align: center;} .blocListeBillet .titre { border-left: 1px solid #d7d7d7; border-right: 1px solid #d7d7d7; font-weight: 600; text-transform: none; font-size: 16px; padding: 13px 20px; margin: 0; display: flex; justify-content: space-between; align-items: center;} .blocListeBillet .titre input { display: inline-block; width: auto; border: 0; outline: 0; flex: 0 1 auto; line-height: 1;} .listeBillet { border: 1px solid #d7d7d7;} .listeBillet li { padding: 10px 20px; font-size: 13px; border-top: 2px solid #d7d7d7;} .listeBillet div { display: flex; margin: 3px 0; align-items: center;} .listeBillet label, .listeBillet input { flex: 0 1 auto; font-size: 13px; width: 50%;} .listeBillet label:first-child { flex: 0 1 auto; padding-right: 10px;} .listeBillet a { position: relative; padding-left: 24px; } .listeBillet .billetNom { margin-right: 10px;} .listeBillet a:hover { text-decoration: underline;} .listeBillet a:before{ content: url(../gx/m/icone-pdf.png); position: absolute; top: 3px; left: 0;} .listeBillet .enteteBillet { font-weight: bold; padding: 0 0 10px; margin-bottom: 7px;} #formCodePromo { margin: 20px 0;} #formCodePromo button { } .champAvecBouton{ padding-right: 122px; position: relative;} .champAvecBouton button{ padding: 8px 18px 9px; position: absolute; right: 0;} .form-participant input[type="button"], .form-participant input[type="submit"] { outline: 0; line-height: 1; border: 0; margin-top: 4px;} .boiteSelectionQte label, .boiteSelectionQte .customSelect { display: inline-block; vertical-align: middle;} .boiteSelectionQte label { margin-right: 15px;} .boiteSelectionQte select { width: 90px;} .boiteSelectionQte { margin-bottom: 10px;} .participant-liste ul { margin-left: 0; list-style: none; margin-top: 20px;} .participant-liste li { margin-bottom: 30px; background: #fafafa; padding: 20px;} .titreBouton2 a { margin-top: 0;} @media screen and (min-width: 480px) { .galerie li { display: inline-block; width: 49%; vertical-align: middle; margin-left: 2%; border: 1px solid #ebebeb; cursor: pointer; position: relative; text-align: center; margin-bottom: 20px;} .titreBouton a { width: auto;} .champAvecBouton{ padding-right: 142px; } .champAvecBouton button{ padding: 8px 28px 9px; } } @media screen and (min-width: 768px) { .galerie li, .galerie li:nth-child(odd) { width: 24.5%; margin-left: 0.66%;} .galerie li:nth-child(4n+1) { margin-left: 0;} .galerieListe header, .titreBouton, .interaction {padding-right: 200px;} .galerieListe a.lienRetour, .titreBouton a, .interaction a { position: absolute; top: 50%; right: 0; margin-top: -28px;} .titreBouton2 a{ position: static;} .section1, aside .galerieEvenement { width: 50%; float: left;} aside .galerieEvenement { padding-left: 20px;} } @media screen and (min-width: 1000px) { .lienRetour.desktop { display: inline-block;} .section1, aside .galerieEvenement { width: 100%; float: none;} aside .galerieEvenement { padding-left: 0;} .detailNouvelle .lienRetour { display: inline-block; margin-top: 30px;} .detailMobile { display: none;} .lateralDetailEvenement { padding-top: 40px;} } @media screen and (min-width: 1150px){ .titreBouton2 a{ position: absolute;} .titreBouton2 a.btHeader2{ right: 205px;} } /* 09_100 : Nous joindre --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .sousTitreNousJoindre { font-size: 18px; margin: 30px 0 40px; font-weight: bold;} .serieAdresse { color: #999; font-size: 16px; margin-top: 50px;} .serieAdresse h2 { color: #000; font-size: 18px; margin-bottom: 20px; font-family: "muli", arial, sans-serif;} .serieAdresse p {font-weight: 300; line-height: 1.7; margin-bottom: 20px; display: inline-block; width: 100%; } .serieAdresse a { font-weight: bold; font-size: 17px;} .regionDesservie { margin-top: 10px;} .carteNousJoindre { margin-top: 20px; display: inline-block; width: 100%;} @media screen and (min-width: 768px) { .serieAdresse { font-size: 0;} .serieAdresse > li{ display: inline-block; vertical-align: top; font-size: 15px; width: 33.33%; padding-right: 20px;} } @media screen and (min-width: 1000px) { .serieAdresse > li { padding-right: 50px;} } /* 10_X00 : Processus de log in / oubli de mot de passe / activation de compte --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .noteOubli { margin-bottom: 10px;} .pageConnexion aside { padding-top: 50px;} .pageConnexion aside .titreH1 { position: relative; padding-left: 40px; margin-bottom: 20px;} .pageConnexion aside .titreH1:before { content: url(../gx/m/icone-aide.png); position: absolute; top: 0; left: 0;} .pageConnexion .titreH1 { margin-bottom: 16px;} .pageConnexion .groupeBouton { width: 100%; margin-bottom: 30px} .pageConnexion .groupeBouton p { width: 100%;} .pageConnexion .groupeBouton p:first-child { margin-right: 2%;} .pageConnexion .groupeBouton a { width: 100%; padding-left: 5px; padding-right: 5px } .creationAcces { margin-bottom: 30px; position: relative;} .creationAcces a { margin-top: 10px; width: 100%} @media screen and (min-width: 480px) { .pageConnexion .col1, .pageConnexion .col2{ width:100%; margin-left: 0; margin-right: 0;} .pageConnexion .groupeBouton p { float: left; width: 49%; } .creationAcces { padding-right: 250px; margin-bottom: 40px; } .creationAcces a { position: absolute; top: 0; right: 0; width: 250px; margin-top: 0; padding-left: 5px; padding-right: 5px} } @media screen and (min-width: 768px) { .pageConnexion .textePrincipal, .pageConnexion aside { width: 50%;} .pageConnexion aside { border-left: 1px solid #e7eef1; padding-left: 40px;} .pageConnexion .textePrincipal { padding-right: 40px;} .pageConnexion .groupeBouton p { float: none; width: 100%; } .creationAcces { padding-right: 0; margin-bottom: 30px;} .creationAcces a { position: static; width: 100%; margin-top: 10px;} } @media screen and (min-width: 1000px) { .pageConnexion .col1, .pageConnexion .col2{ float:left; width:49%;} .pageConnexion .col1{ clear:left; margin-right: 1%; } .pageConnexion .col2{ margin-left: 1%; } [name="btn-login"] { float: right; margin-top: 8px;} } @media only screen and (min-width: 1250px) { .pageConnexion .groupeBouton p { float: left; width: 49%; } } @media only screen and (min-width: 1400px) { .creationAcces { padding-right: 250px; margin-bottom: 40px;} .creationAcces a { position: absolute; width: 250px; margin-top: 0; padding-left: 5px; padding-right: 5px} .creationAcces p { padding-top: 10px} } /*--------------------------------------------------------------------------------------- */ /* 11_1XX - Création de compte */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .alignTexteGauche { text-align: left; } .etapeAdhesion { padding: 0; } .etapeAdhesion > div { font-size: 0; width: 100%; padding: 30px 0px 0px; } .etapeAdhesion ul { position: relative; padding-right: 32px; display: none;} .etapeAdhesion li { display: inline-block; vertical-align: top; width: 33.33%; font-size: 16px; position: relative; } .etapeAdhesion li div { font: 600 14px 'muli', arial, sans-serif; position: absolute; top: 100%; margin-top: 10px; left: -35px; width: 120px; text-align: center; line-height: 1.4; color: #000; } .etapeAdhesion li:before { position: absolute; top: 50%; left: 70px; right: 22px; margin-top: -3px; background: #ebebeb; display: inline-block; content: ""; height: 3px;} .etapeAdhesion [class*=nombre] li:last-child { position: absolute; top: 0; right: 0; width: auto;} .etapeAdhesion [class*=nombre] { text-align: center;} .etapeAdhesion [class*=nombre] li { text-align: left} .etapeAdhesion .nombre7 li { width: 16.66%;} .etapeAdhesion .nombre6 li { width: 20%;} .etapeAdhesion .nombre5 li { width: 25%;} .etapeAdhesion .nombre4 li { width: 33.33%;} .etapeAdhesion .nombre3 li { width: 50%;} .etapeAdhesion .nombre2 li { width: 100%;} .etapeAdhesion .nombre7 ul { width: 100%;} .etapeAdhesion .nombre6 ul { width: 100%;} .etapeAdhesion .nombre5 ul { width: 75%;} .etapeAdhesion .nombre4 ul { width: 66.66%;} .etapeAdhesion .nombre3 ul { width: 50%;} .etapeAdhesion .nombre2 ul { width: 30%;} .etapeAdhesion span { display: inline-block; border-radius: 40px; background: #ebebeb; color: #3f4d5f; width: 32px; height: 32px; font: 600 16px 'nexa', arial, sans-serif; padding-top: 6px; text-align: center;} .etapeAdhesion .etapeMobile { font-size: 20px; text-align: center; font-weight: bold; color: #245baa;} .etapeFini span { background: #3f4d5f; color: #fff;} .etapeActif span { background: #f53e25; color: #fff;} .etapeAdhesion .etapeActif div { color: #f53e25; } .infoExtra { position: absolute; bottom: 4px; right: 10px; cursor: pointer; } .infoExtra span { display: inline-block; } .infoExtra div { display: none; position: absolute; top: -20px; right: 100%; width: 220px; background: #fff; border: 1px solid #e1e1e1; border-radius: 4px; padding: 20px; margin-right: 10px; z-index: 2;} .enteteForm { text-align: center; color: #000; font-size: 14px; margin-bottom: 20px;} .enteteForm h1 { margin-bottom: 0;} .noticeChampObligatoire {color: #000; font-size: 14px; margin-bottom: 20px;} .finCommande { display: block; margin: auto; width: 230px; padding-left: 0; padding-right: 0;} @media screen and (min-width: 480px) { .etapeAdhesion span {width: 50px; height: 50px; font: 600 25px 'nexa', arial, sans-serif; padding-top: 10px; } .etapeAdhesion ul { padding-right: 50px;} .infoExtra div { width: 300px;} } @media screen and (min-width: 768px) { .infoExtra { right: -36px; } } @media screen and (min-width: 850px) { .etapeAdhesion > div { padding: 40px 26px 40px; } .etapeAdhesion { padding: 0 30px ;} .etapeAdhesion ul { display: inline-block;} .etapeAdhesion .etapeMobile { display: none;} } .contenuSelectionAbonnement { position: relative;} .typeAbonnement { font-size: 0; margin-bottom: 20px; text-align: center; width: 100%; margin-top: 20px;} .typeAbonnement .selectionAbonnement, .typeAbonnement .selectionFaite {width: 130px; padding-left: 0; padding-right: 0; } .typeAbonnement .selection .selectionAbonnement, .typeAbonnement .selectionFaite { display: none;} .typeAbonnement .selection .selectionFaite { display: inline-block;} .typeAbonnement .selection .selectionFaite img { display: inline; padding-left: 2px;} .conteneurAbonnement { width: 100%;} .typeAbonnement p { font-size: 16px;} .typeAbonnement li { display: inline-block; width: 100%; font-size: 16px; margin-top: 20px; vertical-align: bottom;} .typeAbonnement li:nth-child(2n+1) { margin-left: 0;} .typeAbonnement li:first-child { margin-left: 0; margin-top: 0;} .typeAbonnement .contenuSelectionAbonnement { border-left: 1px solid #d9dbdf; border-right: 1px solid #d9dbdf; border-bottom: 1px solid #d9dbdf; padding: 22px 30px; min-height: 150px; margin-bottom: 20px;} .typeAbonnement header { background: #3f4d5f; color: #fff; padding: 10px 10px 16px; } form .typeAbonnement .sousTitre { color: #fff; font-size: 25px; line-height: 1;} .typeAbonnement .selection header { background: #245baa;} /*.typeAbonnement li:hover header, .typeAbonnement li:focus header, .typeAbonnement li:active header { background: #245baa;}*/ .titreResume { font-weight: bold; color: #000; font-size: 17px;} .choixAdherer { background: #245baa; padding: 3px 10px 5px; border-radius: 4px; color: #fff; font-size: 14px; float: right; font-weight: 300;} [class*=choixAdhererCouleur] header, [class*=choixAdhererCouleur] .description { transition: all 0.2s; color: #fff; } [class*=choixAdhererCouleur] { font-size: 18px; color: #fff;} [class*=choixAdhererCouleur] .sousTitre { font-size: 25px; font-family: "Nexa"; font-weight: bold;} [class*=choixAdhererCouleur] div { border: none;} /*.typeAbonnement .choixAdhererCouleur1 header { background: #7cb7a3; }.typeAbonnement .choixAdhererCouleur2 header { background: #2a5caa; }.typeAbonnement .choixAdhererCouleur3 header { background: #4b4950; }*/ .typeAbonnement .choixAdhererCouleur1:hover header { background: #55b796;} .typeAbonnement .choixAdhererCouleur1 header { background: #55b796;} .typeAbonnement .choixAdhererCouleur2:hover header { background: #184c9e;} .typeAbonnement .choixAdhererCouleur2 header { background: #184c9e;} .typeAbonnement .choixAdhererCouleur3:hover header { background: #3d3b42;} .typeAbonnement .choixAdhererCouleur3 header { background: #3d3b42;} .typeAbonnement .choixAdhererCouleur1:hover { background: #7cb7a3; color:#fff; border: 1px solid #7cb7a3; border-top: none;} .typeAbonnement .choixAdhererCouleur1 { background: #7cb7a3; color:#fff; border: 1px solid #7cb7a3; border-top: none;} .typeAbonnement .choixAdhererCouleur2:hover { background: #2a5caa; color:#fff; border: 1px solid #2a5caa; border-top: none;} .typeAbonnement .choixAdhererCouleur2 { background: #2a5caa; color:#fff; border: 1px solid #2a5caa; border-top: none;} .typeAbonnement .choixAdhererCouleur3:hover { background: #4b4950; color:#fff; border: 1px solid #4b4950; border-top: none;} .typeAbonnement .choixAdhererCouleur3 { background: #4b4950; color:#fff; border: 1px solid #4b4950; border-top: none;} .introductionAdherer { margin-top: 30px;} .introductionAdherer .boutonMobile { margin-bottom: 30px;} .introductionAdherer .typeAbonnement .description { vertical-align: middle; display: inline-block;} .listePromoAbonnement { width: 100%; text-align: right; line-height: 1.2;} .listePromoAbonnement td { vertical-align: middle;} .listePromoAbonnement td:first-child { text-align: left; line-height: 1.8;} .listePromoAbonnement p { position: relative; padding-left: 15px; padding-bottom: 3px;} .listePromoAbonnement p:before { content: ""; width: 11px; height: 11px; background: url('../gx/m/sprites-icon.png') -208px -114px; position: absolute; top: 50%; margin-top: -7px; left: 0;} .listePromoAbonnement .price { font-weight: 800; color: #000; font-family: "Nexa", arial; } .typeAbonnement .listePromoAbonnement p, .typeAbonnement .listePromoAbonnement { line-height: 1.3;} .typeAbonnement .listePromoAbonnement p { padding-right: 4px;} .listePromoAbonnement td { padding: 4px 0;} .typeAbonnement .listePromoAbonnement p strong { color: #000;} #rabaisInstantane { background: #245baa; width: 100%; padding: 10px 30px; color: #fff; display: inline-block; border-top-left-radius: 6px; border-top-right-radius: 6px; font-size: 13px; text-transform: uppercase;} .typeAbonnement .periodeValide { font-weight: 700; font-size: 13px;color: #fff; display: inline-block; text-align: center; width: 100%; margin: 0; } .typeAbonnement .montantEconomie { background: #f94131; color: #fff; padding: 10px; font: 700 13px "Open Sans", arial; text-transform: uppercase; margin: 20px 30px; } .typeAbonnement .prixRegulier { font-size: 13px; display: inline-block; margin-bottom: 6px; width: 100%;} .typeAbonnement .rabaisExtra { margin-bottom: 20px; font-weight: 800; font-size: 15px; line-height: 1.3; color: #000; font-family: "Nexa";} .noteFraisAdhesion { display: inline-block; width: 100%; margin-top: 30px; font-size: 16px;} .stickyAdherer { border-top: 1px solid #2f3b4a; position: fixed; bottom: 0; left: 0; right: 0; background: #3f4d5f; padding: 30px; color: #fff; z-index: 2; font: 600 20px "nexa", arial, sans-serif; display: none;} .stickyAdherer p { display: inline-block;} .stickyAdherer .boutonCouleur { margin: 10px 40px 0;} @media screen and (min-width: 768px) { .typeAbonnement li { width: 48%; margin-left: 4%; margin-top: 0; } .typeAbonnement .listePromoAbonnement p, .typeAbonnement .listePromoAbonnement { font-size: 13px; line-height: 1.3;} .typeAbonnement .contenuSelectionAbonnement {padding: 22px 30px; } .typeAbonnement { margin-bottom: 20px;} .typeAbonnement .contenuSelectionAbonnement { position: relative; padding-bottom: 138px;} .typeAbonnement .selectionAbonnement, .typeAbonnement .selectionFaite { position: absolute; bottom: 20px; left: 50%; margin-left: -65px; } .typeAbonnement .montantEconomie {position: absolute; bottom: 80px; left: 0; right: 0; margin-bottom: 0;} .introductionAdherer { margin-top: 50px;} [class*=choixAdhererCouleur] { font-size: 0; height: 240px;} [class*=choixAdhererCouleur]:before { content: ""; display: inline-block; height: 100%; vertical-align: middle;} [class*=choixAdhererCouleur] .contenuSelectionAbonnement { padding: 0; display: inline-block; vertical-align: middle; min-height: 0; } [class*=choixAdhererCouleur] .contenuSelectionAbonnement p { font-size: 18px;} } /* temporaire */ @media only screen and (min-width: 1000px) { .typeAbonnement.standardMiseEnPage li, .typeAbonnement.standardMiseEnPage li:nth-child(2n+1) { width: 32%; margin-left: 2%;} .typeAbonnement.standardMiseEnPage li:nth-child(3n+1) { margin-left: 0;} } @media only screen and (min-width: 1200px) { .typeAbonnement.varianteMiseEnPage li, .typeAbonnement.varianteMiseEnPage li:nth-child(2n+1), .typeAbonnement.varianteMiseEnPage li:nth-child(3n+1) { width: 24%; margin-left: 1.33%;} .typeAbonnement.varianteMiseEnPage li:nth-child(4n+1) { margin-left: 0;} } .pageConfirmation .col-1-2 { vertical-align: top;} .pageConfirmation .col-1-2 h2 { font-size: 25px;} .pageConfirmation .groupe-col { margin-top: 40px; margin-bottom: 40px;} .pageConfirmation a { margin-top: 16px; margin-bottom: 16px;} .pageCentre { text-align: center;} .resumeInfoTransaction { margin-bottom: 20px} .actionCarte { margin-top: 30px; text-align: center; margin-bottom: 30px;} .contenuDynamique { display:none!important;} .listeCarte li { border: 1px solid #ebebeb; padding: 30px; margin-bottom: 20px; max-width: 100%;} .listeCarte .groupeLien a { display: block; margin-bottom: 8px;} #btn-non-merci { display: block; margin-top: 15px;} #monerisFrame { width: 100%;} .infoEvenement { margin: 20px 0;} .texte.etapePaiement { width: 100%; padding: 0;} .boitePrix { margin: 20px 0; font-size: 14px;font-weight: bold; background: transparent!important; text-align: left;} .boitePrix li { border-top: 1px solid #ebebeb; display: inline-block; width: 100%; color: #000; padding: 6px 0 10px;} .boitePrix li:first-child { border-top: none;} .boitePrix li span, .boitePrix li p { display: inline-block; vertical-align: middle; width: 50%;} .boitePrix li span { text-align: right;} .texte.etapePaiement { width: 100%; padding: 0; display: inline-block;} .boitePrix { margin: 20px 0 0; font-size: 14px;font-weight: bold;} .etapePaiement table { width: 100%;} .boitePrix tr { border-top: 1px solid #ebebeb; width: 100%; color: #000; padding: 6px 0 10px; height: 56px;} .boitePrix tr:first-child { border-top: none;} .boitePrix tr .vignettePrix, .boitePrix .vignetteTexte {vertical-align: middle; width: 50%;} .boitePrix tr .vignettePrix { text-align: right;} .grandTotal { font-size: 20px;} .resumeEconomie { background: #fff; border: 1px solid #edecec; padding: 8px 15px; text-align: center; display: block; color: red; } @media screen and (min-width: 480px) { .boitePrix tr {height: 50px;} } @media screen and (min-width: 600px) { .stickyAdherer { display: block;} .listeCarte li { margin-left: 10%; margin-right: 10%; } .listeCarte .groupeLien { text-align: right; } .listeCarte .groupeLien a { margin-left: 30px; display: inline; margin-bottom: 0;} #btn-non-merci { display: inline-block; margin-top: 0;} .actionCarte [class^=bouton] { margin-right: 30px;} .texte.etapePaiement { padding: 0 15%;} .formCentrer { margin: 0 15%;} } /* 11_113 - Achat de baux --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .formAchatBaux { margin-top: 40px; font-weight: bold; color: #000;} .formAchatBaux .entete { padding-bottom: 30px; display: none;} .formAchatBaux .entete li{ font: bold 16px "nexa", arial; text-transform: uppercase; color: #000;} .formAchatBaux .transactionResume { border-top: 1px solid #d9d9d9; padding-right: 0; padding-left: 0;} .formAchatBaux .listeProduit { border-top: 1px solid #d9d9d9; padding: 22px 0;} .formAchatBaux .col-centre { text-align: center;} .formAchatBaux .col-droite { text-align: left;} .formAchatBaux .detailTotal li{ text-transform: none;} .formAchatBaux .detailTotal { padding-left: 0; padding-right: 0;} .formAchatBaux li { margin-bottom: 4px;} @media screen and (min-width: 768px) { .formAchatBaux .col-1-8 { display: block;} } @media screen and (min-width: 1000px) { .formAchatBaux .entete { display: block;} .formAchatBaux li strong { display: none;} .formAchatBaux li { margin-bottom: 0px;} .formAchatBaux .col-1-8 { display: inline-block;} .formAchatBaux .col-droite { text-align: right;} } /* 12_100 - Accueil des membres --------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /* BANDEAU ALERTE */ .alerte { padding: 14px 30px 16px; background: #3f4d5f; color: #fff; position: relative;} .alerte:before { position: absolute; top: 12px; right: 30px; content: "x"; } /* CALENDRIER DES ÉVÉNEMENTS */ .calendrierEvenement ul { width: 100%;} .calendrierEvenement .calendrier, .calendrierEvenement ul { display: inline-block; } .calendrierEvenement .conteneurCalendrier { display: inline-block; position: relative; width: 100%; vertical-align: top; font-size: 16px; background: #2f3b4a; margin-bottom: 20px;} .calendrierEvenement ul li { margin-bottom: 40px;} .calendrierEvenement { background: #404d5e url(../gx/m/banniereEvenement.jpg) bottom center no-repeat; padding: 50px 0 20px; font-size: 0;} .calendrierEvenement .accent { font-weight: bold; font-size: 17px; line-height: 1.2; margin-bottom: 3px;} .calendrierEvenement .unEvenement a { display: inline-block; width: 100%; height: 100%; padding: 28px 20px 12px; font-size: 0; } .calendrierEvenement time { font-family: 'nexa', arial, sans-serif; font-size: 19px; font-weight: bold; border-bottom: 1px solid #fff; display: inline-block; width: 100%; padding-bottom: 6px; margin-bottom: 6px;} /*.calendrierEvenement .unEvenement a:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;}*/ .calendrierEvenement li div { display: inline-block; vertical-align: top; font-size: 18px; margin-top: 12px; width: 100%} .calendrierEvenement li div .note { font-size: 13px; } .calendrierEvenement .unEvenement { background: #fff; display: inline-block; height: 320px; width: 100%; vertical-align: top; position: relative; margin-bottom: 20px; transition: all 0.2s} .calendrierEvenement .unEvenement.variante a, .calendrierEvenement .unEvenement.variante p, .calendrierEvenement .unEvenement.variante h2 { color: #fff; } .calendrierEvenement .unEvenement.variante.couleur2 { background: #9fa6af; } /* gris */ .calendrierEvenement .unEvenement.variante.couleur3 { background: #2a5caa; }/* bleu */ .calendrierEvenement .unEvenement.variante.couleur4 { background: #7db7a3; }/* vert */ .calendrierEvenement .unEvenement.variante.couleur5 { background: #000; } /* noir */ .calendrierEvenement .unEvenement.variante.couleur6 { background: #c8afaa; } /* beige */ .calendrierEvenement .unEvenement.variante.couleur7 { background: #922832; }/* rouge */ .calendrierEvenement .unEvenement.variante.couleur8 { background: #358153; }/* vert */ .calendrierEvenement .unEvenement.variante.couleur9 { background: #4b4650; }/* gris sombre */ .calendrierEvenement .unEvenement:hover, .calendrierEvenement .unEvenement:focus, .calendrierEvenement .unEvenement:active { background: #ebebeb} /* blanc */ .calendrierEvenement .unEvenement.variante.couleur2:hover, .calendrierEvenement .unEvenement.variante.couleur2:focus, .calendrierEvenement .unEvenement.variante.couleur2:active { background: #878d96; } /* gris */ .calendrierEvenement .unEvenement.variante.couleur3:hover, .calendrierEvenement .unEvenement.variante.couleur3:focus, .calendrierEvenement .unEvenement.variante.couleur3:active { background: #0d459c; } /* bleu */ .calendrierEvenement .unEvenement.variante.couleur4:hover, .calendrierEvenement .unEvenement.variante.couleur4:focus, .calendrierEvenement .unEvenement.variante.couleur4:active { background: #48a988; } /* vert */ .calendrierEvenement .unEvenement.variante.couleur5:hover, .calendrierEvenement .unEvenement.variante.couleur5:focus, .calendrierEvenement .unEvenement.variante.couleur5:active { background: #333; } /* noir */ .calendrierEvenement .unEvenement.variante.couleur6:hover, .calendrierEvenement .unEvenement.variante.couleur6:focus, .calendrierEvenement .unEvenement.variante.couleur6:active { background: #b59f96; } /* beige */ .calendrierEvenement .unEvenement.variante.couleur7:hover, .calendrierEvenement .unEvenement.variante.couleur7:focus, .calendrierEvenement .unEvenement.variante.couleur7:active { background: #7f2029; } /* rouge */ .calendrierEvenement .unEvenement.variante.couleur8:hover, .calendrierEvenement .unEvenement.variante.couleur8:focus, .calendrierEvenement .unEvenement.variante.couleur8:active { background: #2c7248; } /* vert */ .calendrierEvenement .unEvenement.variante.couleur9:hover, .calendrierEvenement .unEvenement.variante.couleur9:focus, .calendrierEvenement .unEvenement.variante.couleur9:active { background: #3c3741; } /* gris sombre */ .calendrierEvenement .unEvenement a { color: #000; } .calendrierEvenement .unEvenement time { border-bottom: 1px solid #ccc; display: inline-block; width: 100%;} .calendrierEvenement .unEvenement time span { position: relative; } .calendrierEvenement .unEvenement .vignetteComplet { position: absolute; top : 0; right: -82px; background: url(../gx/m/vignette-complet.png) 0 0 no-repeat; display: inline-block; width: 75px; height: 20px; text-align: center; text-transform: uppercase; font: 500 11px "muli", arial, sans-serif; padding-top: 1px; padding-left: 6px;} .calendrierEvenement .unEvenement p, .unEvenement h2 { color: #999; margin: 0; font: 16px 'muli', arial, sans-serif;} .calendrierEvenement .vignette { position: absolute; top: 0; left: 0; background: #ecf3f5; padding: 5px 10px; color: #000; font-size: 12px; text-transform: uppercase;} .calendrierEvenement .inscrit:before, .infoEvenement .inscrit:before { content: url(../gx/m/icone-inscrit.png); position: absolute; top: 0; right: 0; display: inline-block; width: 28px; height: 28px;} .enteteCalendrier { background: #f53e25; color: #fff; font: 300 16px 'nexa', arial, sans-serif; text-transform: uppercase; transition: all 0.2s;} .enteteCalendrier:hover, .enteteCalendrier:focus, .enteteCalendrier:active { background: #ee2524;} .enteteCalendrier a { color: #fff; padding: 20px 30px; display: inline-block; width: 100%; height: 100%;} .legendeCalendrier { padding: 30px 20px;} .legendeCalendrier .legInscrit { position: relative; padding-left: 28px; color: #fff; font-size: 14px;} .legendeCalendrier .legInscrit:before { content: url(../gx/m/icone-inscrit-legende.png); display: inline-block; position: absolute; top: 4px; left: 0px;} .calendrier { width: 100%; position: relative;} .clndr-previous-button:before, .clndr-next-button:before { content: "<"; font: 18px 'guifx', arial, sans-serif; color: #fff; position: absolute; top: 0; cursor: pointer; padding: 22px 15px;} .clndr-previous-button:before { left: 0px; } .clndr-next-button:before { content: ">"; right: 0px;} .clndr { background: #2f3b4a; color: #fff;} .clndr-controls { background: #263240;} .clndr-table thead { background: #263240;} .clndr-table { width: 100%; border-collapse: collapse; outline: none;} .clndr-table, .clndr-table th, .clndr-table td { border: 1px solid #3e4b5c; text-align: center; outline: none; vertical-align: middle; height: 36px;} .clndr-table thead td, .clndr-table td div { padding: 0; font: bold 16px 'muli', arial, sans-serif; } .clndr-table .hasEvents { padding: 0;} .clndr-table .hasEvents a { padding: 6px 0;} .calendrier a { font-size: 16px; padding: 0; margin: 0; color: #fff;} .calendrier .event{ background: #fff; transition: all 0.2s } .calendrier .event a { color: #000; display: inline-block; height: 100%; width: 100%; } .calendrier .isRegistered, .hasEvents { position: relative; display: inline-block; width: 100%; height: 100%;} .calendrier .couleur2 { background: #9fa6af; transition: all 0.2s} .calendrier .couleur3 { background: #2a5caa; transition: all 0.2s} .calendrier .couleur4 { background: #7db7a3; transition: all 0.2s} .calendrier .couleur5 { background: #000; transition: all 0.2s} .calendrier .couleur6 { background: #c8afaa; transition: all 0.2s} .calendrier .couleur7 { background: #922832; transition: all 0.2s} .calendrier .couleur8 { background: #358153; transition: all 0.2s} .calendrier .couleur9 { background: #4b4650; transition: all 0.2s} .calendrier .event:hover, .calendrier .event:focus, .calendrier .event:active { background: #ebebeb; } .calendrier .couleur2:hover, .calendrier .couleur2:focus, .calendrier .couleur2:active { background: #878d96; } .calendrier .couleur3:hover, .calendrier .couleur3:focus, .calendrier .couleur3:active { background: #0d459c; } .calendrier .couleur4:hover, .calendrier .couleur4:focus, .calendrier .couleur4:active { background: #48a988; } .calendrier .couleur5:hover, .calendrier .couleur5:focus, .calendrier .couleur5:active { background: #333; } .calendrier .couleur6:hover, .calendrier .couleur6:focus, .calendrier .couleur6:active { background: #b59f96; } .calendrier .couleur7:hover, .calendrier .couleur7:focus, .calendrier .couleur7:active { background: #7f2029; } .calendrier .couleur8:hover, .calendrier .couleur8:focus, .calendrier .couleur8:active { background: #2c7248; } .calendrier .couleur9:hover, .calendrier .couleur9:focus, .calendrier .couleur9:active { background: #3c3741; } .boutonCouleurCorpiq.couleur4{ background: #63cab7; } .boutonCouleurCorpiq.couleur4:hover, .boutonCouleurCorpiq.couleur4:focus, .boutonCouleurCorpiq.couleur4:active { background: #48a988; } .calendrier .couleur5 a, .calendrier .couleur4 a, .calendrier .couleur3 a, .calendrier .couleur2 a, .calendrier .couleur6 a, .calendrier .couleur7 a, .calendrier .couleur8 a, .calendrier .couleur9 a {color: #fff;} /*.calendrier .isRegistered:before { content: url(../gx/m/icone-inscrit-calendrier.png); position: absolute; top: 0!important; right: 0; font-size: 0;} */.clndr-controls { text-align: center; text-transform: uppercase; position: relative; padding: 18px 0;} .calendrier .isRegistered img { position: absolute; top: 0!important; right: 0; font-size: 0;} .calendrierLateral { background: #3f4d5f; padding: 30px; display: none;} .voirCalendrier { margin-bottom: 10px;} .moduleCalendrier .titre { margin: 30px 0 10px;} .moduleCalendrier .boutonGeneral { width: 100%;} .calendrierEvenement.pageEvenement .unEvenement a { border: 1px solid #ecf3f5; } .calendrierEvenement.pageEvenement .unEvenement { margin-bottom: 10px; } .calendrierEvenement.pageEvenement .unEvenement:before { top: 1px; right: 1px;} .textePrincipal .calendrierEvenement { background: transparent; padding: 0;} .textePrincipal .calendrierEvenement ul { width: 100%;} .lienInterne:hover, .lienInterne:hover .iconFleche:before { color: #3f4d5f;} .iconFleche { position: relative; width: 20px;} .iconFleche:before { content: ">"; color: #000; font-family: "guifx"; position: absolute; top: 7px; right: -16px; font-size: 16px;} @media screen and (min-width: 480px) { .moduleCalendrier .boutonGeneral { width: auto;} } @media screen and (min-width: 550px) { .calendrierEvenement .unEvenement { width: 48%; margin-left: 4%; } .calendrierEvenement .unEvenement:nth-child(2n+1) { margin-left: 0;} .textePrincipal .calendrierEvenement.pageEvenement li { width: 49%; margin-left: 2%;} .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(2n+1) { margin-left: 0;} } @media screen and (min-width: 768px) { .calendrierEvenement { padding: 50px 0 50px;} .calendrierEvenement .conteneurCalendrier { width: 33.33%; margin-bottom: 0;} .calendrierEvenement ul { width: 66.66%; } .calendrierEvenement .unEvenement { width: 48%; margin-left: 2%; } .calendrierEvenement .unEvenement:nth-child(2n+1) { margin-left: 2%;} .textePrincipal .calendrierEvenement.pageEvenement li, .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(2n+1) { width: 32.5%; margin-left: 1.25%;} .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(3n+1) { margin-left: 0;} } @media screen and (min-width: 1000px) { .voirCalendrier { display: none;} .calendrierLateral { display: block!important;} .calendrierEvenement .unEvenement, .calendrierEvenement .unEvenement:nth-child(2n+1) { width: 31%; margin-left: 2.33%;} .calendrierEvenement .unEvenement:nth-child(3n+1) { margin-left: 2.33%;} .calendrierEvenement .conteneurCalendrier { width: 25%;margin-bottom: 0;} .calendrierEvenement ul { width: 75%; } .textePrincipal .calendrierEvenement.pageEvenement li, .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(3n+1), .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(2n+1) { width: 49%; margin-left: 2%;} .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(2n+1) { margin-left: 0;} } @media screen and (min-width: 1200px) { .enteteCalendrier { font-size: 30px;} .calendrierEvenement .unEvenement, .calendrierEvenement .unEvenement:nth-child(2n+1), .calendrierEvenement .unEvenement:nth-child(3n+1) { width: 30%; margin-left: 3.33%; margin-bottom: 36px;} .calendrierEvenement .unEvenement:nth-child(3n+1) { margin-left: 3.33%;} .calendrierEvenement .conteneurCalendrier { height: 637px; } .textePrincipal .calendrierEvenement.pageEvenement li, .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(2n+1), .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(3n+1) { width: 32.5%; margin-left: 1.25%;} .textePrincipal .calendrierEvenement.pageEvenement li:nth-child(3n+1) { margin-left: 0;} } /* 12_210 : Lettres et formulaires /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .listeLettreFormulaire ul { font-size: 0; text-align: center;} .listeLettreFormulaire li { font-size: 14px; display: inline-block; width: 100%; text-align: center; margin: 30px 0 10px; vertical-align: top;} .listeLettreFormulaire li a { color: #000; font-weight: bold; } .listeLettreFormulaire li p { padding-top: 10px;} .avecBoiteModale {display: block; position: relative; font-size: 0; width: 60%; margin: 0 auto;} .conteneurImage { display: inline-block; position: relative;} .conteneurImage:before {content: url(../gx/m/icone-lettre.png); position: absolute; top: -12px; right: -12px; z-index: 2; } .divBoiteModale {display: none; max-height: 100%; overflow: auto!important; position: fixed; background: #fafafa; left: 0; right: 0; bottom: 0; z-index: 99999; border-top: 1px solid #aac1ce; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); } .divBoiteModale a[href*=pdf]:before, .divBoiteModale a[href*=doc]:before, .divBoiteModale a[href*=xls]:before { content:""; display:inline-block; width:20px; height:24px; margin-right:6px; background:url(../gx/m/sprites-icon.png) -8px -198px no-repeat; vertical-align:-6px;} .divBoiteModale a[href*=doc]:before { background-position: -39px -198px; } .divBoiteModale a[href*=xls]:before { background-position: -67px -198px;} .divBoiteModale a { margin-right: 6px; margin-bottom: 10px;} .divBoiteModale time { display: block; font-size: 13px; position: absolute; top: -30px; left: 20px; } .divBoiteModale .btnFermer { font-size: 0; position: absolute; top: 15px; right: 15px; display: inline-block; width: 22px; height: 22px; background: transparent;} .divBoiteModale .btnFermer:before { border: 0; background: url(../gx/m/sprites-icon.png) -118px -126px no-repeat; position: absolute; top: 0px; right: 0px; content: ""; width: 22px; height: 22px; outline: none;} .divBoiteModale .btnFermer:hover:before { background-position: -118px -160px;} .divBoiteModale .conteneur {display: none; padding: 30px;} .divBoiteModale .conteneur.actif {display: block;} .divBoiteModale .divColonneTexte {} .divBoiteModale .divColonneTexte.avecColonneDroite {} .divBoiteModale .divColonneTexte.avecColonneDroite .divTexte {} .divBoiteModale .divTexte {} .divBoiteModale .divImage {max-width: 230px; margin-top: 30px;} .divBoiteModale .divImage > figure {margin-bottom: 30px;} .divBoiteModale .divBouton {margin-top: 30px;} .divBoiteModale .divBouton .bouton {margin-right: 10px;} @media screen and (min-width: 380px) { .listeLettreFormulaire ul {text-align: left;} .avecBoiteModale { width: 100%; margin: 0;} .listeLettreFormulaire li { width: 50%; padding-right: 35px; } } @media screen and (min-width: 600px) { .listeLettreFormulaire li { width: 25%; padding-right: 20px; font-size: 12px; } .divBoiteModale .conteneur {padding: 50px;} .divBoiteModale .btnFermer { top: 50px; right: 50px;} } @media only screen and (min-width: 768px) { .divBoiteModale .divColonneTexte {} .divBoiteModale .divColonneTexte.avecColonneDroite {float: left; width: 100%;} .divBoiteModale .divColonneTexte.avecColonneDroite .divTexte {margin-right: 300px;} .divBoiteModale .divImage {float: left; margin-left: -230px; margin-top: 60px;} } @media only screen and (min-width: 1200px) { .listeLettreFormulaire li { padding-right: 30px; font-size: 14px;} } /* 12_400 : Mon compte /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .infoCompte .bandeau { margin-top: 10px;} .infoCompte .adresse:first-child { border-top: 1px solid #ebebeb; margin: 10px 0;} .infoCompte .adresse { border-bottom: 1px solid #ebebeb; display: inline-block; width: 100%; color: #000; padding: 10px 0;} .infoCompte .bandeau [class^=bouton] { margin-top: 20px;} .infoCompte .general { margin-bottom: 32px; font-size: 0; position: relative;} .infoCompte .general li { display: inline-block; width: 100%; vertical-align: top; font-size: 16px; margin-bottom: 20px;} .infoCompte .general p:first-child { margin-bottom: 10px;} .infoCompte table { width: 100%; margin-top: 14px; border-collapse: collapse; } .infoCompte th { font-size: 14px;margin-bottom: 10px; color: #000; line-height: 1.2; padding: 10px 5px 14px 10px; position: relative; border-bottom: 1px solid #ebebeb;} .infoCompte th:before { position: absolute; bottom: 2px; height: 1px; right: 0; left: 0; background: #ebebeb; content: ""; display: inline-block;} .infoCompte td { border-bottom: 1px solid #ebebeb; padding: 10px;border-left: 1px solid #ebebeb; } .infoCompte tbody { border-top: 1px solid #ebebeb; border-right: 1px solid #ebebeb; border-left: 1px solid #ebebeb;} .infoCompte input, .infoCompte textarea { border: 0; padding: 0; height: auto;} .infoCompte input:focus, .infoCompte textarea:focus { outline: none; border: none; box-shadow: none} .infoCompte .general input { border: 1px solid #ebebeb; padding: 8px 12px} .infoCompte .general li { padding-right: 30px;} .action { text-align: center;} .btn-supprimer-immeuble { display: inline;} .btn-supprimer-immeuble:before { content: ""; display: inline-block; width: 22px; height: 22px; background: url(../gx/m/sprites-icon.png) -156px -127px; vertical-align: top; font-size: 0; } [name=btn-enregistrer-profil] {margin-right: 5px;} .lateralCompte { padding-top: 0; font-size: 0;} .lateralCompte .bandeau { margin-bottom: 10px;} .lateralCompte .separationTablette { margin-bottom: 10px;} .compteStatut { padding: 30px; background: #fafafa; font-size: 14px;font-weight: bold; } .compteStatut ul { margin-bottom: 16px;} .compteStatut li { border-top: 1px solid #ebebeb; display: inline-block; width: 100%; color: #000; padding: 6px 0 10px;} .compteStatut li:first-child { border-top: none;} .compteStatut li span, .compteStatut li p { display: inline-block; vertical-align: middle; width: 50%;} .compteStatut li span { text-align: right;} .compteStatut .titreResume { font-weight: bold; color: #000; font-size: 17px; margin-bottom: 10px;} .lateralCompte .boutonCouleur, .lateralCompte .boutonCouleurCorpiq { width: 100%; margin: 0 0px 10px;} .iconeModif, .iconeAnnuler, .iconeEnregistrer { padding: 11px 16px 12px;} .iconeModif:before, .iconeAnnuler:before, .iconeEnregistrer:before {display: inline-block; vertical-align: top; margin-top: 2px; margin-right: 6px; font-size: 0; } .iconeModif:before { content: url(../gx/m/compte-modifier.png); } .iconeAnnuler:before { content: url(../gx/m/compte-annuler.png); } .iconeEnregistrer:before { content: url(../gx/m/compte-synchro.png); } .tableOverflow { overflow: auto;} .listingFacture ul { border-bottom: 1px solid #d9d9d9; padding: 8px 0;} .listingFacture ul:first-child { border: none; margin-bottom: 10px;} .listingFacture p, .listingFacture a { vertical-align: middle; display: inline-block;} .listingFacture p { display: block;} .listingFacture a { padding: 4px 11px 5px; margin: 8px 0;} .enteteFacture { display: none;} .listingFacture strong { font: bold 15px "nexa", arial, sans-serif;} .listingFacture [class*=col-] { font: bold 15px "muli", arial; color: #000;} .detailFacture { margin-top: 40px;} .detailFacture header img, .logoCorpiqFacture { margin-bottom: 20px;} .logoCorpiqFacture { float: left;} .detailFacture header p {font: 14px "muli", arial; color: #999; margin-bottom: 10px; overflow: hidden;} .detailFacture header p strong { color: #000;} .logoCorpiqFacture { position:relative; width: 320px; } .logoCorpiqFacture img { width: 320px;} .logoCorpiqFacture:before { content: url(../gx/corpiq-logo-facture-impression.png); display: inline-block; width: 320px; } .detailFacture .detailGeneral { padding: 10px 0 30px;} .detailFacture .detailGeneral div, .detailFacture .detailGeneral .sousTitre { text-transform: uppercase; color: #000; font-size: 14px; font-weight: bold; } .detailFacture .detailGeneral .sousTitre { margin-bottom: 20px;} .detailFacture .detailGeneral div:first-child { color: #555; text-transform: none; font-weight: 300; margin-bottom: 20px;} .detailFacture .detailGeneral div:first-child strong { color: #000; display: block;} .detailFacture .detailEntete { background: #ebebeb; padding: 12px 20px; text-align: center;} .detailFacture .detailEntete li { text-transform: uppercase; font-size: 12px;} .detailListeItem { border-bottom: 1px solid #d9d9d9; padding: 16px 20px;} .detailPaiement .detailListeItem li { padding: 0; display: inline-block; } .detailPaiement li {font: bold 14px "muli"; color: #000; display: inline;} .detailPaiement li:first-child:after { content: ":";} .detailPaiement .detailEntete li:first-child:after { content: "";} .transactionResume { padding: 20px; border-bottom: 1px solid #d9d9d9; position: relative;} .transactionResume ul { padding: 4px; } .transactionResume:before { content: ""; height: 1px; width: 100%; position: absolute; bottom: -4px; left: 0; right: 0; background: #d9d9d9;} .detailTotal { padding: 20px;} .detailTotal li { font-size: 18px; text-transform: uppercase;} .modification .boutonGeneral { margin-top: 10px!important;} .modification p { margin-bottom: 0; margin-top: 10px;} @media screen and (min-width: 768px) { .listingFacture p { display: inline-block;} .listingFacture .col-1-4 a { float: right;} .listingFacture ul:first-child li { text-transform: uppercase; font: bold 16px "nexa", arial;} .detailFacture .detailGeneral { font-size: 0;} .detailFacture .detailGeneral div { display: inline-block; vertical-align: top; width: 50%; text-align: right; } .detailFacture .detailGeneral div:first-child { text-align: left;} .listingFacture a { margin: 0;} .infoCompte .general li { width: 50%; } .detailFacture .detailGeneral { padding: 30px 0;} .detailFacture .detailGeneral div:first-child { margin-bottom: 0;} .detailFacture .detailEntete li { font-size: 14px;} .detailPaiement li { display: inline-block;} .detailPaiement li:first-child:after { content: "";} .detailPaiement .detailListeItem li { padding: 22px 20px;} .detailListeItem { padding: 0;} .detailFacture .detailEntete { text-align: left;} .detailFacture .col-1-8 { width: 25%;} .lateralCompte .separationTablette { display: inline-block; width: 49%; vertical-align: top; font-size: 15px;} .lateralCompte .separationTablette:first-child { margin-right: 2%;} } @media screen and (min-width: 1000px) { .enteteFacture { display: block;} .listingFacture strong { display: none;} .detailFacture header img { float: left; margin-bottom: 0;} .detailFacture header p { float: right; } .detailFacture header p.push { margin-right: 50px; } .detailFacture header { padding-bottom: 30px;} .detailFacture .col-1-8 { width: 12.5%;} .lateralCompte .separationTablette { width: 100%; } .lateralCompte .separationTablette:first-child { margin-right: 0;} } /* 13_100 : Calcul d'augmentation /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ #calculAugmentation .groupe-col .detailNb { position: relative; cursor:pointer;} #calculAugmentation .groupe-col .detailTexte { width: 240px; display: none; position: absolute; top: -50%; left: 0; background: #fff; font-size: 11px!important; z-index: 4; text-align: center; border: 1px solid #ccc;} #calculAugmentation .groupe-col .detailTexte span { padding: 10px; font-size: 11px; display: inline-block;} #calculAugmentation .groupe-col .detailTexte.pos1 { left: -100px;} #calculAugmentation .groupe-col .detailTexte.pos2 { left: -20px;} #calculAugmentation .groupe-col .detailTexte .titre { background: #3f4d5f; display: block; color: #fff; padding: 7px 20px 7px 20px; font-size: 10px; } #calculAugmentation .groupe-col .detailTexte .titre:before { content: "x"; font-size: 18px; position: absolute; top: 0px; right: 8px; } #calculAugmentation .groupe-col input { height: 35px; background: #fff; display: inline-block; vertical-align: middle; position: relative;} @media screen and (max-width:1000px){ #calculAugmentation .groupe-col input {max-width:250px;} } @media screen and (max-width:915px){ #calculAugmentation .groupe-col input {max-width:200px;} } @media screen and (max-width:836px){ #calculAugmentation .groupe-col input {max-width:120px;} } #calculAugmentation .groupe-col { text-align: left; width: 100%; display: inline-block; vertical-align: top;} #calculAugmentation .groupe-col * { font-size: 14px; font-weight: bold; color: #000;} #calculAugmentation .groupe-col li { position: relative; padding: 2.5px 20px 2.5px; line-height: 1.1;/* height: 40px;*/ } #calculAugmentation .groupe-col li:before, #calculAugmentation .vignette:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;} #calculAugmentation .groupe-col li p { display: inline-block; vertical-align: middle; padding-top: 4px; padding-bottom: 4px;} #calculAugmentation .groupe-col [class*=op]:before, #calculAugmentation .groupe-col [class*=op]:after { content: ""; position: absolute; top: 50%; margin-top: -8px; font-size: 14px; z-index: 2; display: inline-block;} #calculAugmentation .groupe-col .opEqual:before { content: "="; left: 5px;} #calculAugmentation .groupe-col .opPlus:after { content: "+"; right: 6px;} #calculAugmentation .groupe-col .opMinus:after { content: "-"; right: 5px;} #calculAugmentation .groupe-col .opMulti:after {content: "x"; right: 6px;} #calculAugmentation .groupe-col .opDiv:after {content: "\00f7"; right: 5px;} .bandeauForm { background: #3f4d5f; color: #fff; padding: 15px 20px; margin: 20px 0 0; text-transform: uppercase; font-size: 14px; display: inline-block; width: 100%;} .bandeauForm a { background: transparent; color: #f94131; font-size: 16px; text-decoration: underline; margin-top: 10px; display: block; text-transform: none } #calculAugmentation .disable { background: #f4f4f4;} .groupeActionForm { margin-top: 20px; display: inline-block; width: 100%;} .groupeActionForm .boutonGeneral { float: right; margin-left: 10px; } [class*=texteDetailAugmentation] { display: none;} #calculAugmentation .vignette { background: #ebebeb; color: #000; position: absolute; top: 2.5px; right:20px; bottom: 2.5px; font-size: 11px;width: 40%; text-align: center; padding: 0 5px;} #calculAugmentation .vignette p { display: inline-block; vertical-align: middle; font-size: 10px;} #calculAugmentation .note, #calculAugmentation .note p{ font-size: 12px; text-align: center; vertical-align: bottom!important;} #calculAugmentation .clair, #calculAugmentation .clair p { color: #999;} #calculAugmentation .centre, #calculAugmentation .centre p { text-align: center;} #calculAugmentation .droite, #calculAugmentation .droite p { text-align: center;} #calculAugmentation .fondBleu { background: #edf5f9;} #calculAugmentation .fondBleuFonce { background: #ddecf4;} #calculAugmentation .fondGris { background: #fafafa;} #calculAugmentation .fondGrisFonce { background: #edecec;} #calculAugmentation .spacer {border-bottom: 2px solid #fff; } #calculAugmentation .spacer2 { margin-top: 10px;} #calculAugmentation .boxed { border: 1px solid #ebebeb;} #calculAugmentation .texteOrange p, #calculAugmentation span.texteOrange{ color: #f94131;} #calculAugmentation .texteBleu p, #calculAugmentation span.texteBleu{ color: #245baa;} #calculAugmentation .lienBleu { color: #245baa;} #calculAugmentation .lienOrange { color: #f94131;} #calculAugmentation .groupe-col li.titre:first-child { padding-left: 0; padding-right: 0;} #calculAugmentation .titre p{ font-weight: bold; text-transform: uppercase; padding: 0 20px;} #calculAugmentation .groupe-col.rangeeTitre li { height: 50px; padding-top: 4px;} #calculAugmentation .groupe-col.rangeeTitre .vignette, #calculAugmentation .groupe-col.rangeeTitre .vignettePermanente, #calculAugmentation .groupe-col.rangeeTitre .vignettePermanenteB { top: 7.5px; bottom: 7.5px;} #calculAugmentation .groupe-col.rangeeNote li { height: 30px;} #calculAugmentation .vignettePermanente, #calculAugmentation .vignettePermanenteB { background: #3f4d5f; color: #fff; position: absolute; top: 2.5px; z-index:2; left:20px; bottom: 2.5px; line-height: 35px; font-size: 14px; width: 30px; text-align: center;} #calculAugmentation .vignettePermanenteB { background: #f94131;} #calculAugmentation .vignettePourcent { position: absolute; top: 0; right:30px; bottom: 0; line-height: 40px; font-size: 14px; width: 30px; text-align: center;z-index:2; display: none;} #calculAugmentation .vignettePourcent:before { content: "%"; color: #999; } #calculAugmentation li:last-child .vignettePourcent { right: 20px;} #calculAugmentation .groupe-col-1-2.premier li:last-child .vignettePourcent { right: 10px;} .col-1-8.offset-1-8 { padding-left: 10px!important;} #calculAugmentation .marginTop { margin-top: 10px;} .pageCalculAjustement .messageInfo { padding: 30px; text-align: left; margin: 40px 0 30px; display: inline-block; width: 100%;} .pageCalculAjustement .messageInfo.secondaire { margin: 20px 0 0px;} .pageCalculAjustement .messageInfo .sousTitre { color: #f94131; text-transform: uppercase; } .centreChamp input { text-align: center!important;} @media screen and (max-width: 999px) { #calculAugmentation .empty { padding: 0 !important; background: transparent!important; height: 0!important;} #calculAugmentation .col-m-0 { display:none!important;} } @media screen and (min-width: 768px) { .col-1-8.offset-1-8 { width: 100%;} .col-1-8.offset-xs-1-2, .col-1-4.offset-xs-1-2 { margin-left: 50%;} .col-m-1 { width: 100%;} .col-m-1-8 { width: 25%;} #calculAugmentation .vignette { width: 145px;} #calculAugmentation .col-m-1-8 .vignette { width: 40%;} #calculAugmentation .droite, #calculAugmentation .droite p { text-align: right;} #calculAugmentation .groupe-col li { height: 40px; } } @media screen and (min-width: 1000px) { #calculAugmentation .vignette { display: none;} #calculAugmentation .groupe-col li:first-child{ padding-left: 20px;} #calculAugmentation .groupe-col li:last-child{ padding-right: 20px;} #calculAugmentation .groupe-col-1-2.fondGris li:last-child { padding-right: 10px;} #calculAugmentation .vignettePourcent { display: inline-block;} .col-1-8.offset-1-8, .col-m-1, #calculAugmentation .col-m-1-8 { width: 12.5%;} .col-1-4.col-m-1, #calculAugmentation .col-1-4 { width: 25%;} #calculAugmentation .marginTop { margin-top: 0px;} .col-1-8.offset-xs-1-2, .col-1-4.offset-xs-1-2 { margin-left: 0%;} .col-3-8.col-m-1 { width: 37.5%;} .offset-1-8 { margin-left: 12.5%;} .col-xs-hide { display: block;} .groupe-col-1-2 { width: 50%; float: left;} #calculAugmentation .groupe-col li { padding: 2.5px 20px 2.5px 0; } #calculAugmentation .groupe-col .opEqual:before { left: -14px;} #calculAugmentation .vignettePermanente, #calculAugmentation .vignettePermanenteB { left: 0;} .bandeauForm a { float: right; margin-top: 2px; } } /* 14_100 : Calcul des économies /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ /*--------------------------------------------------------------------------------------- */ .pageCalculEconomie #filAriane { border-bottom: 1px solid #aac1ce;} .structureFormGroupe { padding-top: 20px;} .structureFormGroupe ul { border-top: 1px solid #aac1ce; padding: 10px 0;} .structureFormGroupe ul.premier { border: none;} .structureFormGroupe strong { font-size: 17px; color: #000;} .structureForm li { color: #000;} .structureForm .entete { background: #000; padding: 15px 0; display: none;} .structureForm .entete li {color: #fff; text-transform: uppercase; font-size: 0px; } .structureFormGroupe li { margin-bottom: 6px; position: relative;} .structureFormGroupe li .vignette { background: #ebebeb; color: #000; position: absolute; top: 0; right:0; bottom: 0; line-height: 40px; font-size: 12px; padding: 0 10px; width: 140px; text-align: center;} .banniereEconomie { background: #3f4d5f; font-size: 0; padding: 20px; text-align: center;} .banniereEconomie .image img{ width: 100px; } .banniereEconomie h1 { color: #fff; font-size: 28px; margin-bottom: 0; margin-top: 20px;} .banniereEconomie .image, .banniereEconomie h1 { display: inline-block; vertical-align: middle;} .messageEconomie { padding: 20px 0 20px; color: #000;} .totalEconomie { background: #3f4d5f; color: #fff; padding: 20px; width: 100%; margin: 20px 0 20px; position: relative; text-align: center;} .totalEconomie img { max-width: 90px; display: inline-block; vertical-align: middle; margin-bottom: 20px;} .totalEconomie span { display: inline-block; vertical-align: middle; padding-left: 10px; font: bold 25px "nexa", arial; text-transform: uppercase;} .totalEconomie .result { background: #fff; color: #000; padding: 16px;} .boiteResult { margin-top: 18px;} .pageCalculEconomie .info { background: #fff; padding: 20px 0;} .pageCalculEconomie .info p { text-align: center; color: #2b4868; font-size: 15px; font-weight: bold;} .pageCalculEconomie .info .contact { margin-top: 20px; } @media screen and (min-width: 768px) { .banniereEconomie { padding: 40px; text-align: left;} .banniereEconomie .image { width: 20%;} .banniereEconomie h1 { width: 80%; font-size: 40px; margin-top: 0;} .banniereEconomie .image img{ padding: 0; } .messageEconomie { padding: 40px 10% 30px; } .structureForm .entete { display: block;} .structureForm .entete li {font-size: 14px; } .structureFormGroupe li { margin-bottom: 0;} .structureFormGroupe li .vignette { display: none;} .totalEconomie { text-align: left; margin: 40px 0 20px;} .totalEconomie img { margin-bottom: 0;} .boiteResult { position: absolute; top: 50%; margin-top: -27px; right: 20px; width: 25%; } .pageCalculEconomie .info { padding: 20px 10%;} .pageCalculEconomie .info .contact { width: 50%; float: left; } .structureForm li.col-1-4 { padding-left: 10px; width: 25%;} .structureForm li.col-1-2 { padding-left: 20px;} } @media screen and (min-width: 1000px) { .pageCalculEconomie { background: #edf5f9;} .pageCalculEconomie .info { padding: 20px 20%;} .messageEconomie { padding: 40px 20% 30px; } } /*--------------------------------------------------------------------------------------- */ /* Pied de page */ /*--------------------------------------------------------------------------------------- */ footer { background: #202020; font-size: 14px;} footer a { color: #fff;} footer a:hover, footer a:active, footer a:focus{ color: #2a5caa;} footer a.actif { color: #2a5caa;} footer nav { padding: 40px 0; background: url(../gx/m/banniere-pied.png) bottom center repeat-x;} footer nav > ul { font-size: 0;} footer nav > ul > li { display: inline-block; width: 50%; vertical-align: top; text-transform: uppercase; font-size: 14px; margin-bottom: 20px; padding-right: 100px;} footer ul ul li { margin-bottom: 10px;} footer .sousMenu li { margin-bottom: 6px;} footer .sousMenu a:hover, footer .sousMenu a:focus, footer .sousMenu a:active { color: #fff;} footer .sousMenu a { padding-left: 16px; color: #999; text-transform: none;} footer .titre { color: #fff; text-transform: uppercase; margin-bottom: 6px; display: inline-block;} footer small { background: #000; display: block; padding: 20px 0; color: #fff; } footer small a { display: inline-block; } footer small .sep:before { content: "|"; margin: 0 4px 0 7px ; } #piedPage.pubVisible small{ padding-bottom: 70px;} .gutter { padding-right: 50px;} footer .facebook:before { background-position: 0 0;} footer .facebook { background: transparent!important;} footer .facebook:hover:before, footer .facebook:focus:before, footer .facebook:active:before { background-position: -25px 0;} footer .linkedin:before { background-position: -45px -244px;} footer .linkedin { background: transparent!important; margin-left: 15px; } footer .linkedin:hover:before, footer .linkedin:focus:before, footer .linkedin:active:before { background-position: -6px -244px;} .formInfolettre p { color: #999; text-transform: none; margin-top: 4px;} .choixInfolettre input { float: left;} .choixInfolettre p { display: block; overflow: hidden;} #formContactCourt { margin-top: 14px;} #formContactCourt div { position: relative;} #formContactCourt button { padding: 8px 8px 3px; position: absolute; top: 0; right: 0; bottom: 0;} #formContactCourt button:before { content: url(../gx/m/icone-crochet.png);} #menuPied { display: none;} @media screen and (min-width: 768px) { #menuPied { display: block;} #piedPage.pubVisible small{ padding-bottom: 20px;} } @media screen and (min-width: 1000px) { footer nav > ul > li { width: 25%; padding-right: 0;} footer .lienPartager { float: right; } footer small .sep.mobile:before { content: "";} } .isloading-wrapper{text-align:center;display:block;margin-top:20px;} .icon-refresh{ background: url(../gx/loader.gif) 0 0 no-repeat !important; width:64px; height:64px;display:block;margin:10px auto 0 auto;} .icon-refresh-dark{ background: url(../gx/loader-dark.gif) 0 0 no-repeat !important; width:64px; height:64px;display:block;margin:10px auto 0 auto; color: #fff;} .calendrier .isloading-wrapper { color : #fff;} .infoCompte .general .isloading-overlay { background: rgba(0,0,0,0.2)!important; } .infoCompte .general .icon-refresh{ background: url(../gx/loader-dark.gif) 0 0 no-repeat !important; width:64px; height:64px;display:block;margin:10px auto 0 auto; color: #fff;} #form-codePostal{ position: relative;} #form-codePostal .icon-refresh{ display: none; height:52px; width:52px; position: absolute; left:50%; top:50%; margin: -26px 0 0 -26px; z-index: 1; } #form-codePostal.load .icon-refresh{ display: block;}