@import '../../css';
@import '../../css-1';
@import '../../css-2';


html{
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	background-color: #f2f2f2;
	-webkit-font-smoothing: antialiased;
	box-sizing: border-box;
	}
body{
	max-width: 1170px;
	margin: 0 auto;
	}
.spip-admin-boutons {color: white !important;}
.spip_logo_site {background: transparent url("img/logo_cahier-1.svg") no-repeat; height:40px; width: 170px; display:inline-block; margin-top: 10px; margin-left: 10px;}
.spip_logo_site:hover {
	opacity: 0.7;
 	-moz-transition: all 0.3s;
 	 -webkit-transition: all 0.3s;
 	 transition: all 0.3s;
 	 }
.spip_logo_site2{display:none;}

.logo_site {
	background: transparent url("img/logo_gd-1.svg") no-repeat; margin-top: 20px;height:20px; width: 170px; display:block;
	}
#page_article{
	height: 100%;
	}
header{
	width: 100%;
	}


#vignette_image img{}



#toggleButton, .menu2, footer{
display:none;
	}
section#page_content{
	clear:both;
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
}
menu{
	-webkit-box-ordinal-group: 1;  -moz-box-ordinal-group: 1; -ms-flex-order: 1;-webkit-order: 1;
	order: 1;
	-webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1 1 130px; -ms-flex: 1 1 130px;
	margin-left: 5px;
	margin-right: 5px;
	 }
#nav,.meme_list,
#aside_site_related,
#ref_art,
#main_content{
	background-color: white;
	}

.meme_list, #main_content{border-radius: 0 0 4px 4px; box-shadow: 0 1px 5px rgba(0, 0, 0, .1);}
#main_content{
	padding: 2% 2% 1% 7%;
	}
#alpha{
	position: relative;
	min-height: 650px;
	max-height: 1060px;
	overflow-y: scroll;
	}
#ref_art, .meme_list{
	margin-bottom: 12px;
	}
#ref_art{}
.inner_meme_list{
	padding: 15px 6% 1px 7%;
	}
#tag_list, #auteur_list {
	transition: 2s;
	}
.hauteur_meme_list {
	max-height: 338px;
	overflow: scroll;
	position: relative;
	}
.hauteur_meme_list2 {
	max-height: 242px;
	overflow: scroll;
	position: relative;
	}
.hauteur_meme_list_open {
	max-height: 10000px;
	}
#nav{
	padding: 40px 15px 50px 15px;
	}
#partenaires{
	padding: 20px 20px 20px 5px;
	}

.blocs_replie, .blocs_titre{background: none !important; padding-left: 0px;}
main{
	-webkit-box-ordinal-group: 2; -moz-box-ordinal-group: 2; -ms-flex-order: 2;-webkit-order: 2;
	order: 2;
	-webkit-box-flex: 4; -moz-box-flex: 4; -webkit-flex: 4 1 550px; -ms-flex: 4 1 550px;
	margin: -30px 5px 200px 5px;
	min-width: 400px;
	}

aside{
	-webkit-box-ordinal-group: 3; -moz-box-ordinal-group: 3; -ms-flex-order: 3;-webkit-order: 3;
	order: 3;
	-webkit-box-flex: 1.5; -moz-box-flex: 1.5; -webkit-flex: 1.5 1 200px; -ms-flex: 1.5 1 200px;
	min-width: 200px;
	margin-left: 5px;
	margin-right: 5px;
	}
#aside_site_related{
	padding: 10% 6% 4% 7%;
	margin-bottom: 20px;
	margin-top: 7px;
	}
#header{margin-bottom: 20px;}
#nav_art{width: 30px; float:right; margin-right: 15px; margin-top: 30px;height: 300px;}
#nav_fixed{width: 20px; position:fixed; top: 200px;height: 300px; margin-left: 10px;}

.socialtags ul li {display:block;}
/*#ill_mots .spip_logo */
#ill_mots{display:flex; margin-top: 30px;}
#ill_mots>.spip_logo {margin: 5px 15px 20px 0px; align-self:center; }
#ill_mots>.mots_art {margin: 5px 0px 20px 0px; padding:0; border: none; align-self:center;}
#texte{padding-right: 45px; padding-bottom: 40px;}
.texte{margin-top: 70px; padding-right: 10px;}

.chapo p, .chapo ul, .chapo ol{font-size: 0.85em; line-height: 1.5em; padding-right: 20px; margin-bottom : 1em;}
.presentation_publi p{margin-bottom : 0.8em;}
.presentation_publi{font-family: 'Roboto Condensed', sans-serif; margin: 40px 20px 0px 20px; padding:10px 10px 0 20px; border: 1px solid lightgray;font-size: 0.8em;}
.presentation_publi>blockquote{font-size: 1em; font-family: 'Roboto', sans-serif; margin-bottom : 0.8em;}

.presentation_publi, .chapo{margin-bottom: 30px;}

.presentation_publi_dossier{font-family: 'Roboto Condensed', sans-serif; margin: 40px 20px 0px 20px; padding:15px 10px 0 20px; border: 1px solid #4db6ac;font-size: 0.9em;}
.presentation_publi_numero{font-family: 'Roboto Condensed', sans-serif; margin: 40px 20px 0px 20px;}

.bla2{display:none;}
.chapo .spip_documents{clear: both; width:120px; margin-bottom: 1em;}
.chapo .spip_documents_left{margin-right: 0.6em; margin-bottom: 1em;}

#1, #2{position:absolute; top: 20px;}
.on2 a{color:black !important;}
#ps{padding: 3% 2% 4% 7%;  background-color: #fdd800; }
.ps p, .ps ul{font-size: 1em; line-height: 1.5em;}
#doc{padding: 3% 4% 4% 7%;  background-color: white; border : 1px dotted lightgrey;}
.auteurs_art_plan{display: inline; color: black !important; margin-top: 6px;}

#list_vignettes ul{
 	 display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: horizontal; -moz-box-orient: horizontal;
    -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    margin-left:-20px;
    }
li.list_vignettes_item{
    -webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1 1 21.25em; -ms-flex: 1 1 21.25em;
    border-radius: 4px;
    background: #fff;
    padding: 0.5em 0.5em 3em 0.5em;
    margin: 20px 0 0 20px;
   	height: 23.3em !important;
   	min-width: 21.25em;
   	max-width: 22em;
   	border-bottom: 4px solid #fdd800;
   	box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
    }
a.item_container{
	display: block;
	vertical-align: center;
	margin : 10px 7px 0px 7px;
	}
.titraille_vignette{
	height: 19.8em;
	overflow: hidden;
	padding: 5px 10px 0px 10px;
  	position: relative;
	}
.titraille_vignette:after {
  	padding-left:10px;
  	padding-right: 10px;
  	position: absolute;
  	bottom: 0;
  	height: 100%;
  	width: 100%;
  	content: "";
  	background: linear-gradient(to top, rgba(255,255,255, 0.9) 5%, rgba(255,255,255, 0) 20%);
  	}
.rubrique_vignette{
	padding-top: 4px;
	margin-left: 17px;
	}
#zone_recherche{
	float: right;
	display: inline;
	max-width: 90%;
	}
.spip_surligne{background-color: orange;}
.formulaire_spip input.text{border: none; max-width: 70%; min-width: 150px; margin-top: 20px; height: 27px;}
#loupe:after{border: none;font-family:'FontAwesome', sans-serif; content:"\f002"; color: white; font-size: 110%;  padding-left: 6px; padding-right: 5px; }
#break_recherche{display:none;}

.invisible{
	visibility: hidden;
	}
#loupe_lien{display:none;}


@media all and (max-width: 1100px)
{
*{
	font-size: 95%;
	}
li.list_vignettes_item{
   	min-width: 19.25em;
   	max-width: 20em;
    }
}
@media all and (max-width: 998px) {
	.spip_logo_site2{background: transparent url("img/logo_gd-1.svg") no-repeat; height:40px; width: 190px; display:inline-block; margin-top: 5px;
margin-left: 10px;
margin-bottom: 6px;}
	.spip_logo_site{display:none;}

	.formulaire_spip input.text{height: 22px;}

	*{font-size: 90%;}

	li.list_vignettes_item{

   		min-width: 21.25em;
   	max-width: 22em;

    }
	.menu2, .menu2 #toggleButton{
		display:inline-block;
		float:left;
		margin-left: 5px;
		}
	menu{
		flex:0;
		margin-left: -5px;
		}
	#nav {
		background-color: white;
		margin-top: 2px;
		width: 200px;
		margin-left: 10px;
		margin-top: 30px;
		position: absolute;
		left: -250px;
		padding: 40px 15px 100px 15px;
		z-index: 1;
		box-shadow: 5px 10px 15px 5px rgba(0,0,0,.1);
		max-height: 600px;
		overflow: scroll;
		}
	main{
		margin-top: -20px;
		margin-bottom: 25px;
		}
	menu #partenaires{display:none;}
	footer{display: block;}
	#nav_fixed{margin-left: 2px !important;}
	#texte{padding-right: 10px !important;}
}
@media all and (max-width: 770px) {
	#zone_recherche .formulaire_spip input.text{margin-top: 5px;}
}
@media all and (max-width: 500px) {
	#ill_mots{display:block;}
		#break_recherche{display:block; height: 10px;}
}
@media all and (max-width: 450px) {
	#zone_recherche{display: none;}
	#loupe_lien{display:block; float:right;}
}
