@charset "utf-8";
/* CSS Document */
/* latin-ext */
@font-face {
  font-family: 'Allura';
  font-style: normal;
  font-weight: 400;
  src: local('Allura Regular'), local('Allura-Regular'), url(https://fonts.gstatic.com/s/allura/v6/bLVigXKcYDndNJVaeMpTI_esZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Allura';
  font-style: normal;
  font-weight: 400;
  src: local('Allura Regular'), local('Allura-Regular'), url(https://fonts.gstatic.com/s/allura/v6/POH_k539yBSzDKiiyA98Tg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}
body {
	padding-top: 10px;
	background: url(../images/fond.jpg) top left;
	background-attachment: fixed;
}
.container {
	background-color: transparent;
	max-width:1000px;
	margin:0 auto;
}
@media (min-width:1200px)  {
	.container {
		max-width:1150px;
	}
}
/****************** Barre de navigation ************************/
nav {
	width:1000px;
	margin:0 auto;
	background-color: #fff;
}
.navbar-light .navbar-brand {
	color: rgba(109, 140, 27, 0.9);
}

.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
	color: rgba(109, 140, 27, 0.9);
}

.navbar-light .navbar-nav .nav-link {
	color: rgba(109, 140, 27, 0.9);
	/*font-family: Allura, cursive, "sans-serif";*/
	font-family: Allura, cursive, Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-style: italic;
	font-size:1.7rem;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
	color: rgba(109, 140, 27, 0.7);
	background-image: linear-gradient(#fff 90%, #0c9015);
}

.navbar-light .navbar-nav .nav-link.disabled {
	color: rgba(109, 140, 27, 0.3);
}

.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
	color: rgba(0, 0, 0, 0.9);
}

.navbar-light .navbar-toggler {
	color: rgba(109, 140, 27, 0.5);
	border-color: rgba(109, 140, 27, 0.7);
	border-radius:20px;
}

.navbar-light .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-light .navbar-text {
	color: rgba(109, 140, 27, 0.5);
}

.navbar-light .navbar-text a {
	color: rgba(109, 140, 27, 0.9);
}

.navbar-light .navbar-text a:focus, .navbar-light .navbar-text a:hover {
	color: rgba(109, 140, 27, 0.9);
}
.navbar-brand {
	max-width:180px;
}
nav .nom {
	/*font-family: Allura, cursive; */
	font-family: Allura, cursive, Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	color: rgb(109, 140, 27);
	font-size: 3.1rem; 
	text-shadow: rgba(0, 0, 0, 0.298039) 2px 4px 3px; 
	line-height: 40px; 
	letter-spacing: 2px; 
	text-transform: none; 
	font-weight: bold; 
	font-style: italic; 
	text-decoration: none;
}
@media (min-width:1100px)  {
	nav {
		max-width: 1350px;
		width:100%;
	}
}
/******************** Présentation de l'image principale *******************/
.col-md-12 {
	background-color: transparent;
	margin:150px 0 10px 0;
	text-align: center;
}
.modal-footer{
	margin:0 auto;
}
/************************* Colonne des news *****************/
.col-sm-3 {
	margin-top:20px;
	padding:20px;
	border: none;
	/*max-width:260px;*/
	background-color: #fff;
}
.present {
	/*border:1px solid #989696;
	-webkit-box-shadow: 10px 10px 15px rgba(0,0,0, 0.2); 
	-moz-box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.2);
	box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.2);*/
	box-shadow: 0 0 65px #eeecec inset, 0 0 20px #aba7a7 inset;
	border-radius: 10px;
	/*max-height:800px;*/
	padding:10px 10px 0px 10px;
}
.col-sm-3 h2 {
	text-align:center;
	font-style: italic;
	font-weight: 700;
	font-size: 1.2rem;
}
.col-sm-3 p {
	text-align:left;
	font-weight: 500;
	font-size: .8rem;	
	line-height: 1.3rem;
	margin:0 auto;
}
.col-sm-3 form {
	margin:0 auto;
}
hr {
	width:90%;
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-bottom: 3px solid rgba(0, 0, 0, 1);
}
/************************* Colonne des articles *****************/

.col-sm-9 {
	margin:20px auto 0 auto;
	padding:30px;	
	background-color: #fff;
	border-radius: 10px;
	max-width:850px;
	/*border:1px solid #989696;*/
	/*-webkit-box-shadow: 10px 10px 15px rgba(0,0,0, 0.2); 
	-moz-box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.2);
	box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.2);*/	
	box-shadow: 0 0 65px #eeecec inset, 0 0 30px #96ac9a inset;
}
.col-sm-9 p {
	text-align:left;
	font-size: 1rem;
	line-height: 1.6rem;
}
.col-sm-9 h3 {
	text-align:left;
	font-weight: 700;
	font-size: 1.2rem;
}
.col-sm-9 h4 {
	text-align:center;
	font-weight: 600;
	font-size: 1.2rem;
	font-style:italic;
	cursor: pointer;
}
.col-sm-9 img {
	-webkit-box-shadow: 5px 5px 7px rgba(0,0,0, 0.4); 
	-moz-box-shadow: 5px 5px 7px rgba(0, 0, 0, 0.4);
	box-shadow: 5px 5px 7px rgba(0, 0, 0, 0.4);
	border-radius: 5px;
	border: 1px solid #ACA7A7
}
.choeur {
	-webkit-box-shadow: 10px 10px 15px rgba(0,0,0, 0.4); 
	-moz-box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.4);
	box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.4);
	border-radius: 10px;
	width:95%;
}
.place img{
	display: inline;
	float: right;
	margin: 10px 10px 10px 20px;
	max-width:200px;
}
.deplace img{
	display: inline;
	float: left;
	margin: 10px 10px 10px 20px;
	max-width:200px;
}
.col-sm-9 ul li a, .col-sm-3 ul li a {
	text-align: left;
	text-decoration: none;
}
#content, #content1 {
	max-width:300px;
	margin:-0 auto;
	background:#FFF;
	height:450px;
	padding:0 20px;
	border: solid 1px #9A9591;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	box-shadow: 0 0 65px #eeecec inset, 0 0 20px #beae8c inset;
}
#formulaire {
	margin-top: 50px;
}
#formulaire .modal-title {
	font-size: 1rem;
}
.deco {
	margin-top: 15px;
	margin-left: 15px;
	padding:0;
	height:25px;
	min-width:80px;
	line-height: 1rem;
	font-size: 0.8rem;
}
.decos {
	margin-top: -15px;
	margin-left:15px;
}
#content1 {
	height:250px;
	padding:20px;
}
#content2 {
	max-width:800px;
	margin:0 auto;
	background:#FFF;
	padding:20px;
	border: solid 1px #9A9591;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	/*box-shadow: 0 0 65px #eeecec inset, 0 0 20px #beae8c inset;*/
}
#content3 {
	width:1024px;
	margin:0 auto;
	background:#FFF;
	text-align: center;
	padding:10px;
	border: solid 1px #9A9591;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	box-shadow: 0 0 65px #eeecec inset, 0 0 20px #beae8c inset;
}
.error {
	text-align:center;
	font-weight: 500;
	font-size: 1.2rem;
	font-style:italic;
	color:crimson;
}
iframe {
	max-width:790px;
}
/*********Mise en forme des formulaires ****************/
.news input[type=text] {
	max-width:260px;
}
input[type=text], input[type=password]{
	width:auto;
	height:27px;
	line-height:25px;
	font-weight:500;
	color:#9A9591;
	margin-top:10px;
	border:solid 1px #9A9591;
	padding:2px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}
.news input[type=text] {
	width:260px;
}
.present  input[type=text] {
	width:265px;
}
#content1  input[type=text] {
	width:260px;
}
input[type=text]:focus{
	border:solid 1px #796C5A;
}
.col-sm-12 #content3 textarea{
	color:#0C0C0C;
	border:solid 1px #9A9591;
	padding:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

.col-sm-12 #content3 textarea:focus{
	border: solid #796C5A 1px;
}
.col-sm-9 textarea{
	width:260px;
	height:100px;
	color:#9A9591;
	border:solid 1px #9A9591;
	padding:2px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

.col-sm-9 textarea:focus{
	border: solid #796C5A 1px;
}

label, label .message{
	margin:0;
	margin-left:20px;
	font-size:1.1em;
	color:#4D4539;
	font-style:oblique;
}

label.message{
	display:block;
}

input[type=submit]{
	display:block;
	margin:20px auto 0 auto; 
	text-align:center;
}
.aspect td, .aspect td input {
	margin:0 3px;
	padding:0;
	font-size:0.8rem;
}
.aspect td input[type=text] {
	margin:0 2px;
	padding: 0 5px;
	font-size:0.8rem;
	color:#000000;
	width:90px;
}
.aspect td input[type=text].long {
	width:220px;
}
/***************** Pied de page ***************/
footer {
	max-width: 800px;
	/*height: 35px;*/
	margin: 15px auto;
	padding: 0px;
	color:#000;
	font-size:0.8rem;
	text-align: center;
	background-color: #fff;
}
footer p {
	font-size:0.6rem;

}
/********** Outils de gestion ****************/
.col-sm-12 h2 {
	text-align:center;
	font-family: Allura, cursive;
	color: rgb(109, 140, 27);
	font-style: normal;
	font-weight: bold;
	font-size: 2.2rem;
	text-shadow: rgba(0, 0, 0, 0.298039) 2px 4px 3px; 
}
.col-sm-12 .table {
	max-width:1000px;
	margin:10px auto;
	border-radius:10px;
}
/***************** Présentation et Animation des PHOTOS *******************/
.view {
   width: auto;
   height: auto;
   max-width:237px;
   max-height:180px;
   margin: 50px auto;
   float: left;
   border: 1px solid #909090;
   border-radius:5px;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 3px 3px 5px #e6e6e6;
   -moz-box-shadow: 3px 3px 10px #808080;
   box-shadow: 3px 3px 10px #808080;
   cursor: default;
   background: #fff url(../images/bgimg.jpg) no-repeat center center;
}
.view .mask,.view .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
   border-radius:5px;
}
.view img {
   display: block;
   position: relative;
}
.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 14px;
   padding: 5px;
   background: rgba(0, 0, 0, 0.8);
   margin: 5px 0 0 0;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 10px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 2px 10px;
   background: #000;
   font-size: 12px;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a .info:hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}
/******************** Les effets **************************/

.view-sixth img {
   -webkit-transition: all 0.4s ease-in-out 0.5s;
   -moz-transition: all 0.4s ease-in-out 0.5s;
   -o-transition: all 0.4s ease-in-out 0.5s;
   -ms-transition: all 0.4s ease-in-out 0.5s;
   transition: all 0.4s ease-in-out 0.5s;
}
.view-sixth .mask {
   background-color: rgba(146,96,91,0.8);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-in 0.4s;
   -moz-transition: all 0.3s ease-in 0.4s;
   -o-transition: all 0.3s ease-in 0.4s;
   -ms-transition: all 0.3s ease-in 0.4s;
   transition: all 0.3s ease-in 0.4s;
}
.view-sixth h2 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   margin: 8px 5px 0px 5px;
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -webkit-transition: all 0.3s ease-in-out 0.1s;
   -moz-transition: all 0.3s ease-in-out 0.1s;
   -o-transition: all 0.3s ease-in-out 0.1s;
   -ms-transition: all 0.3s ease-in-out 0.1s;
   transition: all 0.3s ease-in-out 0.1s;
}
.view-sixth p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -webkit-transition: all 0.3s ease-in-out 0.2s;
   -moz-transition: all 0.3s ease-in-out 0.2s;
   -o-transition: all 0.3s ease-in-out 0.2s;
   -ms-transition: all 0.3s ease-in-out 0.2s;
   transition: all 0.3s ease-in-out 0.2s;
}
.view-sixth a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -webkit-transition: all 0.3s ease-in-out 0.1s;
   -moz-transition: all 0.3s ease-in-out 0.1s;
   -o-transition: all 0.3s ease-in-out 0.1s;
   -ms-transition: all 0.3s ease-in-out 0.1s;
   transition: all 0.3s ease-in-out 0.1s;
}
.view-sixth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover img {
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover h2 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.view-sixth:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
.view-sixth:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.3s;
   -moz-transition-delay: 0.3s;
   -o-transition-delay: 0.3s;
   -ms-transition-delay: 0.3s;
   transition-delay: 0.3s;
}
/******** Présentation des choristes ************/
.view1 {
   width: auto;
   height: auto;
   max-width:120px;
   max-height:120px;
   margin: 10px auto;
   float: left;
   border: 1px solid #909090;
   border-radius:5px;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 3px 3px 5px #e6e6e6;
   -moz-box-shadow: 3px 3px 10px #808080;
   box-shadow: 3px 3px 10px #808080;
   cursor: default;
   background: #fff url(../images/bgimg.jpg) no-repeat center center;
}
.view1 .mask,.view1 .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
   border-radius:5px;
}
.view1 img {
   display: block;
   position: relative;
}
.view1 h2 {
   /*text-transform: uppercase;*/
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 11px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 15px 0 0 0;
}
.view1 p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 11px;
	line-height: 13px;
   position: relative;
   color:#101A44;
   padding: 10px 20px 20px;
   text-align: center;
}
.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(181,189,186, 0.7);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.view-first h2 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-first:hover h2,
.view-first:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}

/********************* Media Queries ****************/
@media (min-width:992px) and (max-width: 1050px)  {
	.view {
	   max-width: 230px;
	   max-height: 170px;
	}
}
@media (min-width:905px) and (max-width: 1100px)  {
	.present  input[type=text] {
		width:200px;
	}
}
@media (min-width:680px) and (max-width: 905px)  {
	.present  input[type=text] {
		width:150px;
	}
	.present {
		max-height: 1200px;
	}
}
@media (min-width:576px) and (max-width: 680px)  {
	.present  input[type=text] {
		width:120px;
	}
	.present {
		max-height: 1200px;
	}
}

.qq-upload-button {
	margin:0 auto;
	width: 180px;
	height: 35px;
	line-height: 30px;
	text-align: center;
	border: 1px solid #fff;
	background: #000;
	color:#fff;
	border-radius: 5px;
}

.qq-upload-list {
	display: none;
}

#loadBar {
	width: 0px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	background: #f3188b;
}

#FileName {
	color:chartreuse;
}