/* CUSTOM de EXCELOUTILS
 *
 * personnalisation CSS identique à la zone de saisie "Code CSS" dans "Options du Thème" en admin.
*/

/* Image titre format normal déjà prévu par iGalley à partir de 1180px */
/* Image titre grand */
@media (min-width: 1180px) {
	header.banner #header_top {background-image: url(/images/banners/titre-exceloutils-grand.png); background-repeat: no-repeat; height: 100px; background-position: right; }
}
/* Image titre moyen */
@media (min-width: 750px) and (max-width: 1179px) {
	header.banner #header_top {background-image: url(/images/banners/titre-exceloutils-moyen.png); background-repeat: no-repeat; height: 80px; background-position: right; }
}
/* Image titre réduite */
@media (min-width: 300px) and (max-width: 749px) {
	header.banner #header_top {background-image: url(/images/banners/titre-exceloutils-petit.png); background-repeat: no-repeat; height: 90px; background-position: right; }
}
/* Écran vide en dessous de 300px*/
@media (min-width: 1px) and (max-width: 299px) {
	div#gallery{display: none;}
}

 



/* Centrage de la description des utilitaires*/
div#item_description.object_desc {max-width: min(100%, 100%);}
.object_desc p,a {margin: 0px 40px -15px 40px;}
.object_desc #cat_tags a {margin: 0px 40px -15px 40px;}
#page_custom {max-width: 100%;}

/* meilleure position du titre de l'utilitaire*/
h2#item_title {max-width: 100%; margin: 15px 0px 15px 0px;}
#item_title {font-size: 180%;}

/* Repositionnement du lien "accueil vers la galerie" */
header.banner h1 {margin-left: 0px;}

/* Largeur de la galerie = 1045px par défaut puis 100% pour compatibilité mobile */
div#gallery_inner{width:100%;}

/* Largeur de l'image de la Galerie = largeur galerie -20px = 1025px puis 92% centré auto pour compatibilité mobile */
img#item_img{width: 92%; margin: auto;}

/* Largeur du contenu de la galerie = 100% par défaut*/
div#cat_desc.object_desc{max-width:96%; margin: auto;}

/* Ligne grise sous le bandeau de titre  */
#header_top{border-bottom: solid 2px; border-bottom-color: #dddddd;}

/* Personnalisation du fond de la photo et des bordures */ 
#item {background:#ffffff;}
#item img {border: solid 2px; border-color:#483d8b; padding: 8px;}

/* Personnalisation du titre du site, en haut à gauche */
header.banner #header_top h1{font:italic 15px "arial",sans-serif; background: #3b5eb5;}
header.banner #header_top h1 a {color:#b0c4de;} 
header.banner #header_top h1 a:hover {border-bottom: 0px; color:#ffffff;}
div#header_top {background: #f8f8ff;}
div#title {margin-top:15px;}

/* Centrage de la ligne de description du site = largeur galerie = 1045px puis 100% */
/* hauteur des lignes et espacement des paragraphes pour les descriptions */
#cat_desc.object_desc p{font-family:tahoma, arial, helvetica, sans-serif; font-size:16px; color:#333333; max-width:100%; text-align:center; line-height: 1.4em; margin:-6px;}
div#item_description {text-align:justify;} /* justification de la description des rubriques en div */
div#sb_accueil_description {text-align:center;} /* justification de la description de l'accueil en div */

/* Trait horizontal du footer */
footer {width: 55%;}

/* Personnalisation du texte du bas de page */
footer p{color:#483d8b;}
footer a{color:#3b5eb5;}
footer a{border-bottom: 0px solid #3b5eb5;}
footer a:hover {color:#d2691e;}
footer a:hover {border-bottom: 1px solid #d2691e;}
p#footer_system a {margin:0 0 0 0;}

/* Trait horizontal entre le main et le bottom */
#bottom {border-top: 1px solid #6A5ACD;}

/* Liens des stats, tags et liens dans le bottom */
a {color: #483d8b;}
a {border-bottom: 1px solid #483d8b;}
a:hover {color: #d2691e;}
a:hover {border-bottom: 1px solid #d2691e;}
div#bottom  a {margin: 20px 0px 0px 0px;}


/* Lien du titre des tags, dans le bottom */
h3 a{font-size: 12px; font-weight: normal; text-align:center;}

/* Espacement des tags*/
li.tag_weight_1 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_2 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_3 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_4 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_5 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_6 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_7 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_8 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_9 a,p,span {margin: 0px 0px 0px 0px;}
li.tag_weight_10 a,p,span {margin: 0px 0px 0px 0px;}


/* largeur de la zone des liens dans le bottom */
div#bottom_links.bottom_item {width:300px;}

/* permet de mettre les titres des vignettes sur plusieurs lignes (3 ou 4 lignes) avec texte centré*/
#thumbs_cat .title{max-height: 5.6em;}
.thumbs_items dd span.title {max-height: 5.8em; text-align:center;}

/* sous-titres et liens à gauche*/
span.title a {margin:0 0 0 0;}
li.items a {margin:0 0 0 0;}


/* permet de n'avoir que 2 vignettes en largeur sur des mobiles 190px*/
@media (min-width: 300px) and (max-width: 749px) {
	.thumbs_items.standard dl {max-width:190px; width:190px;}
	.thumbs_items.standard dt a img {max-height:190px;}
	.thumbs_items.standard dt a img {max-width:190px;} 	
}

/* Modifs pour MOBILES pour éviter les "textes peu lisibles" et "les éléments trop rapprochés" de GOOGLE  */
@media (min-width: 300px) and (max-width: 1179px) {
#item_link.viewer {margin-bottom:15px;}
#item_title {max-width:100%; text-align:center;}
div#bottom ul {font-size: 1.3em;}
div#item_description {font-size:1.3em;}
div#thumbs_cat {font-size:1.3em;}
#thumbs_cat .title {margin-top: 5px; font-size: 120%;}
#thumbs_cat .recent {font-size: 120%;}
#thumbs_cat .recent:hover {font-size: 120%;}
dl ul.stats li {margin:5px 0 5px 0px;}
div.thumbs_items.standard {font-size:1.3em;}
p#footer_text {font-size:1.3em;}
p#footer_system {font-size:1.3em;}
h3.bottom_title a {font-size:1em;}
#thumbs_cat dl {margin: 10px 10px 10px 10px; width: calc(50% - 20px);}
header.banner #header_top h1 {font-size: 16px;}
#breadcrumb {font-size: 150%;}
#breadcrumb a {line-height: 2em;}
#item_comment_emoji_link span {font-size: 300%;} /*  était 130% */
}

/*Mise en forme du formulaire de contact */
div#sb_texte_formulaire {background-color:#CCFFCC; max-width:480px; text-align:justify; padding:10px 10px 10px 10px; font-size:11pt;}
div#sb_texte_formulaire_rouge {color:red; text-align:justify; font-size:11pt;}
#contact_form :is(input[type="email"], input[type="text"], input[type="url"]){max-width:520px;}
#contact_form h2{text-align:center;}

/*.header_top {max-width: 100%; height: auto;} */

/**/