.desktop-hidden {
	display: none
}

body {
	font-family: 'Nunito', sans-serif !important;
}

#main-menu li a {

	font-family: 'Roboto Slab', serif;
}

#page>header {
	background-image: url("https://ma-coop38.com/wp-content/uploads/2022/03/fond-bois.jpg");
	height: 305px;
	position: relative;

}

#page>header::before {
	content: '';
	display: block;
	z-index: 3;
	width: 100%;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	position: absolute;
	background: rgba(0, 0, 0, 0.3);

}

.custom-logo-link img {
	height: auto;
	width: 20em
}

.navbar-brand {
	padding-top: 0px !important;
	margin-top: -15px;
	display: block
}

#main-nav {
	background: transparent !important
}

.header {
	z-index: 4;
	position: relative;
	padding-top: 15px;
	display: flex;
	width: 100%;
	align-items: center
}

.infos-pratiques {
	position: relative;
	padding: 5px 0px 2px 0px;
	height: 35px;
	background: var(--bs-green);
	color: #fff;
	text-align: center;
	z-index: 4;
}

.tagline {
	font-size: 25px;
	color: var(--bs-green);
	font-weight: bold;
	flex-basis: 21%;
	font-style: italic;
	padding: 25px 40px 15px 40px;
	border-radius: 10px;
	position: relative;
	border: 2px solid var(--bs-green);

}

.tagline::before {
	display: block;
	content: '';
	width: 15%;
	height: 50%;
	border-left: 2px solid #fff;
	border-top: 2px solid #fff;
	position: absolute;
	top: -2px;
	left: -2px;
	border-top-left-radius: 10px;

}

.tagline::after {
	display: block;
	content: '';
	width: 15%;
	height: 50%;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	position: absolute;
	bottom: -2px;
	right: -2px;
	border-bottom-right-radius: 10px;

}

.tagline .line {
	margin-top: -15px;
	display: block;
	width: 100%;
}

.header-text {
	margin-left: auto
}



.tagline span:nth-child(2) {
	text-align: center;


}

.tagline span:last-child {

	text-align: right;
}

.white{color: #fff}
.localisation {
	font-size: 16px;
	color: #fff;
	font-weight: 500;
	flex-basis: 50%;
	margin-left: auto;
	text-align: right;
	margin-top: -15px;
}

#main-nav {
	flex-wrap: wrap
}

#main-nav .container {
	padding: 0px;
	max-width: 1220px
}

#main-nav #navbarNavDropdown {
	width: 100%;
	flex-basis: 100%;
	margin-top: 30px;
	z-index: 4;
}

#navbarNavDropdown {
	justify-content: center;
}

#main-menu {
	margin-left: 0px !important
}

#main-menu>li>a {
	font-size: 25px;
	color: #fff
}

#main-menu>li:not(.boulangerie-menu-link)>a:hover {
	color: var(--bs-green);
	border-bottom: 3px solid var(--bs-green)
}

#main-menu .boulangerie-menu-link a {
	padding: 7px 20px 6px 20px;
	margin-left: 50px;
	border-radius: 7px;
	background: #F0CD41;
	font-size: 20px;

}

#main-menu .boulangerie-menu-link a:hover {
	color: #fff;
	background: var(--bs-green);


}

li.active a {
	border-bottom: 2px solid var(--bs-green)
}

.show li {
	background: var(--bs-green);
}

.show li a {
	color: #fff;
	border: 0px solid transparent
}

.show li a:hover {
	background: var(--bs-green)
}
#content{max-width: 1230px}

#top-home{margin-top: -5px;}

#top-home>div{width: 33.333333%!important;height: 400px;}

.square{position: relative;overflow: hidden}

.square img {width: 100%;}

.square div:last-child{position: absolute;height: 100%;top: 0px;bottom: 0px;left: 0px;right:0px}
#top-home .square .titre{display:flex;
	position: absolute; top: 20%;height: 20%;width: 100%;
	justify-content: center;align-items:center}

	#top-home .square .titre .caption{
		font-family: 'Roboto Slab', serif;font-size: 22px;padding: 15px 40px;
		background: #fff;width: auto;text-align: center;border-radius: 10px}	

		#top-home .square  .titre_boulangerie .caption{
			background: #F0CD41;color: #fff}

			#top-home .square  .titre_calendrier .caption{
				background: var(--bs-green);color: #fff}

					#top-home .square  .titre_actualite .caption{
				background: #0073D0;color: #fff}
				#top-home .square .img{position: relative;border: 1px solid var(--bs-green);}

			

				#top-home .square .img::before{
					content: "";position: absolute;
					width: 100%;height: 100%;background: rgba(0,0,0,0.4);}

					.bottom_slide{transition: all .3s ease-out;
  background: #428bca;
  height: 100%;top:100%;position:relative}

.slideup{top: 0}