#CACHE{24*3600,cache-client} #HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15} #HTTP_HEADER{Vary: Accept-Encoding} #SET{c_vignettes_bk,(#CONFIG{soyezcreateurs_couleurs/vignettes_bk,#ffffff})} #SET{c_navigation,(#CONFIG{soyezcreateurs_couleurs/navigation,#017ca5})} #SET{c_body_bk,(#CONFIG{soyezcreateurs_couleurs/body_bk,#eceded})} #SET{c_logo_bk,(#CONFIG{soyezcreateurs_couleurs/logo_bk,transparent})} #SET{c_header,(#CONFIG{soyezcreateurs_couleurs/header,#262626})} #SET{c_header_bk,(#CONFIG{soyezcreateurs_couleurs/header_bk,#ffffff})} #SET{c_footer,(#CONFIG{soyezcreateurs_couleurs/footer,#595959})} #SET{c_footer_bk,(#CONFIG{soyezcreateurs_couleurs/footer_bk,#ffffff})} #SET{c_navigation,(#CONFIG{soyezcreateurs_couleurs/navigation,#017ca5})} #SET{c_navigation_bk,(#CONFIG{soyezcreateurs_couleurs/navigation_bk,#ffffff})} #SET{c_menuhaut,(#CONFIG{soyezcreateurs_couleurs/menuhaut,#017ca5})} #SET{c_menuhaut_bk,(#CONFIG{soyezcreateurs_couleurs/menuhaut_bk,#ffffff})} #SET{c_extra,(#CONFIG{soyezcreateurs_couleurs/extra,#017ca5})} #SET{c_extra_bk,(#CONFIG{soyezcreateurs_couleurs/extra_bk,#ffffff})} #SET{c_datemajsite,(#CONFIG{soyezcreateurs_couleurs/datemajsite,#595959})} #SET{c_datemajsite_bk,(#CONFIG{soyezcreateurs_couleurs/datemajsite_bk,#ffffff})} #SET{c_menu_a,(#CONFIG{soyezcreateurs_couleurs/menu_a,#005e7a})} #SET{c_menu_a_bk,(#CONFIG{soyezcreateurs_couleurs/menu_a_bk,#ffffff})} #SET{c_menu_a_hover,(#CONFIG{soyezcreateurs_couleurs/menu_a_hover,#ffffff})} #SET{c_menu_a_hover_bk,(#CONFIG{soyezcreateurs_couleurs/menu_a_hover_bk,#0b7899})} #SET{c_menu_a_active,(#CONFIG{soyezcreateurs_couleurs/menu_a_active,#ffffff})} #SET{c_menu_a_active_bk,(#CONFIG{soyezcreateurs_couleurs/menu_a_active_bk,#0b7899})} #SET{c_menu_a_strong,(#CONFIG{soyezcreateurs_couleurs/menu_a_strong,#ffffff})} #SET{c_menu_a_strong_bk,(#CONFIG{soyezcreateurs_couleurs/menu_a_strong_bk,#0b7899})} #SET{c_container,(#CONFIG{soyezcreateurs_couleurs/container,#02265a})} #SET{c_container_bk,(#CONFIG{soyezcreateurs_couleurs/container_bk,#f6f6f6})} #SET{LargeurContaineur,(#CONFIG{soyezcreateurs_layout/largeurconteneur,960})} #SET{LargeurMenuGauche,(#CONFIG{soyezcreateurs_layout/largeurmenugauche,180})} #SET{LargeurMenuDroit,(#CONFIG{soyezcreateurs_layout/largeurmenudroit,180})} #SET{LargeurMilieu,(#GET{LargeurContaineur}|moins{#GET{LargeurMenuGauche}}|moins{#GET{LargeurMenuDroit}}|div{2})} #SET{masonry,308} div#content { width: 100%; } { /* clearfix */ /* ---- grid ---- */ /* ---- grid-item ---- */ } iframe { width: 100%; } img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; } :focus { outline: none; } select { cursor: pointer; } .spip_logo { max-width: 100%; } .ariaformprop { padding: 0; margin: 0; position: relative; z-index: 99; background-color: white; font-size: 80%; } .ajaxbloc { height: 100%; } .row { margin-right: auto; margin-left: auto; } .text-center { text-align: center; } .text-right { text-align: right; } .text-left { text-align: left; } .menu { margin: 0; list-style-type: none; } .menu > li { display: table-cell; vertical-align: middle; } .vertical > li { display: block; vertical-align: middle; } .hide { display: none; } .sans-border { border: 0; } .avec-border { border: 1px solid #aaa; } .avec-border-top { border-top: 1px solid #aaa; } .avec-border-bottom { border-bottom: 1px solid #aaa; } .avec-border-left { border-left: 1px solid #aaa; } .sans-margin { margin: 0; } .avec-margin { margin: 1.5em; } .avec-margin-top { margin-top: 1.5em; } .avec-margin-right { margin-right: 1.5em; } .avec-margin-bottom { margin-bottom: 1.5em; } .avec-margin-bottom05 { margin-bottom: .5em; } .avec-margin-bottom015 { margin-bottom: .15em; } .avec-margin-left { margin-left: 1.5em; } @media screen and (min-width: 40em) { .avec-margin-bottom-for-medium { margin-bottom: 1.5em; } } .sans-padding { padding: 0; } @media screen and (max-width: 40em) { .sans-padding-for-small { padding: 0; } } .avec-padding { padding: 1em; } .avec-padding05 { padding: .5em; } .avec-padding-top { padding-top: 1em; } .avec-padding-top05 { padding-top: .5em; } .avec-padding-top15 { padding-top: 1.5em; } .avec-padding-right { padding-right: 1em; } .avec-padding-right05 { padding-right: .5em; } .avec-padding-bottom { padding-bottom: 1em; } .avec-padding-left { padding-left: 1em; } .avec-padding-leftright { display: block; padding-right: 1em; padding-left: 1em; } .display-block { display: block; } .text-transform-none { text-transform: none; } .text-uppercase { text-transform: uppercase; } .font-style-italic { font-style: italic; } .position-relative { position: relative; } .float-left { float: left ; } .float-right { float: right ; } .float-center { display: table; margin-right: auto ; margin-left: auto ; } .z-index-999 { z-index: 999; } .cursor-pointer { cursor: pointer; } .portailcognac #letexte { display: none; } .portailcognac #content { padding: 0; background-color: transparent; } .portailcognac #contenu { max-width: 100%; width: 100%; } .portailcognac #contenu #content { max-width: 100%; width: 100%; } #contenu #content img { padding: 0; } #projets { margin: 0; padding: 0; } #projets projet { width: 50%; float: left; } #projets a { display: flex; flex-direction: row; align-content: center; height: 20vw; color: white; border: none; } #projets a:hover { color: #333; } #projets h2 { width: 100%; height: auto; margin: auto; padding: 0 10px; align-self: center; color: inherit; font-size: 3vw; font-weight: 300; text-align: center; line-height: 50px; } #projets .suite { background-color: rgba(100, 100, 100, 0.5) ; display: flex; height: auto; padding: 0 25px; } #projets .suite .icon { margin: auto; align-self: center; font-size: 0; } #projets .suite .icon:before { font-size: 4vw; } @media only screen and (max-width: 1024px) { #projets h2 { font-size: 36px; line-height: 38px; } } @media only screen and (max-width: 768px) { #projets h2 { font-size: 30px; line-height: 34px; } } @media only screen and (max-width: 640px) { #projets .projet { width: 100%; float: none; } #projets .projet a { height: auto; } #projets h2 { padding: 1rem; font-size: 26px; line-height: 30px; } #projets .suite { padding: 0 15px; } #projets .suite .icon { font-size: 0; } } .slider-pratique { margin: 0 4rem; } .slider-pratique .slick-prev, .slider-pratique .slick-next { width: 60px; height: 70px; text-shadow: initial; } .slider-pratique .slick-prev { left: -60px; } .slider-pratique .slick-prev:before { content: "\e907"; } .slider-pratique .slick-next { right: -60px; } .slider-pratique .slick-next:before { content: "\e906"; } .slider-pratique .slick-prev:before, .slider-pratique .slick-next:before { margin-left: -20px; font-family: "picto-cognac" ; font-size: 50px; opacity: 1; color: #be1621; } .slider-pratique .slick-prev:hover:before, .slider-pratique .slick-prev:focus:before, .slider-pratique .slick-next:hover:before, .slider-pratique .slick-next:focus:before { opacity: 1; color: #333 ; } .slider-pratique button:hover, .slider-pratique button:focus { background-color: transparent; } .slider-pratique .content-pratique { background-color: #129b9b; width: 280px; margin: 0 12px; -webkit-transition: all .25s ease; transition: all .25s ease; } .slider-pratique .content-pratique:hover, .slider-pratique .content-pratique:focus { background-color: rgba(18, 155, 155, 0.2) ; -webkit-transition: all .25s ease; transition: all .25s ease; } .slider-pratique .content-pratique:hover h2, .slider-pratique .content-pratique:focus h2 { color: #129b9b ; } .slider-pratique .h2 { display: flex; height: 150px; margin: 1.5em 0 0 0; padding-bottom: 90px; font-family: 'Open Sans', sans-serif ; font-size: 26px; color: white; font-weight: 300; text-align: right; } .slider-pratique .h2 .titre-pratique { width: 100%; align-self: center; padding: 10px; text-align: right; border-right: 1px solid; } .slider-pratique .h2 .icon { align-self: center; padding: 7px 15px 7px 7px; font-size: 0; } .slider-pratique .h2 .icon:before { font-size: 30px; } @media only screen and (max-width: 400px) { .slider-pratique { margin: 0 2.8rem; } .slider-pratique .content-pratique { width: 240px; } .slider-pratique .h2 { height: 130px; padding-bottom: 0; font-size: 21px; } } #content .titre-sommaire { margin-top: 4em; } #content .titre-sommaire:before { content: ""; display: block; background-color: #be1621; width: 100%; height: 1px; } #content .titre-sommaire h1 { display: block; background-color: #eae9e5; max-width: [(#GET{LargeurContaineur}|moins{44})]px; margin: -1.1em auto 1em auto; padding: .5em .8em .5em; color: #be1621; font-size: 2rem; line-height: 1em; border-left: 1px solid #be1621; } @media screen and (max-width: 1178px) { #content .titre-sommaire h1 { border-left: none; } } .slick-slider { margin-bottom: 0; } .slider-slick img { width: 100%; } .slick-slide img { margin: 0 auto; } .slick-slide .row { max-width: none; } .slick-dots { bottom: -45px; } .slick-dots li { width: 30px; height: 30px; } .slick-dots li button { width: 30px; height: 30px; } .slick-dots li button::before { font-size: 20px; line-height: 30px; width: 30px; height: 30px; } .slick-dots li.slick-active button::before { color: #be1621; } #liens-diaporama { position: absolute; top: 100px; right: 0; } @media only screen and (max-width: 1024px) { #liens-diaporama { top: 5vw; } } @media only screen and (max-width: 767px) { #liens-diaporama { position: relative; top: 50px; } } #liens-diaporama ul { width: 220px; text-align: right; } @media only screen and (max-width: 767px) { #liens-diaporama ul { display: flex; width: 100%; flex-wrap: wrap; } #liens-diaporama li { flex-grow: 1; } } @media only screen and (max-width: 767px) { #liens-diaporama li a span { padding: .25em .5em; } } #liens-diaporama li a span.icon { margin-left: .55rem; padding: .85rem .5rem; font-size: 0; border-left: 1px solid #be1621 ; } #liens-diaporama li a span.icon:before { font-size: 2.15rem; } #liens-diaporama li a:hover { color: #666 ; } @media only screen and (max-width: 767px) { #liens-diaporama li a { background-color: #eae9e5; margin-left: .5em; } } #actualites { margin-top: 7em; } #lesprojets { margin-top: 5em; } #lesprojets .titre-sommaire { display: none; } #pratique { margin-top: 6.5em; margin-bottom: 4em; } #pratique .titre-sommaire h1 { background-color: #CFEBEB; } .clearfix:after, .grid:after { content: ''; display: block; clear: both; } .grid-item .h2 .icon:before { font-size: 30px; } .grid-item-x2 { width: calc(50% - 20px) ; } .grid-item-x3 { width: calc(75% - 20px) ; } #liens-diaporama { position: absolute; top: 100px; right: 0; } @media only screen and (max-width:[(#GET{LargeurContaineur})]px) { #liens-diaporama { top: 5vw; } } @media only screen and (max-width: 767px) { #liens-diaporama { position: relative; top: 50px; } } #liens-diaporama ul { width: 220px; text-align: right; } @media only screen and (max-width: 767px) { #liens-diaporama ul { display: flex; width: 100%; flex-wrap: wrap; } } #liens-diaporama li { /* Si le fond est clair, on va le prendre comme couleur de fond, sinon, la couleur d'écriture Texte : #GET{c_header}([(#GET{c_header}|couleur_extreme)])/ Fond : #GET{c_header_bk}([(#GET{c_header_bk}|couleur_extreme)]) */ background-color: rgba([(#GET{c_header_bk}|couleur_extreme|=={ffffff}|?{#GET{c_header_bk},#GET{c_header}}|sc_rgb)], 0.75); margin-bottom: .5em; } @media only screen and (max-width: 767px) { #liens-diaporama li { flex-grow: 1; } } #liens-diaporama li a { display: flex; font-size: 1.2em; color: [(#GET{c_header_bk}|couleur_extreme|=={ffffff}|?{#GET{c_header},#GET{c_header_bk}})]; justify-content: flex-end; line-height: 1 ; align-items: center; } #liens-diaporama li a span { padding: .5em .25em .5em .5em; } @media only screen and (max-width: 767px) { #liens-diaporama li a span { padding: .25em .5em; } } #liens-diaporama li a span.icon { border-left: 1px solid; border-left-color: inherit; } @media only screen and (max-width: 767px) { #liens-diaporama li a { background-color: #eae9e5; margin-left: .5em; } } .slick-slide img { margin: 0 auto; } .slick-slide .row { max-width: none; } .slick-dots { bottom: -45px; } .slick-dots li { width: 30px; height: 30px; } .slick-dots li button { width: 30px; height: 30px; } .slick-dots li button::before { font-size: 20px; line-height: 30px; width: 30px; height: 30px; } .slick-dots li.slick-active button::before { color: black; } #content img { padding: 0; } .clearfix:after, .grid:after { content: ''; display: block; clear: both; } #diaporama { margin-bottom: 9em; } #zoomsurtexte { max-width: [(#GET{LargeurContaineur}|moins{44})]px; margin: 0 auto; padding: 1em 2em; color: #GET{c_container}; background-color: #GET{c_container_bk}; [(#CONFIG{soyezcreateurs_couleurs/transparencecontent,1}|!={1}|oui)background-color: rgba([(#GET{c_container_bk}|sc_rgb)], #CONFIG{soyezcreateurs_couleurs/transparencecontent,1});] } #content #zoomsur .titre-sommaire h1 { margin-bottom: 0; } img.zoomsurlogo { max-width: [(#GET{LargeurContaineur})]px; margin: 0 auto; display: block; } #masonry { max-width: #GET{LargeurContaineur}px; margin: 0 auto; padding-left: 20px; text-align: center; } .grid { text-align: center; } .grid-item { margin-bottom: 20px; -webkit-transition: all .25s ease; transition: all .25s ease; } .grid-item .content-actus:hover, .grid-item .content-actus:focus { /* Si le fond est clair, on va le prendre comme couleur de fond, sinon, la couleur d'écriture Texte : #GET{c_header}([(#GET{c_header}|couleur_extreme)])/ Fond : #GET{c_header_bk}([(#GET{c_header_bk}|couleur_extreme)]) */ background-color: rgba([(#GET{c_header_bk}|couleur_extreme|=={ffffff}|?{#GET{c_header_bk},#GET{c_header}}|sc_rgb)], 0.2); -webkit-transition: all .25s ease; transition: all .25s ease; } .grid-item .content-actus { /* Si le fond est clair, on va le prendre comme couleur de fond, sinon, la couleur d'écriture Texte : #GET{c_header}([(#GET{c_header}|couleur_extreme)])/ Fond : #GET{c_header_bk}([(#GET{c_header_bk}|couleur_extreme)]) */ background-color: #[(#GET{c_header_bk}|couleur_extreme|=={ffffff}|?{#GET{c_header_bk},#GET{c_header}}|couleur_foncerluminosite{20})]; } .grid-item .content-actus:nth-child(2) { margin-top: 16px; } .grid-item header { font-size: 1.5em; font-weight: 300; line-height: 21px; overflow: auto; } .agenda strong { font-size: 1.8em; vertical-align: bottom; } .agenda .annee { font-size: 1.8em; } .agenda time { padding: 0 .25em; } .agenda {height: 95px; } .grid-item .h2 { display: flex; flex-direction: row; width: 100%; height: 95px; margin: 0; font-size: 21px; font-weight: 400; color: #be1621 ; line-height: 21px; padding: 10px; text-align: right; border: none; } .grid-item .agenda .h2 { font-size: 18px; } .grid-item .agenda .date { padding: 0; flex-shrink: 0; display: flex; align-items: center; justify-content: center; } .agenda time { text-align: center; } .agenda .debutfin time { text-align: left; } .grid-item .agenda .date.debutfin { display: block; align-items: left; justify-content: left; } .grid-item .h2 .icon { font-size: 0; align-self: center; padding: 7px 0 7px 7px; } .grid-item .h2 .titre-actus { width: 100%; align-self: center; padding: 10px 10px 10px 0; border-right: 1px solid; } .grid-item img { max-width: 100%; } .grid-item { margin-bottom: 20px; } /* Affichage des dates. cf https://codepen.io/jpyrat/pen/EmZrpR */ .date { width: 95px; height: 95px; position: relative; background: [(#GET{c_header_bk}|couleur_extreme|=={000000}|?{#GET{c_header_bk},#GET{c_header}})]; color: [(#GET{c_header_bk}|couleur_extreme|=={000000}|?{#GET{c_header},#GET{c_header_bk}})]; } .debutfin:after { content: ""; position: absolute; right: 0; top: 0; border-top: 2px solid #fff; width: 142%; transform: rotate(-45deg); transform-origin: 99% 0%; } .debut, .fin { width: 75%; height: 50%; position: absolute; text-align: left; display: flex; flex-direction: column; justify-content: center; color: #fff; line-height: 1.2em; font-size: 75%; } .agenda .debutfin time.fin { right: 0; top: 50%; text-align: right; } .ladate { margin:0; padding:0; } .annee { font-size: 1.2em; line-height: 0.82em; display: block; } /* M : [(#GET{masonry}|mult{3}|plus{100})] LC: #GET{LargeurContaineur} */ [(#GET{masonry}|mult{3}|plus{100}|<={#GET{LargeurContaineur}}|oui) .grid-sizer, .grid-item { width: calc(25% - 20px); } .grid-item { height: calc(340px + 65px); } .grid-item-x2 { width: calc(50% - 20px); } .grid-item-x3 { width: calc(75% - 20px); } @media only screen and (max-width: #GET{LargeurContaineur}px) { .grid-item { height: calc(340px + 90px); } } ] [(#GET{masonry}|mult{3}|plus{100}|<={#GET{LargeurContaineur}}|non) .grid-sizer, .grid-item { width: calc(33.333% - 20px); } .grid-item { height: calc(340px + 90px); } .grid-item-x2 { width: calc(66.666% - 20px); } .grid-item-x3 { width: calc(100% - 20px); } ] @media only screen and (max-width:[(#GET{masonry}|mult{3}|plus{100})]px) { .grid-sizer, .grid-item { width: calc(33.333% - 20px); } .grid-item { height: calc(340px + 90px); } .grid-item-x2 { width: calc(66.666% - 20px); } .grid-item-x3 { width: calc(100% - 20px); } } @media only screen and (max-width: [(#GET{masonry}|mult{2}|plus{80})]px) { .grid-sizer, .grid-item { width: calc(50% - 20px); } .grid-item { height: calc(340px + 90px); } .grid-item-x2 { width: calc(100% - 20px); } } @media only screen and (max-width: [(#GET{masonry}|mult{1}|plus{60})]px) { .grid-sizer, .grid-item { width: calc(100% - 20px); } .grid-item { height: auto; } } #lesprojets { margin-top: 5em; margin-bottom: 4em; } #projets { margin: 0; padding: 0; } #projets .projet { background-color: #777; } @media only screen and (min-width: 641px) { #projets .projet { width: 50%; float: left; } } #projets .projet:hover { background-color: #aaa; } @media only screen and (max-width:[(#GET{LargeurContaineur})]px) { #projets h2 { font-size: 36px; line-height: 38px; } } @media only screen and (max-width: 768px) { #projets h2 { font-size: 30px; line-height: 34px; } } @media only screen and (max-width: 640px) { #projets article { width: 100%; float: none; } #projets article a { height: auto; } #projets h2 { padding: 1rem; font-size: 26px; line-height: 30px; } } #pratique { margin-bottom: 4em; } [(#CHEMIN{images/stylesportailcognac_perso.css}|?{'/* Surcharge eventuelle */'}) [(#INCLURE{#CHEMIN{images/stylesportailcognac_perso.css}|url_absolue_css}|compacte{css})] ]