/* BANDEAU */ #bandeau {padding:0; position:fixed; left:0px; top:0px; width:100%; z-index:3000; } #global:not(.global-accueil).no-bandeau #bandeau { background: #5d6e75;} #bandeau .menu-wrapper {display:block !important; } #bandeau-mobile {display:none; } .lg {height:160px; } .sm {height:120px; } /* Bandeau réduit */ #bandeau.sm {background:rgba(93, 110, 117, 0.8); } #bandeau.sm #bandeau-conteneur { } #bandeau.sm #bandeau-contact {} #bandeau.sm #logo { width: 100px; height: 105px;} #bandeau.sm #logo a img { image-rendering: initial; } #bandeau.sm #bandeau-menu { margin: 0px;} #bandeau.sm #menu {} #bandeau.sm #menu .menu-element .menu-element-contenu > a > span > span, #bandeau.sm #menu .menu-element .menu-element-contenu > a:visited > span > span, #bandeau.sm #menu .menu-element .menu-element-contenu > span > span {} /* Bandeau non réduit */ #bandeau-conteneur {position: relative; z-index: 400; height:100%; width:100%; } #bandeau-contact {position:relative; z-index:40; height: 100%;} #bandeau-contact > .global { position:relative; z-index:40; height: 100%; display: grid; grid-template-columns: repeat(30, [col-start] 1fr);-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;} #bandeau-logo {grid-row:1; grid-column: col-start 1 / span 3; width: 100%; height: 100%; 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: start; -ms-flex-pack: start; justify-content: flex-start;} #bandeau-menu {grid-row:1; grid-column: col-start 4 / span 26; position: relative; z-index: 30; padding: 0 55px; height: 63px; box-sizing: border-box; background:#89bc41; display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #bandeau #logo { padding:9px 5px 4px 1px; position:relative; z-index:10; max-width: 100%; box-sizing:border-box;} #bandeau #logo a, #bandeau #logo a:visited {display:block; width: 100%; height: 100%; } #bandeau #logo a img {height:100%; width: auto; max-width:96px;} /* Elements du bandeau */ #bandeau-elements {display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #bandeau-elements .bandeau-contact {} #bandeau-elements .bandeau-contact a, #bandeau-elements .bandeau-contact a:visited {text-decoration:none; padding:5px 12px; font-size:17px; color:#fff; font-weight: 500; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #bandeau-elements .bandeau-contact i {display:block; width:26px; height:26px; margin-right: 7px; filter: invert(25%) sepia(21%) saturate(1462%) hue-rotate(66deg) brightness(90%) contrast(92%);} /* Telephone */ #bandeau-elements #bandeau-telephone {} #bandeau-elements #bandeau-telephone i { background:url(../images/icone-telephone-rond.svg) no-repeat center center; background-size:contain;} /* Email */ #bandeau-elements #bandeau-email {} #bandeau-elements #bandeau-email a, #bandeau-elements #bandeau-email a:visited {padding-right:0;} #bandeau-elements #bandeau-email a::before {display:block; content:""; width:2px; height:15px; background:#214f1b; margin: 0 20px 0 0;} #bandeau-elements #bandeau-email i {background:url(../images/icone-mail-rond.svg) no-repeat center center; background-size:contain;} /* MENU */ /* Menu niveau 1 */ #menu-conteneur { width: calc(100% - 310px); height: 100%; } #menu-wrapper {height:100%;} #menu {list-style:none; margin:0px auto; padding: 0; height:100%; } #menu > .global{padding:0; height:100%; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #menu .menu-element { display:inline-block; vertical-align:top; position:relative; z-index:30; height:100%; margin:0 25px; } #menu .menu-element:first-child {margin-left:0; } #menu .menu-element .menu-element-contenu {height:100%; position:relative; z-index:30;} #menu .menu-element .menu-element-contenu > i { display: none;} #menu .menu-element .menu-element-contenu > span { cursor:default; } #menu .menu-element .menu-element-contenu > a, #menu .menu-element .menu-element-contenu > a:visited { height:100%; 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; } #menu .menu-element .menu-element-contenu > a > span, #menu .menu-element .menu-element-contenu > a:visited > span, #menu .menu-element .menu-element-contenu > span {color: #214f1b; text-align: center; height:100%; 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; } #menu .menu-element .menu-element-contenu > a > span> span, #menu .menu-element .menu-element-contenu > a:visited > span> span, #menu .menu-element .menu-element-contenu > span > span { font-size:23px; position:relative; padding: 5px 0; font-weight:300; height: calc(100% - 15px); -webkit-box-sizing:border-box; box-sizing:border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align:center; -ms-flex-align:center; align-items:center;} #menu .menu-element.menu-grand {} #menu .menu-element.menu-grand .menu-element-contenu > a > span, #menu .menu-element.menu-grand .menu-element-contenu > span {padding:0px 0 1px; } #menu .menu-element .menu-element-contenu > a, #menu .menu-element .menu-element-contenu > a:visited {text-decoration:none; } #menu .menu-element .menu-element-contenu > a:hover {text-decoration:none; } /** SINON **/ #menu .menu-element.selected .menu-element-contenu > span, #menu .menu-element.selected .menu-element-contenu > a > span {color:#fff;} #menu .menu-element:hover .smenu-conteneur { animation : affichageSousMenu 300ms linear 350ms 1 forwards; } @keyframes affichageSousMenu { from { visibility: hidden; opacity: 0; } to { visibility: visible; opacity: 1; } } /* Sous menu niveau 1 */ #menu .smenu-conteneur {visibility: hidden; opacity: 0; position:absolute; left:0px; z-index:200; width:350px; min-height:20px; background: #e0ecf1; padding:20px; box-sizing:border-box;} #menu .smenu-conteneur .global {padding:0 !important; } #menu .smenu-bas {} #menu .smenu-centre { margin:0 !important; padding:0 !important; list-style:none; width:100%; text-align: left; } #menu .smenu-centre-menus {padding:0 10px; } #menu .smenu-element { } #menu .smenu-image {width:37px; height:37px; margin-right:10px; background:#fff; border-radius:65px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align:center; -ms-flex-align:center; align-items:center;} #menu .smenu-image img {width:27px; height:27px; object-fit:contain; } #menu .smenu-contenu {} #menu .smenu-element .smenu-contenu > span { cursor:default; } #menu .smenu-element .smenu-contenu > a {text-decoration:none; } #menu .smenu-element .smenu-contenu > a > span, #menu .smenu-element .smenu-contenu > span {color:#5d6e75; text-align:left; padding:10px 5px 5px; width: 100%; font-size: 20px; font-weight:400; position: relative; z-index: 2; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align:center; -ms-flex-align:center; align-items:center; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -khtml-box-sizing:border-box; } #menu .smenu-element:first-child .smenu-contenu > a > span, #menu .smenu-element:first-child .smenu-contenu> span {border:none; } #menu .smenu-element .smenu-contenu > a > span::after, #menu .smenu-element .smenu-contenu > span::after {content:"\f105"; font-family:FontAwesome; font-size:21px; color:#5d6e75; margin-left: 0; opacity:0; right:25px; top: 0; height: 100%; -webkit-transition: margin 300ms ease 0ms; -moz-transition: margin 300ms ease 0ms; -ms-transition: margin 300ms ease 0ms; -o-transition: margin 300ms ease 0ms; transition: margin 300ms ease 0ms; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #menu .smenu-element.selected .smenu-contenu > span, #menu .smenu-element.selected .smenu-contenu > a > span, #menu .smenu-element:hover .smenu-contenu > a > span, #menu .smenu-element:hover .smenu-contenu > span {color:#89bc41; } #menu .smenu-element.selected .smenu-contenu > a > span::after, #menu .smenu-element.selected .smenu-contenu > span::after, #menu .smenu-element:hover .smenu-contenu > a > span::after, #menu .smenu-element:hover .smenu-contenu > span::after {opacity:1; margin-left:10px;} /* Sous menu niveau 2 */ #menu .ssmenu-conteneur {padding:0px; margin:0px; } #menu .ssmenu-element {} #menu .ssmenu-element > span { cursor:default; } #menu .ssmenu-element > a {text-decoration:none; } #menu .ssmenu-element > a > span, #menu .ssmenu-element > span {color:#5d6e75; padding:2px 5px ; font-weight:400; font-size:16px; position:relative; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; align-items:center; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -khtml-box-sizing:border-box; width: calc(100% - 20px); margin-left: 0px; -webkit-transition: margin 300ms ease 0ms; -moz-transition: margin 300ms ease 0ms; -ms-transition: margin 300ms ease 0ms; -o-transition: margin 300ms ease 0ms; transition: margin 300ms ease 0ms;} #menu .ssmenu-element > a > span::after, #menu .ssmenu-element > span::after {content:"\f105"; font-family:FontAwesome; font-size:21px; color:#89bc41; margin-left:10px; opacity:0; right:25px; top: 0; height: 100%; -webkit-transition: margin 300ms ease 0ms; -moz-transition: margin 300ms ease 0ms; -ms-transition: margin 300ms ease 0ms; -o-transition: margin 300ms ease 0ms; transition: margin 300ms ease 0ms; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #menu .ssmenu-element.selected > span, #menu .ssmenu-element:hover > span , #menu .ssmenu-element.selected > a > span, #menu .ssmenu-element:hover > a > span {color:#89bc41; margin-left:10px; } #menu .ssmenu-element.selected > a > span::after, #menu .ssmenu-element.selected > span::after, #menu .ssmenu-element:hover > a > span::after, #menu .ssmenu-element:hover > span::after {opacity:1; } #menu #menu-23 {position:initial;} #menu #smenu-23 { padding: 30px 40px; left:unset !important; right:0; width:100%;} #menu #smenu-23 .smenu-centre-menus { display: -ms-grid; display: grid; -ms-grid-columns: 30% 15px 30% 15px 30%; grid-template-columns: repeat(3, 32%); -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; grid-gap: 15px;} #menu #smenu-23 .smenu-element { width:100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start;} #menu #smenu-23 .smenu-contenu {width:calc(100% - 56px);} #menu #smenu-23.scrollable {height: calc(100vh - 130px);} #menu #smenu-23.scrollable .smenu-centre, #menu #smenu-23.scrollable .smenu-centre-menus {height: 100%; box-sizing: border-box;} #menu #smenu-23.scrollable .smenu-centre {overflow-y:auto; overflow-x: hidden;} @media all and (max-width:1540px) { #menu #smenu-23 {padding: 30px 20px;} } @media all and (max-width:1410px) { #bandeau-menu { grid-column: col-start 5 / span 26;} } @media all and (max-width:1375px) { #menu .menu-element { margin: 0 18px;} } @media all and (max-width:1300px) { #bandeau-menu { padding: 0 30px;} } @media all and (max-width:1215px) { #menu .menu-element .menu-element-contenu > a > span > span, #menu .menu-element .menu-element-contenu > a:visited > span > span, #menu .menu-element .menu-element-contenu > span > span {font-size:21px;} } @media all and (max-width:1193px) { #menu .menu-element { margin: 0 13px;} #menu #smenu-23 {padding: 25px 15px;} } @media all and (max-width:1120px) { #bandeau:not(.sm) #menu-conteneur {width:100%;} #bandeau:not(.sm) #bandeau-elements { position: absolute; top: -40px; right: 20px;} #bandeau:not(.sm) #bandeau-elements .bandeau-contact i {filter: invert(60%) sepia(78%) saturate(347%) hue-rotate(43deg) brightness(98%) contrast(87%);} #bandeau:not(.sm) #bandeau-elements #bandeau-email a::before { background:#89bc41;} #bandeau:not(.sm) #menu > .global { justify-content: space-around;} #bandeau:not(.sm) #menu .menu-element:first-child {margin-left: 13px;} } @media all and (max-width:1090px) { #bandeau.sm #bandeau-contact > .global { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end;} #bandeau.sm #bandeau-menu { margin: 10px 0; } #bandeau.sm #menu > .global { justify-content: space-around;} #bandeau.sm #menu-conteneur {width:100%;} #bandeau.sm #bandeau-elements { position: absolute; top: -45px; right: 20px;} #bandeau.sm #bandeau-elements .bandeau-contact i {filter: invert(60%) sepia(78%) saturate(347%) hue-rotate(43deg) brightness(98%) contrast(87%);} #bandeau.sm #bandeau-elements #bandeau-email a::before { background:#89bc41;} } @media all and (max-width:990px) { #menu #smenu-23 {padding:10px 15px;} #menu #smenu-23 .smenu-centre-menus { -ms-grid-columns: 50% 15px 50%; grid-template-columns: repeat(2, 50%); grid-gap: 15px;} } @media all and (max-width:845px) { /* Bandeau */ .noscroll #bandeau-haut, .noscroll #bandeau-contact #logo, .noscroll #bandeau-contact #bandeau-elements {display:none; } #bandeau.sm #bandeau-conteneur {height:auto; } /* Si telephone et mail restent dans le bandeau en sm */ #bandeau.sm #bandeau-contact { position: absolute; right: 0; top: 0; width: calc(100% - 50px); height: 35px; z-index: 400; transition:unset; } #bandeau.sm #bandeau-contact #logo {display:none; } #bandeau.sm #bandeau-elements {position: absolute; top: -35px; right: 10px; z-index: 200; height: 35px; } #bandeau.sm #bandeau-elements .bandeau-element {height: 100%; overflow: hidden; } #bandeau.sm #bandeau-elements #bandeau-telephone, #bandeau.sm #bandeau-elements #bandeau-email {height:auto; } #bandeau.sm #bandeau-mobile {height: 28px; width: 25px; left: 5px; top: 0px; padding: 3px 5px; } #bandeau.sm #bandeau-menu {margin:0;} .lg { height: 160px; } .sm { height: 35px; border:none; } #bandeau-contact {opacity:1; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } #bandeau-contact > .global {display:block; } #bandeau:not(.sm) #bandeau-logo { height: auto; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;} #bandeau #logo { padding:3px 0 0; margin:0 auto; width: 73px; height: auto;} #bandeau #logo a img {height:auto; width:100%; margin: 0 auto; } #bandeau:not(.sm) #bandeau-elements { position: relative; top: unset; right: unset;} #bandeau #bandeau-menu {background: none; width: 100%; padding: 0; margin: 5px 0 0; height: calc(100% - 120px); justify-content: flex-end;} /* bas */ /* Menu mobile */ #bandeau-mobile {min-width: inherit; width: 75px; height: 30px; padding: 5px; margin: 0px; position: absolute; left: 5px; bottom: 2px; z-index: 99999; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #bandeau-mobile.open {left: 10px; top: 0; bottom:unset; } #bandeau-mobile.open span, #bandeau.sm #bandeau-mobile span {display:none; } #bandeau-mobile span {color: #fff; text-transform: uppercase; font-size: 17px; } #bandeau-mobile .hamburger {position: relative; display: inline-block; width: 24px; height: 1px; color: #000; font: bold 14px/.4 Helvetica; text-transform: uppercase; text-indent: -55px; background: #fff; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; } #bandeau-mobile .hamburger::before, #bandeau-mobile .hamburger::after { content: ''; width: 24px; height: 1px; background: #fff; position: absolute; left: 0; -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out; } #bandeau-mobile .hamburger::before { top: -9px; } #bandeau-mobile .hamburger::after { bottom: -9px; } #bandeau-mobile .hamburger.active { background: #fff; left: 0px; } #bandeau-mobile .hamburger.active::before {background: #37342a; top: 0; -webkit-transform: rotateZ(45deg); -moz-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -o-transform: rotateZ(45deg); transform: rotateZ(45deg); } #bandeau-mobile .hamburger.active::after {background: #37342a; bottom: 0; -webkit-transform: rotateZ(-45deg); -moz-transform: rotateZ(-45deg); -ms-transform: rotateZ(-45deg); -o-transform: rotateZ(-45deg); transform: rotateZ(-45deg); } #bandeau #menu-conteneur { padding: 0; position: fixed; z-index: 9999; top: 0; left: 0; height: 100% !important; width: calc(100% - 45px); background: #fff; -webkit-transition: transform 0.5s; -khtml-transition: transform 0.5s; -moz-transition: transform 0.5s; -ms-transition: transform 0.5s; -o-transition: transform 0.5s; transition: transform 0.5s; -webkit-transform: translateX(-100%); -khtml-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); overflow: hidden; } #bandeau #menu-conteneur.open {display: block; -webkit-transform: translateX(0%); -khtml-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } #bandeau #menu-wrapper {box-sizing: border-box; padding: 0 10px 10px; overflow-y: auto; margin-top: 40px; height:calc(100% - 50px); scrollbar-color: #5d6e75 #fff; scrollbar-width: thin; } #menu > .global {padding: 30px 10px 0; display:block; width:100%; box-sizing: border-box; } #menu .menu-element, #menu .menu-element.menu-grand {height:auto !important; margin:10px 0px 0 !important; display:block; padding:0 0 10px 5px; border-bottom:1px solid #edecec; } #menu .menu-element .menu-element-contenu {display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-pack:start; -ms-flex-pack:start; justify-content:flex-start; -webkit-box-align:center; -ms-flex-align:center; align-items:center;} #menu .menu-element .menu-element-contenu > i { cursor:pointer; display: block; color: #89bc41; font-size: 22px; margin-left: 20px; } #menu .menu-element .menu-element-contenu > a > span, #menu .menu-element .menu-element-contenu > a:visited > span, #menu .menu-element .menu-element-contenu > span, #menu .menu-element.menu-grand .menu-element-contenu > a > span, #menu .menu-element.menu-grand .menu-element-contenu > span > span { padding:5px; text-align:left;} #menu .menu-element br {display:none; } #menu .menu-element .menu-element-contenu > a > span > span, #menu .menu-element .menu-element-contenu > a:visited > span > span, #menu .menu-element .menu-element-contenu > span > span { font-size: 19px;} #menu .menu-element .menu-element-contenu > a > span::after, #menu .menu-element .menu-element-contenu > span::after {display:none !important; } #menu .menu-element.selected .menu-element-contenu > a > span, #menu .menu-element.selected .menu-element-contenu > span { } #menu .menu-element.selected .menu-element-contenu > a > span > span, #menu .menu-element.selected .menu-element-contenu > span > span {color:#5d6e75; font-weight: 400; } #menu .menu-element:hover .smenu-conteneur { -webkit-animation-play-state:paused; -moz-animation-play-state:paused; animation-play-state:paused; } #menu .smenu-conteneur {margin-top:6px; width:100%; padding:0; visibility: visible; opacity: 1; position:relative; left:0 !important; top:0 !important; background:none; min-height: 0; display:none;} #menu .smenu-centre {border:none; margin:0; width:auto; } #menu .ssmenu-conteneur-images {display:none !important; } #menu .smenu-centre-menus {float:none; width:auto; border-radius: 0; padding:0 ; } #menu .smenu-image {display:none;} #menu .smenu-conteneur .smenu-element{display:block; width:auto; } #menu .smenu-element .smenu-contenu > a > span, #menu .smenu-element .smenu-contenu > span {font-size: 18px; padding: 5px 10px; min-height: 0; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;} #menu .smenu-element > a, #menu .smenu-element > a:hover {text-decoration:none; } #menu .smenu-element .smenu-contenu > a > span::after, #menu .smenu-element .smenu-contenu > span::after {transition:none; color:#fff; } #menu .smenu-element.selected > a > span, #menu .smenu-element:hover > a > span, #menu .smenu-element.selected > span, #menu .smenu-element:hover > span {background:#89bc41; color:#fff; } #menu .ssmenu-element > a > span, #menu .ssmenu-element > span {padding:5px 0 5px 20px; } #menu #smenu-23 {padding: 0;} #menu #smenu-23.scrollable {height:auto;} #menu #smenu-23.scrollable .smenu-centre { overflow: hidden;} #menu #smenu-23 .smenu-centre-menus { display: block; height: auto !important;} #menu #smenu-23 .smenu-contenu {width:100%;} } @media all and (max-width:450px) { #bandeau-contact > .global { padding:0 5px;} #bandeau-mobile { bottom: unset; top: 5px; width: 65px; } #bandeau-mobile span {font-size: 15px; } #bandeau #bandeau-menu {justify-content: center;} #bandeau:not(.sm) #bandeau-elements { width: calc(100% - 20px); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;} } @media all and (max-width:380px) { #bandeau-elements .bandeau-contact a, #bandeau-elements .bandeau-contact a:visited { padding: 5px 7px;} #bandeau-elements .bandeau-contact i {width: 22px; height: 22px;} #bandeau-elements #bandeau-email a::before { margin: 0 10px 0 0;} #bandeau.sm #bandeau-elements #bandeau-email span {display: none;} }