/* ---------------------------------------
	Main stylesheet for the template 1870j4
	This template comes from the tutorial from
	The Joomla 4 templates - The guide
	available on https://www.joomlack.fr
-----------------------------------------*/

body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	font-family: /*Rubik, "Segoe UI",*/ "Helvetica Neue", Arial;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #5e5a57;
	background: #2e0002;/*url('../images/Notespluie.svg') left top repeat;*/
	background-size: contain;
}

body.component {
	background: #fff;
}

body.error-page #maincontent {
	margin-top: 100px;
}

* {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

a {
	/*color: #f47a14;*/
	color: #ed9e27;
}

a:hover {
	color: #c25800;
}

ul, ol {
	padding: .75em 0 .75em 0;
	margin: 0 0 0 35px;
}

ul.nav,
ul.menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.nav li a,
ul.menu li a {
	text-decoration: none;
}

p {
	padding: 5px 0;
}

.clr {
	clear : both;
}

canvas, img, svg, video {
	max-width: 100%;
	height: auto;
	box-sizing: border-box;
}

table img {
	max-width: none;
}

fieldset {
	border: none;
}

.img_caption {
	max-width: 100%;
	width: auto !important;
}

/*h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
	margin-top: 0;
	margin-bottom: 0.5rem;
	font-weight: 500;
	line-height: 1.2;
}*/

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
  padding: 3px 0;
  margin: 0;
  font-family: /*Nunito, "Segoe UI",*/ "Helvetica Neue", Arial, Sans-Serif;*/
  line-height: 1.2;
  font-weight: normal;
  font-style: normal;
  color: #ed9e27;
}

h1, .componentheading {
  font-size: 1.75em;
}

h2, .item-title, .page-header  {
  font-size: 1.5em;
  font-weight: bold;
}

h3, .h3 {
    font-size: 1.25em;
  font-weight: bold;
  color: #444;
}

h4 {
  font-size: 1em;
  /*color: #d46805;
  color: #b83371;
  color: #ed9e27;
  color: #f47a14;*/
  color: #990218;
}
/*ajout de 1870j3*/
header {
	display: flex;
	align-items: center;
	padding: 20px;
}
.site-title {
	font-size: 40px;
	line-height: 48px;
	font-weight: 600;
}
.site-description {
	line-height:28px;
	font-size:20px;
	font-weight: 600;
}
a.brand {
	color: #ffd700;
	-webkit-transition: color .5s linear;
	-moz-transition: color .5s linear;
	-o-transition: color .5s linear;
	transition: color .5s linear;
	text-decoration: none;
}

.brand:hover {
	color: #b83371;
	text-decoration: none;
}
/*fin ajout*/

#topmenu ul.nav {
	display: flex;
}

#topmenu ul.nav > li {
	margin: 0 10px;;
}

#topmenu ul.nav > li > a {
	padding: 0 20px 0 0;
	min-height: 40px;
	color: #444;
	font-family: rubik, Sans-serif;
	font-size: 18px;
	font-weight: 400;
}

#topmenu ul.nav > li.active > a,
#topmenu ul.nav > li:hover > a,
#topmenu ul.nav > li:focus > a {
	color: #f47a14;
}

#topmenu ul.nav ul {
       display: none;
	position: absolute;
	background: #fff;
	box-shadow: rgba(0,0,0,0.2) 5px 5px 20px;
}

#topmenu ul.nav li:hover > ul,
#topmenu ul.nav li:focus > ul{
	display: block;
}


#topmenu ul.nav li:focus > ul {
	display: block;
}

#topmenu ul.nav ul > li > a {
	display: block;
	padding: 10px 20px;
	min-height: 30px;
	color: #444;
	font-family: rubik, Sans-serif;
	font-size: 18px;
	font-weight: 400;
}

#topmenu ul.nav ul > li.active > a,
#topmenu ul.nav ul > li:hover > a,
#topmenu ul.nav ul > li:focus > a {
	color: #f47a14;
}

.container {
	max-width: 1200px;
	padding: 0 px;
	margin: auto;

}

.rounded {
    -moz-border-radius: 5px;
	-o-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: #fdd700 1px solid;
	margin-bottom : 20px;
}	
.white {
    background: #e1e1e1;
	background-image: url("white-gradient.svg");
	background-image: -o-linear-gradient(center top,#ffffff,#ffffff 40%, #e1e1e1 100%);
	background-image: -webkit-gradient(linear, left top, left bottom,from(#ffffff),color-stop(40%,#ffffff), color-stop(100%, #e1e1e1));
	background-image: -moz-linear-gradient(center top,#ffffff,#ffffff 40%, #e1e1e1 100%);
	background-image: linear-gradient(center top,#ffffff,#ffffff 40%, #e1e1e1 100%);
	-pie-background: linear-gradient(center top,#ffffff,#ffffff 40%, #e1e1e1 100%);
	border: #fdd700 1px solid;
}
.hauteurheader {
	height: 50px;
	padding: 0px 10px 0px 10px;
	margin-bottom:5px;
	max-width: 1200px;
	margin-left: auto;
    margin-right: auto;
}
	
	
}
.contennu {
    padding-left : 20px;
}
.logo-left {
    width : 100%;
}

.logo-right {
    /*margin-top : -80px;*/
    margin-bottom : 5px;
     width : 30%;
}
#header-module {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom:5px;
	padding: 10px 20px 0px 20px;
/*	height: 400px;*/

}

#header-module-left,
#header-module-right {
	flex: 1 1 auto;
	width: 50%;
	min-width: 350px;
   /* height: 400px;*/
}
.orchestre {
    /*height : 380px;*/
   /* padding-left : 60px;*/
    background-image : url('../images/logo_orchestre.jpg');
    background-size :auto auto;
}
.readmore-button {
	/*background: #f47a14;*/
	background: #ed9e27;
	padding: 10px 20px;
    margin: 10px 0;
	display: inline-block;
	border-radius: 40px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	transition: all 0.2s;
}

.readmore-button:hover {
color: #fdd700;
background: #990218;
font-weight: bold;
}

.readmore-button-light {
	background: none;
	color: #f47a14;
	font-weight: bold;
}

#top-module {
	text-align: center;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	column-gap: 4%;
}

#top-module > div {
	width: 30%;
	margin: 2% 0;
	background: #fff;
	box-shadow: rgba(42,67,113,0.2) 5px 5px 30px;
	padding: 20px;
	border-radius: 10px;
	min-width: 250px;
	flex: 1 1 auto;
}
#maincontent {
    /*padding: 20px;*/
}

#maincontent .blog-items {
    /*padding: 20px;*/
	column-gap: 2em;
	margin-bottom: 2em;
	/*	background:  url('../images/Notespluie.svg') left top repeat;
	background-size: contain;*/
}

#maincontent .blog-item {
	box-shadow: rgba(42,67,113,0.2) 5px 5px 30px;
}

#maincontent .blog-item .item-image {
	width: 100%;
}

#maincontent .blog-item .item-image img {
	width: 100%;
}

#maincontent .blog-item .item-content  {
    padding: 2em;
}
.com-content-article {
   padding: 20px; 
}
.com-content-categories {
   padding: 20px; 
}
.com-content-category-list {
   padding: 20px; 
   
}
.content-category {
    padding: 20px; 
    text-align:left;
}
.com-weblinks-category {
   padding: 20px; 
}	
h1 {
    font-family:/*unito, "Segoe UI",*/Helvetica Neue", Arial, Sans-Serif;*/
	font-size: 2.3rem;
	margin: 30px 0;
	color: #f47a14;
	font-weight: 600;
}
h2 {
    font-family:/*unito, "Segoe UI",*/Helvetica Neue", Arial, Sans-Serif;
	font-size: 1.8rem;
	margin: 20px 0;
	font-weight: bold;
	color: #f47a14;
}
h3 {
	color: #444;
	font-family: Nunito, "Segoe UI", "Helvetica Neue", Arial, Sans-Serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 32px;
	margin: 20px 0;
}

.item-title, .page-header h2 {
	font-family:/*unito, "Segoe UI",*/Helvetica Neue", Arial, Sans-Serif;
	font-size: 1.8rem;
	margin: 20px 0;
	font-weight: bold
	color: #f47a14;
}


.item-title:hover > a {
	color: #f47a14;
}*/

#footer-module-top {
	/*background: #990218;*/
	padding: 30px 50px;
	border-radius: 20px;
	transform: translateY(-60px);
}

#footer-module-top > div {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	text-align: center;
}

#footer-module-top > div > h3 {
	font-size: 22px;
	font-family: nunito;
	color: #fff;
	line-height: 1.5;
}

#footer-module-top > div > * {
	flex: 1 1 auto;
}

#footer-module-top .mod-finder__search input[type="text"] {
	height: 60px;
	border-radius: 30px;
	padding: 0 30px;
	border: none;
	background: #fff;
}

#footer-module-top .mod-finder__search > button {
	background: #fe5f0a;
	border: none;
	margin-left: 20px;
	height: 60px;
	padding: 0 30px;
	border-radius: 30px;
	font-size: 22px;
}

#footer-module-top .mod-finder__search > .btn .icon-search {
	margin-right: 10px;
}

#footer-module-top .mod-finder__search > div {
	flex: 1 1 auto;
}

footer {
/*	background: #f1f2f3 url('../images/footer-bg.svg') center top no-repeat;*/
	margin-top: 30px;
}

#footer-row {
	display: flex;
	flex-wrap: wrap;
	column-gap: 1%;
}

#footer-row > div {
	width: 30%;
	margin: 2% 0;
	background: #fff;
	box-shadow: rgba(42,67,113,0.2) 5px 5px 30px;
	padding: 20px;
	border-radius: 10px;
	border: #fdd700 1px solid;
	min-width: 250px;
	flex: 1 1 auto;
}

#footer-copyright {
	padding: 10px 0;
	border-top: 1px solid rgba(0,0,0,0.1);
}


@media (max-width: 768px) {
	#topmenu {
		margin-left: auto;
	}

	#topmenu .navbar-collapse {
		position: absolute;
		min-height: 100vh !important;
		right: 0px;
		top: 100px;
		width: 100px;
		background: #fff;
		padding: 10px;
		box-shadow: rgba(0,0,0,0.2) 5px 5px 20px;
		transition: width 0.2s;
	}

	#topmenu .navbar-collapse.show {
		width: 240px;
	}

	#topmenu .navbar-collapse > ul {
		display: flex;
		flex-direction: column;
	}

	#topmenu .navbar-collapse > ul ul {
		display: block;
		position: static;
		box-shadow: none;
	}

	#topmenu .navbar-collapse > ul li a {
		display: block;
	    ing: 10px;
	}


	#footer-module-top .mod-finder__search.input-group {
		flex-direction: column;
	}

	#footer-module-top .mod-finder__search.input-group .awesomplete > input {
		max-width: none;
	}

	#footer-module-top .mod-finder__search > button {
		margin-left: 0;
		margin-top: 20px;
	}
}