OwlCyberSecurity - MANAGER

Edit File: box_skins.css.html

[(#REM)

Ce squelette definit les styles de l'espace prive

Note: l'entete "Vary:" sert a repousser l'entete par
	defaut "Vary: Cookie,Accept-Encoding", qui est (un peu)
	genant en cas de "rotation du cookie de session" apres
	un changement d'IP (effet de clignotement).

ATTENTION: il faut absolument le charset sinon Firefox croit que
	c'est du text/html !
	<style>
]
#CACHE{3600*100,cache-client}
#HTTP_HEADER{Content-Type: text/css; charset=iso-8859-15}
#HTTP_HEADER{Vary: Accept-Encoding}

[(#INCLURE{prive/themes/spip/box.css})]
/* ajustement des marges selon grille verticale en em */
.box{margin:[(#ENV{margin-bottom}|mult{1.5})em] 0;}
.bd {padding:[(#ENV{margin-bottom}|div{2})em] 10px;}
.bd > :first-child,.bd > :first-child > :first-child {margin-top:0;}
.bd > :last-child {margin-bottom:0;}
.hd, .ft {padding:[(#ENV{margin-bottom}|div{2})em] 10px;}
.hd h1,.hd h2,.hd h3,.hd h4,.hd h5,.hd h6 {margin-bottom:0;}

/* **************** BLOCK SKINS ***************** */
/* ====== Contour blocks ====== */
/* remove *background-image:" to default to square corners for IE */
/* ----- simple (extends box) ----- */
.simple .inner {border:1px solid #ccc;background-color:#fcfcfc;color:#333;}
.simple .inner .hd {}
.simple b{}
/* ----- info (extends box) ----- */
.info .inner {border:2px solid #ENV{claire};background:#fcfcfc;}
.info .inner .hd {}
.info b{}
/* ----- note (extends box) ----- */
.note,.note .inner{border:1px solid #c2c2c2;}
.note .inner{border-color:#fff; border-width:4px; background-color:[#(#ENV{claire}|couleur_eclaircir{0.85})];}
.note .inner .hd {}

/* ----- raccourcis (extends box) ----- */
.raccourcis .inner{border:1px solid #ccc;background-color:#eee;}
.note .inner .hd {}

/* ----- important (extends box) ----- */
.important .inner{border: 3px solid [(#ENV{foncee})]; border-bottom-width:10px;background:#fff;}
.important b{}

/* ----- basic (extends box) ----- */
.basic {/*margin-bottom: -1px*/}
.basic .inner {/*padding-bottom: 1px;*/border: 1px solid #aaa;}
.basic .inner .hd {}
.basic b{}

/* ----- error, success, notice (extends box) ----- */
.box.error, .box.success, .box.notice {padding:0;backround-image:none;}
.error .inner,.success .inner,.notice .inner{border:2px solid;font-weight: normal;color:#333;}
.error .bd,.success .bd,.notice .bd {padding-[(#ENV{left})]:40px;min-height:24px;background-repeat:no-repeat;background-position: 2px 5px;}
.box.error .hd,.box.success .hd,.box.notice .hd {padding-[(#ENV{left})]:40px;}
.error .ft,.success .ft,.notice .ft {padding-[(#ENV{left})]:40px;}
.box.error .ft,.box.success .ft,.box.notice .ft {border-color:#ddd;background-color:#eee;}

.success .inner{color: #264409;border-color: #C6D880;background-color:#E6EFC2;}
.success .bd{background-image:url(#CHEMIN_IMAGE{ok-32.png});}
.box.success .hd {background-color:#C6DF61;}
.box.success .hd h1,.box.success .hd h2,.box.success .hd h3,.box.success .hd h4,.box.success .hd h5,.box.success .hd h6 {background-color:#C6DF61;}

.error .inner{color: #8A1F11;border-color: #FBC2C4;background-color:#FBE3E4;}
.error .bd{background-image:url(#CHEMIN_IMAGE{erreur-32.png});}
.box.error .hd {background-color:#DF454F;color:#fff;}
.box.error .hd h1,.box.error .hd h2,.box.error .hd h3,.box.error .hd h4,.box.error .hd h5,.box.error .hd h6 {background-color:#DF454F;color:#fff;}

.notice .inner{color: #514721;border-color: #FFD324;background-color:#FFF6BF;}
.notice .bd{background-image:url(#CHEMIN_IMAGE{warning-32.png});}
.box.notice .hd {background-color:#FFD83F;}
.box.notice .hd h1,.box.notice .hd h2,.box.notice .hd h3,.box.notice .hd h4,.box.notice .hd h5,.box.notice .hd h6 {background-color:#FFD83F;}

/* ====== Background blocks ====== */
.highlight .inner{background-color:#ENV{claire};}
.inverse .inner{background-color:#ENV{foncee};color:#ffffff}

/* ====== Block headers and footers ====== */
.hd.titrem { background-repeat: no-repeat; padding-[(#ENV{left})]:16px; padding-[(#ENV{right})]:10px;
background-color: [#(#ENV{foncee}|couleur_eclaircir)];color: #4A4A4A; font-size:[(#ENV{line-height}|mult{1})em];position:relative;line-height: 1;}
.hd.titrem h1,.hd.titrem h2,.hd.titrem h3,.hd.titrem h4,.hd.titrem h5,.hd.titrem h6{ font-size: 1em; color:#4A4A4A;}

.section{ background-repeat: no-repeat; padding-[(#ENV{left})]:16px; padding-[(#ENV{right})]:10px;
background-color: #ENV{foncee}; color: #4A4A4A;font-size:1.2em;position:relative;}
.section h1,.section h2,.section h3,.section h4,.section h5,.section h6{font-size:100%;color:#4A4A4A;padding:0;margin:0;}

.bam{ background-repeat: no-repeat; padding-[(#ENV{left})]:16px; padding-[(#ENV{right})]:10px;
background-color: [#(#ENV{foncee}|couleur_foncer)]; color: #fff;font-size:1.2em; position:relative;}
.bam h1,.bam h2,.bam h3,.bam h4,.bam h5,.bam h6{font-size:100%;color:#fff;padding:0;margin:0;}

.topper{ background-repeat: no-repeat; padding-[(#ENV{left})]:16px; padding-[(#ENV{right})]:10px;
background-color: #fff; color: #4A4A4A;font-size:1.2em; position:relative;}
.topper h1,.topper h2,.topper h3,.topper h4,.topper h5,.topper h6{font-size:100%;color:#4A4A4A;padding:0;margin:0;}

.act{	[background-color: #(#ENV{claire}|couleur_eclaircir);]
	[border-top: 1px solid (#ENV{claire});]
	margin-top:-1px;
	clear:both;
	text-align: #ENV{right};
}

/* Cas particuliers */
.simple.sous-rub .inner .hd {padding:0}
.simple.sous-rub .inner .hd .logo {float:#ENV{right};margin:4px 5px 0;margin-#ENV{right}:-5px;}
.simple.sous-rub .sous-sous-rub {margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;}

/* vieilles boites depliables/repliables
  encore maintenues mais depreciees
*/
.titrem { font-weight: bold; }
div.titrem, h3.titrem { display: block; padding-top: [(#ENV{margin-bottom}|div{2})em]; padding-bottom: [(#ENV{margin-bottom}|div{2})em]; background-repeat: no-repeat; padding-[(#ENV{left})]:16px; padding-[(#ENV{right})]:10px;}
div.titrem a.titremancre,h3.titrem a.titremancre {padding:15px 0 0 16px;background-position: [(#ENV{left})] top;background-repeat: no-repeat; position:relative;float:[(#ENV{left})];margin-[(#ENV{left})]:-16px;}
/* Deplier / Replier */
.deplie a.titremancre, .deplie a.titremancre, .depliant a.titremancre, .replie a.titremancre { height: 1px; padding-bottom: 0px; }
.replie a.titremancre { background-image: url([(#CHEMIN_IMAGE{deplierhaut[(#ENV{rtl})].gif})]); }
.titrem.hover { background-color: #ENV{claire}; }
.deplie a.titremancre { background-image: url(#CHEMIN_IMAGE{deplierbas.gif}); }
.impliable {}
.js .blocreplie { display: none; }
.js .titrem.blocreplie { display: block; }
.blocdeplie { display: block; background: none; }
.bloc_depliable .pagination{ white-space:normal; }