@charset "utf-8";
/* CSS Reset */
Ahtml, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

html,body {
	margin: 0;
	padding: 0;
	height: 100%;
}

body {
  line-height: 150% !important;
	font: normal normal normal 14px/1.3em 'Times New Roman', Arial, sans-serif;
	font-family: Constantia, "Palatino Linotype", Palatino, Georgia, serif;
}

strong {
	font-weight: bold;
}
.grid {
	margin: 20px auto;
	max-width: 900px;
	width: 100%;
}
.grid-item {
	width: 48%;
	margin-bottom: 10px;
	margin-right: 1%;
}

@media (max-width: 850px) {
	.grid {
		width: 90%;
	}
	.grid-item {
   	width: 100%; margin-bottom: 10px;
 	}
}

.educationWrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
}

.educationWrapper img {
	min-width: 49.5%;
	max-width: 49.5%;
	height: 100%;
	width: 49.5%;
	flex-basis: 49.5%;
	margin-bottom: 10px;
}

@media (max-width: 500px) {
	.educationWrapper img {
		min-width: 100%;
		max-width: 100%;
		height: 100%;
		width: 100%;
		flex-basis: 100%;
	}
}

.under-construction {
	display: flex;
	justify-content: center;
	align-items: center;
}
.under-constructionImg {
	width: 500px;
}
.clear {
	clear:both;
}

.fs16 {
	font-size: 16px;
}

.amourImg-container .amourImg-image {
    height: 130px;
		margin-top: 20px;
		margin-left: 10px;
}

.programme-image {
	margin-top: 20px;
	margin-bottom: 20px;
  width: 100%;
  height: 100%;
  max-width: 600px;
}

.amourImg-container {
	display: flex;
	flex-wrap: wrap;
}

.Home-downPictures {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	max-width: 900px;
	margin: 0 auto;
	margin-top: 30px;
	padding: 0 20px;
}

.Home-downPictures img {
	flex-basis: 30%;
	width: 30%;
	height: 30%;
	max-height: 180px;
}
div.header {
	height: 120px;
	max-width: 900px;
	margin: 0 auto;
}

img#logoImage {
	width: 100px;
	height: 160px;
}

div.logo, div.header-text {
	float:left;
}

.administration, .saison-page, .artists-page, .programme-page, .concerts-page, .master-page, .billets-page,.fondateur-page, .venezChanter-page , .croisiere-page, .billet-page{
	display: none;
}


div.header-text {
	margin-top: 50px;
	margin-left: 15px;
	font-size: xx-large;
	letter-spacing: 2px;
	line-height: 30px;
	text-transform: uppercase;
	color: #636363;
}

p#titleDescription, p#firstRowText {
	color: #858585;
	font-size: small;
}

p#secondRowText {
	font-weight:bold;
	letter-spacing:3px;
	font-size:xx-larger;
}

div.header-quote {
	padding-top: 70px;
	text-align: right;

}

p#quote {
	color: #790000;
	font-size: x-large;
	font-weight: bold;
}

.tourisme-img {
    margin-top: 30px;
    width: 75%;
}

.programme-page {
    background-image: url(../images/p1010.jpeg);
    background-position: right top;
    background-repeat: no-repeat;
}

p#quoteDate {
	margin-top: 10px;
	font-size: large;
	color: #790000;
	font-weight: bold;
}

ul.main-main-menu {
	max-width: 1180px;
	margin: 0 auto;
	display: flex;
	justify-content: space-around;
}

li.menu-item {
	float: left;
	padding-top: 12px;
	padding-left: 32px;
	padding-right: 29px;
	line-height: 27px;
	padding-bottom: 12px;
}

div.menu-background {
	width: 100%;
	height: 50px;
	background: #790000;
	margin-top: 25px;
	margin-bottom: 25px;
}

li.menu-item a {
	text-decoration: none;
	color: white;
	font-size: larger;
}

.flexslider {
	max-width: 900px;
	margin: 0 auto;
}

.flexslider .slides img {
	max-width: 900px;
	max-height: 400px;
  width: 100%;
}

.flex-control-paging li a.flex-active, .flex-direction-nav a {
	color: rgba(121,0,0,0.8);
}

.flex-control-paging li a.flex-active {
	background: rgba(121,0,0,0.8);
}

.flex-direction-nav .flex-next, .flex-direction-nav .flex-prev {
	font-size:0px;
}

div.festival-desc {
	max-width: 900px;
	margin: 0 auto;
	margin-top: 40px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

div.festival-descLeft {
	padding-top: 40px;
}

.director-image {
	width: 90%;
}

p#festival-desc-title {
	font-size: xx-large;
	margin-bottom: 20px;
	color: #790000;
}

p#festival-desc-theme {
	font-weight: bold;
	margin-bottom: 15px;
}

p#festival-desc-sale {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: medium;
}

p#festival-desc-sale2 {
	font-weight: bold;
}

div.main-bottom {
	max-width: 900px;
	margin: 0 auto;
	margin-top: 30px;
}

div.programme, div.gallery, div.tickets {
	float:left;
}

div.programme-img, div.gallery-img, div.tickets-img {
	width: 285px;
	height: 250px;
}

div.programme-img {
	background: url(../images/programme.jpg) 0 0 no-repeat;
}

div.tickets-img {
	background: url(../images/ticket22.jpg) 0 0 no-repeat;
}

div.gallery-img {
	background: url(../images/gallery.jpg) 0 0 no-repeat;
}

div.gallery-img, div.tickets-img, div.programme-img {
	background-size:cover;
}

p#clickProgramme, p#clickGallery, p#clickTickets {
	margin-top: 10px;
	width: 285px;
}

a.click-here-links {
	color: #790000;
}

a.click-here-link-formation {
	color:#790000;
	cursor:pointer;
}

p#titleProgramme, p#titleTickets, p#titleGallery {
	margin-top: 15px;
	font-size: x-large;
	color: #790000;
}

div.programme, div.gallery, div.tickets {
	float: left;
}

div.tickets, div.gallery {
	margin-left: 20px;
}

div.footer {
	background: #e3e3e3;
	margin-top: 80px;
	padding-bottom:20px;
}

div.social-networks {
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 10px;
}

li#menuOne:hover, li#menuTwo:hover, li#menuThree:hover, li#menuFour:hover, li#menuFive:hover, li#menuSix:hover, li#menuSeven:hover , li#menuEight:hover, li#menuNine:hover,
li#menuCroisiere:hover,li#menuVenezChanter:hover,
 li#menuBillet:hover,li#menuCroisiere:hover  {
	background: rgba(255,255,255,0.3);
	cursor: pointer;
}

p#copyrightText {
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
	color: #790000;
}

.bio-red {
	color:#790000;
}

img#facebookImage, img#twitterImage , img#youtubeImage  {
	margin-top: 20px;
}

div.language-bar {
	background: #e3e3e3;
	padding-top: 3px;
	padding-bottom: 3px;
}

div.en-fr {
	max-width: 900px;
	margin: 0 auto;
	text-align: right;
	color: #790000;
	font-size: smaller;
	padding-right: 10px;
}

#lang1 {
	float:right;
	margin-left: 15px;
}

#facebookImage, #twitterImage, #youtubeImage, #instaImage {
	height:32px;
	width:32px;
}

.flex-direction-nav a {
	overflow:inherit;
}

div.administration {
	max-width: 900px;
	min-height:52.5%;
	margin: 0 auto;
	margin-top: 60px;
	text-align: justify;
}

p.section-title {
	font-size: xx-large;
	margin-bottom: 10px;
	color: #790000;
}

p.subsection-title {
	font-size: large;
	margin-bottom: 10px;
	color: #790000;
}

.table-admin, .email-admin, .artists-bio , .master-page-text{
	font-size:medium;
}

.table-title {
	font-size:large;
}

div.artists-page,div.fondateur-page{
	max-width: 900px;
	margin: 0 auto;
	margin-top: 60px;
	text-align: justify;
}



p.artists-bio {
float: left;
width:500px;
text-align: initial;
}

img#artistsImage {
	float: left;
	width: 300px;
	height: 400px;
	margin-left: 50px;
	margin-top: 40px;
	box-shadow: 0 0 5px 2px #666666;
	-moz-box-shadow: 0 0 5px 2px #666666;
	-webkit-box-shadow: 0 0 5px 2px #666666;
}

div.artists-philip {
	margin-top: 50px;
}

div.programme-page, div.master-page, div.concerts-page, div.billets-page, div.venezChanter-page,     div.saison-page , div.croisiere-page, div.billet-page{
	max-width: 900px;
	margin: 0 auto;
	margin-top: 60px;
	text-align: justify;
}

div.billets-page {
	font-size: medium;
}

div.billets-right, div.billets-left-side {
	float:left;
}

div.billets-right img {
	margin-left: 98px;
	margin-top: 40px;
	height: 240px;
}

div.billets-right-2 img {
	margin-left: 98px;
	margin-top: 40px;
	height: 240px;
}

div.billets-second img {
	height:240px;
	width: 343px;
}

.billets-bottom {
	text-align:center;
	margin-top:15px;
}

.table-programme {
	width:500px;
	font-size:medium;
}

.table-programme-2 {
	width:435px;
	font-size:medium;
}

.table-programme-3 {
	width:435px;
	font-size:medium;
}

.table-programme td, .table-programme-2 td, .table-programme-3 td {
	padding:10px;
}

p.master-page-text {
	margin-top:10px;
}

div.concerts-page {
	font-size: medium;
}

p.concert-title {		
	color: #790000;
	font-size: x-large;
	margin-top: 50px;
	margin-bottom: 20px;
	line-height: 25px;
}

p.concert-desc {
		font-style: italic;
	font-size: large;
	margin-top: 5px;
	margin-bottom: 20px;
}

#masksImage {
	margin-top: 15px;
}

.italic {
	font-style: italic;
}

.programme-text, #programeImg {
	float:left;
}

#adminImage {
  width: 50%;
  height: 50%;
}

#childrenImage {
	margin-top: 10px;
}

.time {
	padding-left:0px !important;
}

div.clarinette-text {
	width: 485px;
	float: left;
}

p#festival-desc-desc {
	font-size: medium;
	text-align: initial;
}

p#lang1, p#lang2 {
	cursor:pointer;
}

div.en-fr a {
	color: #790000;
	text-decoration:none;
}

div.billets-first-text {
	float: left;
	width: 330px;
}

div.billets-second-img {
	float: left;
}

div.billets-second-text {
	float: left;
	margin-left: 20px;
}

div.billets-second {
	margin-top: 20px;
}

div.concerts-bottom {
	margin-top: 10px;
}

div.plus-text {
	text-align:left;
	font-size: medium;
}

div.admin-text-plus-image {
	margin-top: 30px;
}

div.signiture-img {
	width: 100%;
	text-align: right;
}

img#singitureImg {
	width: 30%;
}

div.billets-page table {
	width: 600px;
}

div.billets-page table tr td:first-child {
	width: 115px;
}

div.billets-page p {
	/*text-align: left;*/
}

div.billets-page p.centered {
	text-align: center;
}

div.billets-page p span.bio-red {
	display: block;
	margin-bottom: 5px;
}

div.concert-d-orchestre {
	width: 485px;
	float: left;
}

#robImg {
	float: left;
	margin-left: 23px;
	margin-top: 15px;
}

/* Tablet breakpoint 1024 */

@media (max-width: 1024px) {

	ul.main-main-menu {
		width: 100%;
	}

	div.header {
		height: 150px;
	}

	div.header-quote {
		/*padding-top: 70px;*/
		text-align: left;
		margin-left: 15px;
		float:right;
	}

	div.header-text {
		margin-top: 40px;
	}

	p#quoteDate {
		font-size: small;
		color: #790000;
		font-weight: bold;
	}

	li.menu-item {
		float: left;
		padding-top: 12px;
		padding-left: 10px;
		padding-right: 10px;
		line-height: 27px;
		padding-bottom: 12px;
	}

	div.festival-desc {
		padding-left: 15px;
		padding-right: 15px;
		flex-direction: column;
	}

	.director-image {
		margin-bottom: 50px;
		width: 100%;
	}

	div.main-bottom {
		max-width: 600px;
		margin: 0 auto;
		margin-top: 30px;
	}

	div.gallery {
		margin-left:0px;
	}



	div.programme-page, 
	div.master-page, 
	div.concerts-page, 
	div.billets-page, 
	div.artists-page, 
	div.administration, 
	div.fondateur-page, 
	div.venezChanter-page,
	div.croisiere-page, 
	div.billet-page,
	div.saison-page	{
		max-width: 900px;
		margin: 0 auto;
		margin-top: 60px;
		text-align: justify;
		padding-left: 20px;
		padding-right: 20px;
	}

	div.billets-bottom img {
		width:90%;
	}

	div.master-page img {
		width:100%;
	}

	#robImg {
		width:90%;
	}

	p.artists-bio {
		width: 100%;

	}

	img#artistsImage {
		display:none;
	}
}

@media (max-width: 1024px) {
	div.clarinette-text {
		width: 100%;
	}
}

@media (max-width: 920px) {
	img#programmeImage, div.billets-right, #adminImage , div.billets-right-2{
		display: none;
	}

	div.clarinette-text {
		width: 100%;
	}
}

@media (max-width: 725px) {


	div.header-quote {
		float: left;
	}

	.programme-page {
		background-image: none;
	}


	.amourImg-container {
		align-items: center;
    justify-content: space-around;
	}

	div.menu-background {
		width: 100%;
		height: 70px;
		margin-top: 10px;
		margin-bottom: 0px;

	}

	div.programme, div.gallery, div.tickets {
		text-align: center;
		margin-bottom: 10px;
		margin-left: 0;
		float: none;
	}

	div.programme-img, div.gallery-img, div.tickets-img {
		margin: 0 auto;
	}

	p#clickProgramme, p#clickGallery, p#clickTickets {
		width: 100%;
	}

}

@media (max-width: 551px) {

	div.header-quote {
		padding-top: 0px;
	}

	div.header-text {
		margin-top: 10px;
	}

	p#titleDescription, p#firstRowText {
		font-size: x-small;
	}

	p#secondRowText {
		letter-spacing:1px;
		font-size: 28px;
	}

	.under-constructionImg {
		width: 300px;
	}

	li.menu-item {
		font-size: 10px;
		padding-left: 6px;
		padding-right: 6px;
	}
	div.menu-background {
		height: 50px;
	}

	div.programme, div.gallery, div.tickets {
		text-align: center;
		margin-bottom: 10px;
		margin-left: 0;
		float: none;
	}

	div.programme-img, div.gallery-img, div.tickets-img {
		margin: 0 auto;
	}

	table {
		width: 100% !important;
	}

	div.programme-page, div.master-page, div.concerts-page, div.billets-page, div.artists-page, div.administration, div.venezChanter-page , div.croisiere-page, div.billet-page{
		text-align: left;
	}

	div.billets-first-text {
		width: 100%;
	}

	div.clarinette-text {
		width: 100%;
	}

	ul.main-main-menu.eng li.menu-item {
		padding-left: 8px;
		padding-right: 8px;
	}

	.tourisme-img {
    	width: 90%;
	}

	.administration-letter img {
		float: none !important;
		display: block;
		margin: 30px auto !important;
	}
}

#thirdRowText {
	font-size: 10px;
	line-height: 130% !important;
}

.concert-dates {
	margin-top: 10px;
	line-height: 25px;
}

.administration-text {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.administration-letter {
	font-size: medium;
	margin-bottom: 3rem;
}

.administration-letter img {
	float: left;
  margin-right: 20px;
  margin-bottom: 20px;
}

.administration-table {
	display: flex;
	justify-content: space-between;
}

.table-admin {
	flex-basis: 45%;
}

.table-admin tbody tr td {
  padding: 0 18px 8px 0;
}

#adminImage {
	flex-basis: 40%;
}