Untitled diff

Created Diff never expires
761 removals
961 lines
309 additions
508 lines
/* --------------------------------------
/* --------------------------------------
cssmenu.css
cssmenu.css
Contient les elements associes aux menus
Contient les elements associes aux menus
-----------------------------------------*/
-------------------------------------- */
/* --- Module-mini --- */
/* ------------------- */
.cssmenu-content .module-mini-contents {
padding: 0;
}
/* -- Classes multi niveau -- */
/* -------------------------- */
/* --- Classes generales cssmenu --- */
/* -- Classes generales cssmenu -- */
/* ------------------------------- */
.cssmenu {
.cssmenu {
font-size: 0;
font-size: 0;
}
}
.cssmenu,
.cssmenu,
.cssmenu ul,
.cssmenu ul,
.cssmenu ul li,
.cssmenu li {
.cssmenu ul li .cssmenu-title {
position: relative;
position: relative;
margin: 0;
margin: 0;
list-style: none;
list-style: none;
line-height: 1;
line-height: normal;
left: auto;
left: auto;
}
.cssmenu { display: block; }
header .cssmenu { display: inline-block; }
@media (min-width: 769px) {
#sub-header-content .cssmenu {
height: 43px;
}
}
.cssmenu ul,
.cssmenu ul li,
.cssmenu ul li .cssmenu-title {
display: block;
display: block;
}
}
.cssmenu:after,
.cssmenu:after,
.cssmenu > ul:after {
.cssmenu > ul:after {
display: block;
display: block;
visibility: hidden;
visibility: hidden;
height: 0;
height: 0;
content: "";
content: "";
line-height: 0;
line-height: 0;
clear: both;
clear: both;
}
}
.cssmenu-img {
.cssmenu-img {
display: inline-block;
display: none;
}
@media (max-width: 768px) {
.cssmenu > .cssmenu-img {
display: none;
}
.cssmenu-img {
padding: 0px 5px 0px 0px;
}
}
}
@media (min-width: 769px) {
@media (min-width: 769px) {
.cssmenu-img {
.cssmenu-img {
padding: 10px 0 0 5px;
display: inline-block;
vertical-align: top;
margin-left: 1.309rem;
}
}
}
.cssmenu-img-level-0 ~ ul.level-0 {
.cssmenu .menu-with-img {
display: inline-block;
display: inline-block;
}
.close {
left: -9999px !important;
height: 0;
overflow: hidden;
}
#menu-left .cssmenu { margin-right: -9px; }
#menu-right .cssmenu { margin-left: -9px; }
#menu-left .cssmenu.small-screen { margin-right: 0; }
#menu-right .cssmenu.small-screen { margin-left: 0; }
.cssmenu li:hover > .cssmenu-title {
text-decoration: none;
}
.cssmenu .cssmenu-title img {
margin: 0 5px 0 0;
vertical-align: bottom;
}
.cssmenu.small-screen {
width: 100%;
}
.cssmenu.small-screen ul {
display: block;
width: 100%;
}
.cssmenu.small-screen ul li {
width: 100%;
border-top: 1px solid rgba(120, 120, 120, 0.2);
}
.cssmenu.small-screen > ul > li:last-child.has-sub {
border-bottom: 1px solid rgba(120, 120, 120, 0.2);
}
.cssmenu.small-screen ul ul li,
.cssmenu.small-screen li:hover > ul > li {
height: auto;
}
.cssmenu.small-screen ul li .cssmenu-title,
.cssmenu.small-screen ul ul li .cssmenu-title {
padding: 17px;
width: 100%;
border-bottom: 0;
}
.cssmenu.small-screen ul ul li .cssmenu-title {
padding: 11px;
}
@media (max-width: 768px) {
.cssmenu.small-screen .cssmenu-img-level-0 + div {
padding: 10px 40px 5px 17px;
}
}
}
/* --- Variante cssmenu-horizontal --- */
.module-mini-top img {
#main .cssmenu-horizontal {}
margin: 0 0.309em 0 0;
}
/* --- Variante cssmenu-group --- */
div.cssmenu-group {
position: relative;
display: inline-block;
padding: 2px 8px;
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 0%,rgba(56, 56, 56, 0.18) 100%);
background-color: #FFFFFF;
border: 1px solid #999999;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) #B3B3B3 rgba(0, 0, 0, 0.25);
color: #444444;
cursor: pointer;
}
}
div.cssmenu-group .cssmenu-title {
.cssmenu li:hover > .cssmenu-title {
color: #444444;
font-size: 1.2rem;
font-weight: 300;
text-decoration: none;
text-decoration: none;
}
}
.cssmenu-group.small-screen {
.cssmenu-title {
margin: 0 0 5px 0;
padding: 0.456em 1.618em 0.456em 0.618em;
}
font-size: 1.482rem;
white-space: normal;
/* --- Variante cssmenu-actionslinks --- */
font-weight: 400;
.cssmenu-actionslinks {
margin: 0 0 20px 0;
}
.cssmenu-actionslinks {
float: right;
margin: 0 5px 5px 5px;
}
.cssmenu-actionslinks.small-screen {
float: none;
margin: 0;
}
.cssmenu.cssmenu-actionslinks ul li .cssmenu-title,
.cssmenu.cssmenu-actionslinks ul li ul li .cssmenu-title {
padding: 5px;
border: none;
font-weight: normal;
font-size: 11px;
}
.cssmenu-actionslinks.small-screen ul li {
border: none;
}
.cssmenu.cssmenu-actionslinks.small-screen ul li .cssmenu-title,
.cssmenu.cssmenu-actionslinks.small-screen ul li ul li .cssmenu-title {
padding: 15px 5px;
cursor: pointer;
}
/* --- Autres variantes --- */
@media (min-width: 769px) {
#cssmenu-galleryfilter ul {
min-width: 130px;
}
}
.cssmenu.cssmenu-static li.has-sub > .cssmenu-title:after,
.cssmenu.cssmenu-static li.has-sub > .cssmenu-title:before {
display: none;
}
/* -- Classes Niveau 1 -- */
/* ---------------------- */
/* --- Classes generales cssmenu --- */
.cssmenu > ul > li {
float: left;
}
#sub-header .cssmenu-horizontal > ul > li {
position: relative;
border-right: 1px solid #444444;
}
#sub-header .cssmenu-horizontal > ul > li:after {
position:absolute;
right: 1%;
top: 50px;
height: 100%;
width: 1px;
border-right: 1px solid #333333;
}
#main .cssmenu-horizontal > ul > li:last-child,
#sub-header .cssmenu-horizontal > ul > li:last-child {
border-bottom: none;
}
#main .cssmenu-horizontal > ul > li:last-child:after,
#sub-header .cssmenu-horizontal > ul > li:last-child:after {
width: 0;
height: 0;
}
#main .cssmenu-horizontal > ul > li {
position: relative;
border-right: 1px solid #EFEFEF;
}
#main .cssmenu-horizontal > ul > li:last-child {
border-right: none;
}
#main .cssmenu-horizontal.small-screen > ul > li {
border-right: none;
}
#main .cssmenu-horizontal > ul > li:after {
position:absolute;
right: 1%;
top: 50px;
height: 100%;
width: 1px;
border-right: 1px solid #EEEEEE;
}
.cssmenu-left > ul > li,
.cssmenu-right > ul > li {
float: none;
text-align: left;
text-align: left;
}
.cssmenu > ul > li > .cssmenu-title {
padding: 17px;
font-size: 12px;
font-weight: 700;
letter-spacing: 1px;
}
/* --- Indicateur de sous menu --- */
.cssmenu > ul > li.has-sub > .cssmenu-title {
padding-right: 30px;
}
.cssmenu > ul > li.has-sub > .cssmenu-title:after,
.cssmenu > ul > li.has-sub > .cssmenu-title:before {
position: absolute;
display: block;
display: block;
content: '';
}
.cssmenu > ul > li.has-sub > .cssmenu-title:after {
width: 8px;
height: 2px;
}
.cssmenu > ul > li.has-sub > .cssmenu-title:before {
width: 2px;
height: 8px;
transition: all 0.25s ease;
}
.cssmenu > ul > li.has-sub:hover > .cssmenu-title:before {
height: 0;
}
.cssmenu-vertical > ul > li > .cssmenu-title {
padding: 8px 20px 8px 10px;
}
}
@media (min-width: 769px) {
@media (min-width: 769px) {
.cssmenu-title {
white-space: nowrap;
}
.cssmenu-vertical > ul > li > .cssmenu-title {
.cssmenu-vertical > ul > li > .cssmenu-title {
padding: 6px 20px 6px 10px;
white-space: normal;
}
}
}
}
.cssmenu > ul > li.has-sub > .cssmenu-title:after { top: 22px; right: 11px; }
.cssmenu-title img {
.cssmenu > ul > li.has-sub > .cssmenu-title:before { top: 19px; right: 14px; }
display: inline-block;
.cssmenu > ul > li.has-sub:hover > .cssmenu-title:before { top: 23px; }
margin-right: 0.1618em;
@media (min-width: 769px) {
.cssmenu-vertical > ul > li.has-sub > .cssmenu-title:after { top: 11px; }
.cssmenu-vertical > ul > li.has-sub > .cssmenu-title:before { top: 8px; }
}
}
/* --- Position des sous menu --- */
.cssmenu li:hover > ul { left: auto ; }
aside .cssmenu-left li:hover > ul { left: 100% ; top: 0; }
aside .cssmenu-right li:hover > ul { right: 100%; top: 0; }
aside .cssmenu-left.cssmenu-static li:hover > ul { left: 0; top: 0; }
aside .cssmenu-right.cssmenu-static li:hover > ul { right: 0; top: 0; }
.cssmenu.cssmenu-actionslinks li:hover > ul { right: 0; top: 100%; }
.cssmenu.cssmenu-actionslinks ul li:hover > ul { right: 100%; top: 0; }
.cssmenu.small-screen li:hover > ul { left: 0; }
.cssmenu.cssmenu-right.small-screen li:hover > ul { right: 0; }
.cssmenu.cssmenu-left.small-screen li:hover > ul { left: 0; }
/* --- Variante cssmenu-group --- */
/* -- Classes Items -- */
.cssmenu-group > ul {
/* --------------------*/
text-align: center;
.cssmenu-horizontal > ul > li {
font-size: 0;
}
.cssmenu-group > ul > li {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 0%,rgba(56, 56, 56, 0.18) 100%);
background-color: #FFFFFF;
border: 1px solid #999999;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) #B3B3B3 rgba(0, 0, 0, 0.25);
color: #444444;
cursor: pointer;
}
.cssmenu.cssmenu-group > ul > li {
display: inline-block;
display: inline-block;
float: none;
vertical-align: middle;
}
.cssmenu.cssmenu-group > ul > li:hover {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 40%,rgba(56, 56, 56, 0.18) 100%);
background-color: #F0F0F0;
border-bottom-color: #B3B3B3;
}
.cssmenu-group > ul > li:first-child {
border-left: 1px solid rgba(0, 0, 0, 0.1);
}
.cssmenu-group > ul > li:last-child {
border-right: 1px solid rgba(0, 0, 0, 0.1);
}
.cssmenu-group > ul > li.current {
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.18) 0%,rgba(56, 56, 56, 0.18) 100%);
background-color: #F0F0F0;
border-top-color: #B3B3B3;
}
}
.cssmenu.cssmenu-group > ul > li > .cssmenu-title {
.cssmenu-vertical li,
padding: 4px 12px;
.cssmenu-actionslinks li {
color: #444444;
display: block;
font-size: 1.1rem;
font-weight: 300;
text-decoration: none;
}
}
.cssmenu-group.small-screen > ul.open {
/* --- Indicateur de sous menu --- */
display: table !important;
.cssmenu-horizontal > ul > li >.cssmenu-title {
margin: auto;
padding: 0.618em 1.618em 0.618em 0.618em;
width: auto;
}
}
.cssmenu-group.small-screen > ul > li,
.cssmenu-right li.has-sub > .cssmenu-title {
.cssmenu-group.small-screen > ul > li:hover {
padding-left: 1.618em;
float: left;
width: auto;
background: transparent;
border: none;
clear: both;
}
}
.cssmenu.cssmenu-group.small-screen > ul > li > .cssmenu-title {
.cssmenu ul li.has-sub > .cssmenu-title:after,
padding: 10px 12px;
.cssmenu-right ul li.has-sub > .cssmenu-title:before {
position: absolute;
display: inline-block;
content: '';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 1rem;
top: 50%;
transform: translateY(-40%);
}
}
/* --- Variante cssmenu-actionslinks --- */
.cssmenu ul li.has-sub > .cssmenu-title:after {
.cssmenu-actionslinks.small-screen > ul > li:last-child {
right: 1em;
padding: 0 0 10px 0;
content: '\f067';
border-bottom: 1px solid rgba(120, 120, 120, 0.2);
transition: 0.2s;
}
}
.cssmenu.cssmenu-static li > .cssmenu-title {
.cssmenu-right ul li.has-sub > .cssmenu-title:after {
border: none;
content: '';
}
}
.cssmenu.cssmenu-static > ul > li > .cssmenu-title {
.cssmenu-right ul li.has-sub > .cssmenu-title:before {
text-align: center;
left: 1em;
content: '\f067';
}
}
/* --- Variante cssmenu-static --- */
.cssmenu ul li.has-sub:hover > .cssmenu-title:after {
.cssmenu.cssmenu-static > ul > li {
content: '\f068';
padding: 0 10px 0 10px;
transition: 0.2s;
}
}
footer .cssmenu.cssmenu-static > ul > li { border-right: 1px solid #2A2A2A; }
.cssmenu-right ul li.has-sub:hover > .cssmenu-title:after {
#top-footer .cssmenu.cssmenu-static > ul > li { border-right: 1px solid #DDDDDD; }
content: '';
footer .cssmenu.cssmenu-static > ul > li:last-child,
#top-footer .cssmenu.cssmenu-static > ul > li:last-child {
border-right: none;
}
}
.cssmenu.cssmenu-static > ul > li > .cssmenu-title {
.cssmenu-right ul li.has-sub:hover > .cssmenu-title:before {
margin: 0 0 20px 0;
content: '\f068';
padding-bottom: 5px;
border-bottom: 1px solid #25466C;
font-size: 17px;
font-weight: bold;
}
}
/* --- Position des sous menu --- */
/* -- Classes Niveau 2 -- */
/* ---------------------- */
/* --- Classes generales cssmenu --- */
.cssmenu ul ul {
.cssmenu ul ul {
position: absolute;
position: absolute;
left: -9999px;
left: -9999px;
z-index: 10;
z-index: 10;
}
}
.cssmenu ul ul li {
.cssmenu li:hover > ul { left: auto ; }
height: 0;
.cssmenu-horizontal li:hover > ul { left: 0; top: 100%; }
transition: all 0.25s ease;
.cssmenu-horizontal ul ul li:hover > ul,
}
.cssmenu-left li:hover > ul { left: 100% ; top: 0; }
.cssmenu-right li:hover > ul { right: 100%; top: 0; }
.cssmenu-left.cssmenu-static li:hover > ul { left: 0; top: 0; }
.cssmenu-right.cssmenu-static li:hover > ul { right: 0; top: 0; }
.cssmenu-actionslinks li:hover > ul { right: 0; top: 100%; }
.cssmenu-actionslinks ul li:hover > ul { right: 100%; top: 0; }
.cssmenu ul ul ul { top: 0; }
.cssmenu li:hover > ul > li {
.small-screen li:hover > ul { left: 0; }
height: auto;
.cssmenu-right.small-screen li:hover > ul { right: 0; }
vertical-align: middle;
.cssmenu-left.small-screen li:hover > ul { left: 0; }
}
.cssmenu ul ul ul {
top: 0;
}
.cssmenu ul ul li .cssmenu-title {
padding: 11px 15px;
font-size: 12px;
}
.cssmenu ul ul li .cssmenu-title {
padding: 8px 20px 8px 10px;
border-bottom: 1px solid rgba(150, 150, 150, 0.15);
white-space: nowrap;
}
@media (min-width: 769px) {
/* --- Decommenter pour déplier le dernier item de rang 1 vers la gauche pour un menu horizontal --- */
.cssmenu ul ul li .cssmenu-title {
/*
padding: 6px 20px 6px 10px;
.cssmenu-horizontal > ul > li:hover:last-child > ul {
}
left: auto;
right: 0;
}
}
/* --- Indicateur de sous menu --- */
.cssmenu-horizontal > ul > li:hover:last-child > ul li:hover > ul {
.cssmenu ul ul li:last-child > .cssmenu-title,
left: auto;
.cssmenu ul ul li.last-item > .cssmenu-title {
right: 100%;
border-bottom: 0;
}
}
*/
.cssmenu ul ul li.has-sub > .cssmenu-title:after,
/* -- Small screens - change the viewprot limit in /templates/default/framework/menus/link.tpl -- */
.cssmenu ul ul li.has-sub > .cssmenu-title:before {
/* ---------------------------------------------------------------------------------------------- */
position: absolute;
.small-screen,
.small-screen ul,
.small-screen ul li {
display: block;
display: block;
content: '';
width: 100%;
}
.cssmenu ul ul li.has-sub > .cssmenu-title:after {
width: 8px;
height: 2px;
}
}
.cssmenu ul ul li.has-sub > .cssmenu-title:before {
.cssmenu-actionslinks.small-screen ul {
width: 2px;
top: 100%;
height: 8px;
transition: all .25s ease;
}
.cssmenu ul ul li.has-sub > .cssmenu-title:after { top: 13px; right: 11px; }
.cssmenu ul ul li.has-sub > .cssmenu-title:before { top: 10px; right: 14px; }
@media (min-width: 769px) {
.cssmenu.cssmenu-vertical ul ul li.has-sub > .cssmenu-title:after { top: 11px; right: 11px; }
.cssmenu.cssmenu-vertical ul ul li.has-sub > .cssmenu-title:before { top: 8px; right: 14px; }
}
.cssmenu ul ul > li.has-sub:hover > .cssmenu-title:before {
top: 17px;
height: 0;
}
.cssmenu.small-screen ul ul li.has-sub > .cssmenu-title:after,
.cssmenu.small-screen ul ul li.has-sub > .cssmenu-title:before {
display: none;
}
.cssmenu.small-screen ul.level-1 li .cssmenu-title {
padding-left: 25px;
}
.cssmenu.small-screen ul.level-2 li .cssmenu-title,
.cssmenu.cssmenu-actionslinks.small-screen ul li ul li ul li .cssmenu-title {
padding-left: 35px;
}
.cssmenu.small-screen ul.level-3 li .cssmenu-title {
padding-left: 45px;
}
.cssmenu.small-screen ul.level-4 li .cssmenu-title {
padding-left: 55px;
}
.cssmenu.small-screen ul ul li .cssmenu-title {
background: none;
}
}
.cssmenu.small-screen ul ul,
.cssmenu.small-screen ul ul,
.cssmenu.small-screen ul ul ul {
.small-screen ul ul ul {
position: relative;
position: relative;
top: 0;
left: 0;
left: 0;
width: 100%;
width: 100%;
margin: 0;
margin: 0;
border: none;
border: none;
text-align: left;
}
}
/* --- Variantes --- */
.cssmenu.small-screen ul ul,
.cssmenu-horizontal ul ul ul {
.small-screen ul ul ul,
margin-left: 100%;
.cssmenu-vertical.small-screen .cssmenu-title {
text-align: left;
}
}
.cssmenu-vertical ul ul {
.cssmenu-horizontal.small-screen ul ul li:hover > ul,
position: relative;
.cssmenu-left.small-screen li:hover > ul {
top: 0;
left: 0;
}
}
aside .cssmenu-vertical ul ul {
.close {
position: absolute;
left: -9999px !important;
margin-top: -1px;
height: 0;
border: 1px solid #BEBEBE;
overflow: hidden;
}
}
header .cssmenu-vertical ul ul li .cssmenu-title,
.small-screen ul li .cssmenu-title,
#main .cssmenu-vertical ul ul li .cssmenu-title {
.small-screen ul ul li .cssmenu-title,
padding: 5px 15px;
.cssmenu-actionslinks.small-screen ul li .cssmenu-title {
padding: 0.309em 0.618em;
width: 100%;
width: 100%;
border-bottom: none;
}
}
.cssmenu-static ul ul {
.small-screen ul ul li .cssmenu-title {
position: relative;
padding-left: 1em;
left: 0;
z-index: 0;
}
}
.cssmenu-static ul ul li {
.small-screen ul ul ul li .cssmenu-title,
height: auto;
.cssmenu-actionslinks.small-screen ul li ul li ul li .cssmenu-title {
padding-left: 1.618em;
}
}
.cssmenu-static ul ul ul {
.small-screen ul ul ul ul li .cssmenu-title {
margin-left: 0;
padding-left: 2em;
}
}
.cssmenu.cssmenu-static ul ul > li > .cssmenu-title {
.small-screen ul ul ul ul ul li .cssmenu-title {
padding-left: 10px;
padding-left: 2.618em;
}
}
.cssmenu.cssmenu-static ul ul ul > li > .cssmenu-title {
/* --- Responsive button --- */
padding-left: 20px;
.menu-button {
display: none;
position: relative;
font-size: 1.482rem;
}
}
.cssmenu-actionslinks ul li.has-sub .cssmenu-title:after { top: 9px; }
.small-screen .menu-button,
.cssmenu-actionslinks ul li.has-sub .cssmenu-title:before { top: 6px; }
.cssmenu-actionslinks .menu-button {
display: block;
padding: 0.618em 1.618em 0.618em 0.618em;
/* -- Personnalisation graphique -- */
text-transform: uppercase;
/* -------------------------------- */
font-weight: 400;
cursor: pointer;
/* --- Niveau 1 --- */
font-size: 1.309rem;
#top-header .cssmenu > ul > li > .cssmenu-title { color: #444444; }
text-align: left;
#sub-header .cssmenu > ul > li > .cssmenu-title { color: #DDDDDD; }
.cssmenu.cssmenu-vertical > ul > li > .cssmenu-title { color: #444444; }
#main .cssmenu > ul > li > .cssmenu-title { color: #444444; }
.cssmenu-actionslinks > ul > li > .cssmenu-title { color: #666666; }
footer .cssmenu-static > ul > li > .cssmenu-title { color: #DDDDDD; }
#top-footer .cssmenu-static > ul > li > .cssmenu-title { color: #444444; }
#top-header .cssmenu > ul > li:hover > .cssmenu-title { color: #FFFFFF; }
header .cssmenu li:hover > .cssmenu-title { color: #FFFFFF; }
.cssmenu.cssmenu-vertical li:hover > .cssmenu-title { color: #666666; }
#main .cssmenu li:hover > .cssmenu-title { color: #666666; }
@media (min-width: 769px) {
header .cssmenu-horizontal > ul > li:hover { background-color: #333333; }
#main .cssmenu-horizontal > ul > li:hover { background-color: #F1F1F1; }
}
}
/* --- Niveau 2 --- */
.small-screen .menu-button:after {
.cssmenu ul ul li .cssmenu-title { color: #DDDDDD; }
position: absolute;
#main .cssmenu ul ul li .cssmenu-title { color: #333333; }
padding: 0.618em;
.cssmenu.cssmenu-vertical ul ul li .cssmenu-title { color: #333333; }
display: inline-block;
.cssmenu-actionslinks li ul li .cssmenu-title { color: #666666; }
content: '\f0c9';
aside .cssmenu-static li ul li .cssmenu-title,
font-family: 'Font Awesome 5 Free';
#top-footer .cssmenu-static li ul li .cssmenu-title { color: #666666; }
font-weight: 900;
font-size: 1.482rem;
right: 0;
top: 0;
}
.cssmenu ul ul li:hover > .cssmenu-title { color: #333333; }
.small-screen .menu-button.menu-opened:after {
header .cssmenu ul ul li:hover > .cssmenu-title { color: #FFFFFF; }
content: '\f00d';
#main .cssmenu ul ul li:hover > .cssmenu-title { color: #555555; }
}
.cssmenu.cssmenu-vertical ul ul li:hover > .cssmenu-title { color: #555555; }
.cssmenu-actionslinks li:hover > .cssmenu-title { color: #333333; }
footer .cssmenu-static ul ul li:hover > .cssmenu-title { color: #FFFFFF; }
#top-footer .cssmenu-static ul ul li:hover > .cssmenu-title { color: #262626; }
.cssmenu.cssmenu-vertical ul ul li .cssmenu-title { background-color: #FFFFFF; }
.cssmenu-actionslinks ul li:hover > .cssmenu-title:after { background-color: #333333; }
header .cssmenu ul ul li .cssmenu-title { background-color: #333333; }
/* --- Responsive submenu button --- */
.cssmenu-actionslinks li:hover > .cssmenu-title { background-color: #DDDDDD; }
.cssmenu.small-screen ul li.has-sub > .cssmenu-title:after,
.cssmenu-actionslinks.small-screen li:hover > .cssmenu-title { background-color: transparent;}
.cssmenu-right.small-screen ul li.has-sub > .cssmenu-title:before {
#main .cssmenu-horizontal ul ul { background-color: #F9F9F9; }
#main .cssmenu-horizontal ul ul > li:hover { background-color: #F1F1F1; }
#cssmenu-galleryfilter ul ul li .cssmenu-title { background-color: #FFFFFF; }
#cssmenu-galleryfilter ul ul li:hover .cssmenu-title { background-color: #DDDDDD; }
/* --- Personnalisation de l'indicateur de sous-Menu --- */
.cssmenu li.has-sub > .cssmenu-title:after,
.cssmenu li.has-sub > .cssmenu-title:before { background-color: #DDDDDD; }
.cssmenu-vertical li.has-sub > .cssmenu-title:after,
.cssmenu-vertical li.has-sub > .cssmenu-title:before { background-color: #444444; }
/* -- Bouton responsive -- */
/* ----------------------- */
/* --- Classes generales cssmenu --- */
.cssmenu .menu-button {
display: none;
display: none;
position: relative;
list-style: none;
line-height: 1;
font-size: 1.2rem;
}
}
.cssmenu .menu-button:before {
.small-screen .submenu-button {
font-size: 1.3rem;
position: absolute;
}
z-index: 99;
right: 0;
.cssmenu.small-screen .menu-button {
top: 0;
display: block;
display: block;
padding: 17px 40px 17px 17px;
text-transform: uppercase;
font-weight: 700;
cursor: pointer;
cursor: pointer;
}
}
#top-footer .cssmenu.small-screen .menu-button {
.small-screen .submenu-button:after {
color: #444444;
}
.cssmenu.small-screen .menu-button:after,
.cssmenu.small-screen .menu-button:before {
position: absolute;
position: absolute;
display: block;
display: block;
content: '';
content: '\f0d7';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 1.482rem;
right: 0;
top: 0;
padding: 0.618em;
}
}
.cssmenu.small-screen .menu-button:after {
.small-screen ul ul .submenu-button:after {
height: 4px;
top: 0.309em;
width: 20px;
font-size: 1.306rem;
border-width: 2px 0 2px 0;
padding: 0.456em;
border-style: solid;
}
}
.cssmenu.small-screen .menu-button:before {
.small-screen .submenu-button.submenu-opened:after { content: '\f0d8'}
height: 2px;
width: 20px;
background-color: #DDDDDD;
/* -- Cssmenu-actionslinks variant -- */
font-size: 1.3rem;
/* ---------------------------------- */
.cssmenu-actionslinks {
float: right;
margin: 0.809rem 0.809rem 2.809rem 3.618rem;
}
}
.cssmenu.small-screen .menu-button.menu-opened:after {
.cssmenu-actionslinks .menu-button {
height: 2px;
display: block;
border: 0;
transform: rotate(45deg);
}
}
.cssmenu.small-screen .menu-button.menu-opened:before {
.cssmenu-actionslinks .menu-button:after {
transform: rotate(-45deg);
position: absolute;
display: block;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 1.482rem;
content: "\f013";
top: 0;
right: 0;
padding: 0.228em 0.618em;
border-width: 1px;
border-style: solid;
border-color: transparent;
}
}
/* --- Position du bouton --- */
.cssmenu-actionslinks:hover .menu-button:after {
.cssmenu.small-screen .menu-button:after { top: 22px; right: 17px; }
border-bottom-width: 0;
.cssmenu.small-screen .menu-button:before { top: 16px; right: 17px; }
}
.cssmenu.small-screen .menu-button.menu-opened:after,
.cssmenu.small-screen .menu-button.menu-opened:before { top: 23px; width: 15px; }
/* --- Variante cssmenu-actionslinks --- */
.cssmenu-actionslinks ul {
.cssmenu .menu-button:before {
position: absolute;
font-size: 1.3rem;
z-index: 10;
top: 2.309rem;
min-width: 200px;
left: -9999px;
}
}
.cssmenu-actionslinks .menu-button {
.cssmenu-actionslinks .menu-button:hover + ul,
float: right;
.cssmenu-actionslinks .menu-button + ul:hover {
position: relative;
left: auto;
display: inline-block;
right: -1px;
padding: 4px 12px 4px 12px;
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%,rgba(56,56, 56, 0.1) 100%);
background-color: #FFFFFF;
border: 1px solid #999999;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) #B3B3B3 rgba(0, 0, 0, 0.25);
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
color: #444444;
text-align: center;
cursor: pointer;
-webkit-font-smoothing: antialiased;
}
}
@media (min-width: 769px) {
@media (min-width: 769px) {
.cssmenu-actionslinks .menu-button {
.cssmenu-actionslinks .menu-button {
font-size: 0;
font-size: 0;
}
z-index: 9;
.cssmenu-actionslinks:hover .menu-button {
z-index: 11;
margin-bottom: 1px;
background-image: none;
border-width: 1px 1px 0 1px;
border-color: #AAAAAA;
}
}
}
}
#main .cssmenu-actionslinks.small-screen .menu-button {
/* --- Cssmenu-actionslinks small-screen variant --- */
.cssmenu-actionslinks.small-screen {
margin: 0;
float: none;
float: none;
background-color: transparent;
background-image: none;
border: none;
font-family: "Trebuchet MS",Verdana,"Bitstream Vera Sans",Times,serif;
text-align: left;
}
}
.cssmenu-actionslinks .menu-button + ul {
.cssmenu-actionslinks.small-screen .menu-button:after {
left: -9999px;
content: '\f0c9';
border-width: 0;
padding: 0.618em;
}
}
.cssmenu-actionslinks .menu-button:hover + ul,
.cssmenu-actionslinks.small-screen .menu-button.menu-opened:after {
.cssmenu-actionslinks .menu-button + ul:hover{
content: '\f00d';
left: auto;
}
}
.cssmenu-actionslinks.small-screen .menu-button:hover + ul,
.cssmenu-actionslinks.small-screen .menu-button:hover + ul,
.cssmenu-actionslinks.small-screen .menu-button + ul:hover {
.cssmenu-actionslinks.small-screen .menu-button + ul:hover {
left: -9999px;
left: -9999px;
right: 0;
}
}
.cssmenu-actionslinks.small-screen .menu-button + ul.open,
.cssmenu-actionslinks.small-screen .menu-button + ul.open,
.cssmenu-actionslinks.small-screen .menu-button + ul:hover.open {
.cssmenu-actionslinks.small-screen .menu-button + ul:hover.open {
left: auto;
left: auto;
}
position: relative;
width: 100%;
.cssmenu-actionslinks .menu-button:before {
content: "\f013";
}
.cssmenu-tools .menu-button:before {
content: "\f0c9";
}
}
.cssmenu-actionslinks ul {
.cssmenu-actionslinks.small-screen.cssmenu-right .cssmenu-title {
position: absolute;
text-align: left;
z-index: 10;
right: 0;
top: 21px;
padding: 5px 0;
width: 170px;
background-color: #FFFFFF;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
border: 1px solid #AAAAAA;
font-size: 11px;
}
}
.cssmenu-actionslinks.small-screen ul {
.cssmenu-actionslinks.small-screen ul ul .cssmenu-title {
top: 100%;
padding-left: 0.618em;
border: none;
box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
}
.cssmenu-actionslinks.small-screen li.has-sub > a,
.cssmenu-actionslinks.small-screen ul li.has-sub > .submenu-button,
.cssmenu-actionslinks.small-screen li.has-sub > .submenu-button {
.cssmenu-actionslinks.small-screen ul li.has-sub > .cssmenu-title {
display: none;
display: none;
}
}
.cssmenu-actionslinks.small-screen li.has-sub > ul {
display: block !important;
/* -- Cssmenu-tools variant small-screen -- */
padding: 0;
/* ---------------------------------------- */
.cssmenu-tools.small-screen {
height: auto;
}
}
/* --- Variante tools --- */
.cssmenu-tools.small-screen li.has-sub > a,
.cssmenu-tools.small-screen li.has-sub > a,
.cssmenu-tools.small-screen li.has-sub > .submenu-button {
.cssmenu-tools.small-screen li.has-sub > .submenu-button {
display: block;
display: block;
}
}
/* --- Variante Static --- */
.cssmenu-tools .menu-button:after {
.cssmenu-static.small-screen .menu-button {
content: "\f0c9";
cursor: default;
}
}
.cssmenu-static.small-screen .menu-button:after,
.cssmenu-static.small-screen .menu-button:before {
/* -- Cssmenu-group variant -- */
display: none;
/* --------------------------- */
.cssmenu-group {
text-align: center;
margin-bottom: 1.618rem;
}
}
.cssmenu-static.small-screen ul li {
.cssmenu-group li {
border-top: none;
display: inline-block;
}
}
.cssmenu-static.small-screen > ul > li > .cssmenu-title,
.cssmenu-group .cssmenu-title {
.cssmenu-static.small-screen ul ul > li > .cssmenu-title {
font-size: 1.309rem;
padding-bottom: 5px;
padding: 0.309em;
border-width: 1px 0 1px 1px;
border-style: solid;
border-color: transparent;
font-weight: 300;
text-decoration: none;
}
}
/* --- Personnalisation graphique du bouton responsive--- */
.cssmenu-group li:last-child .cssmenu-title {
.cssmenu.small-screen .menu-button:after {
border-right-width: 1px;
border-color: #DDDDDD;
}
}
#main .cssmenu.small-screen .menu-button {
/* --- Variante cssmenu-group small-screen --- */
color: #111111;
.cssmenu-group.small-screen ul li .cssmenu-title {
padding: 0.309em 0.618em;
}
}
.cssmenu.small-screen .menu-button:before { background-color: #DDDDDD; }
.cssmenu.small-screen .menu-button.menu-opened:after,
.cssmenu.small-screen .menu-button.menu-opened:before { background-color: #DDDDDD; }
header .cssmenu.small-screen .menu-button.menu-opened:after,
header .cssmenu.small-screen .menu-button.menu-opened:before { background-color: #FFFFFF; }
header .cssmenu-vertical.small-screen .menu-button.menu-opened:after,
header .cssmenu-vertical.small-screen .menu-button.menu-opened:before { background-color: #DDDDDD; }
header .cssmenu-tools.small-screen .menu-button.menu-opened:after,
header .cssmenu-tools.small-screen .menu-button.menu-opened:before { background-color: #DDDDDD; }
/* -- Bouton submenu -- */
/* -- Variantes cssmenu-statique -- */
/* -------------------- */
/* -------------------------------- */
.cssmenu-static > ul > li {
/* --- Classes generales cssmenu --- */
display: inline-block;
.cssmenu.small-screen > ul > li.has-sub > .cssmenu-title:before,
vertical-align: top;
.cssmenu.small-screen > ul > li.has-sub > .cssmenu-title:after {
display: none;
}
}
.cssmenu.small-screen .submenu-button {
.cssmenu-static > ul > li > .cssmenu-title {
position: absolute;
text-align: center;
z-index: 99;
right: 0;
top: 0;
display: block;
height: 46px;
width: 46px;
border-left: 1px solid rgba(120, 120, 120, 0.2);
cursor: pointer;
}
}
.cssmenu.small-screen ul ul .submenu-button {
.cssmenu-static ul li.has-sub > .cssmenu-title:after,
height: 34px;
.cssmenu-static ul li.has-sub > .cssmenu-title:before {
width: 34px;
display: none;
}
}
.cssmenu.small-screen .submenu-button:after,
.cssmenu-static > ul > li {
.cssmenu.small-screen .submenu-button:before {
padding: 0 0.618em;
position: absolute;
display: block;
content: '';
}
}
.cssmenu.small-screen .submenu-button:after {
.cssmenu-static > ul > li > .cssmenu-title {
width: 8px;
margin: 0 0 0.618em 0;
height: 2px;
font-size: 1.618rem;
font-weight: bold;
}
}
.cssmenu.small-screen .submenu-button:before {
.cssmenu-static ul ul {
width: 2px;
position: relative;
height: 8px;
left: 0;
z-index: 0;
}
}
.cssmenu.small-screen .submenu-button.submenu-opened:before {
.cssmenu-static ul ul > li > .cssmenu-title {
display: none;
padding: 0.228em 1.618em 0.228em 0.618em;
}
}
.cssmenu-actionslinks.small-screen .submenu-button {
.cssmenu-static ul ul ul > li > .cssmenu-title {
height: 31px;
padding: 0.228em 1.618em;
width: 31px;
border: none;
}
}
/* --- Variante Static --- */
.cssmenu-static.small-screen .submenu-button,
.cssmenu-static.small-screen .submenu-button:after,
.cssmenu-static.small-screen .submenu-button:before {
display: none;
}
.cssmenu-static.small-screen ul ul,
/* --- Variante Static small-screen --- */
.cssmenu-static.small-screen ul ul ul {
.cssmenu-static.small-screen > ul > li > .cssmenu-title {
display: block !important;
text-align: left;
margin: 0;
}
}
/* --- Personnalisation background Bouton submenu --- */
.cssmenu-static.small-screen .submenu-button:after { content: '\f0d8'}
.cssmenu.small-screen .submenu-button:after { background-color: #DDDDDD; }
.cssmenu-static.small-screen .submenu-button.submenu-opened:after { content: '\f0d7'}
.cssmenu.small-screen .submenu-button:before { background-color: #DDDDDD; }
.cssmenu.small-screen .submenu-button.submenu-opened:after { background-color: #FFFFFF; }
.cssmenu.small-screen .submenu-button.submenu-opened { background-color: #262626; }
#top-header .cssmenu.small-screen .submenu-button.submenu-opened { background-color: rgba(255, 255, 255, 0.05); }
.cssmenu-actionslinks.small-screen .submenu-button.submenu-opened { background-color: #DDDDDD; }
#menu-left .cssmenu.small-screen .submenu-button.submenu-opened { background-color: rgba(120, 120, 120, 0.2); }
#menu-right .cssmenu.small-screen .submenu-button.submenu-opened { background-color: rgba(120, 120, 120, 0.2); }
/* --- Postion icone Submenu --- */
.cssmenu.small-screen .submenu-button:after { top: 22px; right: 19px; }
.cssmenu.small-screen .submenu-button:before { top: 19px; right: 22px; }
.cssmenu.small-screen ul ul .submenu-button:after { top: 15px; right: 13px; }
.cssmenu.small-screen ul ul .submenu-button:before { top: 12px; right: 16px; }
.cssmenu-actionslinks.small-screen .submenu-button:after { top: 14px; right: 11px; }
.cssmenu-actionslinks.small-screen .submenu-button:before { top: 11px; right: 14px; }