@font-face { font-family: Universalis ADF Std, sans-serif; src: url('asset/fonts/UniversalisADFStd-Regular.otf') format('otf'), url('asset/fonts/UniversalisADFStd-Regular.woff') format('woff'); font-family: Millimetre, sans-serif; src: url('asset/fonts/Millimetre-Bold.otf') format('otf'), url('asset/fonts/Millimetre-Regular.otf') format('otf'); } *{ -webkit-box-sizing: border-box; box-sizing: border-box; } html{ overflow-x: hidden; } /*START PARALAX*/ .paralax{ z-index: -1; position: absolute!important; width: 50%; } #section_proch .paralax{ left: -20%; } .section_accueil .paralax{ /* left: 50%; */ } #section_projets .paralax{ left: 50%; } #section_asso .paralax{ left: 30%; } .agenda .paralax{ z-index: -1; position: absolute; top:0; width: 50%; } .les-projets .paralax{ z-index: -1; } .la-collecte .paralax{ z-index: -1; width: 50%; top: 0; } .la-benevole-zone .paralax{ z-index: -1; width: 50%; top: 0; } .privatiser-lespace .paralax{ z-index: -1; width: 30%; top: 0; } .privacy-policy .paralax{ z-index: -1; width: 70%; top: 0; } /*END PARALAX*/ body { font-size: 16px; font-family: Universalis ADF Std, sans-serif; padding: 0!important; } h1, h2, h3, h5{ font-family: Millimetre, sans-serif; } h1, h5, h6{ text-transform: uppercase; } img{ width: 100%; height: 100%; } ul{ padding:0; } li ,ul ,ol { list-style-type:none; } a, a:hover{ color: black; text-decoration: none; } /* START HEADER */ header{ width: 100%; position: fixed; z-index: 999; top: 0; left: 0; pointer-events: none; } header > .nav-wrapper{ height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } /* START LOGO */ .logoLamine { width : 150px; height: 150px; pointer-events: auto; } .logoLamine a{ display: block; width: 100%; height: 100%; } .logoLamine img{ -o-object-fit: cover; object-fit: cover; } #lumiR_logo { z-index: 1; position: absolute; left: 68px; top: 60px; width: 68px; height: 68px; background-color: #ffcc00ff; border-radius: 68px; opacity: 0.3; } .accueil #lumiR_logo, .agenda #lumiR_logo, .association #lumiR_logo, .privacy-policy #lumiR_logo{ background-color: #ffcc00ff; } .les-projets #lumiR_logo { background-color: #ff0000ff; } .les-temps-forts #lumiR_logo { background-color: #009ee0ff; } .la-collecte #lumiR_logo { background-color: #ff56ffff; } .la-benevole-zone #lumiR_logo { background-color: #5353e1ff; } .privatiser-lespace #lumiR_logo { background-color: #26e800ff; } #fond_logo{ z-index: -1; position: absolute; left: -25px; top: -25px; width: 200px; height: 200px; background-color: white; border-radius: 200px; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .logoLamine:hover #fond_logo{ -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /* END LOGO */ /* START RS */ .rs{ /* padding-top: 10px; */ height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; pointer-events: auto; } .rs > div { width: 30px; height: 30px; -o-object-fit: cover; object-fit: cover; margin-right: 15px; } /* END RS */ /* START NAV */ /* END NAV */ /* START BURGER */ .burger{ height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; pointer-events: auto; } .fond_burger{ background-image: url('../images/form_burger.svg'); background-position: center; /* Center the image */ background-repeat: no-repeat; /* Do not repeat the image */ background-size: contain; } #nav-main{ display: none; position: fixed; top: 70px; right: 1rem; width: calc(100% / 4); max-width : 200px; background: white; z-index: -1; border: 4px solid black; } @media screen and (max-width: 576px) { #nav-main{ width: 100%; max-width : 100%; right: 0; top: 0; height: 100vh; border: none; } .nav-main > ul > li{ border-bottom: 4px solid black; } .nav-main > ul > li:first-child{ border-top: 4px solid black; } } #nav-main.is-active{ display: -webkit-box; display: -ms-flexbox; display: flex; pointer-events: auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .nav-main > ul{ width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-bottom: 0rem; } .nav-main > ul > li{ text-align: center; } .nav-main > ul > li a{ background: white; color: black; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .nav-main > ul > li a:hover{ background: black; color: white; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .nav-main > ul > li:not(:last-child){ border-bottom: 4px solid black; } #fl_menu{ position:absolute; z-index: 9999; width: 30px; height: auto; right: 0; } .menu-item { font-family: Millimetre, sans-serif; text-transform: uppercase; text-align: center; pointer-events: auto; } .menu-item a { width: 100%; display: block; padding: 1rem; } #nav-main > ul > li > ul{ display: none; text-transform: lowercase; border-bottom: none; } #nav-main > ul > li > a:hover > ul { display: block; } #nav-main > ul > .menu-item{ /* border: 4px solid black; */ } #nav-main > ul > li:first-child > a::after{ content: ""; background-image: url('../images/fleche_menu.svg'); background-repeat: no-repeat; background-position: center; display: inline-block; width: 20px; height: 15px; margin-left: 10px; } #nav-main > ul > li:first-child:hover > ul { display: block; } /* END BURGER */ /* END HEADER */ /* START BODY */ body > .content-wrapper{ margin-top: 200px; } /* END BODY */ /* START BUTTON */ .section_accueil .redirection_page{ margin: 10px auto; padding: 3px 10px; } .section_accueil .tout_voir{ margin: 30px auto; padding: 3px 10px; } .btn, #bouton_asso, #bouton_contact { display: block; cursor: default!important; margin: auto; } #bouton_contact { margin-top: 20px; } .btn a, #bouton_asso a, #bouton_contact a{ display: block; width: -webkit-max-content; width: -moz-max-content; width: max-content; margin: auto; -webkit-transform: scale(1) rotate(0deg); -ms-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; -o-transition: transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } .btn a:hover, #bouton_asso a:hover, #bouton_contact a:hover{ -webkit-transform: scale(1.05) rotate(-5deg); -ms-transform: scale(1.05) rotate(-5deg); transform: scale(1.05) rotate(-5deg); -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .btn a{ padding: 7px 10px; background-color: white; border: 4px solid black; } .add_asso{ display: block; cursor: default!important; margin: 30px auto 30px auto;; } .add_asso a { padding: 7px 10px; background-color: white; border: 4px solid black; font-weight: bold; } .add_asso a:hover { color: white; background-color: black; } .flickity-button { background: transparent; } .flickity-prev-next-button { width: 100px; height: 100px; } .flickity-button-icon { fill: white; } .flickity-button-icon:hover { fill: black; } .flickity-prev-next-button:hover { background: transparent; } footer .flickity-prev-next-button:disabled { display: none; } footer .flickity-prev-next-button{ width: 50px; height: 50px; } /* END BUTTON */ /* START PAGE HOME */ .section_accueil { position: relative; padding: 100px 0; } .section_accueil .titre{ white-space: nowrap; } .section_accueil#section_proch .titre{ border-color: #ffcc00ff; } .section_accueil#section_asso .titre, .section_accueil#section_asso .content_asso { border-color: #ffcc00ff; } .section_accueil#section_projets .titre, .section_accueil#section_projets .wrap_content { border-color: #f51212ff; background-color: white; } .section_accueil#section_projets .wrapper__content h3{ color: #f51212ff; } .section_accueil#section_projets .wrap_content{ height: calc(100% - 80px); } /*ajout chloe drag*/ .group_drag { z-index: 9999; width: 200px; height: auto; cursor: -webkit-grab; cursor: grab; } .ui-draggable-dragging{ cursor: -webkit-grabbing; cursor: grabbing; } #drag_1 { position:absolute; top:175px; left: 645px; } #drag_2 { position:absolute; top: 265px; left: 318px; } #drag_3 { position:absolute; top:630px; left: 790px; } #drag_4 { position:absolute; top:385px; left: 616px; } #drag_5 { position:absolute; top:255px; left: 981px; } #drag_6 { position:absolute; top:280px; left: -69px; } #drag_7 { position:absolute; top:555px; left: 340px; } #drag_8 { position:absolute; top:420px; left: 945px; } #drag_9 { position:absolute; top:515px; left: 40px; } @media screen and (max-width: 576px) { .group_drag{ display: none; } } /*fin ajout chloe drag*/ .section_accueil#section_tpsF .titre, .section_accueil#section_tpsF .content_asso { border-color: #009ee0ff; } .section_accueil#section_tpsF .wrapper__content h3{ color: #009ee0ff; } .section_accueil#section_tpsF .colonne_section{ margin-bottom: 50px; } .section_accueil#section_tpsF ._content_tpsF{ min-height: 280px; } .section_accueil#section_MineVideo .titre { border-color: #009ee0ff; } /* END PAGE HOME */ /* START PAGE AGENDA */ .agenda .titre_page { border-color: #ffcc00ff; } .agenda .cat-list{ padding: 50px 0; } .agenda .cat-list li{ cursor: pointer; margin: 0 10px 20px 10px; padding: 2px 8px; border: 4px solid black; background-color: white; height: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .agenda .cat-list li:hover{ background: black; color: white; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .cat-list { text-transform: uppercase; font-weight: bold; margin-top: 10px; } /* START END AGENDA */ /* START PAGE SINGLE */ .fleche { position: relative; left:-50px; top:-10px; background-image: url('../images/fleche.svg'); width: 50px; height: 50px; background-size: contain; } article .header{ margin-bottom: 40px; } article .titre_event{ text-transform: uppercase; font-weight: bold; text-align: center; background-color: white; border: 8px solid #ffcc00ff; padding: 0.5rem 0 0.2rem 0; margin: 0!important; } .article-content .cat{ text-transform: uppercase; font-weight: bold; } .article-content .data{ background-color: white; border: 4px solid #ffcc00ff; padding: 1em; text-transform: uppercase; font-weight: bold; color: #ffcc00ff; } .article-content .inscription, .article-content .partager, .article-content .tarif{ margin-top: 40px; } .article-content h3:not(.titre_event) { color: #ffcc00ff; margin-bottom: 0; } .article-content .texte_details{ margin: 0; } .article-content .voir_event{ font-weight: bold; } .article-content .partager a{ display: block; width: 20px; height: 20px; margin-right: 5px; } article .__img_event{ max-height: 500px; } @media screen and (max-width: 576px) { article .__img_event{ max-height: 300px; } } article .__img_event img{ position:relative; top: 0; width:100%; height:100%; -o-object-fit:cover; object-fit:cover; } .other{ margin-top: 200px; position: relative; } .other .header_other{ position: absolute; top: 0; -webkit-transform: translate(-50% ,-150%); -ms-transform: translate(-50% ,-150%); transform: translate(-50% ,-150%); left: 0; } .voir_aussi { text-transform: uppercase; font-weight: bold; background-color: white; border: 8px solid #ffcc00ff; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); padding: 0.5rem; } .cat p{ margin:0; } .wrapper__content { margin-top: 20px; } /* END PAGE SINGLE */ /* START PAGE LA COLLECTE */ body.la-collecte .titre_page { border-color: #ff56ffff; } body.la-collecte .__header h3{ color: #ff56ffff; } .sider_left_form .acf-field .acf-label label{ display: none!important; } .sider_left_form .acf-fields > .acf-field{ border-top: 0; } .sider_left_form input{ border: 0px; border-bottom: 1px solid black; } .sider_left_form{ padding: 0 1rem; border: 8px solid #ff56ffff; background-color: white; } .sider_left_form .acf-form-submit{ padding-top: 0; } .sider_left_form .af-submit-button{ margin: 0 auto; } .sidebar_left .__content, .content_zone { border: 8px solid blue; background-color: white; padding: 1em; } /* END PAGE LA COLLECTE */ /* START PAGE BENEVOLE */ body.la-benevole-zone .titre_page { border-color: #5353e1ff; } body.la-benevole-zone .__header h3{ color: #5353e1ff; } body.la-benevole-zone .__content { border-color: #5353e1ff; } .la-benevole-zone .__bouttons{ text-align: center; width: -webkit-max-content; width: -moz-max-content; width: max-content; margin: 30px auto 0 auto; } .la-benevole-zone .__bouttons > div{ border: 4px solid #5353e1ff; background-color: white; margin: 10px auto; padding: 0 10px; font-weight: bold; } /* END PAGE BENEVOLE */ /* START PAGE projets */ body.les-projets .titre_page { border-color: #ff0000ff; } body.les-projets .header h3{ color: #ff0000ff; } body.les-projets .content_zone { border-color: #ff0000ff; } body.les-projets .title { color: #ff0000ff; } body.les-projets section#content .wrapper section{ margin: 100px auto; } .projet .img { margin: 30px 0; } ._pjt{ margin-top: 8%; /* RETIRE LES % */ } /* END PAGE projets */ /* START PAGE ASSOCIATION */ body.association .titre_page { border-color: #ffcc00ff; } body.association .__header h3{ color: #ffcc00ff; } body.association .__content { border-color: #ffcc00ff; } .association .__bouttons{ text-align: center; width: -webkit-max-content; width: -moz-max-content; width: max-content; margin: 30px auto 0 auto; } .association .__bouttons > div{ border: 4px solid #ffcc00ff; background-color: white; margin: 10px auto; padding: 0 10px; font-weight: bold; } .tableau_engagements{ margin-top: 100px; } .tableau_engagements > div:not(.gutter-sizer) { margin-bottom: 10px; border: 4px solid #ffcc00ff; background-color: white; padding: 10px; width: calc(50% - 10px)!important; } .gutter-sizer { width: 10px; } @media screen and (max-width: 576px) { .tableau_engagements > div:not(.gutter-sizer) { width: calc(100% - 40px)!important; margin: 0 20px 20px 20px; } } /* END PAGE ASSOCIATION */ /* START PAGE privatiser-lespace */ body.privatiser-lespace .titre_page { border-color: #26e800ff; } body.privatiser-lespace .__header h3{ color: #26e800ff; } .legendes{ background-color: white; position : absolute; bottom: 20px; margin-left: 20px; border: 8px solid #26e800ff; padding: 10px; } .privatiser.__slide .img{ height: 100%; } .privatiser.__slide .legendes{ opacity: 0; -webkit-transform: translateX(50px); -ms-transform: translateX(50px); transform: translateX(50px); -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .privatiser.__slide .is-selected .legendes{ opacity: 1; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); -webkit-transition: all 1.3s; -o-transition: all 1.3s; transition: all 1.3s; } .privatiser-lespace .__organisation, .privatiser-lespace .__organisation .orga{ margin: 40px 0; } .privatiser-lespace .__organisation .title{ color: #26e800ff } .privatiser-lespace .__organisation .__item{ border: 8px solid #26e800ff; background-color: white; padding: 10px; } /* END PAGE privatiser-lespace */ /*START PRIVACY-POLICY*/ .privacy-policy .article-h1 { position: absolute; top: 100px; left: 150px; text-transform: uppercase; font-weight: bold; text-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 8px solid #00FFFF; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); padding: 0.5rem; background-color: white; } .privacy-policy h2, .privacy-policy h3{ font-family: Universalis ADF Std, sans-serif; color: black!important; font-size: 1em; text-transform: uppercase; font-weight: bold; } .privacy-policy .content-wrapper { margin-top: 300px; } .privacy-policy .article-body { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } /*END PRIVACY-POLICY*/ .titre_page, .titre{ position: absolute; top: -100px; left: -70px; text-transform: uppercase; font-weight: bold; text-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 8px solid blue; background-color: white; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); padding: 0.5rem; background-color: white; } .titre_1{ margin-top:1em; } .next_edition{ font-style: italic; text-align: center; color:#009ee0ff; text-transform: uppercase; } .title { text-align: center; text-transform: uppercase; } /*start sections page accueil*/ /* START KEVIN */ /*START SECTION PROCHAINEMENT*/ .coming_soon{ width: 100%; } /* ALL thumbnails */ .thumbnails .__img{ height: 300px; } .thumbnails .__img img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .thumbnails .icone_cat{ width: 40px; height: 40px; border-radius: 40px; position: absolute; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-position: center; /* Center the image */ background-repeat: no-repeat; /* Do not repeat the image */ background-size: cover; /* Resize the background image to cover the entire container */ background-color: black; } .thumbnails .atelier_bois{ background-image: url("../images/atelier_couture.png"); } .thumbnails .atelier_couture_avec_saroj{ background-image: url("../images/atelier_couture.png"); } .thumbnails .atelier_tricot_solidaire{ background-image: url("../images/atelier_tricot.png"); } .thumbnails .bal_rock, .thumbnails .woodstroc{ background-image: url("../images/bal_rock.png"); } .thumbnails .chiner_concert{ background-image: url("../images/chiner_concert.png"); } .thumbnails .atelier_fab_lab{ background-image: url("../images/fab_lab.png"); } .thumbnails .la_mine_numerique{ background-image: url("../images/fab_lab.png"); } .thumbnails .gouter_melanie{ background-image: url("../images/gouter.png"); } .thumbnails .danse_orientale{ background-image: url('../images/bal_rock.png'); } .thumbnails .hatha_yoga{ background-image: url("../images/hatha_yoga.png"); } .thumbnails .mineside_jazz{ background-image: url("../images/mineside_jazz.png"); } .thumbnails .non_programmation{ background-image: url("../images/non_prog.png"); } .thumbnails .soiree_mine{ background-image: url("../images/soiree_mine.png"); } .thumbnails .zero_dechets { background-image: url("../images/zero_dechet.png"); } /* END SECTION PROCHAINEMENT */ /* SECTION ASSO */ #section_asso .association .__body{ position: relative; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-top: 50px; } .image_sectionasso { position: absolute; top: 0; left: 0; margin-top: 100px; width: 70%; } .content_asso { width: 70%; position: relative; padding: 20px 10px; background-color: white; border: 8px solid yellow; } /* START SECTION PROJETS*/ #section_projets{ margin-top: 300px; } .title_pjt{ color: #f51212ff; font-weight: bold; } /*END SECTION PROJETS*/ /* responsive iframe */ #section_MineVideo .wrapper__content { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .slide .video{ position: relative; width: 100%; padding-bottom: 50%; padding-top: 35px; height: 100%; overflow: hidden; } .slide .video iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #section_MineVideo .wrapper__content iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* END KEVIN */ /* .item { margin-top: 50px; } */ .wrap__content_proch { position: relative; width: calc(100% - 40px); margin: -4rem auto 0 auto; padding: 10px; min-height: 160px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; background-color: white; border: 4px solid black; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .colonne_section{ margin-top: 10px; } .colonne_section .wrap_content { border: 8px solid blue; padding: 1em; } .colonne_section h3 { color: blue; text-transform: uppercase; text-align: center; } .projet .colonne_section .header{ height: 80px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end ; } .projet .colonne_section .header h3{ text-align: center; width: 100%; } .item img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } ._content_tpsF { position: relative; width: 80%; padding: 10px; margin: -50px auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; background-color: white; border: 4px solid black; } /*fin sections page accueil*/ /*page collecte avec formulaire*/ /*trouver comment styliser les champs du formulaire*/ .af-submit-button{ position: relative; margin: 50px auto 10px auto; display:-webkit-box; display:-ms-flexbox; display:flex; border: 4px solid black; border-radius: 0%; text-align: center; padding: 5px; -webkit-transform: scale(1) rotate(0deg); -ms-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; -o-transition: transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } .af-submit-button:hover{ -webkit-transform: scale(1.1) rotate(-10deg); -ms-transform: scale(1.1) rotate(-10deg); transform: scale(1.1) rotate(-10deg); -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /*fin collecte et form*/ /*gestion des dots*/ .flickity-page-dots { bottom: 0px; } .flickity-page-dots .dot { width: 12px; height: 12px; opacity: 1; background: transparent; border: 2px solid white; } .flickity-page-dots .dot.is-selected { background: white; } /* dot home */ .hero .flickity-page-dots{ bottom: 30px; } /*fin gestion des dots*/ /* START KEVIN */ .hero{ width: 100%; height: 100vh; position: relative; } .hero .slide{ width: 100%; height: 100vh; overflow: hidden; } .hero .slide .image{ width: 100%; height: 100vh; } .hero .slide img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .hero .__head{ width: 100%; text-align: center; position: absolute; bottom: 60px; color: white; } .wrapper section > div { position: relative; } .tpsF .img{ width: 100%; height: 400px; } .tpsF .img img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } body.les-temps-forts #content section{ margin-top: 100px; } body.les-temps-forts .title, body.les-temps-forts .next_edition { color: #009ee0ff; text-align: left; } body.les-temps-forts .titre_page { border-color: #009ee0ff; } .projet .img{ height: 300px; } .projet .img img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .prive .images{ width: 100%; height: 600px; } .prive .img img{ width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } /* END KEVIN */ /*START MEDIA QUERIES*/ @media screen and (min-width: 200px) and (max-width: 1088px) { .titre_page, .titre{ top: -150px; left: 50%; -webkit-transform: rotate(-10deg) translateX(-50%); -ms-transform: rotate(-10deg) translateX(-50%); transform: rotate(-10deg) translateX(-50%); } .privacy-policy .article-h1{ top: 100px; left: 50%; -webkit-transform: rotate(-10deg) translateX(-50%); -ms-transform: rotate(-10deg) translateX(-50%); transform: rotate(-10deg) translateX(-50%); } .privacy-policy .article-body { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; } .other .header_other { left: 50%; } .article-content{ margin-top: 30px; } } @media only screen and (max-width : 320px) { /* Smartphone */ /*footer*/ .accueil .collecte, .accueil .adresse, .accueil .horaires { display: block; } .collecte, .horaires { display:none; } /*fin footer*/ } @media screen and (max-width : 768px){ article .__img_event{ max-height: 300px; } } @media screen and (min-width: 200px) and (max-width: 640px) { .image_sectionasso { display: none; width: 100%; } .content_asso { width: 100%; } } @media screen and (min-width: 200px) and (max-width: 755px) { .__chapeau, .titre_event{ margin-top: 20px; } } /*END MEDIA QUERIES*/ /* START FOOTER */ footer{ background-color: rgba(240, 240, 240, 240); width: 100%; padding: 50px 10px; margin-top: 100px; } /* footer .information > div > div{ margin: 0 20px; } */ footer > section{ margin-bottom: 20px; } footer .logo_lamine { /* max-width: 150px; */ height: auto; max-height: 150px; /* margin: 10px; */ } footer .logo_lamine a{ display: block; height: 100%; width: auto; } footer .logo_lamine img{ -o-object-fit: contain; object-fit: contain; } footer > .information > div > div { margin-bottom: 20px; } footer .reseaux_sociaux > div a > img{ display: block; width: 20px; height: 20px; margin-right: 5px; } footer .reseaux_sociaux img { vertical-align: baseline; -o-object-fit: contain; object-fit: contain; } /* START Mailchimp */ footer #mc_embed_signup label, footer #mc-embedded-subscribe{ padding: 7px 10px; background-color: white; border: 4px solid black; } footer .email{ width: 100%; padding: 7px 10px; background-color: #D8D8D8; border-bottom: 4px solid black; border-top: 4px solid black; border-left: none; border-right: none; } footer #mc_embed_signup_scroll p { margin: 0; } footer #mc_embed_signup_scroll{ align-items: baseline; background: white; } footer #mc_embed_signup_scroll label{ white-space: nowrap; font-weight: bold; } footer #mc_embed_signup_scroll input{ width: 100%; } footer #mc-embedded-subscribe:hover{ color: white; background-color: black; } footer #mc_embed_signup_scroll{ border: 4px solid black; } footer #mc_embed_signup_scroll > div > p{ white-space:nowrap; padding: 0 1rem; } footer #mc_embed_signup_scroll input.email{ border-left: 4px solid black; border-right: 4px solid black; border-top: 0; border-bottom: 0; } footer #mc_embed_signup .button{ border: none; border-radius: 0; } /* END MAILCHIMP */ /* START SLIDE */ footer .partenaires ._titre{ white-space: nowrap; font-weight: bold; margin: auto 50px auto 0px; } footer .partenaires{ width: 100%; } footer .container_slide li{ width: 80px; height: 80px; margin: 0 10px; } footer .partenaires img{ -o-object-fit: contain; object-fit: contain; } /* END SLIDE */ /* END FOOTER */ @media screen and (max-width: 576px) { footer p, footer a{ text-align: center; } footer a.d-flex{ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #Btn_asso a{ display: block; } .send_actu input{ text-align: center; } }