/* CSS */


/* 1 - FONT-----------*/
/* 2 - HEADER-----------*/
/* 3 - ADS-----------*/
/* 4 - MAIN PAGE-----------*/
/* 5 - FOOTER-----------*/
/* 6 - NAVIGATION RESPONSIVE-----------*/


/*///////////////////////////1-FONT////////////////////*/
@font-face {
  font-family: lucidagarande;
  src: url('../Fonts-Site/lucidagrande.ttf');}

		@font-face {  
		  font-family: ParkLaneNF;
		 src: url('../Fonts-Site/ParkLaneNF.ttf');}

				@font-face {  
				  font-family: Peignot;
				  src: url('../Fonts-Site/Peignot.ttf');}
				  


html {
  /*font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}


.divcategonamefont  {
  text-align: center;
  padding: 0px;
  margin-left: auto;
  margin-right: auto;
}

body { 
/*/////////////////////definition du grid desktop/////////////////*/
  display: grid;
  grid-template-areas: 
    "header header header"
    "AdsLeft article AdsRight"
    "footer footer footer"
    "Adsbottom Adsbottom Adsbottom";
  grid-template-rows: 150px 1fr 290px 150px;  
  grid-template-columns: 15% 1fr 15%;
  grid-row-gap: 10px;
  grid-column-gap: 10px;
  height: 100vh;
  margin: 0;
  } 
  /*/////////////////////definition du grid mobile/////////////////*/
				 /* Stack the layout on small devices/viewports. */
				@media all and (max-width: 600px) {
				  body { 
					grid-template-areas: 
					  "header"
					  "AdsLeft"					  
					  "article"
					  "AdsRight"
					  "footer"
					  "Adsbottom";
					grid-template-rows:200px 5px 1fr 90px 295px 90px; 					
					grid-template-columns: 1fr;
				 }
				}



#pageHeader {
  grid-area: header;
  }
#pageFooter {
  grid-area: footer;
  }
#mainArticle { 
  grid-area: article;      
  }
#siteAdsLeft { 
  grid-area: AdsLeft; 
  }
#siteAdsRight { 
  grid-area: AdsRight; 
  } 
#siteAdsbottom { 
  grid-area: Adsbottom; 
  } 



 

  

  
/*///////////////////////////2-HEADER////////////////////*/
header {
  padding: 1.2em;
  background: #000033;
  }
  
 
.headerFontCollector  {
  text-align: center;
  background: #000033 ;
  padding: 0px;
  font-family: lucidagarande;
  color: #ffffff;
  margin-top: 0px;
}


.tablemenu {
  margin-left: auto;
  margin-right: auto;
  width: 70%;
}

.picture-left{
  float: left;
  background: #000033 ;
  padding: 0px;	
}



/*///////////////////////////3-ADS////////////////////*/
  .Ads {
  padding: 1.2em;
  background: #009966;
  text-align: center;
  /*position: fixed;*/
  } 
  @media all and (max-width: 600px) {
				.Ads{
				   display: none;
				  }
				}
			
				
  .Adssmartphone {
  /*padding: 25px;*/
  background: #ffffff;
  text-align: center;
  margin:0 auto;
  width:310px;
  display: none;
  } 
  @media all and (max-width: 600px) {
				.Adssmartphone{
				  display: block; 
				  overflow: hidden;			  
				  }
				}
  				
  
  .Adsbottom {
  background: #ffffff;
  text-align: center;
  }
    @media all and (max-width: 600px) {
				.Adsbottom{
				  width:85%;
				  }
				}
  
  
  .Adsimg{
  padding: 1.2em;
  text-align: center;
  }  			@media all and (max-width: 600px) {
				.Adsimg{
				  width:90%;
				  }
				}
  


 
  
/*///////////////////////////4-MAIN PAGE////////////////////*/
@media only screen and (min-width: 0px) and (max-width: 700px) {
    .tdsearch {
        display:inline-block;
		padding:5px;
        width:100%;
    }
}

h1{
	font-size: 30px;
}
.chapter
{
	font-size: 30px;
}

input{
  padding: 5px;
  font-family: lucidagarande;
  font-size: 15px;
  border:1;
  border-radius:10px;
  box-shadow:0 0 15px 14px rgba(0,0,0,0.06);
  width:60%;
  }
  				@media all and (max-width: 600px) {
				input{
				  padding: 5px;
				  font-family: lucidagarande;
				  border:1;
				  border-radius:10px;
				  box-shadow:0 0 15px 4px rgba(0,0,0,0.06);
				  width:90%;
				  }
				}
				
th{
  height: 30px;
}

.tdauthor {
  text-align: center;
}
  
article{
  padding: 1.2em;
  background: #ffffff;
  font-family: lucidagarande;
  vertical-align: top;
}
  
.description{
  text-align: center;
  padding: 50px;
  padding-top: 0px;
  padding-bottom: 10px;
  font-family: lucidagarande;
  font-size: 15px;
  color: #000033;
}
  
  .typofc{
  text-align: center;
  padding: 0px;
  font-family: ParkLaneNF;
  font-size: 30px;
  color: #ffffff;
}
	  .typofctxt{
	  text-align: center;
	  padding: 0px;
	  font-family: ParkLaneNF;
	  font-size: 30px;
	  color: #000033;
	}
  
.slogan  {
  text-align: center;
  padding: 0px;
  font-family: Peignot;
  font-size: 45px;
  color: #000033;
}
.categoname  {
  text-align: center;
  padding: 0px;
  font-family: Peignot;
  font-size: 22px;
  color: #000033;
}
.alphabetical  {
  text-align: center;
  padding: 0px;
  font-family: Peignot;
  font-size: 22px;
  color: #000033;
}

.listingpage  {
  text-align: center;
  text-decoration: none;
  padding: 0px;
  font-family: Peignot;
  font-size: 20px;
  color: #000033;
}
			.listingpage:hover {
			  background-color: #009966;
			  text-decoration: underline;
			  border: 1px solid black; padding: 2px;
			  color: #ffffff;
			}
			
.presentpage  {
  text-align: center;
  text-decoration: none;
  padding: 0px;
  font-family: Peignot;
  font-size: 20px;
  color: #000033;
  border: 1px solid black; padding: 2px;
}			

.imgauthor{
  padding: 0px;
  width: 200px;
}
				@media all and (max-width: 600px) {
				  .imgauthor { 
				    padding: 0px;
					width: 150px;
				 }
				}
.policy {
  text-align: left;
  text-decoration: none;
  padding: 100px;
  padding-top: 0px;
  padding-bottom :0px;
  word-wrap: break-word;

}
				@media all and (max-width: 600px) {
				  .policy { 
				    padding: 15px;
				 }
				}

.policyul {
  text-align: left;
  text-decoration: none;
  padding: 120px;
  padding-top: 0px;
  padding-bottom :0px;

}
				@media all and (max-width: 600px) {
				  .policyul { 
				    padding: 22px;
				 }
				}	
				
.imgtools {
  border-radius: 8px;
  border: 1px solid #ddd;
  padding: 5px;
  box-shadow: 0 5px 5px 0 rgba(0,0,0,0.24), 0 5px 5px 0 rgba(0,0,0,0.19);
}	.imgtools:hover{
	box-shadow: 0 10px 10px 0 rgba(0,0,0,0.19), 0 10px 10px 0 rgba(0,0,0,0.24);	
	}
				
            /*///////////////////////////CATEGORY////////////////////*/
.categoryMenu {
  border: 3px solid #009966;
  padding: 10px;
  width: 100%;
  font-family: Peignot;  
} 

.inlinetable{

	display: inline;
	text-decoration: none;
	}

.cat{
   background: #009966;
   color: #ffffff;
   padding: 2px;
   font-size: 18px;
  }
			.cat:hover {
			  background-color: #cccccc;
			}

.subcat{ 
  font-size: 14px; 
  text-decoration: none;
  color: #000033;
}
			.subcat:hover {
			  background-color: #cccccc;
			}
			
.catsearch{ 
  font-size: 95%; 
  color: #006633;
  text-decoration: none;
}
			.catsearch:hover {
			  color: #000033;
			  text-decoration: underline;
			  
			}			
			
            /*///////////////////////////RECENT FONTS////////////////////*/
			
.headLineRecentFont {
  background: #000033;
  width: 100%;
  font-family: Peignot;
  color: #ffffff; 
} 

.blockFont {
  border: 3px solid #000033;
  width: 100%;
  font-family: lucidagarande;
  font-size: 15px;
  padding: 10x;
  color: #000033; 
} 

.tdblockFont {
	max-width: 315px;
	word-wrap: break-word;
	}
	
.linkblockfont{
				text-decoration: none; 
				color: #009966;
				} 
				   .linkblockfont:hover{
					color: #000033;
					} 										
						
.blockFontSuggest {
  border: 3px solid #000033;
  width: 70%;
  font-family: lucidagarande;
  font-size: 15px;
  padding: 10x;
  color: #000033; 
} 

.downloadfont{
   background: #009966;
   text-decoration: none;
   color: #ffffff;
   padding: 10px;
   border-radius: 20px;
  }
			.downloadfont:hover {
			  background-color: #000033;
			  padding: 10px;
			}
		
				@media all and (max-width: 600px) {
				  .downloadfont { 
				    padding: 2px;
				 }
				}
			
			
			
			
.downloadfontpage{
   background: #009966;
   text-decoration: none;
   color: #ffffff;
   font-size: 25px;
   padding: 5px;
  }			.downloadfontpage:hover {
			  background-color: #000033;
			  padding: 20px;
			}
  
 /*///////////////////////////5-FOOTER////////////////////*/
footer {
  padding: 1.2em;
  background: #000033 ;
  }
	  .sloganbottom  {
	  text-align: center;
	  padding: 0px;
	  font-family: Peignot;
	  font-size: 25px;
	  color: #ffffff;
	}
	  .sloganbottomfrench  {
	  text-align: center;
	  padding: 0px;
	  font-family: Peignot;
	  font-size: 22px;
	  color: #ffffff;
	}

.navigbottom{
  text-align: center;
  padding: 0px;
  font-family: lucidagarande;
  font-size: 10px;
  color: #ffffff;
}

 /*///////////////////////////6-NAVIGATION RESPONSIVE////////////////////*/

/* (A) ON BIG SCREEN */
/* (A1) HORIZONTAL MENU */
#hamItems { display: flex; 
}

#hamItems a { width: 70%; }
/* (A2) HIDE HAMBURGER ICON */
#hamNav label, #hamburger { display: none; }

#hamNav, #hamItems a {
  color: #ffffff;
  text-decoration: underline;
  text-decoration-color: #009966;
  font-size: 25px;
  font-family: Peignot; 
}			

#hamItems a:hover{
			color: #009900;
			} 

.mobilemenu {
  display: none;
}

.Itemsmobile {
  color: #ffffff;
  text-decoration: none;
  font-size: 35px;
  font-family: Peignot;
  text-align: center;
  position:absolute;
  top: 200px;
  left: 0px;
  width: 100%;
  display: none;
  background-color: #009966;
  padding: 10px; 
} 
.menumob {
  color: #ffffff;
  text-decoration: none;
  font-size: 35px;
  font-family: Peignot;
  text-align: center;
}
.menumobbottom {
  color: #ffffff;
  text-decoration: none;
  font-size: 17px;
  font-family: Peignot;
  text-align: center;
}  
	.menumobbottomstudio{
	  color: #ffffff;
  font-size: 17px;
  font-family: Peignot;
  text-align: center;
}  
	.formsort{
  font-size: 17px;
  font-family: Peignot;
  text-align: right;
  padding-top: 2px;
}  


/* (B) ON SMALL SCREEN */
@media only screen and (max-width: 600px) {

  /* (B2) BREAK ITEMS INTO SINGLE COLUMN */
  #hamItems { 
  flex-wrap: wrap; 
  }
  /* (B3) TOGGLE SHOW/HIDE */
  #hamItems { display: none; 
  }
  #hamNav input:checked ~ #hamItems { display: flex; 
  }
  
  
/* BUTTON FOR MOBILE MENU */
  .mobilemenu {
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  display: block;
  color: #ffffff;
  position:absolute;
  left: 10px;
  top: 18px;
  /*left: 150px;
  top: 170px;*/
  z-index: 3;
  background-color: #000033;
  font-size: 35px;
  border: none;
  background-image:url('../img/responsivebb.png');
  cursor:pointer;
  width:40px;
  height:22px;  
}
 
  }
  
  .catseerchhr {
  border-top: 1px dashed #006633;
}
  
  /* LANGUAGE BAR */
  
.buttonlang{
  width: 20px;
}
				@media all and (max-width: 600px) {
				  .buttonlang { 
				    width: 25px;
				 }
				}