/* template */
body {/*background-image: url(../images/grille.gif); background-repeat: repeat;*/}
#header{} 
#bandeau{} 
#filariane{} 
#navigation{} 
#menu-recherche{} 
#menu{} 
#recherche{} 
#wrap{width:99%; margin:0 auto;} 
#fulltop{background: #ffc107; border: 1px dotted red; padding:0 5px;}
#maincontent{} 
#left{} 
#maintop{padding:0 5px;} 
#main{padding:0 5px;} 
#mainbottom{padding:0 5px;} 
#asidetop{padding:0 5px;} 
#right{} 
#asidecenter{} 
#aside1{padding:0 5px;} 
#aside2{padding:0 5px;} 
#asidebottom{padding:0 5px;} 
#fullbottom{padding:0 5px;} 
#footer{}

/* archives */ 
#contenu{margin:10px auto; min-height: 400px; position: relative;} 
#page{float: left; padding:0 15px 0 5px; width: 60%;} 
#liste{float: right; height: 100%; padding:0 5px; overflow: auto; position: absolute; right: 0; top: 0; width: 40%;}
#liste{background:lightgray; background-image: -moz-linear-gradient(lightgray, white); background-image: -webkit-gradient(linear, 0 0, 0 100%, from (lightgray), to (white) ); background-image: -webkit-linear-gradient(lightgray, white);}  
#liste a{text-decoration: none; color: black;}
#liste a:hover{background: lightgreen;}
#liste a:visited{color: red;}

/* flexBox */
.container{display: flex; flex-direction: column;}
.futo{flex:1;}
.maco{display: flex; flex-direction: row;}
.droite{display: flex; flex-direction: column; flex:1;}
.drto{flex:1;}
.drce{display: flex; flex-direction: row; flex:1;}
.drc1{flex:2;}
.drc2{flex:1;}
.drbo{flex:1;}
.gauche{display: flex; flex-direction: column; flex:2;}
.gato{flex:1;}
.gama{flex:1;}
.gabo{flex:1;}
.fubo{flex:1;}

/* css boite flexible */
.columns-2, .masonry-2{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;} 
.columns-2>div, .masonry-2>div{width: 49%;}
.columns-3, .masonry-3{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.columns-3>div, .masonry-3>div{width: 33%;} 
.columns-4, .masonry-4{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.columns-4>div, .masonry-4>div{width: 24%;} 

.futo > .newsflash, .fubo > .newsflash{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; margin:0 -5px;}
.futo > .newsflash > div, .fubo > .newsflash > div {flex:1; min-width:400px; max-width:800px; margin:0 5px;}

.gato > .newsflash, .gabo > .newsflash {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; margin:0 -5px;}
.gato > .newsflash > div, .gabo > .newsflash > div {flex:1; min-width:300px; max-width:600px; margin:0 5px;} 

.mod-custom{position: relative;}

/* element reactif */
.redbox img{border:dotted 2px gray;}
.redbox img:hover{border:solid 2px red;}

/* col pour articles en pleine page*/
.col100{-webkit-column-width: 100px; -moz-column-width: 100px; column-width: 100px;}
.col150{-webkit-column-width: 150px; -moz-column-width: 150px; column-width: 150px;}
.col200{-webkit-column-width: 200px; -moz-column-width: 200px; column-width: 200px;}

/* fond above secondary content */ 
#right{
background:lightgray;
background-image: -moz-linear-gradient(lightgray, white);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from (lightgray), to (white) );
background-image: -webkit-linear-gradient(lightgray, white);
}

/* fond de sidebar */
#Sidebar01{
background: #FFFF99;
background-image: -moz-linear-gradient(yellow, white);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from (yellow), to (white) );
background-image: -webkit-linear-gradient(yellow, white);
}