/* Général */

body {
	background: url(images/fond.jpg)  fixed;
	background-size: cover; /* version standardisée */
	-webkit-background-size: cover; /* pour Chrome et Safari */
	-moz-background-size: cover; /* pour Firefox */
	-o-background-size: cover; /* pour Opera */

	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #4F2511;
	line-height: 175%;
	margin:0px;
	padding:0px;
        width:100%;
        height:100%
}

h1, h2, h3 {
	margin-top: 0;
}

h1 {
	font-size: 2em;
}

h2 {
	font-size: 1.6em;
        padding-bottom:3px;
}

h3 {
	font-size: 1em;
        margin:0px;
        padding-bottom:2px;
}

ul {
        list-style-image: url(images/img04.gif);
        padding:0px 0px 0px 20px;
}

li {
        padding-left:0px;
}

a {
	text-decoration: none;
	color: #7A5212;
}

a:hover {
        color: #CF8105;
}

a img {
	border: none;
}



/* Squelette Global*/

#top {
        width: 535px;
     	float: left;
     	height: 50px;
     	padding: 0px 0px 0px 20px;
}

#page {
      	width: 950px;
        height:100%;
        margin: 0 auto;
	    padding: 0px;
        background: url(images/fond1.jpg);
}

#page1 {
      	width: 1100px;
        height:100%;
        margin: 0 auto;
	    padding: 0px;
        background: url(images/fond3.jpg);
}



#page_garde {
            display:none;
}

#page_toptop {
   	position: fixed;
   	width: 100%;
   	height: 60px;
   	top: 0px;
   	bottom: 0px;
   	background:#5C3F00;
   	z-index: 10;
   	margin:0;
}

#progress{
	background-color: #FFB00D;
	height: 1px;
	width: 0;
	position: fixed;
	top: 0px;
	left: 0;
	z-index: 9999; /* Peut être important si vous avez un menu en position fixe */
}

#page_top {
        background:url('images/fondtop.gif') no-repeat;
	margin: 0 auto;
        height:50px;
        width:950px;
}

#page_bottom {
        background:url('images/fondbottom.gif') no-repeat;
	margin: 0 auto;
        height:50px;
        width:950px;
}

#page_top1 {
        background:url('images/fondtop1.gif') no-repeat;
	margin: 0 auto;
        height:50px;
        width:1100px;
}

#page_bottom1 {
        background:url('images/fondbottom1.gif') no-repeat;
	margin: 0 auto;
        height:50px;
        width:1100px;
}

#page_bottombottom {
   	position: fixed;
   	width: 100%;
   	height: 20px;
   	bottom: 0px;
   	background:#5C3F00;
   	z-index: 10;
   	margin:0;
}



/* Main Column */

#content {
     font-size:11px;
    float: left;
        padding: 0px 10px 0px 20px;
	width: 555px;
 	   line-height:175%;
}

#content0 {
     font-size:11px;
    float: left;
        padding: 0px 10px 0px 20px;
	width: 555px;
    	line-height:175%;
}

#content1 {
          display: none;
}

#content2 {
          display: none;
}

#contentcom {
    font-size:11px;
	float: left;
        padding: 0px 10px 0px 20px;
	width: 545px;
	    line-height:175%
}

#contentcom1 {
    font-size:11px;
	float: left;
        padding: 0px 10px 0px 20px;
	width: 570px;
    	line-height:175%
}

#contentcom2 {
    font-size:11px;
	float: left;
        padding: 0px 0px 0px 30px;
	width: 705px;
    	line-height:175%
}

#contentcom3 {
    font-size:11px;
    float: left;
    padding: 0px 10px 0px 20px;
	width: 570px;
	line-height:175%;
    margin:0px 0px 0px 90px;
}

/* Sidebar */

#sidebar {
        float:right;
        padding:0px;
}

#sidebar-1 {
        width:350px;
        text-align:center;
        padding:0px;
}

#sidebar-2 {
        width:340px;
        text-align:left;
        padding:0px;
}

#sidebar-hr {
        width:340px;
        padding:10px 0px 10px 0px;
        text-align:center;
}

#sidebar-bloc1 {
        float:right;
        padding:5px 0px;
        width:170px;
        text-align:left;
}

#sidebar-bloc1 ul {
        padding:0px 0px 0px 25px;
}

#sidebar-bloc2 {
        padding:5px 0px;
        width:170px;
        text-align:left;
}

#sidebar-bloc2 ul {
        padding:0px 0px 0px 25px;
}

#sidebar-bloc3 {
        float:right;
        margin-right:25px;
        width:150px;
        text-align:left;
}

#sidebar-video {
        padding:10px 0px 0px 0px;
}

#sidebar-videomore {
        text-align:right;
        padding-right:35px;
        padding-bottom:10px;
}




/* Entetes */

.title_cat1 {
	    margin-top:25px;
       	padding:5px 0px 15px 0px;
}



/* Main Intern */

.main01_divbig {
	padding:0px;
    margin:0px;
	vertical-align: top;
	font-size:11px;
	line-height:135%;
}

.main01_divright {
	float:right;
	width:49%;
	padding:0px 5px 0px 30px;
	vertical-align: top;
	font-size:11px;
	line-height:135%;
 margin:0px;
}

.main01_divleft {
    width:50%;
	padding:0px;
	vertical-align: top;
	font-size:11px;
	line-height:135%;
 margin:0px;
}

.bigmain11 {
 	width:100%;
	padding:0px;
	border:1px solid #000000;
	font-size:13px;
	background-color:#E9E4C6;
	text-align:left;
    margin:0px;
}

.main11 {
 	width:525px;
	padding:10px 10px 10px 25px;
	font-size:11px;
	background-color:#E9E4C6;
	-moz-border-radius: 4px;
	text-align:left;
}

.main12 {
 	width:535px;
	padding:10px;
        min-height:390px;
	border:1px solid #000000;
	font-size:11px;
	background-color:#E9E4C6;
	-moz-border-radius: 4px;
	text-align:left;
}

.main13 {
 	width:535px;
	padding:10px 10px 10px 15px;
    border:0;
	font-size:11px;
	background-color:#E9E4C6;
	-moz-border-radius: 4px;
	text-align:left;
}

.main15 {
    margin-bottom:30px;
    width:535px;
    padding:10px;
    padding-left:15px;
    font-size:11px;
}

.main21max {

}

.main21min {
    display:none;
}

/* Articles */

.titre {
       margin-top:5px;
       float:left;
       width:350px;
}

.titre img {
       width:90%;

}

.title1 {
	font-weight:bold;
	margin: 0;
}

.title1 a {
        color: #7A5212;
        text-decoration: none;
}

.title1 a:hover {
        color: #CF8105;
        text-decoration:none;
}

.title2 {
	font-size:12px;
	font-weight:bold;
	margin: 0;
}

.title2 a {
        color: #7A5212;
        text-decoration: none;
}

.title2 a:hover {
        color: #CF8105;
        text-decoration:none;
}

.title2_cat {
	text-align:right;
	padding:0px 0px 10px 0px;
}

#article1 {
        background:url('images/fondarticle1.jpg') repeat-y;
        padding:10px;
}

#article2 {
        background:url('images/fondarticle2.jpg') no-repeat;
        height:5px;
}

#article3 {
        background:url('images/fondarticle3.jpg') repeat-y;
        padding:5px 5px 5px 5px;
}

#article4 {
        background:url('images/fondarticle4.jpg') no-repeat;
        height:5px;
}

.article_cat {
        float:left;
        margin:0px;
        padding:0px;
}
.article_source {
        margin:0px;
        padding:0px;
}

#date {
        padding:2px;
        color:#5C3F00;
        text-align:center;
        float:right;
        padding-right:10px;
}

#datejour {
          font-size:16px;
}




/* Divers */

.sentence {
          color:#BCA87A;
          padding-top:31px;
}

.source {

}

.entetemax {

}

.entetemin {
          display: none;
}

.artmin {
    float:none;
    padding:0px;
    margin:10px 0px 0px;
    height:31px;
    text-align:left;
    line-height: 100%;
    overflow: visible;
    width:97%;
}

.artmin :hover {
  	background-color: #DBD18D;
    cursor: pointer;
    color: #CF8105;
}

.artmin :hover a  {
        color: #CF8105;
}

.post {
        margin-bottom: 20px;
	padding-bottom: 25px;
	line-height: 135%;
}

#latest-post {
	padding: 20px;
}

#calendrier {
        font-size:11px;
}

#cat {
	font-size:11px; 
	font-weight:600;
}

#playlist {
    width:525px;
	padding:10px; 
	padding-left:5px;
 	border:1px solid #000000; 
	font-size:11px; 
	background-color:#E9E4C6;
	-moz-border-radius: 4px; 
	text-align:left;
}

#videolist {
	width:525px;
	padding:10px;
	padding-left:5px;
 	border:1px solid #000000; 
	font-size:11px; 
	background-color:#E9E4C6;
	-moz-border-radius: 4px; 
	text-align:left;
}

#bloglist {
    width:525px;
	padding:10px;
	padding-left:5px;
 	border:1px solid #000000;
	font-size:11px;
	background-color:#E9E4C6;
	-moz-border-radius: 4px;
	text-align:left;
}

#podlist {
    width:515px;
    margin-top:70px;
    padding:10px 10px 10px 5px;
 	border:1px solid #000000;
	font-size:11px;
	background-color:#E9E4C6;
	-moz-border-radius: 4px;
	text-align:left;
}

#podlist li:hover {
  	background-color: #DBD18D;
    cursor: pointer;
    color: #CF8105;
}

.list li:hover {
  	background-color: #DBD18D;
    cursor: pointer;
    color: #CF8105;
}

.list li:hover a  {
        color: #CF8105;
}

.select_pod {
    font-family: Verdana; font-size: 10px; font-weight:bold; background-color:#FFFFFF; border:1px solid #000000; width:200px;
}

.fichejdr {
    border:0;
    padding:0px;
    font-size:14px;
    line-height: 135%;
    width:100%;
}

.evenement2 {
    padding:0px 5px;
    cursor:pointer;
}

.evenement2:hover {
    background-color: #E9E4C6;
}

.dateevene {
    float:left;
    width:60px;
    text-align:right;
    padding-right:10px;
    z-index:10px;
    background-color:#ffffff;
}

.imgdate {
	float:left;
	margin:5px 0px 0px;
}

.separator {
	border-bottom:1px solid #000;
	width:250px;
	margin:10px auto;
}

.table {
 	border:1px solid #000000;
	font-size:11px;
	background-color:#E9E4C6;
	-moz-border-radius: 4px;
	text-align:left;
}

.blogroll {
	float:right;
	width:130px;
	color:#7A5212;
	text-align:left;
	padding-left:10px;
}

.critique {
	margin-bottom:15px;
	border:1px solid #000000;
	padding:5px; width:472px;
	background-color:#DBBC75;
	text-align:justify;
	line-height:150%;
}

.im_serie {
    margin:0px;
    }

.cachediv {
	display: none;
}

.div_select {
    float:right;
    text-align:right;
    width:222px;
}

.select {
    font-family: Verdana;
    font-size: 10px;
    font-weight:bold;
    background-color:#FFFFFF;
    border:1px solid #000000;
    width:120px;
}

.vignette {
    width:92px;
    height:140px;
    margin:0px 2px 0px 0px;
    padding:5px;
    float:left;
}

.vignette img {
    width:88px;
    height:88px;
    border:1px solid #000000;
}


.form_tdv {
	margin-bottom:15px;
	border:1px solid #000000;
	padding:5px;
    width:515px;
	background-color:#E9E4C6;
	text-align:justify;
	line-height:150%;
}

.form_input_tdv {
    width:300px;
    padding:3px;
    font-weight:bold;
    background-color:#FDFEF8;
    border:1px solid #58452A;
    font-family: Verdana;
    font-size: 10px;
}

.form_text_tdv {
    width:400px;
    height:250px;
    font-weight:bold;
    background-color:#FDFEF8;
    border:1px solid #58452A;
    padding:3px;
    font-family: Verdana;
    font-size: 10px;
}

.form_submit_tdv {
    padding:5px;
    font-weight:bold;
    color:#F6F2EC;
    background-color: #9F8354;
    border:1px solid #58452A;
    font-family: Verdana;
    font-size: 10px;
}

.retourligne_tdv {
    height:7px;
}

.blocvign {
    float:left;
    margin:0px 0px 0px 7px;
    width:161px;
    height:161px;
    text-align:center;
    font-size:10px;
    border:1px solid #E9E4C6;
    padding:10px 5px 5px;
    line-height:120%;
    visibility: hidden;
    cursor: pointer;
    }

.blocvign:hover{
    background-color:#DBD18D;
    border:1px solid #000000;
    }

.blocvignimg {
    width:145px;
    height:108px;
    margin:0px auto 2px;
    overflow: hidden;
    border:1px solid #000000;
    }

.blocvignimg img {
    -webkit-transition: all 1s ease; /* Safari and Chrome */
    -moz-transition: all 1s ease; /* Firefox */
    -ms-transition: all 1s ease; /* IE 9 */
    -o-transition: all 1s ease; /* Opera */
    transition: all 1s ease;
    width:145px;
    height:108px;
    }

.blocvignimg:hover img {
    -webkit-transform:scale(1.25); /* Safari and Chrome */
    -moz-transform:scale(1.25); /* Firefox */
    -ms-transform:scale(1.25); /* IE 9 */
    -o-transform:scale(1.25); /* Opera */
    transform:scale(1.25);
    }

  .image {
    padding:0px;
    margin:-2px 10px 5px -2px;
    overflow: hidden;
    border:1px solid #000000;
    }

  .image img {
    -webkit-transition: all 1s ease; /* Safari and Chrome */
    -moz-transition: all 1s ease; /* Firefox */
    -ms-transition: all 1s ease; /* IE 9 */
    -o-transition: all 1s ease; /* Opera */
    transition: all 1s ease;
    }

  .image:hover img {
    -webkit-transform:scale(1.25); /* Safari and Chrome */
    -moz-transform:scale(1.25); /* Firefox */
    -ms-transform:scale(1.25); /* IE 9 */
    -o-transform:scale(1.25); /* Opera */
    transform:scale(1.25);
    }



/* Scrollbar */

.custom-scrollbar {

            font-size:11px;
            width:450px;
            height:310px;
            margin:0px auto;

            text-align:left;
            padding:15px 0px 15px 10px;
            border:1px solid #000000;
            overflow:auto;
            }

          .custom-scrollbar::-webkit-scrollbar {
            width: 9px;
            }
          .custom-scrollbar::-webkit-scrollbar-track { // set style to track
            background-color:#E9E4C6;
            border-radius: 9px;

            }
          .custom-scrollbar::-webkit-scrollbar-thumb { // sets style to thumb
            border-radius: 10px;
            background-color:#D6CB89;
            }
            
            

/* Menu Général 1 */

* {
  outline: none;
}

#nav-container {
  position: fixed;
  height: 100vh;
  width: 100%;
  pointer-events: none;
}
#nav-container .bg {
  position: absolute;
  top: 60px;
  left: 0;
  width: 100%;
  height: calc(100% - 60px);
  visibility: hidden;
  opacity: 0;
  transition: .3s;
  background: #000;
}
#nav-container:focus-within .bg {
  visibility: visible;
  opacity: .6;
}
#nav-container * {
  visibility: visible;
}

.button {
  float:right;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 1;
  -webkit-appearance: none;
  background: transparent;
  border-radius: 0;
  height: 45px;
  width: 20px;
  cursor: pointer;
  pointer-events: auto;
  margin-right: 25px;
  margin-top:7px;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.icon-bar {
  display: block;
  width: 100%;
  height: 3px;
  background: #B6A87A;
  transition: .3s;
}
.icon-bar + .icon-bar {
  margin-top: 5px;
}

#nav-container:focus-within .button {
  pointer-events: none;
}
#nav-container:focus-within .icon-bar:nth-of-type(1) {
  transform: translate3d(0,8px,0) rotate(45deg);
}
#nav-container:focus-within .icon-bar:nth-of-type(2) {
  opacity: 0;
}
#nav-container:focus-within .icon-bar:nth-of-type(3) {
  transform: translate3d(0,-8px,0) rotate(-45deg);
}
#nav-container:focus-within .button {
  pointer-events: none;
}


#nav-content {
  margin-top: 60px;
  padding: 20px 10px;
  width: 90%;
  max-width: 370px;
  position: absolute;
  top: 0;
  right: 0;
  	border-bottom:1px solid #000000;
  	border-right:1px solid #000000;
  	border-left:1px solid #000000;
  background: #E9E4C6;
  pointer-events: auto;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  transform: translateX(100%);
  transition: transform .3s;
  will-change: transform;
  contain: paint;
}

#nav-content ul {
  height: 100%;
  display: flex;
  flex-direction: column;
  list-style-type: none;
  list-style-image: none;
      padding: 0px;
    margin:0px;
}

#nav-content li {
padding-left:20px;
}

#nav-content li:hover {
  	background-color: #DBD18D;
}

#nav-content li:hover a {
  	color: #CF8105;
}

#nav-content li img {
   margin:8px 15px 0px 0px; float:left;
}


#nav-content li a {
  display: block;
  transition: color .1s;
}

#nav-content li a:hover {
  color: #CF8105;
}

#nav-content li:not(.small) + .small {
  margin-top: auto;
}

.small {
  display: flex;
  align-self: center;
}

.small a {
  font-size: 12px;
  font-weight: 400;
  color: #888;
}
.small a + a {
  margin-left: 15px;
}

#nav-container:focus-within #nav-content {
  transform: none;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.menupage {
          margin:0px;
          padding:0px;
}

.menutable {
    width:350px;
    line-height:170%;
}

.menutabletd {
          width:175px;
          padding-left:20px;;
}

.menulist {
          margin-left:5px;
          padding:0px;
          line-height:170%;
          list-style-type: none;
          list-style-image: none;
}

.menulist li {
  	list-style-type: none;
  	padding: 0px 5px;
        margin:0px 10px 0px 0px;
}

.menulist li:hover {
  	background-color: #DBD18D;
    cursor: pointer;
    color: #CF8105;
}

.menulist li:hover a  {
        color: #CF8105;
}

.menupage {
}

.menucache {
	display:none;
}


/* Retour Haut de page */

  a#cRetour{
    border-radius:3px;
    padding:10px;
    font-size:15px;
    text-align:center;
    color:#fff;
    background:rgba(0, 0, 0, 0.25);
    position:fixed;
    right:20px;
    opacity:1;
    z-index:99999;
    transition:all ease-in 0.2s;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    text-decoration: none;
    }
  a#cRetour:before{ content: "\25b2"; }
  a#cRetour:hover{
    background:rgba(0, 0, 0, 1);
    transition:all ease-in 0.2s;
    }
  a#cRetour.cInvisible{
    bottom:-35px;
    opacity:0;
    transition:all ease-in 0.5s;
    }
  a#cRetour.cVisible{
    bottom:20px;
    opacity:1;
    }


    
/* Effets Images */

  .image {
    padding:0px;
    margin:0px 10px 10px 0px;
    overflow: hidden;
    }

  .image img {
    -webkit-transition: all 1s ease; /* Safari and Chrome */
    -moz-transition: all 1s ease; /* Firefox */
    -ms-transition: all 1s ease; /* IE 9 */
    -o-transition: all 1s ease; /* Opera */
    transition: all 1s ease;
    }

  .image:hover img {
    -webkit-transform:scale(1.25); /* Safari and Chrome */
    -moz-transform:scale(1.25); /* Firefox */
    -ms-transform:scale(1.25); /* IE 9 */
    -o-transform:scale(1.25); /* Opera */
    transform:scale(1.25);
    }

.zoom img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.zoom img:hover {
	-webkit-transform: scale(1.3);
	transform: scale(1.3);
}



/* Barre de recherche */

.search {
  width: 290px;
  position: relative;
  display: flex;
}

.searchTerm {
  width: 250px;
  border: 1px solid #7A5212;
  border-right: none;
  margin-left:15px;
  padding: 5px;
  height: 36px;
  border-radius: 5px 0 0 5px;
  outline: none;
  color: #5C3F00;
}

.searchTerm:focus{
  color: #4F2511;
}

.searchButton {
  width: 40px;
  height: 36px;
  border: 0px solid #7A5212;
  background: #7A5212;
  text-align: center;
  color: #fff;
  border-radius: 0 5px 5px 0;
  cursor: pointer;
  font-size: 20px;
}

.search1 {
  width: 170px;
  position: relative;
  display: flex;
}

.searchTerm1 {
  width: 120px;
  border: 1px solid #7A5212;
  padding: 5px;
  height: 20px;
  border-radius: 5px 5px 5px 5px;
  outline: none;
  color: #5C3F00;
}

.searchTerm1:focus{
  color: #4F2511;
}

.searchButton1 {
  width: 30px;
  height: 20px;
  border: 0px solid #7A5212;
  background: #7A5212;
  text-align: center;
  color: #fff;
  border-radius: 5px 5px 5px 5px;
  cursor: pointer;
  font-size: 12px;
}
