@charset "UTF-8";
/* CSS Document */


/* ----------------------------------------------------------------
    Search
-----------------------------------------------------------------*/
.opensearch:hover,body.search-open .opensearch{
	/* background-color: rgba(255,255,255,0.9); */
	background-color: rgba(195,255,0,0.9);
	transition: 0.25s;
}
.opensearch{
	padding-top:20px !important;
	padding-bottom:15px !important;
	margin:0  !important;
}
#search {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center; text-align: center; background: rgba(195,255,0,0.9); line-height: normal; position: fixed; z-index: 1000; top: 70px; left: 0; width: 100%; height: 300px; pointer-events: none; opacity: 0; transition: opacity 0.5s; }

#search #search-logo { top: -1px; left: 30px; opacity: 0; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; position: absolute; line-height: 80px; height: 80px; width: auto; }

#search #search-logo img { width: 100%; height: 100%; }

#search .search-form {
	max-width:450px;
	width:100%;

	opacity: 0; -webkit-transform: scale3d(0.8, 0.8, 1); transform: scale3d(0.8, 0.8, 1); -webkit-transition: opacity 0.5s, -webkit-transform 0.5s; transition: opacity 0.5s, -webkit-transform 0.5s; transition: opacity 0.5s, transform 0.5s; transition: opacity 0.5s, transform 0.5s, -webkit-transform 0.5s; margin: 80px 0; }

#search .search-form .text-muted {
	font-family: 'Milliard-ExtraLight', sans-serif;
	    font-weight: 100;
			font-size: 1.8vh;
    line-height: 1.2em;
 }

#search .search-form .form-control { font-size: 34px; padding: 10px; border: 1px solid #000; font-weight: 700; margin-bottom: 20px; background-color: transparent;

	display: block;
	width: 100%;
 }

#search .search-form .form-control:focus { background-color: transparent; outline: none; box-shadow: none; }

#search .search-form .form-control:-webkit-input-placeholder { color: #000; }

#search .search-form .form-control:-moz-placeholder { color: #000; }

#search .search-form .form-control:-ms-input-placeholder { color: #000; }

#search .btn-search-close { font-size: 30px; position: absolute; top: 20px; right: 30px; display: none; padding: 12px; line-height: 12px;
	background-color: transparent; border: 1px solid #000; cursor: pointer; border-radius: 0.42rem; color: #000; opacity: 0;
	 transform: scale3d(0.8, 0.8, 1);
	 transition: opacity 0.5s, -webkit-transform 0.5s; transition: opacity 0.5s, transform 0.5s; transition: opacity 0.5s, transform 0.5s, -webkit-transform 0.5s; }

#search .search-suggestion-wrapper { display: none; }

/* ----------------------------------------------------------------
    Search / Open state
-----------------------------------------------------------------*/
body.search-open #topbar { z-index: 199; }

body.search-open #search { z-index: 10005; pointer-events: auto; opacity: 1; }

body.search-open #search #search-logo { display: block; opacity: 1; }

body.search-open #search .search-form { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }

body.search-open #search .btn-search-close { display: block; opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }

body.search-open #search .search-suggestion { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

body.search-open #search .search-suggestion:nth-child(2) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }

body.search-open #search .search-suggestion:nth-child(3) { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }

/* ----------------------------------------------------------------
    Search Responsive
-----------------------------------------------------------------*/
@media (max-width: 991.98px) { #search #search-logo { margin: 0 auto !important; max-width: 130px; left: auto; }
  #search .search-form { margin: 40px; }
  #search .search-form .form-control { font-size: 24px; margin-bottom: 8px; }
  #search .search-form .text-muted { font-size: 10px; }
  #search .btn-search-close { font-size: 1em; padding: 8px; line-height: 8px; } }


	.material-symbols-outlined {
	  font-variation-settings:
	  'FILL' 0,
	  'wght' 400,
	  'GRAD' 0,
	  'opsz' 48
	}



/****************
BOUTON HAUT DE PAGE
****************/
	div.haut-page	{
		display:block;
		position:fixed;
		width:100%;
		max-width:1280px;
		z-index:15000;
		margin: 0 50%;
		transform: translateX(-50%);
		bottom: 0;
	}

	a#top{
	  /*border-radius:3px;*/
	  width:45px;
	  height: 57px;
	  /*padding:10px;*/
	  font-size:15px;
	  text-align:center;
	  color:#fff;
	  position:fixed;
	  right:20px;
	  opacity:1;
	  background: url(../images/picto-top.png) top no-repeat;
	  transition:all ease-in 0.2s;
	  backface-visibility: hidden;
	  -webkit-backface-visibility: hidden;
	  text-decoration: none;
	}

	a#top:before{ background:url(../images/picto-top.png) top no-repeat; }
	/*a#top:before{ content: "\25b2"; }*/
	a#top:hover{
	  transition:all ease-in 0.2s;
	}

	a#top.invisible{
	  bottom:-35px;
	  opacity:0;
	  transition:all ease-in 0.2s;
	}

	a#top.visible{
	  bottom:10px;
	  opacity:1;
	}

	img#picto-top	{
		border:none;
	}


/****************
HEADER
****************/

    ul.header   {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 10000;
        width: 100vw;
        height: 70px;
        margin: 0;
        padding: 0;
        text-align: left;
        letter-spacing: -0.3em;
    /*    border-bottom: 2px solid black;*/
    }
		.sticky ul.header   {
			background:rgba(255,255,255,0.8);
			border-bottom: 2px solid black;
		}
    .header .menu-item  {
        display: inline-block;
        vertical-align: top;
        font-family: 'Cresta-Medium', sans-serif;
    }

    #menu-header>li:not(.menu-before):hover,.offres-demploi   {
        /* background-color: rgba(255,255,255,0.9);*/
				background-color: rgba(195,255,0,0.9);
    }

    .header .menu-item.current_page_item {
			/* background-color: rgba(255,255,255,0.9);*/
			background-color: rgba(195,255,0,0.9);
    }

    a.menu1  {
        display: inline-block;
        padding: 0 10px;
        vertical-align: top;
        text-align: center;
    }

    a.menu1#menuu {
/*        display: none;*/
        height: 35px;
        margin: 10px 0 0 0;
        font-family: 'Material+Symbols+Outlined';
        font-size: 14px;
        padding: 10px 10px 0 10px;
/*        border: 1px solid black;*/
    }

    a.menu1#logo    {
        height: 47px;
        margin: 10px 18px 0 0;
        padding: 0;
        border-right: 2px solid black;
    }

@media screen and (max-width:800px) {
    a.menu1#logo    {
        height: 35px;
    }
}

    a.menu1#pictos  {
        width: 80px;
        margin-top: 15px;
        padding: 0;
    /*    border: 1px solid orange;*/
    }

@media screen and (max-width:800px) {
    a.menu1#menuu   {
        display: none;
    }
}

    #menu-header>li>a  {
        display: inline-block;
        height: 40px;
        margin: 0;
        padding: 30px 30px 5px 30px;
        vertical-align: top;
        text-align: center;
        font-family: 'Cresta-Medium', sans-serif;
        font-weight: 500;
        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        color: black;
        cursor: pointer;
        text-decoration: none;
/*        border: 1px solid green;*/
    }

    a.menu2#menuu {
        display: none;
        height: 35px;
        margin: 40px 0 0 0;
        font-family: 'Material+Symbols+Outlined';
        font-size: 1.2em;
        padding: 10px 10px 0 10px;
        border: 1px solid black;
    }

@media screen and (max-width:800px) {
    a.menu2#menuu   {
        display: block;
        position: fixed;
        top:-5px;
        right: 15px;
        height: 25px;
        margin: 17px 0 0 0;
        padding: 5px;
				z-index:10005;
        background-color: rgba(204,240,0,0.4);
    }
}

    span.material-symbols-outlined {
          font-variation-settings:
          'FILL' 0,
          'wght' 300,
          'GRAD' 0,
          'opsz' 48
    }

    span#searchicon {
        font-size: 2.5em;
    }

    span#home {
        font-size: 2.2em;
    }

    span#portail {
        font-size: 2.2em;
    }

    span#port {
        display: inline-block;
        margin: 7px 0 0 5px;
        font-family: 'Helvetica', 'Arial', sans-serif;
        text-align: left;
        vertical-align: top;
        font-size: 0.7em;
    }

    a.menu2:hover    {
        background-color: rgba(255,255,255,0.9);
        transition: 0.25s;
    }

@media screen and (max-width:800px) {
    a.menu2   {
        display: none;
    }
}

    img.logo    {
        width: 200px;
        margin: -13px 20px 0 0;
        height: auto;
    /*    border: 1px solid orange;*/
    }

    img.logo#pages  {

        margin: -10px 20px 0 0;
    }

    img.picto   {
        width: 35px;
        height: auto;
        padding: 10px 0 0 0;
    }

    img.picto#portail   {
        width: 43px;
        height: auto;
        padding: 5px 0 5px 0;
    /*    padding-right: 50px;*/
    }

/****************
SUBMENUS
****************/

    .header>li:hover > ul.sub-menu  {
        height: 300px;

    }

    .header>li > ul.sub-menu  {
        display: block;
        position: absolute;
        top: 75px;
        left: 0;
        width: 100vw;
        height: 0;
        overflow: hidden;
				text-align: center;
        letter-spacing: -0.3em;
				background-image: linear-gradient(rgba(195,255,0,0.9)  50%,rgba(195,255,0,0.4));
    }
		/* menu cms */
		  .header>li:nth-child(n+3) > ul.sub-menu  {
				max-width: 600px;
				width:100%;
				left:50%;
				transform:translateX(-50%);
				background-image: inherit;

			}

			@media (max-width:800px){
				.header>li:nth-child(n+2){
					display:none !important;
				}
			}


			.header>li:nth-child(n+3):hover > ul.sub-menu  {
				overflow:visible;
				padding:20px 0;
			}

			.header>li:nth-child(n+3):hover > ul.sub-menu:after  {
				position:fixed;
				z-index:-1;
				left:-9999px;
				top:0;
				height:300px;
				width:99999px;
				content:'';
				background-image: linear-gradient(rgba(195,255,0,0.9)  50%,rgba(195,255,0,0.4));
			}


    .header>li>.sub-menu>li {
        display: inline-block;
        width: 150px;
        margin: 20px 0;
        vertical-align: top;
        text-align: left;
        font-family: 'Cresta-Regular', sans-serif;
        font-size: 1.3vh;
        letter-spacing: normal;
        line-height: 1.2em;
    }
		.header>li:nth-child(2)>.sub-menu>li{
			margin-left:100px;
		}
		.header>li:nth-child(2)>.sub-menu>li:first-child{
			margin-left:0;
			width:600px;
		}
		.header>li:nth-child(n+3) > ul.sub-menu>li{
			width: auto;
			margin: 10px 5px;
		}

    .header>li:nth-child(2)>.sub-menu>li>a {
        display: inline-block;
        width: 100%;
        margin: 10px 0;
        padding: 3px 0 1px 0;
        font-family: 'Cresta-Medium', sans-serif;
        color: black;
        font-size: 1.1em;
        text-indent: 10px;
/*        background-color: rgba(204,204,204,0.6);*/
        background-image: linear-gradient(to right, rgba(255,255,255,0.6), rgba(255,255,255,0.05));
/*        border-radius: 15px;*/
    }
		.header>li:nth-child(2)>.sub-menu>li>a:first-child{
			max-width:150px;
		}
		.header .sub-menu .sub-menu li{
			display:block;
		}

    .header .sub-menu .sub-menu a  {
        display: inline-block;
        margin: 10px 5px;
        color: black;
        text-decoration: none;
        letter-spacing: normal;
    }
		.header>li:nth-child(2)>.sub-menu>li:first-child> .sub-menu{
			-webkit-column-count: 5;
			-moz-column-count: 5;
			column-count: 5;
		}
		.header .sub-menu a{
			position:relative;
			font-size:16px;
		}
		.header .sub-menu a:before{
			content:'•';
			margin-right:5px;
		}
		.header>li:nth-child(2)>.sub-menu>li>a:before{
			content:'';
			margin:0;
		}
    span.new  {
        font-family: 'Cresta-Medium', sans-serif;
        font-size: 0.8em;
        text-transform: uppercase;
        color: rgba(255,153,0,1);
    }

    p.submenus a:hover  {
        font-family: 'Cresta-Medium', sans-serif;
    }


/****************
FOOTER
****************/

    #footer    {
        height: auto;
        background-color: rgba(225,220,210,0.8);
        overflow: visible;
        text-align: center;
				width:100%;
    }

    .footer   {
        display: inline-block;
        width: 90vw;
        max-width: 1366px;
        height: auto;
        margin: 8vh 0 0 0;
        padding-bottom: 10vh    ;
        text-align: left;
        opacity: 0.6;
    }


    li.foot   {
        display: inline-block;
        height: auto;
        margin: 0 30px 0 0;
        overflow: visible;
        vertical-align: top;
        font-family: 'Milliard-Book', sans-serif;
        font-size: 0.8em;
        color: black;
        line-height: 1.2em;
        letter-spacing: normal;
    }

@media screen and (max-width: 800px)    {
    li.foot {
        margin: 0 10px 30px 0;
    }
}

    li.foot#col1   {
/*        width: 10vw; */
        max-width: 350px;
        padding-right: 2vw;
        font-family: 'Milliard-Medium', sans-serif;
    }

		li.foot#col2{
			max-width: 340px;
			width:100%;
		}

@media screen and (max-width:800px) {
    li.foot#col2    {
        display: none;
    }
}

@media screen and (max-width:800px) {
    li.foot#col3    {
        display: none;
    }
}

    li.foot#col4    {
/*            margin: 30px 0 0 0;*/
        }

		.menufoot1 .menu>li>.sub-menu>li{
			float:left;
			width:50%;
		}


    footer .menu>li>a  {
        display: inline-block;
        margin: 0 0 5px 0;
        font-family: 'Milliard-Medium', sans-serif;
/*        font-weight: 600;*/
        font-size: 1.1em;
    }
		.menufoot2 .menu>li>a{
			margin-bottom:25px;
		}
    .menufoot1 .menu>li>.sub-menu>li>a {
        display: inline-block;
        margin: 5px 0 5px 0;
        font-family: 'Milliard-Medium', sans-serif;
        color: rgba(153,51,0,1);
/*        font-weight: 600;*/
/*        font-size: 1.1em;*/
    }
.offresemploi a{
	padding:0 !important;
}
.footer .menu-item-has-children + .menu-item-has-children{
margin-TOP:20PX;
}
@media (min-width:1000px){
.offresemploi{
	position:fixed;
	top:0;
	right:0;
}
}