/*


  Layer Template


  http://www.templatemo.com/preview/templatemo_438_layer


*/



@import url(http://fonts.googleapis.com/css?family=Forum:400);



@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);

/*@font-face {
    font-family: Forum;
    src: url(../fonts/forum/Forum-Regular.ttf); #heading-pages
}

@font-face {
    font-family: Lato;
    src: url(../fonts/lato/Lato-Light.ttf);
}
*/


/*BASIC*/




body {

	font-family: 'Forum', cursive;


  background-color: #eee!important;


  overflow-x: hidden;


}


ul {


  padding: 0;


  margin: 0;


}





p {


  color: #787878;


  line-height: 24px;
	font-size:17px;


}







.blue {


  color: #06C;


}

.audioPlayer{
  display: block;
  border-radius: 20px;
  margin:0 auto 20px auto;
}

#top .titre-site, h1, h2, .nav a, 
 p {
}
#top .titre-site {
	font-size:30px;
	padding:15px 0 15px 5px
}

.first_part {
	margin-bottom:25px
}
.first_part p {
	font-size:18px;
}
.panel-group {
 margin-top:20px;
}
.panel, .panel-default {
 margin-bottom:20px;
}
.panel-heading {
  background-color: #fff;
}
.panel-title:hover i {
  color: #fff;
  background-color: #cca875;
  cursor: pointer;
  -webkit-transition: all 0.5s ease 0s;
          transition: all 0.5s ease 0s;
  border-color: transparent;
}

.panel-title i {
 margin-right:10px;
  font-size: 26px;
  color: #cca875;
  border: 1px solid #e7e7e7;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  line-height: 60px;
  display: inline-block;
  text-align: center;
}


.green {


  color: #090;


}





.lightgreen {


  color: #3C6;


}





.yellow {


  color: #CC6;


}





.orange {


  color: #C60;


}





.white {


  color: #FFF;


}









.templatemo-flexbox {


  display: -webkit-box;


  display: -webkit-flex;


  display: -ms-flexbox;


  display: flex;


  -webkit-box-align: center;


  -webkit-align-items: center;


      -ms-flex-align: center;


          align-items: center;


  height: 100%;


}








/*PARALLAX*/





[class*="bg__"] {


  height: 100vh;





  position: relative;


  /* fix background */


  background-attachment: fixed;





  /* center it */


  background-position: center center;





  /* Scale it nicely to the element */


  background-size: cover;





  /* just make it look a bit better ;) */


  &:nth-child(2n) {


    box-shadow: inset 0 0 1em #111;


  }


}





.bg__first {


  background-image: url(../img/slides/PortraitJosquin2000.jpg);
  
	background-attachment:scroll;
background-repeat:no-repeat;
background-size: 100vmax 100vmax;
-webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;


}


.bg__first .container {


  height: 75.5vh;


  min-height: 440px;


}





.bg__second {


  border-bottom: 3px solid #cca875;


  height: 45vh;


  background-image: url(


    ../img/second-bg.jpg


  );


}





.bg__third {


  height: 100vh;
	/*height:auto;*/




  background-image: url(


    ../img/soliste-1200.jpg


  );
	background-attachment:scroll;
background-repeat:no-repeat;
background-size: 100vmax 100vmax;
-webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;

}





.bg__fourth {


  height: 40vh;





  background-image: url(


    ../img/fourth-bg.jpg


  );


}

















/*HEADER*/





.navbar-brand img {


  display: inline-block;


  margin-right: 5px;


}





.navbar-brand {


  /*font-size: 18px;


  font-weight: 700;*/


  color: #1e1e1e!important;


  text-transform: uppercase;


  text-shadow: none!important;


}





.navbar {


  margin-bottom: 0px!important;


}





.navbar-inverse {


  background-image: none;


  /*background-color: #fff!important;*/
	background: rgba(255, 255, 255, 0.8);


  border-radius: 0!important;


  border-color: transparent!important;


  border-bottom: 1px solid #ddd!important;


}





.nav a {

  text-transform: uppercase;


  font-size: 16px;


  color: #1e1e1e!important;


  text-shadow: none!important;


  margin-left: 12px;  


}





.nav a:hover {


  color: #cca875!important;


    -webkit-transition: all 0.3s ease 0s;


            transition: all 0.3s ease 0s;


}





.nav li:hover .sub-menu { /*http://www.greywyvern.com/?post=337*/


  visibility: visible;


  opacity: 1;


}





.nav span {


  font-size: 13px;


  font-weight: 600;


  color: #fff;


  margin-top: -10px;


  display: inline-block;


  background-color: #cca875;


  padding: 6px 12px;


  text-align: center;


  border-color: transparent;


}





.nav .sub-menu {


  border-top: 1px solid #fff;


  margin-left: 30px;


  position: absolute;


  /*background-color: #fff;*/
	background-color: rgba(255, 255, 255, 0.8);


  width: 190px;


  visibility: hidden;


  opacity: 0;


  -webkit-transition: opacity 1.5s ease;


          transition: opacity 1.5s ease;


  z-index: 12;


}





.nav .sub-menu li {


  list-style: none;


  padding: 10px 0px;


  border-bottom: 1px solid #eee;


}





.nav .sub-menu li:first-child {


  border-top: 3px solid #cca875;


}





.nav .sub-menu li a {


  font-size: 15px;


  text-decoration: none;


}





/*SECTIONS*/








/*First Section*/





.left-image {


  float: right;


  overflow: hidden;


  background-size: cover;


  max-width: 100%;


}





.right-caption {


  color: #fff;


}





.right-caption h4 {


  font-size: 24px;


  font-weight: 600;


  color: #fff;


}





.right-caption h2 {


  font-size: 42px;


  font-weight: 600;


  text-transform: uppercase;


  color: #fff;


  padding-bottom: 10px;


  margin-top: 30px;


}





.right-caption p {


  color: #fff!important;


}





.stroked-button {


  margin-top: 40px;


}





.stroked-button a {


  margin-top: 30px;


  text-decoration: none!important;


  color: #fff;


  font-size: 13px;


  font-weight: 600;


  padding: 10px 16px;


  border: 1px solid #fff;


  border-radius: 5px;


}





.stroked-button a:hover {


  color: #cca875;


  border-color: #cca875;


    -webkit-transition: all 0.3s ease 0s;


            transition: all 0.3s ease 0s;


}





.arrow {


  position: absolute;


  left: 0;


  bottom: 72px;


  width: 100%;


  text-align: center;


}





.arrow i {


  font-size: 22px;


  color: #fff;


  width: 30px;


  height: 30px;


  line-height: 28px;


  display: inline-block;


  text-align: center;


  border: 1px solid #fff;


  border-radius: 50%;


}





.arrow i:hover {


  color: #cca875;


  border-color: #cca875;


  -webkit-transition: all 0.3s ease 0s;


          transition: all 0.3s ease 0s;


}





.arrow:active .btn {


  box-shadow: none;


}





/*Second Section*/








.sevice-items {


  margin-top: 40px;


}





.single-item {


  background-color: #fff;


  text-align: center;


  margin-bottom: 20px;


}





.single-item:hover i {


  color: #fff;


  background-color: #cca875;


  cursor: pointer;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


  border-color: transparent;


}





.single-item i {


  margin-top: 30px;


  font-size: 26px;


  color: #cca875;


  border: 1px solid #e7e7e7;


  border-radius: 50%;


  width: 80px;


  height: 80px;


  line-height: 80px;


  display: inline-block;


  text-align: center;


}





.single-item h2 {


  font-size: 20px;


  color: #1e1e1e;


  font-weight: 700;


  text-transform: uppercase;


}





.single-item p {


  margin-top: 10px;


  margin-left: 20px;


  margin-right: 20px;


  padding-bottom: 20px;


}





.service-arrow  {


  text-align: center;


  margin-top: 10px;


  padding-bottom: 20px!important;


}





.service-arrow i {


  font-size: 22px;


  color: #cca875;


  width: 30px;


  height: 30px;


  line-height: 28px;


  display: inline-block;


  text-align: center;


  border: 1px solid #cca875;


  border-radius: 50%;


}





.service-arrow i:hover {


  color: #cca875;


  border-color: #cca875;


  -webkit-transition: all 0.3s ease 0s;


          transition: all 0.3s ease 0s;


}





.service-arrow:active .btn {


  box-shadow: none;


}








/*Third Section*/








.left-text {


  position: absolute;


  margin-top: 10%;


  background-color: #fff;


  border-top: 3px solid #cca875;


}





.left-text h2 {


  margin-right: 30px;


  margin-left: 30px;


  padding-top: 10px;


  padding-bottom: 15px;


  font-size: 20px;


  color: #1e1e1e;


  font-weight: 700;


}





.left-text .line {


  margin-left: 30px;


  width: 180px;


  height: 2px;


  background-color: #ddd;


}





.left-text p {


  margin: 30px;


}





.left-text .button {


  margin: 30px;


  padding-bottom: 30px;


}





.left-text a {


  text-decoration: none!important;


  font-size: 13px;


  font-weight: 600;


  padding: 7px 10px;


  margin: 0px;


  color: #fff!important;


  background-color: #cca875;


}








/*Fourth Section*/





.right-text {


  position:absolute; 


  z-index: 11;


  background-color: #fff;


  border-top: 3px solid #cca875;


}





.right-text h2 {


  margin-right: 30px;


  margin-left: 30px;


  padding-top: 10px;


  padding-bottom: 15px;


  font-size: 20px;


  color: #1e1e1e;


  font-weight: 700;


}





.right-text .line {


  margin-left: 30px;


  width: 180px;


  height: 2px;


  background-color: #ddd;


}





.right-text p {


  margin: 30px;


}





.right-text .button {


  margin: 30px;


  padding-bottom: 30px;


}





.right-text a {


  text-decoration: none!important;


  font-size: 13px;


  font-weight: 600;


  padding: 7px 10px;


  margin: 0px;


  color: #fff!important;


  background-color: #cca875;


}





.templatemo-position-relative {


  position: relative;


}





#third-section,


#third-section .container,


#third-section .row,


#fourth-section,


#fourth-section .container,


#fourth-section .row {


  height: 100%;


}


.fourth-arrow {


  text-align: center;


  position: absolute;


  bottom: 20px;


  left: 0;


  width: 100%;


}





.fourth-arrow i {





  font-size: 22px;


  color: #fff;


  width: 30px;


  height: 30px;


  line-height: 28px;


  display: inline-block;


  text-align: center;


  border: 1px solid #fff;


  border-radius: 50%;


}





.fourth-arrow i:hover {


  color: #cca875;


  border-color: #cca875;


  -webkit-transition: all 0.3s ease 0s;


          transition: all 0.3s ease 0s;


}





.fourth-arrow:active .btn {


  box-shadow: none;


}





/*fifth Section*/





#fifth-section {


  text-align: center;


  padding-top: 40px;


  background-color: #fff;


}





#fifth-section h1 {


  font-size: 22px;


  color: #1e1e1e;


  font-weight: 700;


  text-transform: uppercase;


  padding-bottom: 15px;


  border-bottom: 1px solid #cca875;





}





#fifth-section p {


  margin-top: 5px;


}





.submit-form {


  margin-top: 40px;


}





.submit-form input {


  color: #888;


  padding: 8px 10px;


  font-size: 13px;


  width: 100%;


  outline: none;


  border: 1px solid #ddd;


}





.submit-form select {


  color: #888;


  padding: 8px 10px;


  font-size: 13px;


  width: 100%;


  outline: none;


  border-color: #ddd;


}





#fifth-section .templatemo-submit {


  display: block;


  margin-top: 24px;


  margin-bottom: 60px;


  text-decoration: none;


  font-size: 13px;


  font-weight: 600;


  padding: 10px 60px;


  color: #fff;


  background-color: #cca875;


  border: 0px;


}





.templatemo-center {


  text-align: center;


}





/*FOOTER*/





footer {


  background-color: #cca875;


  text-align: center;
bottom:0


}





.social-icons li {


  margin-top: 60px;


  list-style: none;


  display: inline-block;


}





.social-icons a {


  color: #cca875;


  margin: 0 5px;


  width: 25px;


  height: 25px;


  border-radius: 50%;


  background-color: #fff;


  text-align: center;


  display: inline-block;


  line-height: 25px;


}





.social-icons a:hover {


  background-color: #cca875;


  color: #fff;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


}


.flags {
	margin-left:7px;

  width: 30px;


  height: 25px;


  border-radius: 30%;

  border: 1px solid #cca875;

}
.flags:hover {
	

  border: 1px solid #fff;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


}


.copyright-text p {


  text-transform: uppercase;


  margin-top: 20px;


  font-size: 16px;


  color: #fff;


  font-weight: 300;


  padding-bottom: 10px;


}





.copyright-text a {


  /*color: #f9c9c9!important;*/

  color: #ffffff;


  text-decoration: none;


}





.third-arrow  {


  text-align: center;


  padding-bottom: 40px;


}





.third-arrow i {


  font-size: 22px;


  color: #cca875;


  width: 30px;


  height: 30px;


  background-color: #fff;


  line-height: 28px;


  display: inline-block;


  text-align: center;


  border: 1px solid #fff;


}





.third-arrow i:hover {


  -webkit-transition: all 0.3s ease 0s;


          transition: all 0.3s ease 0s;


}





.third-arrow:active .btn {


  box-shadow: none;


}











/*SIDEBAR*/








#heading-pages img {


  height: auto;


  overflow: hidden;


  width: 100%;


  border-bottom: 3px solid #cca875;


  background-repeat: no-repeat;


}








#heading-pages {


  text-align: center;


}





#heading-pages h2 {


  margin-top: 60px;


  font-size: 26px;


  color: #1e1e1e;


  font-weight: 700;


  text-transform: uppercase;


  border-bottom: 1px solid #cca875;


  padding-bottom: 15px;


}





#heading-pages p {


  margin-top: 5px;


  font-size: 20px;


  padding-bottom: 30px;


}





.main-post {


  padding-bottom: 60px;


}





.image-post img {


  width: 100%;


  overflow: hidden;


  border-bottom: 3px solid #cca875;


}





.post-content {


  background-color: #fff;


  margin-top: -20px;


}





.post-content h2 {


  font-size: 18px;


  color: #1e1e1e;


  font-weight: 300;


  text-transform: uppercase;


  padding: 30px 0 30px 0px;
text-align:center


}





.post-content p {


  padding: 0px 30px 15px 30px;/**/
text-align:left


}





.post-content blockquote {

text-align:left;


  color: #555;


  border-left: 3px solid #cca875;


  margin-left: 30px;


  margin-right: 30px;


}
.post-content blockquote h3{

	font-family: 'Forum', cursive;
  font-weight: 600;

  font-size: 17px;
	margin: 3px 0;
	padding:0
}
.post-content blockquote p{
	text-align:left;

  font-weight: 300;

  font-size: 16px;
	margin: 0 0 10px 15px;
	padding:0
}




.first-widget {


  padding-bottom: 60px;


}





.widgets h4 {


  margin-top: 0px;


  font-size: 20px;


  color: #1e1e1e;


  font-weight: 700;


  text-transform: uppercase;


  padding-bottom: 15px;


}





.widget-social li {


  margin-top: 15px;


  list-style: none;


  display: inline-block;


}





.widget-social a {


  font-size: 13px;


  color: #fff;


  margin: 0 5px;


  width: 25px;


  height: 25px;


  border-radius: 50%;


  background-color: #aaa;


  text-align: center;


  display: inline-block;


  line-height: 25px;


}





.widget-social a:hover {


  background-color: #cca875;


  color: #fff;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


}





.second-widget {


  padding-bottom: 70px;


}





.posts {


  display: inline;


}





.posts img {





}





.posts a {


  text-decoration: none;


  color: #1e1e1e;


}





.posts a:hover {


  color: #cca875;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


}





.posts h6 {


  font-size: 15px;


  color: #1e1e1e;


  font-weight: 700;


  margin-left: 135px;


  margin-top: -80px;


  line-height: 22px;


}





.posts span {


  font-size: 12px;


  color: #999;


  font-weight: 300;


  display: inline;


  margin-left: 135px;


}





.post1 {


  margin-top: 30px;


}





.post2 {


  margin-top: 40px;


}





.third-widget {


  padding-bottom: 50px;


}





.third-widget ul {


  margin-top: 20px;


}





.third-widget li {


  list-style: none;


  padding-bottom: 5px;


}





.third-widget li a:hover p {


  color: #cca875;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


}





.third-widget li a:hover span {


  color: #cca875;


  -webkit-transition: all 0.5s ease 0s;


          transition: all 0.5s ease 0s;


}





.third-widget a {


  font-size: 13px;


  font-weight: 600;


}





.third-widget li p {


  display: inline-block;


  color: #aaa;


}





.third-widget li span {


  float: right;


  color: #aaa;


}





/*ELEMENTS*/





.elements-headings {


  margin-top: 60px;


  padding-bottom: 20px;


}





.elements-headings h2 {


  font-size: 18px;


  color: #1e1e1e;


  font-weight: 700;


  text-transform: uppercase;


  border-bottom: 3px solid #ddd;


  padding-bottom: 10px;


}





.heading-levels h1 {


  margin-top: 0px;


}





.photos img {


  margin-top: 20px;


  width: 100%;


  overflow: hidden;


  background-size: cover;


}





.elements {


  padding-bottom: 0px;


}





.main-footer {


  margin-top: 80px;


  margin-bottom: -80px;


}





/*RESPONSIVE*/





@media (max-width: 991px) { 

	.nav a {
  font-size: 14px;
  margin-left: 3px;  


}

	#audio {
		margin:15px 5px
	}
	.bg__first {


  	background-image: url(../img/PortraitJosquin800.jpg);
	}
	.bg__third {

		height: 200vh;
  }
	
  .fourth-arrow {


    text-align: center;


    margin-top: 92vh;


  }


    .submit-form select {


    margin-top: 15px;


  }


  .submit-form input {


    margin-top: 15px;


  }


}





@media (max-width: 767px) {
	#top .titre-site {
	font-size:25px;
	}/**/
	.panel-title {}
	
	.panel-title i {
 margin-right:5px;
  font-size: 22px;
 
  width: 45px;
  height: 45px;
  line-height: 45px;
}
	.panel-heading h2 {
  		font-size: 18px;
  		text-align:center
	}
	.bg__third {

		height: 250vh;
  }
	.nav a {
  font-size: 16px;
  margin-left: 12px;  


}

  .right-caption h4 {


    font-size: 16px;


  }


  .right-caption h2 {


    font-size: 26px;


  }


  .left-image {


    float: none;    


  }


  .left-image img {


    margin: 0 auto;


  }


  .right-caption {


    text-align: center;


    margin-top: 10px;


    padding-bottom: 0;


  }


  .right-caption h2 {


    padding-bottom: 0px;


    margin-top: 0px;


  }


  .right-caption p {


    margin-top: -5px;


  }


  .stroked-button {


    padding-bottom: 15px;


    padding-top: 10px;


    margin-top: 10px;


  }


  .nav .sub-menu {


    display: block;


    position: relative;


    opacity: 1;


    visibility: visible;


    text-align: left;


  }


  .sub-menu a {


    color: #999!important;


  }


  .navbar-inverse .navbar-toggle {


    border-color: #cca875!important;


    background-color: #cca875;


  }


  .navbar-inverse .navbar-toggle:hover {


    background-color: #cca875!important;


  }


  .right-text .button {


    padding-bottom: 0px;


  }


  .left-text .button {


    padding-bottom: 0px;


  }


}





@media (max-width: 640px) {


  .left-image img {


    width: 128px;


  }


}


@media (max-width: 480px) {


  .arrow {


    bottom: 20px;


  }


}


@media (max-height: 600px) {


  .bg__third, .bg__fourth {


    min-height: 600px;


  }


}


@media (max-height: 500px) {


  .bg__first {


    min-height: 520px;


  }


}