/*
 * Copy this file into your theme to customize it.
 * https://www.phpboost.com/wiki/structure-d-un-theme#paragraph-le-repertoire-theme
 *
 * Contains links menu properties for menus built with MenuMaker
*/

/* --- General classes ------------------------------------------------------ */
.cssmenu { font-size: 0; }

.cssmenu,
.cssmenu ul,
.cssmenu li {
	position: relative;
	margin: 0;
	list-style: none;
	line-height: normal;
	left: auto;
	display: block;
}

.cssmenu::after,
.cssmenu > ul::after {
	display: block;
	visibility: hidden;
	height: 0;
	content: "";
	line-height: 0;
	clear: both;
}

.small-screen .cssmenu-img { display: none; }

.cssmenu-img {
	display: inline-block;
	margin-left: 1.309rem;
}

.cssmenu-horizontal .cssmenu-img {
	vertical-align: bottom;
	margin-right: 0.618rem;
}

.cssmenu .menu-with-img { display: inline-block; }

.cssmenu-horizontal > ul > li > ul { min-width: 100%; }

.cssmenu li:hover > .cssmenu-title { text-decoration: none; }

.cssmenu-title {
	padding: 0.456em 0.618em;
	font-size: 1.482rem;
	white-space: nowrap;
	font-weight: 400;
	text-align: left;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.cssmenu-vertical > ul > li > .cssmenu-title { white-space: normal; }

.small-screen .cssmenu-title { white-space: normal; }

.cssmenu-title img + span,
.cssmenu-title i + span,
.cssmenu-title span + span { margin-left: 0.456em; }


/* --- Item classes --------------------------------------------------------- */
.cssmenu-horizontal { display: table; }

.cssmenu-horizontal > ul > li {
	display: inline-block;
	vertical-align: middle;
}

.cssmenu-vertical li,
.cssmenu-actionslinks li { display: block; }

/* --- Sub-menu Indicator --- */
.cssmenu-horizontal li > .cssmenu-title { padding: 0.618em; }

.cssmenu-horizontal ul li.has-sub > .cssmenu-title,
.cssmenu-vertical.cssmenu-left ul li.has-sub > .cssmenu-title { padding-right: 1.618em; }

.cssmenu-right ul li.has-sub > .cssmenu-title { padding-left: 1.618em; }

.cssmenu ul li.has-sub > .cssmenu-title::after,
.cssmenu-right ul li.has-sub > .cssmenu-title:before {
	position: absolute;
	display: inline-block;
	content: '';
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	font-size: 1rem;
	top: 50%;
	transform: translateY(-40%);
}

.cssmenu ul li.has-sub > .cssmenu-title::after {
	right: 0.809em;
	content: '\f067';
	transition: 0.2s;
}

.cssmenu-right ul li.has-sub > .cssmenu-title::after { content: ''; }

.cssmenu-right ul li.has-sub > .cssmenu-title:before {
	left: 0.809em;
	content: '\f067';
}

.cssmenu ul li.has-sub:hover > .cssmenu-title::after {
	content: '\f068';
	transition: 0.2s;
}

.cssmenu-right ul li.has-sub:hover > .cssmenu-title::after { content: ''; }

.cssmenu-right ul li.has-sub:hover > .cssmenu-title:before { content: '\f068'; }

/* --- Sub-menu position --- */
.cssmenu ul ul {
	position: absolute;
	left: -9999px;
	z-index: 10000;
}

.cssmenu li:hover > ul                      { left: auto ;            }
.cssmenu-horizontal li:hover > ul           { left: 0;     top: 100%; }
.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;    }

.small-screen li:hover > ul                 { left: 0;                }
.cssmenu-right.small-screen li:hover > ul   { right: 0;               }
.cssmenu-left.small-screen li:hover > ul    { left: 0;                }

/* Uncomment to unfold the last top-level item to the left for an horizontal menu */
/*
.cssmenu-horizontal > ul > li:hover:last-child > ul {
	left: auto;
	right: 0;
}

.cssmenu-horizontal > ul > li:hover:last-child > ul li:hover > ul {
	left: auto;
	right: 100%;
}
*/

/* --- Small screens  ------------------------------------------------------- */
/* change the viewport limit in /templates/__default__/framework/menus/links.tpl on line 38 */

.small-screen,
.small-screen ul,
.small-screen ul li {
	display: block;
	width: 100%;
}

.cssmenu-actionslinks.small-screen ul { top: 100%; }

.cssmenu.small-screen ul ul,
.small-screen ul ul ul {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	margin: 0;
	border: none;
}

.cssmenu.small-screen ul ul,
.small-screen ul ul ul,
.cssmenu-vertical.small-screen .cssmenu-title { text-align: left; }

.cssmenu-horizontal.small-screen ul ul li:hover > ul,
.cssmenu-left.small-screen li:hover > ul {
    top: 0;
	left: 0;
}

.close {
	left: -9999px !important;
	height: 0;
	overflow: hidden;
}

.small-screen ul li .cssmenu-title,
.small-screen ul ul li .cssmenu-title,
.cssmenu-actionslinks.small-screen ul li .cssmenu-title {
	padding: 0.618em;
	width: 100%;
}

.small-screen ul ul li .cssmenu-title  { padding-left: 1em; }

.small-screen ul ul ul li .cssmenu-title,
.cssmenu-actionslinks.small-screen ul li ul li ul li .cssmenu-title  { padding-left: 1.618em; }

.small-screen ul ul ul ul li .cssmenu-title { padding-left: 2em; }

.small-screen ul ul ul ul ul li .cssmenu-title { padding-left: 2.618em; }

/* --- Small screens button --- */
.menu-button {
	display: none;
	position: relative;
	font-size: 1.482rem;
}

.small-screen .menu-button,
.cssmenu-actionslinks .menu-button {
	display: block;
	padding: 0.618em 1.618em 0.618em 0.618em;
	text-transform: uppercase;
	font-weight: 400;
	cursor: pointer;
	font-size: 1.309rem;
	text-align: left;
}

.small-screen .menu-button::after {
	position: absolute;
	padding: 0.618em;
	display: inline-block;
	content: '\f0c9';
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	font-size: 1.482rem;
	right: 0;
	top: 0;
}

.small-screen .menu-button.menu-opened::after { content: '\f00d'; }

/* --- Small screens sub-menu button --- */
.cssmenu.small-screen ul li.has-sub > .cssmenu-title::after,
.cssmenu-right.small-screen ul li.has-sub > .cssmenu-title:before { display: none; }

.small-screen .submenu-button {
	position: absolute;
	z-index: 99;
	right: 0;
	top: 0;
	display: block;
	cursor: pointer;
}

.small-screen .submenu-button::after {
	position: absolute;
	display: block;
	content: '\f0d7';
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	font-size: 1.482rem;
	right: 0;
	top: 0;
	padding: 0.618em;
}

.small-screen ul ul .submenu-button::after {
	top: 0.309em;
	font-size: 1.306rem;
	padding: 0.456em;
}

.small-screen .submenu-button.submenu-opened::after { content: '\f0d8'}


/* --- Cssmenu-actionslinks variant ----------------------------------------- */
.cssmenu-actionslinks {
	float: right;
	margin: 0.809rem 0.809rem 2.809rem 3.618rem;
}

.cssmenu-actionslinks .menu-button {
	display: block;
	font-size: 0;
	z-index: 9;
}

.cssmenu-actionslinks .menu-button::after {
	position: absolute;
	display: block;
	font-family: 'Font Awesome 6 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;
}

.cssmenu-actionslinks:hover .menu-button::after { border-bottom-width: 0; }

.cssmenu-actionslinks ul {
	position: absolute;
	z-index: 10;
	top: 2.309rem;
	min-width: 200px;
	left: -9999px;
}

.cssmenu-actionslinks .menu-button:hover + ul,
.cssmenu-actionslinks .menu-button + ul:hover {
	left: auto;
	right: -1px;
}

.cssmenu-actionslinks.small-screen .menu-button { font-size: 1.228rem; }

.cssmenu-actionslinks.small-screen {
	margin: 0;
	float: none;
}

.cssmenu-actionslinks.small-screen .menu-button::after {
	content: '\f013';
	border-width: 0;
	padding: 0.618em;
	font-size: 1.309rem;
}

.cssmenu-actionslinks.small-screen .menu-button.menu-opened::after { content: '\f00d'; }

.cssmenu-actionslinks.small-screen .menu-button:hover + ul,
.cssmenu-actionslinks.small-screen .menu-button + ul:hover {
	left: -9999px;
	right: 0;
}

.cssmenu-actionslinks.small-screen .menu-button + ul.open,
.cssmenu-actionslinks.small-screen .menu-button + ul:hover.open {
	left: auto;
	position: relative;
	width: 100%;
}

.cssmenu-actionslinks.small-screen.cssmenu-right .cssmenu-title { text-align: left; }

.cssmenu-actionslinks.small-screen ul ul .cssmenu-title { padding-left: 0.618em; }

.cssmenu-actionslinks.small-screen ul li.has-sub > .submenu-button,
.cssmenu-actionslinks.small-screen ul li.has-sub > .cssmenu-title  { display: none; }


/* --- Small screens cssmenu-tools variant ----------------------------------- */
.cssmenu-tools.small-screen { height: auto; }

.cssmenu-tools.small-screen li.has-sub > a,
.cssmenu-tools.small-screen li.has-sub > .submenu-button { display: block; }

.cssmenu-tools .menu-button::after { content: "\f0c9"; }


/* --- Cssmenu-group variant ------------------------------------------------ */
.cssmenu-group {
	text-align: center;
	margin-bottom: 1.618rem;
}

.cssmenu-group li { display: inline-block; }

.cssmenu-group .cssmenu-title {
	font-size: 1.456rem;
	padding: 0.309em;
	border-width: 1px 0 1px 1px;
	border-style: solid;
	border-color: transparent;
	font-weight: 300;
	text-decoration: none;
}

.cssmenu-group li:last-child .cssmenu-title { border-right-width: 1px; }

.cssmenu-group .cssmenu-title-icon { padding: 0 0.618em 0 0.809em; }

.cssmenu-group .cssmenu-title.cssmenu-title-icon {
	padding: 6px 6px 7px;
	border-width: 1px 0 1px 1px;
}

/* --- Small screens cssmenu-group variant --- */
.cssmenu-group.small-screen ul li .cssmenu-title { padding: 0.309em 0.618em; }


/* --- Cssmenu-static variant ----------------------------------------------- */
.cssmenu-static > ul > li {
	display: inline-block;
	vertical-align: top;
	padding: 0 0.618em;
}

.cssmenu-static ul li.has-sub > .cssmenu-title::after,
.cssmenu-static ul li.has-sub > .cssmenu-title:before { display: none; }

.cssmenu-static > ul > li > .cssmenu-title {
	margin: 0 0 0.618em 0;
	font-size: 1.618rem;
	font-weight: bold;
	text-align: center;
}

.cssmenu-static ul ul {
	position: relative;
	left: 0;
	z-index: 0;
}

.cssmenu-static ul ul > li > .cssmenu-title { padding: 0.228em 1.618em 0.228em 0.618em; }

.cssmenu-static ul ul ul > li > .cssmenu-title { padding: 0.228em 1.618em; }


/* --- Small screens cssmenu-static --- */
.cssmenu-static.small-screen > ul > li > .cssmenu-title {
    text-align: left;
	margin: 0;
}

.cssmenu-static.small-screen .submenu-button::after { content: '\f0d8'; }
.cssmenu-static.small-screen .submenu-button.submenu-opened::after { content: '\f0d7'; }
