
.numerik1 .page-container {
  margin: 0px;
  padding: 0px;
}

.numerik1 .page-container:before, .numerik1 .page-container:after { display: table; content: " "; }
.numerik1 .page-container:after { clear: both; }

.numerik1 .page-content {
	min-height: 100vh;
	margin-left: 100px;
	margin-top: 0px;

  padding-top: calc(5rem + 1rem);
	padding-bottom: 40px;
}

/* Sidebar menu */
.numerik1 .smenucontainer {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100px;
  height: 100%;
  background: #000000;
}

.numerik1 .smenu {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100px;
  height: 100%;
  padding: .4em 0;

  color: #ffffff;
  text-align: center;
  font-size: 0;
}
.numerik1 .smenu li {
  pointer-events: none;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  list-style: none;
  line-height: 100%;
	letter-spacing: 0px;
  transform: translateZ(0);
}
.numerik1 .smenu > li { display: block; }
.numerik1 .smenu a {
  pointer-events: auto;
  position: relative;
  display: block;
  min-width: 5em;
  margin-bottom: 0;
  padding: .2em .3em;
  line-height: 100%;
  transition: background 0.3s;

  font-size: 14px;
  text-decoration: none;
  color: white;
  text-transform: uppercase;
}

.numerik1 .smenu a .small { font-size: 12px; }

.numerik1 .smenu a:active, .numerik1 .smenu a:focus { background-color: #B44659; }
.numerik1 .smenu i {
  display: block;
  margin-bottom: .2em;
  font-size: 2.2em;
}

/* top-level links */
.numerik1 .smenu > li > a { background: #000000; color: #ffffff; }
.numerik1 .smenu > li a.active { color: #ffffff; }

/* Submenus - Stack below the top level */
.numerik1 .smenu > li > ul {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 100%;
  height: 100%;
  width: auto;
  white-space: nowrap;
  /* Close the menus */
  transform: translateX(-100%);
  /* background: #f1f1f1; */

  -webkit-transition: 0.5s transform;
          transition: 0.5s transform;
}

/* Subsubmenus */
.numerik1 .smenu > li > ul > li > ul {
	position: absolute;

	-webkit-transition: all 0.8s ease;
	        transition: all 0.8s ease;

	opacity: 0;
	width: 0px;
	overflow: hidden;
}
.numerik1 .smenu > li > ul > li > a { margin-bottom: 0; }


.numerik1 .smenu > li.active > ul {
  /* Open the fly-out menu */
  transform: translateX(0);
  /* background: #f1f1f1; */
}
.numerik1 .smenu > li.active { z-index: 100; }
.numerik1 .smenu > li.active a { background-color: #0C70C2; }

.numerik1 .smenu > li.active > ul > li.active > ul { opacity: 1; width: auto; overflow: visible; }

/* *** */
.numerik1 .smenu > li > ul { pointer-events: none; }
.numerik1 .smenu > li.active > ul { pointer-events: auto; }

.numerik1 .smenu > li > ul li { pointer-events: none; }
.numerik1 .smenu > li.active > ul li { pointer-events: auto; }

.numerik1 .smenu > li > ul a { pointer-events: none; }
.numerik1 .smenu > li.active > ul a { pointer-events: auto; }
/* *** */

/* customization */
.numerik1 .smenu > li > a { min-height: 5rem; padding: 0.5rem 0; }
.numerik1 .smenu > li > ul > li > a,
.numerik1 .smenu > li > ul > li > ul > li > a { width: 110px; min-height: 5rem; padding: 0.5rem 0; }

.numerik1 .smenu li.smenu_logo a						{ background-color: #000000; border: .3em solid #000000; vertical-align: middle; height: calc(5rem + 2px); padding: 0; }
.numerik1 .smenu > li.active.smenu_logo > a { border: .3em solid #000000; }

.numerik1 .smenu li.smenu_users a						{ background-color: #292929; border: .3em solid #292929; }
.numerik1 .smenu li.smenu_contacts a				{ background-color: #414042; border: .3em solid #414042; }
.numerik1 .smenu li.smenu_cartes a					{ background-color: #58595b; border: .3em solid #58595b; }

.numerik1 .smenu li.smenu_lang a				{ background-color: #6d6e70; border: .3em solid #6d6e70; }
.numerik1 .smenu li.smenu_lang > ul > li > ul > li > a { background-color: #6d6e70; border: .3em solid #6d6e70; }
.numerik1 .smenu li.smenu_lang > ul > li > ul > li > a:hover { border: .3em solid var(--global-color-vw3-red); }

.numerik1 .smenu li.smenu_lang > ul > li > ul.smenu_content { left: -200%; }

.numerik1 .smenu li.smenu_signout { position: absolute; bottom: 0; width: 100%; }
.numerik1 .smenu li.smenu_signout > a.smenu_sync									{ background-color: #232323; border: .3em solid var(--global-color-vw3-red); padding: .7rem 0; }
.numerik1 .smenu li.smenu_signout > a.smenu_logout								{ background-color: var(--global-color-vw3-red); border: .3em solid var(--global-color-vw3-red); }
.numerik1 .smenu > li.active.smenu_signout > a.smenu_sync:hover		{ border: .3em solid #232323; }
.numerik1 .smenu > li.active.smenu_signout > a.smenu_logout:hover	{ border: .3em solid #414042; }
.numerik1 .smenu li.smenu_signout .smenu_username { font-size: 11px; margin-top: .2rem; }

.numerik1 .smenu > li.active > ul > li:first-child > a:before {
	/* Show the shadow when the top-level link is hovered over */
  content: "";
  position: absolute;
  z-index: 1;
  width: 8px;
  top: 0;
  height: 100%;
  left: -12px;
  border-radius: 5px / 100px;
  box-shadow: 4px 2px 10px rgba(0,0,0,0.8);
}

.numerik1 .smenu > li.smenu_lang.active > ul > li > ul { width: 760px; white-space: normal; text-align: left; }
.numerik1 .smenu > li.smenu_lang > ul > li > ul > li { text-align: center; }

.numerik1 .smenu img.menuflags { height: 2rem; margin-bottom: 6px; }
/* /customization */

.numerik1 .smenu > li.active > a { border: .3em solid var(--global-color-vw3-red); }
.numerik1 .smenu > li > ul a:hover { border: .3em solid var(--global-color-vw3-red); }
/* /Sidebar menu */


/* customization may 2022 */
/* top-level links */
.numerik1 .smenu a { font-weight: 500; }

/* top-level menu svg */
.numerik1 .smenu > li.smenu_logo > a > img { max-height: 70px; }
.numerik1 .smenu > li:not(.smenu_logo) > a > img { height: 34px; }

/* sub-level menu svg */
.numerik1 .smenu > li > ul > li > a img,
.numerik1 .smenu > li > ul > li > ul > li > a img { height: 34px; }
/* /customization may 2022 */


/* Modifs layout sept. 2019 */
body.numerik1 {
	background: transparent;
}

.numerik1 .page-container {
	max-width: 1260px;
	margin: 0 auto;

	background-color: #eeeeee;
	border-right: 4px solid #3a3a3a;
}

.numerik1 .page-content { margin-left: 0px; }
.numerik1 .wrapper_entete { max-width: 1256px; }

.numerik1 .smenucontainer {
	left: 50%;
	transform: translateX(-734px);
	border-left: 4px solid #3a3a3a;
  width: 104px;
}

.numerik1 .smenu {
	-webkit-clip-path: inset(0px -1000px 0px 0px);
	        clip-path: inset(0px -1000px 0px 0px);
}
/* /Modifs layout sept. 2019 */


@media only screen and (max-width: 1470px) {

	.numerik1 .page-container { border: 0; margin: 0; }
	.numerik1 .page-content { margin-left: 100px; }

	.numerik1 .smenucontainer {
		left: 0;
		transform: none;
		border-left: 0;
	  width: 100px;
	}

	.numerik1 .smenu { -webkit-clip-path: none; clip-path: none; }

}

@media only screen and (min-width: 1260px) and (max-width: 1470px) {

	.numerik1 .wrapper_entete { max-width: 1160px; }

}

@media only screen and (max-width: 1260px) {
}



/* #Tablet (Landscape) */
@media only screen and (min-width: 960px) and (max-width: 1115px) {

	.numerik1 .smenu > li > a,
	.numerik1 .smenu > li > ul > li > a,
	.numerik1 .smenu > li > ul > li > ul > li > a { padding: 0.6rem 0; }

	.numerik1 .smenu img.menuflags { height: 2rem; margin-bottom: 8px; }
	.numerik1 .smenu li.menu_tie img { height: 26px; }

}

/* #Tablet (Portrait)
   #Note: Design for a width of 768px
================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {

	.numerik1 .smenu li.smenu_creation > ul > li > ul > li > a { border: .4em solid #6d6e70; }
	.numerik1 .smenu img.menuflags { height: 2.1rem; margin-bottom: 9px; }
	.numerik1 .smenu li.menu_tie img { height: 26px; }

}

/* #Mobile
   #Note: Design for a width of 767px
================================================== */
@media only screen and (max-width: 767px) {

	.numerik1 .page-content { margin-left: 0px; padding-top: 0px; }

}

/* #Mobile (Landscape)
   #Note: Design for a width of 480px
================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
}

/* #Mobile (Portrait)
   #Note: Design for a width of 320px
================================================== */
@media only screen and (max-width: 479px) {
}

/* Small height */
@media only screen and (min-height: 670px) and (max-height: 740px) {

	.numerik1 .smenu i { font-size: 1.5em; }

	.numerik1 .smenu > li > a,
	.numerik1 .smenu > li > ul > li > a,
	.numerik1 .smenu > li > ul > li > ul > li > a { min-height: 3.5rem; padding: 0.5rem 0; }

	.numerik1 .smenu li.smenu_logo a { height: calc(5rem + 2px); }

	.numerik1 .smenu > li:not(.smenu_logo) > a > img { height: 30px; }
	.numerik1 .smenu > li > ul > li > a img,
	.numerik1 .smenu > li > ul > li > ul > li > a img { height: 30px; }

}

@media only screen and (min-height: 500px) and (max-height: 669px) {
	.numerik1 .smenu i { font-size: 1.5em; }

	.numerik1 .smenu > li > a { min-height: 3.5rem; padding: 0.4rem 0; }
	.numerik1 .smenu > li > ul > li > a,
	.numerik1 .smenu > li > ul > li > ul > li > a { min-height: 3.5rem; padding: 0.5rem 0; }

	.numerik1 .smenu li.smenu_logo a { height: calc(5rem + 2px); }

	.numerik1 .smenu > li:not(.smenu_logo) > a > img { height: 30px; }
	.numerik1 .smenu > li > ul > li > a img,
	.numerik1 .smenu > li > ul > li > ul > li > a img { height: 30px; }

}

/* Menu flags - Adjust by height */
@media only screen and (min-height: 670px) and (max-height: 740px) {
	.numerik1 .smenu img.menuflags { height: 1.3rem; margin-bottom: 6px; }
}

@media only screen and (min-width: 960px) and (max-width: 1115px) and (min-height: 670px) and (max-height: 740px) {
	.numerik1 .smenu img.menuflags { height: 1.4rem; }
}

@media only screen and (min-width: 768px) and (max-width: 959px) and (min-height: 670px) and (max-height: 740px) {
	.numerik1 .smenu img.menuflags { height: 1.5rem; }
}



@media only screen and (min-height: 500px) and (max-height: 669px) {
	.numerik1 .smenu img.menuflags { height: 1.2rem; margin-bottom: 6px; }
}

@media only screen and (min-width: 960px) and (max-width: 1115px) and (min-height: 500px) and (max-height: 669px) {
	.numerik1 .smenu img.menuflags { height: 1.4rem; }
}

@media only screen and (min-width: 768px) and (max-width: 959px) and (min-height: 500px) and (max-height: 669px) {
	.numerik1 .smenu img.menuflags { height: 1.5rem; }
}
/* END - Menu flags - Adjust by height */