Debian-facile

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

Ah, ok, sans le float: left.
Ça centre le menu effectivement, mais je trouve ça très moche.

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

kao

Modérateur

Distrib. : Testing

Noyau : Linux 4.quelquechose

(G)UI : Gnome 3

Inscription : 27-09-2012

Site Web

Re : [concours coopératif] nouveau style DF

Sans rire, c'est OK avec display: inline-block

J'ai rassemblé tout les brdmenu dans perso.css mais je ne trouve pas la solution

/*****************************************************************
1. INITIAL SETTINGS
 *****************************************************************/

/*Ajout palmito
----------------------------------------------------------------*/
html{
  height: 100%;
}
body{
  background-color:#406292 !important;
  background-image: url("Kao/background.png") !important;
  background-repeat: repeat !important;
  margin: 0;
  padding: 5px 0 5px 0;!important;
  min-height: 99%;
}

div#wiki_container {
  width: 100em !important;
  margin-top: -20px !important;
  font-family: Arial,Helvetica,sans-serif !important;
  font-size: 0.9em !important;
  margin-left: auto;
  margin-right: auto;
}

#brdtitle h1 {
  display: block;
  background: url("Kao/banniere.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  height: 124px; /* Hauteur de l'image */
  width: 100%; /* largeur de l'image */
  text-indent: -200%;
}

#main .block .box .inbox{
  border-bottom: 2px dotted;
  border-left: 2px dotted;
  border-color: #cad7e1;
  padding: 15px;

}




.pun .thanks {
  border: 1px dotted;
  padding: 10px 20px 10px 20px;
  margin: 10px 0 10px 0;
  border-color:#000;
}

/* Poll */
#ap_poll_input {
}

.ap_poll_hidden { display: none; }

fieldset.ap_poll {
  margin-top: 2em;
  padding: 1em;
  background-color: #F6F9FC;
  border: 1px solid #DFE6EE;
}

.ap_poll legend {
  font-weight: normal;
}

.ap_poll p {
  font-weight: bold;
}

.ap_poll table {
  width: auto;
}

.ap_poll th {
  font-weight: normal;
  padding: .5em 1em .5em 0;
}

.ap_poll td {
  padding: .5em 1em;
}

.ap_poll label {

}

.ap_poll .percent {
  text-align: right;
}

.ap_poll .results .bar {
  height: 20px;
  background-color: #44699C;
}

.ap_poll .results .bar .top {
  background-color: #4F78B2;
  width: 100%;
  height: 10px;
}

.ap_poll .total {
  color: #b7b7b7;
  margin-top: .5em;
  font-style: italic;
}



/* Limited Reset
----------------------------------------------------------------*/

html, /*body,*/ .pun table, .pun div, .pun form, .pun p, .pun h1, .pun h2, .pun h3, .pun h4, .pun h5, .pun pre, .pun blockquote,
.pun ul, .pun ol, .pun li, .pun dl, .pun dt, .pun dd, .pun th, .pun td, .pun fieldset, .pun legend .pun img,
.pun abbr, .pun cite {
  border: 0;
  font-style: normal;
  font-weight: normal;
  margin: 0;
  padding: 0;
}

.pun ul, .pun ol {
  list-style: none;
}

.pun select {
  padding-bottom: 1px;
  padding-top: 1px;
}

/* Content Defaults
----------------------------------------------------------------*/

.pun {
  font: 0.9em  Arial, Helvetica, sans-serif;
}

.pun table, .pun td, .pun th, .pun input, .pun select, .pun optgroup, .pun textarea, .pun legend {
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.pun pre, .pun code {
  font-family:  monospace;
  font-size: 1em;
}

.pun pre code {
  font-size: 1em;
}

.pun table {
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  empty-cells: show;
  width: 100%;
}

.pun h1 {
  font:2.154em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h2, .pun .hd h2 {
  font: 1.462em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h3 {
  font-size: 1.154em;
  line-height: 1.267em;
  padding: 7px 0;
}

.pun h4 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 7px 0;
}

.pun h5, .pun h6 {
  font-size: 1em;
  font-weight: bold;
  padding: 7px 0;
}

.pun p, .pun ul, .pun ol, .pun dl, .pun th, .pun td, .pun legend {
  padding: 7px 0;
}

.pun strong, .pun th, .pun span.warntext, .pun p.warntext {
  font-weight: bold;
}

.pun em {
  font-style: italic;
}

.pun a, .pun a:link, .pun a:visited {
  text-decoration: none;
}

.pun a:hover, .pun a:active, .pun a:focus {
  text-decoration: underline;
}

.pun .actions span {
  padding-left: 16px;
  padding-right: 8px;
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
}

/* Hidden Elements
----------------------------------------------------------------*/

#brdfooter h2, #brdstats h2, #debug h2, #brdstats .conl dt, #brdstats .conr dt, #modcontrols dt,
#searchlinks dt, div.postright h3, .pun .subscribelink span, #announce .hd, #reportform h2, #punmoderate #vf h2,
#punviewforum #vf h2, .pun .required strong span, .pun .icon div {
  display: block;
  overflow: hidden;
  position: absolute;
  text-indent: -9999em;
  width: 0;
}

/* Generic Float Clear
----------------------------------------------------------------*/

.pun .inbox, .pun #brdmain, .pun .crumbs, .pun .pagepost, .pun .block2col {
  min-height: 1px;
}

* html .pun .inbox, * html .pun #brdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: inline-block;
}

* html .pun .inbox, * html .pun #bdrdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: block;
}

.pun .inbox:after, .pun #brdmain:after, .pun .crumbs:after, .pun .pagepost:after, .pun .block2col:after {
  content: " ";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden;
}

.pun .block2col .inbox:after {
  content: none;
  clear: none;
}

.clearl {
  clear: left;
}


/*****************************************************************
2. COMMON STYLES
 *****************************************************************/

/* Page Layout
----------------------------------------------------------------*/

.pun {
  padding: 30px 40px;
}

#punredirect {
  width:400px;
  float:center;
}

#punredirect .block{
  text-align:center;
}

#punmaint {
  padding: 60px 20% 12px 20%;
}

#puninstall, #pundb_update {
  padding: 20px 10%;
}

.pun .punwrap {
  border: 1px solid;
  padding: 0px 0px 10px 0px;
  box-shadow: 8px 8px 15px #22334c;
}

.pun .top-box {
  height: 0px;
  margin-bottom: 0px;
  position: relative;
  background: url(Air/img/main_top.png) top left no-repeat;
}

.pun .top-box div {
  height: 0px;
  margin-left: 50%;
  background: url(Air/img/main_top.png) top right no-repeat;
}

.pun .end-box {
  /*  margin-top: -17px;*/
  height: 18px;
  position: relative;
  /*  background: url(Air/img/main_end.png) bottom left no-repeat; */
  display:none;
}

.pun .end-box div {
  height: 18px;
  display:none;
}

#punredirect h2, #punmaint h2 {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  margin-bottom: 3px;
}

/* Section Spacing and Borders
----------------------------------------------------------------*/
#brdmain {
  border-style: solid none;
  border-width: 2px 0;
  margin-bottom: 12px;
  padding: 12px 5px;
}

/*#brdmain .subscribelink {
padding: 2px 2px  2px  2px  ;
}*/

#brdfooternav{
  padding: 0 5px 5px 5px;
}


#punindex #brdmain {
  padding-top: 24px;
}

#punredirect #brdmain, #punmaint #brdmain {
  border: 0;
  margin: 0;
  padding: 0;
}

#brdstats {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 24px;
  padding-top: 12px;
}

#brdstats .box{
  padding-top: 12px;
}

#quickpost {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 12px;
  padding-top: 12px;
}

#announce {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  padding-top: 3px;
}

/*****************************************************************
3. COMMON BOARD ELEMENTS
 *****************************************************************/

/* Logo, Description and Main Menu
----------------------------------------------------------------*/

#brdtitle h1 {
  padding: 0 0 0 0;
}

#brddesc {
  display:none;
}

#brddesc p {
  padding: 0;
}
#brdmenu {
  background: #44699c;
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
}

#brdmenu ul {
  padding-top: 0px;
  text-align:center;
}

#brdmenu li {
  float: left;
display: inline-block
}

#brdmenu a, #brdmenu a:link, #brdmenu a:visited {
  background: #44699c;
  color: #e3eaf2; /*color: #d4dae2;*/
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
}

#brdmenu a:link, #brdmenu a:visited {
  border-right-style: solid;
  border-top-style: solid;
  border-width: 1px;
  border-color: #5c83bb;
  display: block;
/* min-width: 60px;*/
  padding: 10px 8px;
  white-space: nowrap;
  border-radius: 8px 0px 0 0;
}

#brdmenu a:hover, #brmenu a:active, #brdmenu a:focus {
  text-decoration: none;
  border-radius: 8px 0px 0 0;
  background: #6796d7;
  background-image:linear-gradient( #44689b,  #6796d7);
  color: #ffffff;
}

#navpm acronym {  
 border-bottom: none;                                                                                                                                                                          
}

/* Welcome Box
----------------------------------------------------------------*/

#brdwelcome {
  padding: 10px 8px;
  background-image:linear-gradient(#363434, #1e1d1d);
  background-color: #363434;
  color: #FFFFFF;
}

#brduser {
  color: #2466b0;
}

#brdwelcome .conl, #brdwelcome .conr, #brdwelcome p, #brdwelcome li {
  display: inline;
  padding: 0;
}

#brdwelcome .conl {
  float: left;
}

#brdwelcome a {
  color: #5c83bb;
}

#brdwelcome a:hover {
  color: #91A9C7;
  text-decoration: none;
}


#brdwelcome .conr {
  float: right;
}

#brdwelcome li span {
  background: url(Air/img/bull.png) center left no-repeat;
  padding-left: 18px;
  margin-right: 3px;
  display: inline-block;
  line-height: normal;
  white-space: nowrap;
}

#brdwelcome .conl li:first-child span {
  padding-left: 0;
  background: none;
}

/* Stats
----------------------------------------------------------------*/

#brdstats .conl {
  float: left;
}

#brdstats .conr {
  float: right;
  text-align: right;
}

#brdstats #onlinelist {
  border-top-style: dotted;
  border-top-width: 1px;
  clear: both;
}

#brdstats #onlinelist dt, #brdstats #onlinelist dd {
  display: inline;
}

/* Footer
----------------------------------------------------------------*/

.pun #modcontrols {
  border-style: none none dotted none;
  border-width: 0 0 1px 0;
  margin-bottom: 4px;
  text-align: center;
  width: 100%;
}

.pun #modcontrols dd {
  display: inline;
}

.pun #brdfooter #modcontrols dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter .conl {
  float: left;
}

.pun #brdfooter .conr {
  text-align: right;
  float: right;
}

.pun #brdfooter #poweredby a {
  font-size: 1.077em;
  font-weight: bold;
}

.pun #brdfooter #qjump {
  padding-top: 5px;
}

.pun #brdfooter #qjump * {
  white-space: nowrap;
}

.pun #brdfooter #searchlinks dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter #feedlinks {
  padding-bottom: 0;
}

.pun #brdfooter #feedlinks span {
  background: url(Air/img/feed.png) center left no-repeat;
  display: inline-block;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #debugtime {
  border-style: dotted none none none;
  border-width: 1px 0 0 0;
  margin-top: 7px;
  text-align: center;
}

/* Breadcrumbs, Postlink, Pagination
----------------------------------------------------------------*/

.pun .linkst .inbox, .pun linksb .inbox, .pun .postlinksb .inbox {
  overflow: hidden;
}

.pun .linksb, .pun .postlinksb, .pun .linkst, .pun .crumbs {
  clear: both;
  position: relative;
}

.pun .linkst .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.462em; */
  line-height: 1.211em;
  padding: 7px 0;
}

.pun .linksb .crumbs, .pun .postlinksb .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.154em;*/
}

.pun .linkst .crumbsplus .pagepost {
  border-top-style: dotted;
  border-top-width: 1px;
}

.pun .linksb .crumbsplus .pagepost, .pun .postlinksb .crumbsplus .pagepost {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}

.pun .postlinksb .crumbs {
  margin-right: 11em;
}

.pun .crumbs li {
  float: left;
  padding-right: 0.4em;
  white-space: nowrap;
}

.pun .crumbs li strong {
  font-weight: normal;
}

.pun .pagelink {
  float: left;
  white-space: nowrap;
}

.pun .pagelink strong, .pun .pagelink a, .pun .pagelink span.spacer {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  display: inline-block;
  padding: 0 12px 0 10px;
  margin-right: -6px;
}

.pun .pagelink .item1 {
  border: 0;
}

.pun .pagelink .pages-label {
  display: inline-block;
}

.pun .postlink {
  float: right;
  font-weight: bold;
  text-align: right;
}

.pun .modbuttons {
  float: right;
  padding: 5px 0 3px 0;
}

.pun .modbuttons input {
  margin-left: 8px;
}

.pun .subscribelink {
  position: absolute;
  right: 0;
  text-align: right;
  top: 33px;
}

#punindex .subscribelink {
  top: 0px;
}

#punindex .linksb {
  height: 12px;
}

/*****************************************************************
4. MAIN TABLES
 *****************************************************************/

.pun #brdmain .blocktable {
  position: relative;
}

#punindex #brdmain .blocktable h2, #punsearch #vf h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 1px 1px 0 1px;
  padding-left: 8px;
  position: relative;
  left: 0;
  white-space: nowrap;
  z-index: 100;
}

#punindex .blocktable th.tcl, #punsearch #vf th.tcl {
  font-size: 0;
  text-indent: -9999em;
}

.pun .blocktable .box {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blocktable .box {
  display: inline-block;
}

.pun .blocktable table {
  table-layout: fixed;
  margin-bottom: -1px;
}

.pun .blocktable th {
  padding: 7px 8px;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable td {
  padding: 7px 8px;
  line-height: 1.3077em;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable h3 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 0;
}

.pun .blocktable p {
  padding: 0;
}

.pun .blocktable .tcl p {
  padding: 5px 0 0 0;
}

.pun .blocktable .tcl {
  width: auto;
}

.pun .blocktable .tc2, .pun .blocktable .tc3, .pun .blocktable .tcmod {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  width: 11%;
}

.pun .blocktable .tcr {
  width: 30%;
}

.pun .blocktable td .newtext, .pun .blocktable td .pagestext, .pun .blocktable td .byuser {
  white-space: nowrap;
}

.pun .blocktable .tcl h3 span.newtext {
  font-size: 0.929em;
  font-weight: normal;
}

.pun #vf td.tcl span.stickytext, .pun #vf td.tcl span.closedtext {
  font-size: 1em;
  font-weight: bold;
}

#punsearch #vf .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 18%;
}

#users1 .tcr {
  width: 25%;
}

#users1 .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 25%;
}

#debug {
  margin-top: 12px;
}

#debug .tcl {
  width: 10%;
}

#punredirect #debug .tcl, #punmaint #debug .tcl {
  width: 20%;
}

#debug .tcr {
  width: 90%;
  white-space: normal
}

#punindex .tcr .byuser {
  display: block
}

#punindex td.tc2, #punindex td.tc3, #punindex td.tcr, .pun #vf td.tc2, .pun #vf td.tc3,
.pun #vf td.tcr, #punindex td.tcl div.forumdesc, .pun #vf td.tcl span {
  font-size: 0.923em;
}

.pun #vf td.tcl a {
  font-weight: bold;
}

.pun #vf td.tcl span a {
  font-weight: normal;
}

.pun .blocktable .tclcon {
  height: 1%;
  min-height: 1px;
  overflow: hidden;
  padding: 0 11px 0 12px;
  position: relative;
}

.pun .blocktable .tclcon div {
  width: 100%;
  overflow: hidden;
}

.pun .icon {
  border-style: solid;
  border-width: 8px;
  float: left;
  height: 0;
  overflow: hidden;
  width: 0;
}

.pun .iposted .ipost {
  font-weight: bold;
  left: 0;
  padding-left: 4px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 8px;
}

/*****************************************************************
MAIN POSTS
 *****************************************************************/

/* Structure
----------------------------------------------------------------*/

.pun .blockpost {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blockpost {
  display: inline-block;
}

.pun .blockpost h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  white-space: nowrap;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  height: 1.462em;
  padding: 0.538em 8px 0.538em 236px;
  font-weight: normal;
}

#punsearch .blockpost h2 {
  height: auto;
  padding-left: 36px;
  white-space: normal;
}

#punsearch .blockpost h2 span span {
  white-space: nowrap;
  display: inline-block;
  font: 1.077em "Trebuchet MS", Arial, Helvetica, sans-serif
}

#punsearch .blockpost .icon {
  position: absolute;
  top: 0;
  margin-top: -2.154em;
}

.pun .blockpost h2 .conr {
  float: right;
  text-align: right;
}

.pun .blockpost .inbox {
  float: right;
  position: relative;
  width: 100%;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  border-left-style: solid;
  border-left-width: 1px;
  float: right;
  margin-right: -218px;
  position: relative;
  text-align: left;
  width: 100%;
}

.pun .blockpost .postleft, .pun .blockpost .postfootleft {
  width: 194px;
  padding: 7px 12px 7px 12px;
  float: left;
  margin-left: -218px;
  position: relative;
}

.pun .blockpost .postleft dl {
  padding: 0;
}

#punviewtopic .blockpost dt, #punmoderate .blockpost dt {
  display: block;
  position: absolute;
  padding: 0.538em 0 0.538em 12px;
  height: 1.462em;
  top: -2.615em;
  left: 0;
  overflow: hidden;
  width: 206px;
}

.pun .blockpost dt strong {
  font-size: 1.231em;
  font-weight: bold;
}

.pun .blockpost .postleft dd {
  font-size: 0.923em;
}

.pun .blockpost .postleft .usertitle {
  padding: 4px 0 6px 0;
  font-size: 1em;
}

.pun .blockpost .postleft .postavatar {
  display: block;
  margin: 0 0 4px 0;
}

.pun .blockpost .postright {
  position: relative;
  padding: 4px 230px 7px 18px;
}

.pun .postmsg {
  width:100%;
  overflow: hidden;
  word-wrap: break-word;
}

.pun .blockpost .postfootright {
  position: relative;
  padding: 7px 230px 7px 18px;
  text-align: right;
}

.pun .postfoot p, .pun .postfoot ul {
  padding: 0;
}

.pun .blockpost .postfootright li {
  display: inline;
}

.pun .blockpost .postfootright li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

.pun .blockpost .usercontacts {
  padding: 7px 0;
}

.pun .blockpost .usercontacts .email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun .blockpost .usercontacts .website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

.pun .postsignature hr {
  border:none;
  height: 1px;
  margin-left: 0px;
  text-align: left;
}

/* Content (includes other user content)
----------------------------------------------------------------*/

.pun .usercontent {
  padding: 7px 0;
}

.pun .postmsg p, .pun .postmsg li, #punhelp p samp {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .usercontent h1, .pun .usercontent h2, .pun .usercontent h3,
.pun .usercontent h4, .pun .usercontent h5, .pun .usercontent h6 {
  padding: 7px 0 0 0;
}

.pun .postmsg h5, #punhelp h5 {
  font-size: 1.231em;
  font-weight: bold;
  padding: 7px 0;
}

.pun .usercontent ul, .pun .postmsg ul {
  list-style: disc;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol, .pun .postmsg ol {
  list-style: decimal;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol.alpha, .pun .postmsg ol.alpha {
  list-style: lower-alpha;
}

.pun .usercontent li, .pun .postmsg li {
  padding: 0 3px;
}

.pun .usercontent li p, .pun .postmsg li p {
  padding: 0;
}

.pun span.bbu {
  text-decoration: underline;
}

.pun span.bbs, .pun del {
  text-decoration: line-through;
}

.pun .postmsg ins, #punhelp samp ins {
  text-decoration: none;
}

.pun .blockpost .postmsg .postedit {
  font-size: 0.857em;
}

.pun .blockform .postsignature, .pun .blockpost .postsignature {
  font-size: 0.923em;
}

.pun .codebox {
  border-style: solid;
  border-width: 1px;
  margin: 0.75em 1em;
  padding: 0;
}

.pun .quotebox {
  border-style: solid;
  border-width: 1px 1px 1px 3px;
  margin: 0.75em 1em;
  padding: 0 0.75em;
}

.pun .quotebox cite {
  display: block;
  padding: 0.75em 0 0 0;
  font-weight: bold;
  line-height: 1.462em;
}

.pun .quotebox blockquote {
  overflow: hidden;
  width: 100%;
}

.pun .codebox pre {
  overflow-y:hidden;
  overflow: auto;
  width: 100%;
  direction: ltr;
  text-align: left;
}

* html .pun .codebox pre {
  padding-bottom: 10px;
}

*:first-child+html .pun .codebox pre {
  padding-bottom: 10px;
}

.pun .codebox pre code {
  padding: 0.75em;
  white-space: pre;
}

.pun div[class*=codebox] pre code {
  display: inline-block;
}

* html .pun .codebox pre code {
  display: block;
}

.pun .codebox pre.vscroll {
  height: 32em;
  overflow: auto;
  overflow-y: auto
}

.pun .postmsg img, #punhelp samp img {
  vertical-align: text-top;
}

.pun .postmsg .postimg img {
  max-width: 98%;
  vertical-align: middle;
  margin: 7px 0.5em 7px 0;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-style: solid;
  border-width: 2px;
}

/*****************************************************************
MAIN FORMS
 *****************************************************************/

#punedit .blockform h2, #punpost .blockform h2, #postpreview h2, #posterror h2,
.pun #quickpost h2, .pun #reportform h2, #pundelete .blockform h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  white-space: nowrap;
  padding: 10px 19px 4px 37px;
  border: 0;
}

#punpost .blockform h2, #punedit .blockform h2,.pun #quickpost h2,
#pundelete .blockform h2 {
  margin: 1px 1px 0 1px;
  width: 25em;
  position: absolute;
  z-index: 100;
}

.pun #quickpost legend, #punpost legend, #punedit legend {
  width: 25em;
  overflow: hidden;
  white-space: nowrap;
}

.pun .blockform .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 12px;
}

.pun #posterror {
  border-style: solid;
  border-width: 1px;
}

.pun #posterror .box {
  padding: 0 18px 12px 18px;
}

* html .pun .blockform .box, * html .pun #posterror {
  display: inline-block;
}

.pun .blockform .forminfo, .pun .error-info {
  padding: 12px 18px;
  border-style: solid;
  border-width: 1px;
  position: relative;
}

.pun .blockform .forminfo {
  margin-top: 12px;
}

#pundelete .blockform .forminfo {
  margin-top: 33px;
}

.pun .forminfo h3 {
  padding-bottom: 0;
}

.pun .error-list li {
  padding-left: 24px;
  background: url(Air/img/exclaim.png) center left no-repeat;
}

.pun .inform {
  padding: 0 18px;
}

.pun legend {
  font-weight: bold;
  padding: 10px 19px 4px 19px;
}

* html .pun legend {
  margin-left: -7px;
}

*:first-child+html .pun legend {
  margin-left: -7px;
}

.pun .infldset {
  border-style: solid;
  border-width: 1px;
  padding: 12px 18px;
}

#punregister #rules .infldset {
  padding: 5px 18px;
}

.pun fieldset p {
  padding: 0 0 7px 0;
  width: 100%;
}

.pun fieldset .usercontent p {
  padding: 7px 0;
}

.pun fieldset label {
  display: block;
  padding: 0 0 7px 0;
}

.pun label em {
  font-weight: normal;
  font-style: normal;
}

.pun .required strong {
  background: url(Air/img/asterisk.png) center right no-repeat;
  font-weight: normal;
  padding-right: 14px;
  white-space: pre;
  display: inline-block;
  line-height: normal;
}

.pun label input, .pun label select, .pun label textarea {
  margin-top: 2px;
}

.pun label.conl {
  display: inline-block;
  padding-right: 12px;
}

.pun form .buttons {
  padding: 8px 19px 8px 34px;
  margin-bottom: -12px;
}

.pun .blockform .buttons input {
  margin-right: 12px;
}

.pun .rbox {
  padding: 3px 0;
}

.pun .rbox label {
  padding: 3px 0 3px 1.75em;
  position: relative;
  min-height: 1px;
}

* html .pun .rbox label {
  text-indent: -3px;
  height: 1%;
}

.pun .rbox input {
  margin: 3px 0.75em 3px -1.75em;
  float: left;
  position: relative;
  vertical-align: middle;
  padding: 0;
  height: 1em;
  width: 1em;
}

.pun input[type=text], .pun select, .pun textarea {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .txtarea textarea, .pun input.longinput {
  width: 98%;
}

.pun #quickpost .txtarea {
  padding-right: 12px;
  position: relative;
}

.pun .blockform .bblinks {
  padding-top: 0;
}

.pun .blockform .bblinks li {
  display: inline;
}

.pun .blockform .bblinks li span {
  background: url(Air/img/help.png) center left no-repeat;
  margin-right: 8px;
  padding-left: 20px;
  display: inline-block;
}

.pun #quickpost .bblinks {
  padding-top: 0;
}

.pun #quickpost .bblinks li {
  display: inline;
}

.pun #login p.clearb {
  border-top-style: dotted;
  border-top-width: 1px;
  font-size: 0;
  height: 0;
  line-height: 0;
  margin-top: 7px;
  overflow: hidden;
  padding-bottom: 3px;
  padding-top: 7px;
  text-indent: -9999em;
  width: 100%;
}

.pun #postreview {
  padding-top: 12px;
}

.pun #postpreview, .pun #posterror {
  margin-bottom: 12px;
}

.pun #postpreview .postright {
  padding: 0;
}

.pun #postpreview .postbody {
  border-style: solid;
  border-width: 1px;
  float: none;
  margin: 0 18px 12px 18px;
  padding: 0;
  padding: 4px 18px 4px 18px;
  width: auto;
}

.pun span.email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun span.website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

#punmisc #rules .box {
  border-style: solid;
  border-width: 1px;
  padding: 5px 18px;
}


#punhelp .box {
  border-style: solid;
  border-width: 1px;
  padding: 7px 12px;
}

.pun .multiselect {
  float: left;
  padding-bottom: 7px;
}

.pun .checklist {
  border-width: 1px;
  border-style: solid;
  max-height: 9em;
  width: 20em;
  overflow: auto;
  padding: 0.25em 0.5em;
  margin: 0.25em 16px 0 0.15em;
}

.pun .checklist legend {
  padding: 0;
}

.pun .checklist legend span {
  width: auto;
  max-width: 25em;
}

.pun .checklist .checklist-item {
  position: relative;
}

.pun .checklist .checklist-item label {
  padding: 0 0 0 1.75em;
}

.pun .checklist .checklist-item .fld-input {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
}

.pun .checklist .checklist-item input {
  margin: 0;
  height: 1.55em;
  width: 1.55em;
}

/*****************************************************************
PROFILES (+ ADMIN MENU)
 *****************************************************************/

/* Profile / Admin
----------------------------------------------------------------*/

.pun .blockmenu {
  width: 13em;
  float: left;
  padding-bottom: 12px;
}

.pun .block2col .blockform, .pun .block2col .block {
  margin-left: 15em;
}

.pun .blockmenu .block2 {
  padding-top: 19px;
}

.pun .blockmenu ul {
  border-top-style: dotted;
  border-top-width: 1px;
  padding: 0;
}

.pun .blockmenu li {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  font-weight: bold;
  padding: 0;
}

.pun .blockmenu a:link, .pun .blockmenu a:visited {
  display: block;
  padding: 9px 6px 3px 6px;
  min-height: 1px;
  text-decoration: none;
}

* html .pun .blockmenu a:link,  * html .pun .blockmenu a:visited {
  height: 1%;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  text-decoration: none;
}

#viewprofile .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 18px;
}

#viewprofile dt, #adstats dt {
  padding: 7px 0;
  position: absolute;
  width: 13em;
  left: 0;
}

#viewprofile dl {
  border-style: solid none none none;
  border-width: 1px;
  margin: 7px 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#adintro, #adstats {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adintro li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

#adstats .inbox, #adintro .inbox {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adstats dl {
  margin: 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#viewprofile dd, #adstats dd {
  border-style: none none solid none;
  border-width: 1px;
  padding: 7px 0 7px 13em;
}

/*****************************************************************
COLOUR SCHEME
 *****************************************************************/

/* Basic defaults and Common Items
----------------------------------------------------------------*/

html, /*body,*/ .pun {
  background: #f6f9fc;
  color: #333;
}

.pun .punwrap {
  /*  background: #fff;*/
  /*  border-color: #cad7e1; */
  border: none;
  color: #313a45; /*  color: #566579;*/
  margin-bottom: 20px;
}

#brdtitle #brddesc, .pun .pagepost, #brdstats #onlinelist, #brdfooter #searchlinks, #brdfooter #modcontrols,
#punmaint h2, #punredirect h2, #adminconsole .submittop, .pun #debugtime, .pun .pagelink a, .pun .pagelink * {
  border-color: #b9c5ce;
  font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

.pun a, .pun a:link, .pun a:visited {
  color: #2365B0;
}

.pun a:hover, .pun a:active, .pun a:focus {
  color: #004687;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-color: #22538a;
}

.pun .postmsg .postimg a:hover img, .pun .postmsg .postimg a:active img, .pun .postmsg .postimg a:focus img {
  border-color: #b50000;
}



/* Main Tables
----------------------------------------------------------------*/

.pun .blocktable .box {
  background: #fcfdfe;
  border-color: #b9c5ce #d9e1e7;
}

#punindex .blocktable h2, .pun #vf h2 {
  color: #357082;
}

#adminconsole fieldset th, #adminconsole fieldset td {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun #users1 h2 {
  background: #fff;
}

.pun .blocktable td {
  border-color: #dfe6ee;
}

.pun .blocktable th {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blocktable td.tcl span.stickytext {
  color: #3399CC;
}

/* Main Posts
----------------------------------------------------------------*/

.pun .blockpost {
  background: #f6f9fc;
  border-color: #b9c5ce #d9e1e7;
}

.pun .blockpost h2 {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  background: #fcfdfe;
  border-color: #dfe6ee;
}

.pun .blockpost .postfootright li {
  color: #fcfdfe;
}

.pun .postmsg, #punhelp code, #punhelp samp {
  color: #333;
}

.pun .postsignature, .pun .postmsg .postedit {
  color: #566579;
}

.pun .quotebox {
  background: #f8f9f0;
  border-color: #7aadbd;
  color: #566579;
}

.pun .quotebox cite {
  color: #357082;
}

.pun .codebox, #punhelp .codebox code {
  background: #333;
  color: #fff;
}

.pun .postmsg hr {
  background: #b9c5ce;
}

.pun .postmsg ins, #punhelp samp ins {
  background-color: #ff0;
}

/* Main Forms + Profile
----------------------------------------------------------------*/

.pun .blockform .box, #adstats, #adintro, #postpreview, #posterror {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

#punmisc #rules .box, #punhelp .box {
  border-color: #b9c5ce #d9e1e7;
  background: #f6f9fc;
}

.pun #quickpost h2, #punpost .blockform h2, #punedit .blockform h2, #posterror h2,
#pundelete .blockform h2 {
  background: #ebf1f5;
  color: #357082;
}

.pun .forminfo {
  background: #fff;
  border-color: #dfe6ee;
}

#puninstall form#install .forminfo {
  background: #44699c;
  color: #fff;
}

.pun #posterror .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
}

#puninstall form#install .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
  color: #333;
}

.pun .infldset, #adintro .inbox, #adstats .inbox {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun label, .pun legend, #adminconsole fieldset th {
  color: #357082;
}

.pun fieldset p {
  border-color: #b9c5ce;
}

.pun .blockmenu ul, .pun .blockmenu li {
  border-color: #b9c5ce;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  background: #ffffe6;
}

.pun .blockmenu .isactive a:link, .pun .blockmenu .isactive a:visited {
  color: #333;
  background: #f6f9fc;
}

.pun #viewprofile .box {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

.pun #viewprofile dt, #adstats dt {
  color: #357082;
}

.pun #viewprofile dl, .pun #viewprofile dd, #adstats dl, #adstats dd {
  border-color: #dfe6ee;
}

#adminconsole fieldset td.nodefault {
  background: #d59b9b;
}

.pun .multiselect {
  color: #357082;
}

.pun .checklist {
  background: white;
  border-color: #ccc;
}

/* Status Indicators
----------------------------------------------------------------*/

.pun .icon {
  width: 16px;
  height: 16px;
  border-width: 0px;
  border-color: #e8ecf1 #d4d9dd #dfe3e8 #e8ecf1;
  background-image: url("Kao/icon.png");

}

.pun .iredirect .icon{
  border-color: #b9c5ce;
  border-width: 1px;
  padding: 7px;
}

.pun .inew .icon {
  border-color: #91b3d9 #87a8d1 #6c85bb #7292c3;
  background-image: url("Kao/icon-new.png");
}

div.pun {
  max-width: 100em;
  width: 100%;
  margin: auto auto;
  padding: 0px 0px;
}

/* Intégration du code source
----------------------------------------------------------------*/

.pun .geshicodebox {
  overflow-y:auto;
  overflow: auto;
  width: 95%;
  direction: ltr;
  text-align: left;
  font-size: 10pt;
  max-height: 22em;
  white-space: nowrap;
  padding: 1em;
  background-color: rgb(251, 250, 249);
  color: black;
  margin: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  margin-left: 1em;
}

.pun div.code_root {
  margin-left: 0.5em;
  border-color: rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 0, 0);
  box-shadow: 0px 0px 5px rgb(170, 136, 136) inset;
  border-left: 0.5em solid rgb(170, 0, 0);
}

.pun div.code_user {
  margin-left: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  border-left: 0.5em solid rgb(85, 85, 85);
}

.pun div.code_root:before, .pun div.code_user:before {
  border-bottom: 0px dotted black;
  margin: -1em -1em 0 -1em;
  padding: 0.1em 0.5em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
.pun div.code_root:before {
  content: "en root";
  background: url(/images/root.png) no-repeat right;
  background-size: contain;
}
.pun div.code_root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

.pun div.code_user:before {
  content: "en user";
  background: url(/images/user.png) no-repeat right;
  background-size: contain;
}
.pun div.code_user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

/* Page d'accueil
----------------------------------------------------------------*/


.carre {
  width:31%;
  height:100px;
  background-image:linear-gradient(#2c476d, #44689b);
  float: left;
  margin: 1%;
  border-radius: 8px 8px 8px 8px;

}

.carre h1{
  font-size:160%;
  text-align: center;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre h2{
  padding-left:10px !important;
  font-size:110% !important;
  line-height:1.1 !important;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre a{
  text-decoration: none !important;
  background-repeat:no-repeat;
  background-position:95% 45%;
  box-shadow: 8px 8px 5px #879aa9;
  border-radius: 8px 8px 8px 8px;
  height: 100%;
  display: block;
}

.carre a:hover{
  text-decoration: none !important;
  background-color: #44689b;
  box-shadow: 8px 8px 5px #879aa9;
  background-position:95% 55%;
  border-radius: 8px 8px 8px 8px;
}

#carregauche{
  margin: 1%;
}

#carregauche a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-archive.png');
}

#carregauche2{
  margin: 1%;
}

#carregauche2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-installer.png');
}

#carremilieu{
  margin: 1%;
}

#carremilieu a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-forum.png');
}

#carremilieu2{
  margin: 1%;
}

#carremilieu2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-irc.png');
}

#carredroite{
  margin: 1%;
}

#carredroite a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-asso.png');
}

.news{
  box-shadow: 8px 8px 5px #879aa9;
  background-color:#f0f0f0;
  background-repeat:no-repeat;
  background-position:98% 0%;
  border-radius: 8px 8px 8px 8px;
}

.news h1{
  padding-left: 20px !important;
  padding-top: 10px !important;
  color: #44699C;

}

.news h2{
  padding-top: 10px !important;
  padding-left: 20px !important;
}

.news h5{
  padding-top: 10px !important;
  padding-left: 20px !important;
}



.news p{
  padding-left: 20px !important;
  padding-right: 10px !important;
  padding-top: 0px !important;
}

#news{
  float:left;
  width:64%;
  margin: 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
}

#newsasso{
  float:right;
  width:30%;
  margin: 1% 2% 1% 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
  background-image:url('/images/logo-asso-4-mini.png');
}
 

 

wiki.css

body {
  font-size: 100%;
  padding: 5px 0 5px 0;!important
  text-align: left;
}


#menudf {
  margin:             10px auto 0 auto;
  background: none repeat scroll 0% 0% rgb(246, 249, 252);
  width:              100%;
  max-width:          115em;
  text-align:         left;
  font: 0.8em Arial,Helvetica,sans-serif;
}

#menudf a{
  text-decoration:    none;
}

#menudf h1{
  padding: 0 0 0 0;
  margin: 0 0 0 0;
}

#bienvenudf {
  font-size:          1em;
}

#menudf ul{
list-style: none outside;
}
#menudf li{
  float: left;
  margin-left: 0em;
}

#brdtitle {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

#bodydf {
  width: 100%;
  max-width: 115em;
  margin: 0 auto 0 auto;
  padding: 0;
  border: none;
  font: 0.8em Arial,Helvetica,sans-serif;
}

#dokuwiki__top.site {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

#dokuwiki__header {
  padding: 0 0 0 0;
  margin: 1px 0 0 0;
}
#dokuwiki__header .group {
  padding: 0 0 0 0;
  margin: 0 0 0 0;
}

#dokuwiki__header .group {
  width: 100%;
}

#export_header {
  font-style: italic;
  height: 1em;
  min-height: 50px;
  vertical-align: middle;
  text-align: center;
  margin-bottom: -1em;
  margin-top: -0.8em;
  margin-right: -1.2em;
  margin-left: -1.2em;
}

#export_header img {
  display: inline;
  position: relative;
  float: right;
  height: 32px;
}


.tools {
  background: none repeat scroll 0% 0% rgb(68, 105, 156);
}

.tools a {
  text-decoration: none;
  color: rgb(212, 218, 226);
}
.tools a:link {
  color: rgb(212, 218, 226);
}
.tools a:active {
  color: white;
  text-decoration: none;
}
.tools a:hover {
  color: white;
  text-decoration: none;
}

#dokuwiki__usertools {
  position: relative;
  float: left;
  text-align: left;
  top: 0;
  right: 0;
}
#dokuwiki__usertools ul {
 display: inline;
vertical-align: middle;
padding-top:10px;
}
#dokuwiki__usertools li {
/*  font-size: 1em;*/
  margin-left: 1em;
/*  list-style: none outside none;*/
  display: inline;
vertical-align: middle;
}

#dokuwiki__usertools li.user {
  color: rgb(212, 218, 226);
}

#dokuwiki__usertools span.bchead {
  color: #e3eaf2;
}

#dokuwiki__usertools a.wikilink1 {
  color: #ffffff;
}

#dokuwiki__usertools a.action {
  color: #e3eaf2;
}

#dokuwiki__usertools a.action:hover {
  color: #ffffff;
  text-decoration:underline
}
#dokuwiki__header .tools div {
  height:32px;
  background-image:linear-gradient( #23344c, #44699c , #44699c , #44699c );
}

div.tools {
background: #ffffff;
}
#dokuwiki__usertools a.action.edit{
color:black;
}
#dokuwiki__usertools a.action.create{
color:black;
}
#dokuwiki__usertools a.action.revs{
color:black;
}
#dokuwiki__usertools a.action.backlink{
color:black;
}
#dokuwiki__usertools a.action.top{
color:black;
}

#dokuwiki__header .tools li {
  font-size: 1em;
  margin-left: 1em;
  list-style: none outside none;
  display: inline;
}

#dw__toc {
  margin-top: 1em;
}

.page a:hover {
  text-decoration: none;
  color: blue;
}

#dw__search {
  position: relative;
  float: right;
  display: inline;
  padding-right: 15px;
padding-top:4px;
}


#dw__search .button{
  height:25px;
  background: #6796d7;
  background-image:linear-gradient( #6796d7, #44699c  , #44699c );
  color: white;
  border-radius: 4px ;
  border-color: #23344c;
}
#dw__search .button:hover{
  background-image:linear-gradient( #6796d7 , #44699c );
}



#qsearch__in {
  padding-left: 2px;
  height:25px;
  background: white;
  background-image:linear-gradient(  grey , white , white , white , white );
  color: black;
  border-radius: 4px ;
  border-color: #23344c;
}


#qsearch__out a {
  color: green;
}
#qsearch__out a:hover {
  color: blue;
}

#dokuwiki__site .mode_show  {
  box-shadow: 8px 8px 15px rgb(34, 51, 76);
    background: #ffffff;
}
#dokuwiki__content .docInfo {
  padding: 2px 15px 2px 0px;
  background-image:linear-gradient(#363434, #1e1d1d);
  background-color: #363434;
  color: #FFFFFF;
}

#dokuwiki__content div.page {
  margin-bottom: 0 !important;
}


table.inline tr:hover td {
  color: white;
}

table.inline .row0 th {
  background-color: #173d70;
  color: rgb(212, 218, 226);
  text-transform: uppercase;
  font-weight: bold;
}
table.inline tr:hover.row0 th {
  background-color: #173d70;
  color: white;
}
table.inline .row0 td {
  background-color: #173d70;
  color: rgb(212, 218, 226);
  text-transform: uppercase;
  font-weight: bold;
}
table.inline tr:hover.row0 td {
  background-color: #173d70;
  color: white;
}

.page p {
  font-family: sans-serif;
}

.page h1 {
  border-bottom: 3px solid rgb(140, 172, 187);
  font-size: 2.5em;
  font-weight: normal;
  font-family: sans-serif;
  margin-left: -1em;
  padding-left: 0.5em;
}

.page h2 {
  border-bottom: 2px solid rgb(160, 192, 207);
  font-size: 2em;
  font-weight: normal;
  margin-left: -1em;
  padding-left: 0.5em;
}

.page h3 {
  font-size: 1.6em;
  font-weight: normal;
  margin: 0.5em 0 0.888em -1em;
  padding-left: 0.5em;
  border-bottom: 1px solid rgb(160, 192, 207);
  display: inline-block;
  padding-right: 0.5em;
}

div.level3, div.level4 {
/*  margin-left: 2em; */
}


.page h4 {
  font-size: 1em;
  text-decoration: underline;
}

.page ul {
  padding-bottom: 0.5em;
}

em.u {
  text-decoration: none !important;
  border-bottom: 1px solid rgb(160, 192, 207);
}

.dokuwiki dl.file dt {
    background-color: #fbfaf9;
    background: -moz-linear-gradient(   top, #ddd 0%, #fbfaf9 100%);
    background: -webkit-linear-gradient(top, #ddd 0%, #fbfaf9 100%);
    background: -o-linear-gradient(     top, #ddd 0%, #fbfaf9 100%);
    background: -ms-linear-gradient(    top, #ddd 0%, #fbfaf9 100%);
    background: linear-gradient(        top, #ddd 0%, #fbfaf9 100%);
    color: inherit;
    border: 1px solid #8cacbb;
    border-bottom-color: #fbfaf9;
    border-top-left-radius: .3em;
    border-top-right-radius: .3em;
    padding: .3em .6em .1em;
    margin-bottom: -1px;
    float: left;
}
.dokuwiki dl.code dt {
    background-color: #fbfaf9;
    background: -moz-linear-gradient(   top, #ddd 0%, #fbfaf9 100%);
    background: -webkit-linear-gradient(top, #ddd 0%, #fbfaf9 100%);
    background: -o-linear-gradient(     top, #ddd 0%, #fbfaf9 100%);
    background: -ms-linear-gradient(    top, #ddd 0%, #fbfaf9 100%);
    background: linear-gradient(        top, #ddd 0%, #fbfaf9 100%);
    color: inherit;
    border: 1px solid #8cacbb;
    border-bottom-color: #fbfaf9;
    border-top-left-radius: .3em;
    border-top-right-radius: .3em;
    padding: .3em .6em .1em;
    margin-bottom: -1px;
    float: left;
}

pre.bash:before {
  height: 1em;
/*  content: "Le code suivant est à taper dans un terminal utilisateur."; */
  display: block;
  background: #ccc;
}
pre.user {
  border-color: #555;
  box-shadow: inset 0 0 5px #bbb;
  border-left: 0.5em #555 solid;
}

pre.root {
  border-color: #a55;
  box-shadow: inset 0 0 5px #a88;
  border-left: 0.5em #a00 solid;
}

pre.root:before, pre.user:before {
  border-bottom: 0px dotted black;
  margin: -0.7em -1em 0 -1em;
  padding: 0.1em 3em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
pre.root:before {
  content: "en root";
  background: url(http://images.debian-facile.org/root.png) no-repeat right;
  background-size: contain;
}
pre.root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

pre.user:before {
  content: "en user";
  background: url(http://images.debian-facile.org/user.png) no-repeat right;
  background-size: contain;
}
pre.user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

#config__manager fieldset {
  background: #fff;
}

/*div#wiki_container {
  width: 100em;
  margin-left: auto;
  margin-right: auto;
  margin-top: -1px;
  font: 0.8em Arial, Helvetica, sans-serif;
}

div#brdmain {
  display: none;
}*/
div.punwrap {
  margin-bottom: 0;
  padding-bottom: 0 !important;
}
 

bendia

Chadministrateur

Distrib. : openSUSE Tumbleweed, Buster

Noyau : Linux 5.9.1-2-default + Linux 4.19.0-12-amd64

(G)UI : Gnome + Console et un peu Fluxbox

Inscription : 20-03-2012

Site Web

Re : [concours coopératif] nouveau style DF

@captnfab : sur mon smartphone non

Édit  : si je vois makntenant , et je trouve ça nickel Je regarde ce soir sur d'autres types d'écrans

Dernière modification par bendia (17-02-2014 12:30:24)

---

Ben
___________________
La seule question bête, c'est celle qu'on ne pose pas.

kao

Modérateur

Distrib. : Testing

Noyau : Linux 4.quelquechose

(G)UI : Gnome 3

Inscription : 27-09-2012

Site Web

Re : [concours coopératif] nouveau style DF

Contournement du problème:


Perso.css

/*****************************************************************
1. INITIAL SETTINGS
 *****************************************************************/

/*Ajout palmito
----------------------------------------------------------------*/
html{
  height: 100%;
}
body{
  background-color:#406292 !important;
  background-image: url("Kao/background.png") !important;
  background-repeat: repeat !important;
  margin: 0;
  padding: 5px 0 5px 0;!important;
  min-height: 99%;
}

div#wiki_container {
  width: 100em !important;
  margin-top: -20px !important;
  font-family: Arial,Helvetica,sans-serif !important;
  font-size: 0.9em !important;
  margin-left: auto;
  margin-right: auto;
}

#brdtitle h1 {
  display: block;
  background: url("Kao/banniere.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  height: 124px; /* Hauteur de l'image */
  width: 100%; /* largeur de l'image */
  text-indent: -200%;
}

#main .block .box .inbox{
  border-bottom: 2px dotted;
  border-left: 2px dotted;
  border-color: #cad7e1;
  padding: 15px;

}




.pun .thanks {
  border: 1px dotted;
  padding: 10px 20px 10px 20px;
  margin: 10px 0 10px 0;
  border-color:#000;
}

/* Poll */
#ap_poll_input {
}

.ap_poll_hidden { display: none; }

fieldset.ap_poll {
  margin-top: 2em;
  padding: 1em;
  background-color: #F6F9FC;
  border: 1px solid #DFE6EE;
}

.ap_poll legend {
  font-weight: normal;
}

.ap_poll p {
  font-weight: bold;
}

.ap_poll table {
  width: auto;
}

.ap_poll th {
  font-weight: normal;
  padding: .5em 1em .5em 0;
}

.ap_poll td {
  padding: .5em 1em;
}

.ap_poll label {

}

.ap_poll .percent {
  text-align: right;
}

.ap_poll .results .bar {
  height: 20px;
  background-color: #44699C;
}

.ap_poll .results .bar .top {
  background-color: #4F78B2;
  width: 100%;
  height: 10px;
}

.ap_poll .total {
  color: #b7b7b7;
  margin-top: .5em;
  font-style: italic;
}



/* Limited Reset
----------------------------------------------------------------*/

html, /*body,*/ .pun table, .pun div, .pun form, .pun p, .pun h1, .pun h2, .pun h3, .pun h4, .pun h5, .pun pre, .pun blockquote,
.pun ul, .pun ol, .pun li, .pun dl, .pun dt, .pun dd, .pun th, .pun td, .pun fieldset, .pun legend .pun img,
.pun abbr, .pun cite {
  border: 0;
  font-style: normal;
  font-weight: normal;
  margin: 0;
  padding: 0;
}

.pun ul, .pun ol {
  list-style: none;
}

.pun select {
  padding-bottom: 1px;
  padding-top: 1px;
}

/* Content Defaults
----------------------------------------------------------------*/

.pun {
  font: 0.9em  Arial, Helvetica, sans-serif;
}

.pun table, .pun td, .pun th, .pun input, .pun select, .pun optgroup, .pun textarea, .pun legend {
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.pun pre, .pun code {
  font-family:  monospace;
  font-size: 1em;
}

.pun pre code {
  font-size: 1em;
}

.pun table {
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  empty-cells: show;
  width: 100%;
}

.pun h1 {
  font:2.154em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h2, .pun .hd h2 {
  font: 1.462em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h3 {
  font-size: 1.154em;
  line-height: 1.267em;
  padding: 7px 0;
}

.pun h4 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 7px 0;
}

.pun h5, .pun h6 {
  font-size: 1em;
  font-weight: bold;
  padding: 7px 0;
}

.pun p, .pun ul, .pun ol, .pun dl, .pun th, .pun td, .pun legend {
  padding: 7px 0;
}

.pun strong, .pun th, .pun span.warntext, .pun p.warntext {
  font-weight: bold;
}

.pun em {
  font-style: italic;
}

.pun a, .pun a:link, .pun a:visited {
  text-decoration: none;
}

.pun a:hover, .pun a:active, .pun a:focus {
  text-decoration: underline;
}

.pun .actions span {
  padding-left: 16px;
  padding-right: 8px;
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
}

/* Hidden Elements
----------------------------------------------------------------*/

#brdfooter h2, #brdstats h2, #debug h2, #brdstats .conl dt, #brdstats .conr dt, #modcontrols dt,
#searchlinks dt, div.postright h3, .pun .subscribelink span, #announce .hd, #reportform h2, #punmoderate #vf h2,
#punviewforum #vf h2, .pun .required strong span, .pun .icon div {
  display: block;
  overflow: hidden;
  position: absolute;
  text-indent: -9999em;
  width: 0;
}

/* Generic Float Clear
----------------------------------------------------------------*/

.pun .inbox, .pun #brdmain, .pun .crumbs, .pun .pagepost, .pun .block2col {
  min-height: 1px;
}

* html .pun .inbox, * html .pun #brdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: inline-block;
}

* html .pun .inbox, * html .pun #bdrdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: block;
}

.pun .inbox:after, .pun #brdmain:after, .pun .crumbs:after, .pun .pagepost:after, .pun .block2col:after {
  content: " ";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden;
}

.pun .block2col .inbox:after {
  content: none;
  clear: none;
}

.clearl {
  clear: left;
}


/*****************************************************************
2. COMMON STYLES
 *****************************************************************/

/* Page Layout
----------------------------------------------------------------*/

.pun {
  padding: 30px 40px;
}

#punredirect {
  width:400px;
  float:center;
}

#punredirect .block{
  text-align:center;
}

#punmaint {
  padding: 60px 20% 12px 20%;
}

#puninstall, #pundb_update {
  padding: 20px 10%;
}

.pun .punwrap {
  border: 1px solid;
  padding: 0px 0px 10px 0px;
  box-shadow: 8px 8px 15px #22334c;
}

.pun .top-box {
  height: 0px;
  margin-bottom: 0px;
  position: relative;
  background: url(Air/img/main_top.png) top left no-repeat;
}

.pun .top-box div {
  height: 0px;
  margin-left: 50%;
  background: url(Air/img/main_top.png) top right no-repeat;
}

.pun .end-box {
  /*  margin-top: -17px;*/
  height: 18px;
  position: relative;
  /*  background: url(Air/img/main_end.png) bottom left no-repeat; */
  display:none;
}

.pun .end-box div {
  height: 18px;
  display:none;
}

#punredirect h2, #punmaint h2 {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  margin-bottom: 3px;
}

/* Section Spacing and Borders
----------------------------------------------------------------*/
#brdmain {
  border-style: solid none;
  border-width: 2px 0;
  margin-bottom: 12px;
  padding: 12px 5px;
}

/*#brdmain .subscribelink {
padding: 2px 2px  2px  2px  ;
}*/

#brdfooternav{
  padding: 0 5px 5px 5px;
}


#punindex #brdmain {
  padding-top: 24px;
}

#punredirect #brdmain, #punmaint #brdmain {
  border: 0;
  margin: 0;
  padding: 0;
}

#brdstats {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 24px;
  padding-top: 12px;
}

#brdstats .box{
  padding-top: 12px;
}

#quickpost {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 12px;
  padding-top: 12px;
}

#announce {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  padding-top: 3px;
}

/*****************************************************************
3. COMMON BOARD ELEMENTS
 *****************************************************************/

/* Logo, Description and Main Menu
----------------------------------------------------------------*/

#brdtitle h1 {
  padding: 0 0 0 0;
}

#brddesc {
  display:none;
}

#brddesc p {
  padding: 0;
}
#brdmenu {
  background: #44699c;
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
  border-top-style: solid;
  border-width: 1px;
  border-color: #5c83bb;
  box-shadow: 0px 0px 2px rgb(34, 51, 76);
}

#brdmenu ul {
  padding-top: 0px;
  text-align:center;
}

#brdmenu li {
 float: left;
display: inline-block;
min-width:7.30%;
margin-top:-1px;

}


#brdmenu a, #brdmenu a:link, #brdmenu a:visited {
  background: #44699c;
  color: #e3eaf2; /*color: #d4dae2;*/
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
}

#brdmenu a:link, #brdmenu a:visited {
  border-left-style: solid;
  border-top-style: solid;
  border-width: 1px;
  border-color: #5c83bb;
  display: block;
/*  min-width: 60px;*/
  padding: 10px 8px;
  white-space: nowrap;
  border-radius: 8px 0px 0 0;
}
#navextra1 a, #navextra2 a, #navextra3 a, #navextra4 a , #navextra5 a, #navuserlist a, #navrules a, #navsearch a, #navprofile a, #navpm a, #navlogout a, #navadmin a{
  box-shadow: -2px 0px 1px #324b70;
}


#brdmenu a:hover, #brmenu a:active, #brdmenu a:focus {
  text-decoration: none;
  border-radius: 8px 0px 0 0;
  background: #6796d7;
  background-image:linear-gradient( #44689b,  #6796d7);
  color: #ffffff;
}

#navpm acronym {  
 border-bottom: none;                                                                                                                                                                          
}

/* Welcome Box
----------------------------------------------------------------*/

#brdwelcome {
  padding: 10px 8px;
  background-image:linear-gradient(#363434, #1e1d1d);
  background-color: #363434;
  color: #FFFFFF;
}

#brduser {
  color: #2466b0;
}

#brdwelcome .conl, #brdwelcome .conr, #brdwelcome p, #brdwelcome li {
  display: inline;
  padding: 0;
}

#brdwelcome .conl {
  float: left;
}

#brdwelcome a {
  color: #5c83bb;
}

#brdwelcome a:hover {
  color: #91A9C7;
  text-decoration: none;
}


#brdwelcome .conr {
  float: right;
}

#brdwelcome li span {
  background: url(Air/img/bull.png) center left no-repeat;
  padding-left: 18px;
  margin-right: 3px;
  display: inline-block;
  line-height: normal;
  white-space: nowrap;
}

#brdwelcome .conl li:first-child span {
  padding-left: 0;
  background: none;
}

/* Stats
----------------------------------------------------------------*/

#brdstats .conl {
  float: left;
}

#brdstats .conr {
  float: right;
  text-align: right;
}

#brdstats #onlinelist {
  border-top-style: dotted;
  border-top-width: 1px;
  clear: both;
}

#brdstats #onlinelist dt, #brdstats #onlinelist dd {
  display: inline;
}

/* Footer
----------------------------------------------------------------*/

.pun #modcontrols {
  border-style: none none dotted none;
  border-width: 0 0 1px 0;
  margin-bottom: 4px;
  text-align: center;
  width: 100%;
}

.pun #modcontrols dd {
  display: inline;
}

.pun #brdfooter #modcontrols dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter .conl {
  float: left;
}

.pun #brdfooter .conr {
  text-align: right;
  float: right;
}

.pun #brdfooter #poweredby a {
  font-size: 1.077em;
  font-weight: bold;
}

.pun #brdfooter #qjump {
  padding-top: 5px;
}

.pun #brdfooter #qjump * {
  white-space: nowrap;
}

.pun #brdfooter #searchlinks dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter #feedlinks {
  padding-bottom: 0;
}

.pun #brdfooter #feedlinks span {
  background: url(Air/img/feed.png) center left no-repeat;
  display: inline-block;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #debugtime {
  border-style: dotted none none none;
  border-width: 1px 0 0 0;
  margin-top: 7px;
  text-align: center;
}

/* Breadcrumbs, Postlink, Pagination
----------------------------------------------------------------*/

.pun .linkst .inbox, .pun linksb .inbox, .pun .postlinksb .inbox {
  overflow: hidden;
}

.pun .linksb, .pun .postlinksb, .pun .linkst, .pun .crumbs {
  clear: both;
  position: relative;
}

.pun .linkst .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.462em; */
  line-height: 1.211em;
  padding: 7px 0;
}

.pun .linksb .crumbs, .pun .postlinksb .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.154em;*/
}

.pun .linkst .crumbsplus .pagepost {
  border-top-style: dotted;
  border-top-width: 1px;
}

.pun .linksb .crumbsplus .pagepost, .pun .postlinksb .crumbsplus .pagepost {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}

.pun .postlinksb .crumbs {
  margin-right: 11em;
}

.pun .crumbs li {
  float: left;
  padding-right: 0.4em;
  white-space: nowrap;
}

.pun .crumbs li strong {
  font-weight: normal;
}

.pun .pagelink {
  float: left;
  white-space: nowrap;
}

.pun .pagelink strong, .pun .pagelink a, .pun .pagelink span.spacer {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  display: inline-block;
  padding: 0 12px 0 10px;
  margin-right: -6px;
}

.pun .pagelink .item1 {
  border: 0;
}

.pun .pagelink .pages-label {
  display: inline-block;
}

.pun .postlink {
  float: right;
  font-weight: bold;
  text-align: right;
}

.pun .modbuttons {
  float: right;
  padding: 5px 0 3px 0;
}

.pun .modbuttons input {
  margin-left: 8px;
}

.pun .subscribelink {
  position: absolute;
  right: 0;
  text-align: right;
  top: 33px;
}

#punindex .subscribelink {
  top: 0px;
}

#punindex .linksb {
  height: 12px;
}

/*****************************************************************
4. MAIN TABLES
 *****************************************************************/

.pun #brdmain .blocktable {
  position: relative;
}

#punindex #brdmain .blocktable h2, #punsearch #vf h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 1px 1px 0 1px;
  padding-left: 8px;
  position: relative;
  left: 0;
  white-space: nowrap;
  z-index: 100;
}

#punindex .blocktable th.tcl, #punsearch #vf th.tcl {
  font-size: 0;
  text-indent: -9999em;
}

.pun .blocktable .box {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blocktable .box {
  display: inline-block;
}

.pun .blocktable table {
  table-layout: fixed;
  margin-bottom: -1px;
}

.pun .blocktable th {
  padding: 7px 8px;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable td {
  padding: 7px 8px;
  line-height: 1.3077em;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable h3 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 0;
}

.pun .blocktable p {
  padding: 0;
}

.pun .blocktable .tcl p {
  padding: 5px 0 0 0;
}

.pun .blocktable .tcl {
  width: auto;
}

.pun .blocktable .tc2, .pun .blocktable .tc3, .pun .blocktable .tcmod {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  width: 11%;
}

.pun .blocktable .tcr {
  width: 30%;
}

.pun .blocktable td .newtext, .pun .blocktable td .pagestext, .pun .blocktable td .byuser {
  white-space: nowrap;
}

.pun .blocktable .tcl h3 span.newtext {
  font-size: 0.929em;
  font-weight: normal;
}

.pun #vf td.tcl span.stickytext, .pun #vf td.tcl span.closedtext {
  font-size: 1em;
  font-weight: bold;
}

#punsearch #vf .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 18%;
}

#users1 .tcr {
  width: 25%;
}

#users1 .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 25%;
}

#debug {
  margin-top: 12px;
}

#debug .tcl {
  width: 10%;
}

#punredirect #debug .tcl, #punmaint #debug .tcl {
  width: 20%;
}

#debug .tcr {
  width: 90%;
  white-space: normal
}

#punindex .tcr .byuser {
  display: block
}

#punindex td.tc2, #punindex td.tc3, #punindex td.tcr, .pun #vf td.tc2, .pun #vf td.tc3,
.pun #vf td.tcr, #punindex td.tcl div.forumdesc, .pun #vf td.tcl span {
  font-size: 0.923em;
}

.pun #vf td.tcl a {
  font-weight: bold;
}

.pun #vf td.tcl span a {
  font-weight: normal;
}

.pun .blocktable .tclcon {
  height: 1%;
  min-height: 1px;
  overflow: hidden;
  padding: 0 11px 0 12px;
  position: relative;
}

.pun .blocktable .tclcon div {
  width: 100%;
  overflow: hidden;
}

.pun .icon {
  border-style: solid;
  border-width: 8px;
  float: left;
  height: 0;
  overflow: hidden;
  width: 0;
}

.pun .iposted .ipost {
  font-weight: bold;
  left: 0;
  padding-left: 4px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 8px;
}

/*****************************************************************
MAIN POSTS
 *****************************************************************/

/* Structure
----------------------------------------------------------------*/

.pun .blockpost {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blockpost {
  display: inline-block;
}

.pun .blockpost h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  white-space: nowrap;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  height: 1.462em;
  padding: 0.538em 8px 0.538em 236px;
  font-weight: normal;
}

#punsearch .blockpost h2 {
  height: auto;
  padding-left: 36px;
  white-space: normal;
}

#punsearch .blockpost h2 span span {
  white-space: nowrap;
  display: inline-block;
  font: 1.077em "Trebuchet MS", Arial, Helvetica, sans-serif
}

#punsearch .blockpost .icon {
  position: absolute;
  top: 0;
  margin-top: -2.154em;
}

.pun .blockpost h2 .conr {
  float: right;
  text-align: right;
}

.pun .blockpost .inbox {
  float: right;
  position: relative;
  width: 100%;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  border-left-style: solid;
  border-left-width: 1px;
  float: right;
  margin-right: -218px;
  position: relative;
  text-align: left;
  width: 100%;
}

.pun .blockpost .postleft, .pun .blockpost .postfootleft {
  width: 194px;
  padding: 7px 12px 7px 12px;
  float: left;
  margin-left: -218px;
  position: relative;
}

.pun .blockpost .postleft dl {
  padding: 0;
}

#punviewtopic .blockpost dt, #punmoderate .blockpost dt {
  display: block;
  position: absolute;
  padding: 0.538em 0 0.538em 12px;
  height: 1.462em;
  top: -2.615em;
  left: 0;
  overflow: hidden;
  width: 206px;
}

.pun .blockpost dt strong {
  font-size: 1.231em;
  font-weight: bold;
}

.pun .blockpost .postleft dd {
  font-size: 0.923em;
}

.pun .blockpost .postleft .usertitle {
  padding: 4px 0 6px 0;
  font-size: 1em;
}

.pun .blockpost .postleft .postavatar {
  display: block;
  margin: 0 0 4px 0;
}

.pun .blockpost .postright {
  position: relative;
  padding: 4px 230px 7px 18px;
}

.pun .postmsg {
  width:100%;
  overflow: hidden;
  word-wrap: break-word;
}

.pun .blockpost .postfootright {
  position: relative;
  padding: 7px 230px 7px 18px;
  text-align: right;
}

.pun .postfoot p, .pun .postfoot ul {
  padding: 0;
}

.pun .blockpost .postfootright li {
  display: inline;
}

.pun .blockpost .postfootright li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

.pun .blockpost .usercontacts {
  padding: 7px 0;
}

.pun .blockpost .usercontacts .email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun .blockpost .usercontacts .website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

.pun .postsignature hr {
  border:none;
  height: 1px;
  margin-left: 0px;
  text-align: left;
}

/* Content (includes other user content)
----------------------------------------------------------------*/

.pun .usercontent {
  padding: 7px 0;
}

.pun .postmsg p, .pun .postmsg li, #punhelp p samp {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .usercontent h1, .pun .usercontent h2, .pun .usercontent h3,
.pun .usercontent h4, .pun .usercontent h5, .pun .usercontent h6 {
  padding: 7px 0 0 0;
}

.pun .postmsg h5, #punhelp h5 {
  font-size: 1.231em;
  font-weight: bold;
  padding: 7px 0;
}

.pun .usercontent ul, .pun .postmsg ul {
  list-style: disc;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol, .pun .postmsg ol {
  list-style: decimal;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol.alpha, .pun .postmsg ol.alpha {
  list-style: lower-alpha;
}

.pun .usercontent li, .pun .postmsg li {
  padding: 0 3px;
}

.pun .usercontent li p, .pun .postmsg li p {
  padding: 0;
}

.pun span.bbu {
  text-decoration: underline;
}

.pun span.bbs, .pun del {
  text-decoration: line-through;
}

.pun .postmsg ins, #punhelp samp ins {
  text-decoration: none;
}

.pun .blockpost .postmsg .postedit {
  font-size: 0.857em;
}

.pun .blockform .postsignature, .pun .blockpost .postsignature {
  font-size: 0.923em;
}

.pun .codebox {
  border-style: solid;
  border-width: 1px;
  margin: 0.75em 1em;
  padding: 0;
}

.pun .quotebox {
  border-style: solid;
  border-width: 1px 1px 1px 3px;
  margin: 0.75em 1em;
  padding: 0 0.75em;
}

.pun .quotebox cite {
  display: block;
  padding: 0.75em 0 0 0;
  font-weight: bold;
  line-height: 1.462em;
}

.pun .quotebox blockquote {
  overflow: hidden;
  width: 100%;
}

.pun .codebox pre {
  overflow-y:hidden;
  overflow: auto;
  width: 100%;
  direction: ltr;
  text-align: left;
}

* html .pun .codebox pre {
  padding-bottom: 10px;
}

*:first-child+html .pun .codebox pre {
  padding-bottom: 10px;
}

.pun .codebox pre code {
  padding: 0.75em;
  white-space: pre;
}

.pun div[class*=codebox] pre code {
  display: inline-block;
}

* html .pun .codebox pre code {
  display: block;
}

.pun .codebox pre.vscroll {
  height: 32em;
  overflow: auto;
  overflow-y: auto
}

.pun .postmsg img, #punhelp samp img {
  vertical-align: text-top;
}

.pun .postmsg .postimg img {
  max-width: 98%;
  vertical-align: middle;
  margin: 7px 0.5em 7px 0;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-style: solid;
  border-width: 2px;
}

/*****************************************************************
MAIN FORMS
 *****************************************************************/

#punedit .blockform h2, #punpost .blockform h2, #postpreview h2, #posterror h2,
.pun #quickpost h2, .pun #reportform h2, #pundelete .blockform h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  white-space: nowrap;
  padding: 10px 19px 4px 37px;
  border: 0;
}

#punpost .blockform h2, #punedit .blockform h2,.pun #quickpost h2,
#pundelete .blockform h2 {
  margin: 1px 1px 0 1px;
  width: 25em;
  position: absolute;
  z-index: 100;
}

.pun #quickpost legend, #punpost legend, #punedit legend {
  width: 25em;
  overflow: hidden;
  white-space: nowrap;
}

.pun .blockform .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 12px;
}

.pun #posterror {
  border-style: solid;
  border-width: 1px;
}

.pun #posterror .box {
  padding: 0 18px 12px 18px;
}

* html .pun .blockform .box, * html .pun #posterror {
  display: inline-block;
}

.pun .blockform .forminfo, .pun .error-info {
  padding: 12px 18px;
  border-style: solid;
  border-width: 1px;
  position: relative;
}

.pun .blockform .forminfo {
  margin-top: 12px;
}

#pundelete .blockform .forminfo {
  margin-top: 33px;
}

.pun .forminfo h3 {
  padding-bottom: 0;
}

.pun .error-list li {
  padding-left: 24px;
  background: url(Air/img/exclaim.png) center left no-repeat;
}

.pun .inform {
  padding: 0 18px;
}

.pun legend {
  font-weight: bold;
  padding: 10px 19px 4px 19px;
}

* html .pun legend {
  margin-left: -7px;
}

*:first-child+html .pun legend {
  margin-left: -7px;
}

.pun .infldset {
  border-style: solid;
  border-width: 1px;
  padding: 12px 18px;
}

#punregister #rules .infldset {
  padding: 5px 18px;
}

.pun fieldset p {
  padding: 0 0 7px 0;
  width: 100%;
}

.pun fieldset .usercontent p {
  padding: 7px 0;
}

.pun fieldset label {
  display: block;
  padding: 0 0 7px 0;
}

.pun label em {
  font-weight: normal;
  font-style: normal;
}

.pun .required strong {
  background: url(Air/img/asterisk.png) center right no-repeat;
  font-weight: normal;
  padding-right: 14px;
  white-space: pre;
  display: inline-block;
  line-height: normal;
}

.pun label input, .pun label select, .pun label textarea {
  margin-top: 2px;
}

.pun label.conl {
  display: inline-block;
  padding-right: 12px;
}

.pun form .buttons {
  padding: 8px 19px 8px 34px;
  margin-bottom: -12px;
}

.pun .blockform .buttons input {
  margin-right: 12px;
}

.pun .rbox {
  padding: 3px 0;
}

.pun .rbox label {
  padding: 3px 0 3px 1.75em;
  position: relative;
  min-height: 1px;
}

* html .pun .rbox label {
  text-indent: -3px;
  height: 1%;
}

.pun .rbox input {
  margin: 3px 0.75em 3px -1.75em;
  float: left;
  position: relative;
  vertical-align: middle;
  padding: 0;
  height: 1em;
  width: 1em;
}

.pun input[type=text], .pun select, .pun textarea {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .txtarea textarea, .pun input.longinput {
  width: 98%;
}

.pun #quickpost .txtarea {
  padding-right: 12px;
  position: relative;
}

.pun .blockform .bblinks {
  padding-top: 0;
}

.pun .blockform .bblinks li {
  display: inline;
}

.pun .blockform .bblinks li span {
  background: url(Air/img/help.png) center left no-repeat;
  margin-right: 8px;
  padding-left: 20px;
  display: inline-block;
}

.pun #quickpost .bblinks {
  padding-top: 0;
}

.pun #quickpost .bblinks li {
  display: inline;
}

.pun #login p.clearb {
  border-top-style: dotted;
  border-top-width: 1px;
  font-size: 0;
  height: 0;
  line-height: 0;
  margin-top: 7px;
  overflow: hidden;
  padding-bottom: 3px;
  padding-top: 7px;
  text-indent: -9999em;
  width: 100%;
}

.pun #postreview {
  padding-top: 12px;
}

.pun #postpreview, .pun #posterror {
  margin-bottom: 12px;
}

.pun #postpreview .postright {
  padding: 0;
}

.pun #postpreview .postbody {
  border-style: solid;
  border-width: 1px;
  float: none;
  margin: 0 18px 12px 18px;
  padding: 0;
  padding: 4px 18px 4px 18px;
  width: auto;
}

.pun span.email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun span.website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

#punmisc #rules .box {
  border-style: solid;
  border-width: 1px;
  padding: 5px 18px;
}


#punhelp .box {
  border-style: solid;
  border-width: 1px;
  padding: 7px 12px;
}

.pun .multiselect {
  float: left;
  padding-bottom: 7px;
}

.pun .checklist {
  border-width: 1px;
  border-style: solid;
  max-height: 9em;
  width: 20em;
  overflow: auto;
  padding: 0.25em 0.5em;
  margin: 0.25em 16px 0 0.15em;
}

.pun .checklist legend {
  padding: 0;
}

.pun .checklist legend span {
  width: auto;
  max-width: 25em;
}

.pun .checklist .checklist-item {
  position: relative;
}

.pun .checklist .checklist-item label {
  padding: 0 0 0 1.75em;
}

.pun .checklist .checklist-item .fld-input {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
}

.pun .checklist .checklist-item input {
  margin: 0;
  height: 1.55em;
  width: 1.55em;
}

/*****************************************************************
PROFILES (+ ADMIN MENU)
 *****************************************************************/

/* Profile / Admin
----------------------------------------------------------------*/

.pun .blockmenu {
  width: 13em;
  float: left;
  padding-bottom: 12px;
}

.pun .block2col .blockform, .pun .block2col .block {
  margin-left: 15em;
}

.pun .blockmenu .block2 {
  padding-top: 19px;
}

.pun .blockmenu ul {
  border-top-style: dotted;
  border-top-width: 1px;
  padding: 0;
}

.pun .blockmenu li {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  font-weight: bold;
  padding: 0;
}

.pun .blockmenu a:link, .pun .blockmenu a:visited {
  display: block;
  padding: 9px 6px 3px 6px;
  min-height: 1px;
  text-decoration: none;
}

* html .pun .blockmenu a:link,  * html .pun .blockmenu a:visited {
  height: 1%;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  text-decoration: none;
}

#viewprofile .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 18px;
}

#viewprofile dt, #adstats dt {
  padding: 7px 0;
  position: absolute;
  width: 13em;
  left: 0;
}

#viewprofile dl {
  border-style: solid none none none;
  border-width: 1px;
  margin: 7px 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#adintro, #adstats {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adintro li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

#adstats .inbox, #adintro .inbox {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adstats dl {
  margin: 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#viewprofile dd, #adstats dd {
  border-style: none none solid none;
  border-width: 1px;
  padding: 7px 0 7px 13em;
}

/*****************************************************************
COLOUR SCHEME
 *****************************************************************/

/* Basic defaults and Common Items
----------------------------------------------------------------*/

html, /*body,*/ .pun {
  background: #f6f9fc;
  color: #333;
}

.pun .punwrap {
  /*  background: #fff;*/
  /*  border-color: #cad7e1; */
  border: none;
  color: #313a45; /*  color: #566579;*/
  margin-bottom: 20px;
}

#brdtitle #brddesc, .pun .pagepost, #brdstats #onlinelist, #brdfooter #searchlinks, #brdfooter #modcontrols,
#punmaint h2, #punredirect h2, #adminconsole .submittop, .pun #debugtime, .pun .pagelink a, .pun .pagelink * {
  border-color: #b9c5ce;
  font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

.pun a, .pun a:link, .pun a:visited {
  color: #2365B0;
}

.pun a:hover, .pun a:active, .pun a:focus {
  color: #004687;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-color: #22538a;
}

.pun .postmsg .postimg a:hover img, .pun .postmsg .postimg a:active img, .pun .postmsg .postimg a:focus img {
  border-color: #b50000;
}



/* Main Tables
----------------------------------------------------------------*/

.pun .blocktable .box {
  background: #fcfdfe;
  border-color: #b9c5ce #d9e1e7;
}

#punindex .blocktable h2, .pun #vf h2 {
  color: #357082;
}

#adminconsole fieldset th, #adminconsole fieldset td {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun #users1 h2 {
  background: #fff;
}

.pun .blocktable td {
  border-color: #dfe6ee;
}

.pun .blocktable th {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blocktable td.tcl span.stickytext {
  color: #3399CC;
}

/* Main Posts
----------------------------------------------------------------*/

.pun .blockpost {
  background: #f6f9fc;
  border-color: #b9c5ce #d9e1e7;
}

.pun .blockpost h2 {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  background: #fcfdfe;
  border-color: #dfe6ee;
}

.pun .blockpost .postfootright li {
  color: #fcfdfe;
}

.pun .postmsg, #punhelp code, #punhelp samp {
  color: #333;
}

.pun .postsignature, .pun .postmsg .postedit {
  color: #566579;
}

.pun .quotebox {
  background: #f8f9f0;
  border-color: #7aadbd;
  color: #566579;
}

.pun .quotebox cite {
  color: #357082;
}

.pun .codebox, #punhelp .codebox code {
  background: #333;
  color: #fff;
}

.pun .postmsg hr {
  background: #b9c5ce;
}

.pun .postmsg ins, #punhelp samp ins {
  background-color: #ff0;
}

/* Main Forms + Profile
----------------------------------------------------------------*/

.pun .blockform .box, #adstats, #adintro, #postpreview, #posterror {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

#punmisc #rules .box, #punhelp .box {
  border-color: #b9c5ce #d9e1e7;
  background: #f6f9fc;
}

.pun #quickpost h2, #punpost .blockform h2, #punedit .blockform h2, #posterror h2,
#pundelete .blockform h2 {
  background: #ebf1f5;
  color: #357082;
}

.pun .forminfo {
  background: #fff;
  border-color: #dfe6ee;
}

#puninstall form#install .forminfo {
  background: #44699c;
  color: #fff;
}

.pun #posterror .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
}

#puninstall form#install .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
  color: #333;
}

.pun .infldset, #adintro .inbox, #adstats .inbox {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun label, .pun legend, #adminconsole fieldset th {
  color: #357082;
}

.pun fieldset p {
  border-color: #b9c5ce;
}

.pun .blockmenu ul, .pun .blockmenu li {
  border-color: #b9c5ce;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  background: #ffffe6;
}

.pun .blockmenu .isactive a:link, .pun .blockmenu .isactive a:visited {
  color: #333;
  background: #f6f9fc;
}

.pun #viewprofile .box {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

.pun #viewprofile dt, #adstats dt {
  color: #357082;
}

.pun #viewprofile dl, .pun #viewprofile dd, #adstats dl, #adstats dd {
  border-color: #dfe6ee;
}

#adminconsole fieldset td.nodefault {
  background: #d59b9b;
}

.pun .multiselect {
  color: #357082;
}

.pun .checklist {
  background: white;
  border-color: #ccc;
}

/* Status Indicators
----------------------------------------------------------------*/

.pun .icon {
  width: 16px;
  height: 16px;
  border-width: 0px;
  border-color: #e8ecf1 #d4d9dd #dfe3e8 #e8ecf1;
  background-image: url("Kao/icon.png");

}

.pun .iredirect .icon{
  border-color: #b9c5ce;
  border-width: 1px;
  padding: 7px;
}

.pun .inew .icon {
  border-color: #91b3d9 #87a8d1 #6c85bb #7292c3;
  background-image: url("Kao/icon-new.png");
}

div.pun {
  max-width: 100em;
  width: 100%;
  margin: auto auto;
  padding: 0px 0px;
}

/* Intégration du code source
----------------------------------------------------------------*/

.pun .geshicodebox {
  overflow-y:auto;
  overflow: auto;
  width: 95%;
  direction: ltr;
  text-align: left;
  font-size: 10pt;
  max-height: 22em;
  white-space: nowrap;
  padding: 1em;
  background-color: rgb(251, 250, 249);
  color: black;
  margin: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  margin-left: 1em;
}

.pun div.code_root {
  margin-left: 0.5em;
  border-color: rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 0, 0);
  box-shadow: 0px 0px 5px rgb(170, 136, 136) inset;
  border-left: 0.5em solid rgb(170, 0, 0);
}

.pun div.code_user {
  margin-left: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  border-left: 0.5em solid rgb(85, 85, 85);
}

.pun div.code_root:before, .pun div.code_user:before {
  border-bottom: 0px dotted black;
  margin: -1em -1em 0 -1em;
  padding: 0.1em 0.5em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
.pun div.code_root:before {
  content: "en root";
  background: url(/images/root.png) no-repeat right;
  background-size: contain;
}
.pun div.code_root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

.pun div.code_user:before {
  content: "en user";
  background: url(/images/user.png) no-repeat right;
  background-size: contain;
}
.pun div.code_user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

/* Page d'accueil
----------------------------------------------------------------*/


.carre {
  width:31%;
  height:100px;
  background-image:linear-gradient(#2c476d, #44689b);
  float: left;
  margin: 1%;
  border-radius: 8px 8px 8px 8px;

}

.carre h1{
  font-size:160%;
  text-align: center;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre h2{
  padding-left:10px !important;
  font-size:110% !important;
  line-height:1.1 !important;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre a{
  text-decoration: none !important;
  background-repeat:no-repeat;
  background-position:95% 45%;
  box-shadow: 8px 8px 5px #879aa9;
  border-radius: 8px 8px 8px 8px;
  height: 100%;
  display: block;
}

.carre a:hover{
  text-decoration: none !important;
  background-color: #44689b;
  box-shadow: 8px 8px 5px #879aa9;
  background-position:95% 55%;
  border-radius: 8px 8px 8px 8px;
}

#carregauche{
  margin: 1%;
}

#carregauche a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-archive.png');
}

#carregauche2{
  margin: 1%;
}

#carregauche2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-installer.png');
}

#carremilieu{
  margin: 1%;
}

#carremilieu a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-forum.png');
}

#carremilieu2{
  margin: 1%;
}

#carremilieu2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-irc.png');
}

#carredroite{
  margin: 1%;
}

#carredroite a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-asso.png');
}

.news{
  box-shadow: 8px 8px 5px #879aa9;
  background-color:#f0f0f0;
  background-repeat:no-repeat;
  background-position:98% 0%;
  border-radius: 8px 8px 8px 8px;
}

.news h1{
  padding-left: 20px !important;
  padding-top: 10px !important;
  color: #44699C;

}

.news h2{
  padding-top: 10px !important;
  padding-left: 20px !important;
}

.news h5{
  padding-top: 10px !important;
  padding-left: 20px !important;
}



.news p{
  padding-left: 20px !important;
  padding-right: 10px !important;
  padding-top: 0px !important;
}

#news{
  float:left;
  width:64%;
  margin: 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
}

#newsasso{
  float:right;
  width:30%;
  margin: 1% 2% 1% 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
  background-image:url('/images/logo-asso-4-mini.png');
}
 

 

J'ai créé un style KaoRatio avec ce dernier css Kao.
La barre de menu est sur deux lignes sur mon écran en 1920x1080.
Les boutons se chevauchent sur mon écran en 1050x1680 (oui, il est vertical ), sur une barre de deux lignes aussi (c'est Déconnexion qui est en bas).

Plus généralement, n'oublie pas que ton menu peut être sur deux lignes ou plus suivant la résolution/zoom de la personne

Actuellement tu es déjà sur deux lignes  avec le thème air, et avec des résolutions aussi petite.
Pour améliorer la chose, il faudrait réduire le nombre de menu, en faisant sauter Recherche (bêta) par exemple, ou en raccourcissant les noms comme "liste des membres" à "membres" ou "Administration" à "Gérer" ou un truc dans le genre. L'idéal serait de passer en dessous des 1024px de large.

kao

Modérateur

Distrib. : Testing

Noyau : Linux 4.quelquechose

(G)UI : Gnome 3

Inscription : 27-09-2012

Site Web

Re : [concours coopératif] nouveau style DF

Sinon, il y a la version dans l'autre sens qui marche pas mal aussi:

perso.css

/*****************************************************************
1. INITIAL SETTINGS
 *****************************************************************/

/*Ajout palmito
----------------------------------------------------------------*/
html{
  height: 100%;
}
body{
  background-color:#406292 !important;
  background-image: url("Kao/background.png") !important;
  background-repeat: repeat !important;
  margin: 0;
  padding: 5px 0 5px 0;!important;
  min-height: 99%;
}

div#wiki_container {
  width: 100em !important;
  margin-top: -20px !important;
  font-family: Arial,Helvetica,sans-serif !important;
  font-size: 0.9em !important;
  margin-left: auto;
  margin-right: auto;
}

#brdtitle h1 {
  display: block;
  background: url("Kao/banniere.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  height: 124px; /* Hauteur de l'image */
  width: 100%; /* largeur de l'image */
  text-indent: -200%;
}

#main .block .box .inbox{
  border-bottom: 2px dotted;
  border-left: 2px dotted;
  border-color: #cad7e1;
  padding: 15px;

}




.pun .thanks {
  border: 1px dotted;
  padding: 10px 20px 10px 20px;
  margin: 10px 0 10px 0;
  border-color:#000;
}

/* Poll */
#ap_poll_input {
}

.ap_poll_hidden { display: none; }

fieldset.ap_poll {
  margin-top: 2em;
  padding: 1em;
  background-color: #F6F9FC;
  border: 1px solid #DFE6EE;
}

.ap_poll legend {
  font-weight: normal;
}

.ap_poll p {
  font-weight: bold;
}

.ap_poll table {
  width: auto;
}

.ap_poll th {
  font-weight: normal;
  padding: .5em 1em .5em 0;
}

.ap_poll td {
  padding: .5em 1em;
}

.ap_poll label {

}

.ap_poll .percent {
  text-align: right;
}

.ap_poll .results .bar {
  height: 20px;
  background-color: #44699C;
}

.ap_poll .results .bar .top {
  background-color: #4F78B2;
  width: 100%;
  height: 10px;
}

.ap_poll .total {
  color: #b7b7b7;
  margin-top: .5em;
  font-style: italic;
}



/* Limited Reset
----------------------------------------------------------------*/

html, /*body,*/ .pun table, .pun div, .pun form, .pun p, .pun h1, .pun h2, .pun h3, .pun h4, .pun h5, .pun pre, .pun blockquote,
.pun ul, .pun ol, .pun li, .pun dl, .pun dt, .pun dd, .pun th, .pun td, .pun fieldset, .pun legend .pun img,
.pun abbr, .pun cite {
  border: 0;
  font-style: normal;
  font-weight: normal;
  margin: 0;
  padding: 0;
}

.pun ul, .pun ol {
  list-style: none;
}

.pun select {
  padding-bottom: 1px;
  padding-top: 1px;
}

/* Content Defaults
----------------------------------------------------------------*/

.pun {
  font: 0.9em  Arial, Helvetica, sans-serif;
}

.pun table, .pun td, .pun th, .pun input, .pun select, .pun optgroup, .pun textarea, .pun legend {
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.pun pre, .pun code {
  font-family:  monospace;
  font-size: 1em;
}

.pun pre code {
  font-size: 1em;
}

.pun table {
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  empty-cells: show;
  width: 100%;
}

.pun h1 {
  font:2.154em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h2, .pun .hd h2 {
  font: 1.462em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h3 {
  font-size: 1.154em;
  line-height: 1.267em;
  padding: 7px 0;
}

.pun h4 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 7px 0;
}

.pun h5, .pun h6 {
  font-size: 1em;
  font-weight: bold;
  padding: 7px 0;
}

.pun p, .pun ul, .pun ol, .pun dl, .pun th, .pun td, .pun legend {
  padding: 7px 0;
}

.pun strong, .pun th, .pun span.warntext, .pun p.warntext {
  font-weight: bold;
}

.pun em {
  font-style: italic;
}

.pun a, .pun a:link, .pun a:visited {
  text-decoration: none;
}

.pun a:hover, .pun a:active, .pun a:focus {
  text-decoration: underline;
}

.pun .actions span {
  padding-left: 16px;
  padding-right: 8px;
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
}

/* Hidden Elements
----------------------------------------------------------------*/

#brdfooter h2, #brdstats h2, #debug h2, #brdstats .conl dt, #brdstats .conr dt, #modcontrols dt,
#searchlinks dt, div.postright h3, .pun .subscribelink span, #announce .hd, #reportform h2, #punmoderate #vf h2,
#punviewforum #vf h2, .pun .required strong span, .pun .icon div {
  display: block;
  overflow: hidden;
  position: absolute;
  text-indent: -9999em;
  width: 0;
}

/* Generic Float Clear
----------------------------------------------------------------*/

.pun .inbox, .pun #brdmain, .pun .crumbs, .pun .pagepost, .pun .block2col {
  min-height: 1px;
}

* html .pun .inbox, * html .pun #brdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: inline-block;
}

* html .pun .inbox, * html .pun #bdrdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: block;
}

.pun .inbox:after, .pun #brdmain:after, .pun .crumbs:after, .pun .pagepost:after, .pun .block2col:after {
  content: " ";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden;
}

.pun .block2col .inbox:after {
  content: none;
  clear: none;
}

.clearl {
  clear: left;
}


/*****************************************************************
2. COMMON STYLES
 *****************************************************************/

/* Page Layout
----------------------------------------------------------------*/

.pun {
  padding: 30px 40px;
}

#punredirect {
  width:400px;
  float:center;
}

#punredirect .block{
  text-align:center;
}

#punmaint {
  padding: 60px 20% 12px 20%;
}

#puninstall, #pundb_update {
  padding: 20px 10%;
}

.pun .punwrap {
  border: 1px solid;
  padding: 0px 0px 10px 0px;
  box-shadow: 8px 8px 15px #22334c;
}

.pun .top-box {
  height: 0px;
  margin-bottom: 0px;
  position: relative;
  background: url(Air/img/main_top.png) top left no-repeat;
}

.pun .top-box div {
  height: 0px;
  margin-left: 50%;
  background: url(Air/img/main_top.png) top right no-repeat;
}

.pun .end-box {
  /*  margin-top: -17px;*/
  height: 18px;
  position: relative;
  /*  background: url(Air/img/main_end.png) bottom left no-repeat; */
  display:none;
}

.pun .end-box div {
  height: 18px;
  display:none;
}

#punredirect h2, #punmaint h2 {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  margin-bottom: 3px;
}

/* Section Spacing and Borders
----------------------------------------------------------------*/
#brdmain {
  border-style: solid none;
  border-width: 2px 0;
  margin-bottom: 12px;
  padding: 12px 5px;
}

/*#brdmain .subscribelink {
padding: 2px 2px  2px  2px  ;
}*/

#brdfooternav{
  padding: 0 5px 5px 5px;
}


#punindex #brdmain {
  padding-top: 24px;
}

#punredirect #brdmain, #punmaint #brdmain {
  border: 0;
  margin: 0;
  padding: 0;
}

#brdstats {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 24px;
  padding-top: 12px;
}

#brdstats .box{
  padding-top: 12px;
}

#quickpost {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 12px;
  padding-top: 12px;
}

#announce {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  padding-top: 3px;
}

/*****************************************************************
3. COMMON BOARD ELEMENTS
 *****************************************************************/

/* Logo, Description and Main Menu
----------------------------------------------------------------*/

#brdtitle h1 {
  padding: 0 0 0 0;
}

#brddesc {
  display:none;
}

#brddesc p {
  padding: 0;
}
#brdmenu {
  background: #44699c;
/*  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);*/
  border-top-style: solid;
  border-width: 1px;
  border-color: #5c83bb;
  box-shadow: 0px 0px 2px rgb(34, 51, 76);
}

#brdmenu ul {
  padding-top: 0px;
  text-align:center;
}

#brdmenu li {
 float: left;
display: inline-block;
min-width:7.33%;
margin-top:-1px;
}


#brdmenu a, #brdmenu a:link, #brdmenu a:visited {
  background: #44699c;
  color: #e3eaf2; /*color: #d4dae2;*/
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
margin-right:2px;
}

#brdmenu a:link, #brdmenu a:visited {
  border-right-style: solid;
  border-top-style: solid;
  border-width: 1px;
  border-color: #5c83bb;
  display: block;
/*  min-width: 60px;*/
  padding: 10px 8px;
  white-space: nowrap;
  border-radius: 0px 8px 0 0;
  box-shadow: 4px 0px 2px #324b70;
}


#brdmenu a:hover, #brmenu a:active, #brdmenu a:focus {
  text-decoration: none;
  border-radius: 0px 8px 0 0;
  background: #6796d7;
  background-image:linear-gradient( #44689b,  #6796d7);
  color: #ffffff;
}

#navpm acronym {  
 border-bottom: none;                                                                                                                                                                          
}

/* Welcome Box
----------------------------------------------------------------*/

#brdwelcome {
  padding: 10px 8px;
  background-image:linear-gradient(#363434, #1e1d1d);
  background-color: #363434;
  color: #FFFFFF;
}

#brduser {
  color: #2466b0;
}

#brdwelcome .conl, #brdwelcome .conr, #brdwelcome p, #brdwelcome li {
  display: inline;
  padding: 0;
}

#brdwelcome .conl {
  float: left;
}

#brdwelcome a {
  color: #5c83bb;
}

#brdwelcome a:hover {
  color: #91A9C7;
  text-decoration: none;
}


#brdwelcome .conr {
  float: right;
}

#brdwelcome li span {
  background: url(Air/img/bull.png) center left no-repeat;
  padding-left: 18px;
  margin-right: 3px;
  display: inline-block;
  line-height: normal;
  white-space: nowrap;
}

#brdwelcome .conl li:first-child span {
  padding-left: 0;
  background: none;
}

/* Stats
----------------------------------------------------------------*/

#brdstats .conl {
  float: left;
}

#brdstats .conr {
  float: right;
  text-align: right;
}

#brdstats #onlinelist {
  border-top-style: dotted;
  border-top-width: 1px;
  clear: both;
}

#brdstats #onlinelist dt, #brdstats #onlinelist dd {
  display: inline;
}

/* Footer
----------------------------------------------------------------*/

.pun #modcontrols {
  border-style: none none dotted none;
  border-width: 0 0 1px 0;
  margin-bottom: 4px;
  text-align: center;
  width: 100%;
}

.pun #modcontrols dd {
  display: inline;
}

.pun #brdfooter #modcontrols dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter .conl {
  float: left;
}

.pun #brdfooter .conr {
  text-align: right;
  float: right;
}

.pun #brdfooter #poweredby a {
  font-size: 1.077em;
  font-weight: bold;
}

.pun #brdfooter #qjump {
  padding-top: 5px;
}

.pun #brdfooter #qjump * {
  white-space: nowrap;
}

.pun #brdfooter #searchlinks dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter #feedlinks {
  padding-bottom: 0;
}

.pun #brdfooter #feedlinks span {
  background: url(Air/img/feed.png) center left no-repeat;
  display: inline-block;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #debugtime {
  border-style: dotted none none none;
  border-width: 1px 0 0 0;
  margin-top: 7px;
  text-align: center;
}

/* Breadcrumbs, Postlink, Pagination
----------------------------------------------------------------*/

.pun .linkst .inbox, .pun linksb .inbox, .pun .postlinksb .inbox {
  overflow: hidden;
}

.pun .linksb, .pun .postlinksb, .pun .linkst, .pun .crumbs {
  clear: both;
  position: relative;
}

.pun .linkst .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.462em; */
  line-height: 1.211em;
  padding: 7px 0;
}

.pun .linksb .crumbs, .pun .postlinksb .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.154em;*/
}

.pun .linkst .crumbsplus .pagepost {
  border-top-style: dotted;
  border-top-width: 1px;
}

.pun .linksb .crumbsplus .pagepost, .pun .postlinksb .crumbsplus .pagepost {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}

.pun .postlinksb .crumbs {
  margin-right: 11em;
}

.pun .crumbs li {
  float: left;
  padding-right: 0.4em;
  white-space: nowrap;
}

.pun .crumbs li strong {
  font-weight: normal;
}

.pun .pagelink {
  float: left;
  white-space: nowrap;
}

.pun .pagelink strong, .pun .pagelink a, .pun .pagelink span.spacer {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  display: inline-block;
  padding: 0 12px 0 10px;
  margin-right: -6px;
}

.pun .pagelink .item1 {
  border: 0;
}

.pun .pagelink .pages-label {
  display: inline-block;
}

.pun .postlink {
  float: right;
  font-weight: bold;
  text-align: right;
}

.pun .modbuttons {
  float: right;
  padding: 5px 0 3px 0;
}

.pun .modbuttons input {
  margin-left: 8px;
}

.pun .subscribelink {
  position: absolute;
  right: 0;
  text-align: right;
  top: 33px;
}

#punindex .subscribelink {
  top: 0px;
}

#punindex .linksb {
  height: 12px;
}

/*****************************************************************
4. MAIN TABLES
 *****************************************************************/

.pun #brdmain .blocktable {
  position: relative;
}

#punindex #brdmain .blocktable h2, #punsearch #vf h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 1px 1px 0 1px;
  padding-left: 8px;
  position: relative;
  left: 0;
  white-space: nowrap;
  z-index: 100;
}

#punindex .blocktable th.tcl, #punsearch #vf th.tcl {
  font-size: 0;
  text-indent: -9999em;
}

.pun .blocktable .box {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blocktable .box {
  display: inline-block;
}

.pun .blocktable table {
  table-layout: fixed;
  margin-bottom: -1px;
}

.pun .blocktable th {
  padding: 7px 8px;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable td {
  padding: 7px 8px;
  line-height: 1.3077em;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable h3 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 0;
}

.pun .blocktable p {
  padding: 0;
}

.pun .blocktable .tcl p {
  padding: 5px 0 0 0;
}

.pun .blocktable .tcl {
  width: auto;
}

.pun .blocktable .tc2, .pun .blocktable .tc3, .pun .blocktable .tcmod {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  width: 11%;
}

.pun .blocktable .tcr {
  width: 30%;
}

.pun .blocktable td .newtext, .pun .blocktable td .pagestext, .pun .blocktable td .byuser {
  white-space: nowrap;
}

.pun .blocktable .tcl h3 span.newtext {
  font-size: 0.929em;
  font-weight: normal;
}

.pun #vf td.tcl span.stickytext, .pun #vf td.tcl span.closedtext {
  font-size: 1em;
  font-weight: bold;
}

#punsearch #vf .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 18%;
}

#users1 .tcr {
  width: 25%;
}

#users1 .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 25%;
}

#debug {
  margin-top: 12px;
}

#debug .tcl {
  width: 10%;
}

#punredirect #debug .tcl, #punmaint #debug .tcl {
  width: 20%;
}

#debug .tcr {
  width: 90%;
  white-space: normal
}

#punindex .tcr .byuser {
  display: block
}

#punindex td.tc2, #punindex td.tc3, #punindex td.tcr, .pun #vf td.tc2, .pun #vf td.tc3,
.pun #vf td.tcr, #punindex td.tcl div.forumdesc, .pun #vf td.tcl span {
  font-size: 0.923em;
}

.pun #vf td.tcl a {
  font-weight: bold;
}

.pun #vf td.tcl span a {
  font-weight: normal;
}

.pun .blocktable .tclcon {
  height: 1%;
  min-height: 1px;
  overflow: hidden;
  padding: 0 11px 0 12px;
  position: relative;
}

.pun .blocktable .tclcon div {
  width: 100%;
  overflow: hidden;
}

.pun .icon {
  border-style: solid;
  border-width: 8px;
  float: left;
  height: 0;
  overflow: hidden;
  width: 0;
}

.pun .iposted .ipost {
  font-weight: bold;
  left: 0;
  padding-left: 4px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 8px;
}

/*****************************************************************
MAIN POSTS
 *****************************************************************/

/* Structure
----------------------------------------------------------------*/

.pun .blockpost {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blockpost {
  display: inline-block;
}

.pun .blockpost h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  white-space: nowrap;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  height: 1.462em;
  padding: 0.538em 8px 0.538em 236px;
  font-weight: normal;
}

#punsearch .blockpost h2 {
  height: auto;
  padding-left: 36px;
  white-space: normal;
}

#punsearch .blockpost h2 span span {
  white-space: nowrap;
  display: inline-block;
  font: 1.077em "Trebuchet MS", Arial, Helvetica, sans-serif
}

#punsearch .blockpost .icon {
  position: absolute;
  top: 0;
  margin-top: -2.154em;
}

.pun .blockpost h2 .conr {
  float: right;
  text-align: right;
}

.pun .blockpost .inbox {
  float: right;
  position: relative;
  width: 100%;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  border-left-style: solid;
  border-left-width: 1px;
  float: right;
  margin-right: -218px;
  position: relative;
  text-align: left;
  width: 100%;
}

.pun .blockpost .postleft, .pun .blockpost .postfootleft {
  width: 194px;
  padding: 7px 12px 7px 12px;
  float: left;
  margin-left: -218px;
  position: relative;
}

.pun .blockpost .postleft dl {
  padding: 0;
}

#punviewtopic .blockpost dt, #punmoderate .blockpost dt {
  display: block;
  position: absolute;
  padding: 0.538em 0 0.538em 12px;
  height: 1.462em;
  top: -2.615em;
  left: 0;
  overflow: hidden;
  width: 206px;
}

.pun .blockpost dt strong {
  font-size: 1.231em;
  font-weight: bold;
}

.pun .blockpost .postleft dd {
  font-size: 0.923em;
}

.pun .blockpost .postleft .usertitle {
  padding: 4px 0 6px 0;
  font-size: 1em;
}

.pun .blockpost .postleft .postavatar {
  display: block;
  margin: 0 0 4px 0;
}

.pun .blockpost .postright {
  position: relative;
  padding: 4px 230px 7px 18px;
}

.pun .postmsg {
  width:100%;
  overflow: hidden;
  word-wrap: break-word;
}

.pun .blockpost .postfootright {
  position: relative;
  padding: 7px 230px 7px 18px;
  text-align: right;
}

.pun .postfoot p, .pun .postfoot ul {
  padding: 0;
}

.pun .blockpost .postfootright li {
  display: inline;
}

.pun .blockpost .postfootright li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

.pun .blockpost .usercontacts {
  padding: 7px 0;
}

.pun .blockpost .usercontacts .email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun .blockpost .usercontacts .website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

.pun .postsignature hr {
  border:none;
  height: 1px;
  margin-left: 0px;
  text-align: left;
}

/* Content (includes other user content)
----------------------------------------------------------------*/

.pun .usercontent {
  padding: 7px 0;
}

.pun .postmsg p, .pun .postmsg li, #punhelp p samp {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .usercontent h1, .pun .usercontent h2, .pun .usercontent h3,
.pun .usercontent h4, .pun .usercontent h5, .pun .usercontent h6 {
  padding: 7px 0 0 0;
}

.pun .postmsg h5, #punhelp h5 {
  font-size: 1.231em;
  font-weight: bold;
  padding: 7px 0;
}

.pun .usercontent ul, .pun .postmsg ul {
  list-style: disc;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol, .pun .postmsg ol {
  list-style: decimal;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol.alpha, .pun .postmsg ol.alpha {
  list-style: lower-alpha;
}

.pun .usercontent li, .pun .postmsg li {
  padding: 0 3px;
}

.pun .usercontent li p, .pun .postmsg li p {
  padding: 0;
}

.pun span.bbu {
  text-decoration: underline;
}

.pun span.bbs, .pun del {
  text-decoration: line-through;
}

.pun .postmsg ins, #punhelp samp ins {
  text-decoration: none;
}

.pun .blockpost .postmsg .postedit {
  font-size: 0.857em;
}

.pun .blockform .postsignature, .pun .blockpost .postsignature {
  font-size: 0.923em;
}

.pun .codebox {
  border-style: solid;
  border-width: 1px;
  margin: 0.75em 1em;
  padding: 0;
}

.pun .quotebox {
  border-style: solid;
  border-width: 1px 1px 1px 3px;
  margin: 0.75em 1em;
  padding: 0 0.75em;
}

.pun .quotebox cite {
  display: block;
  padding: 0.75em 0 0 0;
  font-weight: bold;
  line-height: 1.462em;
}

.pun .quotebox blockquote {
  overflow: hidden;
  width: 100%;
}

.pun .codebox pre {
  overflow-y:hidden;
  overflow: auto;
  width: 100%;
  direction: ltr;
  text-align: left;
}

* html .pun .codebox pre {
  padding-bottom: 10px;
}

*:first-child+html .pun .codebox pre {
  padding-bottom: 10px;
}

.pun .codebox pre code {
  padding: 0.75em;
  white-space: pre;
}

.pun div[class*=codebox] pre code {
  display: inline-block;
}

* html .pun .codebox pre code {
  display: block;
}

.pun .codebox pre.vscroll {
  height: 32em;
  overflow: auto;
  overflow-y: auto
}

.pun .postmsg img, #punhelp samp img {
  vertical-align: text-top;
}

.pun .postmsg .postimg img {
  max-width: 98%;
  vertical-align: middle;
  margin: 7px 0.5em 7px 0;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-style: solid;
  border-width: 2px;
}

/*****************************************************************
MAIN FORMS
 *****************************************************************/

#punedit .blockform h2, #punpost .blockform h2, #postpreview h2, #posterror h2,
.pun #quickpost h2, .pun #reportform h2, #pundelete .blockform h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  white-space: nowrap;
  padding: 10px 19px 4px 37px;
  border: 0;
}

#punpost .blockform h2, #punedit .blockform h2,.pun #quickpost h2,
#pundelete .blockform h2 {
  margin: 1px 1px 0 1px;
  width: 25em;
  position: absolute;
  z-index: 100;
}

.pun #quickpost legend, #punpost legend, #punedit legend {
  width: 25em;
  overflow: hidden;
  white-space: nowrap;
}

.pun .blockform .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 12px;
}

.pun #posterror {
  border-style: solid;
  border-width: 1px;
}

.pun #posterror .box {
  padding: 0 18px 12px 18px;
}

* html .pun .blockform .box, * html .pun #posterror {
  display: inline-block;
}

.pun .blockform .forminfo, .pun .error-info {
  padding: 12px 18px;
  border-style: solid;
  border-width: 1px;
  position: relative;
}

.pun .blockform .forminfo {
  margin-top: 12px;
}

#pundelete .blockform .forminfo {
  margin-top: 33px;
}

.pun .forminfo h3 {
  padding-bottom: 0;
}

.pun .error-list li {
  padding-left: 24px;
  background: url(Air/img/exclaim.png) center left no-repeat;
}

.pun .inform {
  padding: 0 18px;
}

.pun legend {
  font-weight: bold;
  padding: 10px 19px 4px 19px;
}

* html .pun legend {
  margin-left: -7px;
}

*:first-child+html .pun legend {
  margin-left: -7px;
}

.pun .infldset {
  border-style: solid;
  border-width: 1px;
  padding: 12px 18px;
}

#punregister #rules .infldset {
  padding: 5px 18px;
}

.pun fieldset p {
  padding: 0 0 7px 0;
  width: 100%;
}

.pun fieldset .usercontent p {
  padding: 7px 0;
}

.pun fieldset label {
  display: block;
  padding: 0 0 7px 0;
}

.pun label em {
  font-weight: normal;
  font-style: normal;
}

.pun .required strong {
  background: url(Air/img/asterisk.png) center right no-repeat;
  font-weight: normal;
  padding-right: 14px;
  white-space: pre;
  display: inline-block;
  line-height: normal;
}

.pun label input, .pun label select, .pun label textarea {
  margin-top: 2px;
}

.pun label.conl {
  display: inline-block;
  padding-right: 12px;
}

.pun form .buttons {
  padding: 8px 19px 8px 34px;
  margin-bottom: -12px;
}

.pun .blockform .buttons input {
  margin-right: 12px;
}

.pun .rbox {
  padding: 3px 0;
}

.pun .rbox label {
  padding: 3px 0 3px 1.75em;
  position: relative;
  min-height: 1px;
}

* html .pun .rbox label {
  text-indent: -3px;
  height: 1%;
}

.pun .rbox input {
  margin: 3px 0.75em 3px -1.75em;
  float: left;
  position: relative;
  vertical-align: middle;
  padding: 0;
  height: 1em;
  width: 1em;
}

.pun input[type=text], .pun select, .pun textarea {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .txtarea textarea, .pun input.longinput {
  width: 98%;
}

.pun #quickpost .txtarea {
  padding-right: 12px;
  position: relative;
}

.pun .blockform .bblinks {
  padding-top: 0;
}

.pun .blockform .bblinks li {
  display: inline;
}

.pun .blockform .bblinks li span {
  background: url(Air/img/help.png) center left no-repeat;
  margin-right: 8px;
  padding-left: 20px;
  display: inline-block;
}

.pun #quickpost .bblinks {
  padding-top: 0;
}

.pun #quickpost .bblinks li {
  display: inline;
}

.pun #login p.clearb {
  border-top-style: dotted;
  border-top-width: 1px;
  font-size: 0;
  height: 0;
  line-height: 0;
  margin-top: 7px;
  overflow: hidden;
  padding-bottom: 3px;
  padding-top: 7px;
  text-indent: -9999em;
  width: 100%;
}

.pun #postreview {
  padding-top: 12px;
}

.pun #postpreview, .pun #posterror {
  margin-bottom: 12px;
}

.pun #postpreview .postright {
  padding: 0;
}

.pun #postpreview .postbody {
  border-style: solid;
  border-width: 1px;
  float: none;
  margin: 0 18px 12px 18px;
  padding: 0;
  padding: 4px 18px 4px 18px;
  width: auto;
}

.pun span.email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun span.website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

#punmisc #rules .box {
  border-style: solid;
  border-width: 1px;
  padding: 5px 18px;
}


#punhelp .box {
  border-style: solid;
  border-width: 1px;
  padding: 7px 12px;
}

.pun .multiselect {
  float: left;
  padding-bottom: 7px;
}

.pun .checklist {
  border-width: 1px;
  border-style: solid;
  max-height: 9em;
  width: 20em;
  overflow: auto;
  padding: 0.25em 0.5em;
  margin: 0.25em 16px 0 0.15em;
}

.pun .checklist legend {
  padding: 0;
}

.pun .checklist legend span {
  width: auto;
  max-width: 25em;
}

.pun .checklist .checklist-item {
  position: relative;
}

.pun .checklist .checklist-item label {
  padding: 0 0 0 1.75em;
}

.pun .checklist .checklist-item .fld-input {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
}

.pun .checklist .checklist-item input {
  margin: 0;
  height: 1.55em;
  width: 1.55em;
}

/*****************************************************************
PROFILES (+ ADMIN MENU)
 *****************************************************************/

/* Profile / Admin
----------------------------------------------------------------*/

.pun .blockmenu {
  width: 13em;
  float: left;
  padding-bottom: 12px;
}

.pun .block2col .blockform, .pun .block2col .block {
  margin-left: 15em;
}

.pun .blockmenu .block2 {
  padding-top: 19px;
}

.pun .blockmenu ul {
  border-top-style: dotted;
  border-top-width: 1px;
  padding: 0;
}

.pun .blockmenu li {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  font-weight: bold;
  padding: 0;
}

.pun .blockmenu a:link, .pun .blockmenu a:visited {
  display: block;
  padding: 9px 6px 3px 6px;
  min-height: 1px;
  text-decoration: none;
}

* html .pun .blockmenu a:link,  * html .pun .blockmenu a:visited {
  height: 1%;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  text-decoration: none;
}

#viewprofile .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 18px;
}

#viewprofile dt, #adstats dt {
  padding: 7px 0;
  position: absolute;
  width: 13em;
  left: 0;
}

#viewprofile dl {
  border-style: solid none none none;
  border-width: 1px;
  margin: 7px 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#adintro, #adstats {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adintro li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

#adstats .inbox, #adintro .inbox {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adstats dl {
  margin: 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#viewprofile dd, #adstats dd {
  border-style: none none solid none;
  border-width: 1px;
  padding: 7px 0 7px 13em;
}

/*****************************************************************
COLOUR SCHEME
 *****************************************************************/

/* Basic defaults and Common Items
----------------------------------------------------------------*/

html, /*body,*/ .pun {
  background: #f6f9fc;
  color: #333;
}

.pun .punwrap {
  /*  background: #fff;*/
  /*  border-color: #cad7e1; */
  border: none;
  color: #313a45; /*  color: #566579;*/
  margin-bottom: 20px;
}

#brdtitle #brddesc, .pun .pagepost, #brdstats #onlinelist, #brdfooter #searchlinks, #brdfooter #modcontrols,
#punmaint h2, #punredirect h2, #adminconsole .submittop, .pun #debugtime, .pun .pagelink a, .pun .pagelink * {
  border-color: #b9c5ce;
  font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

.pun a, .pun a:link, .pun a:visited {
  color: #2365B0;
}

.pun a:hover, .pun a:active, .pun a:focus {
  color: #004687;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-color: #22538a;
}

.pun .postmsg .postimg a:hover img, .pun .postmsg .postimg a:active img, .pun .postmsg .postimg a:focus img {
  border-color: #b50000;
}



/* Main Tables
----------------------------------------------------------------*/

.pun .blocktable .box {
  background: #fcfdfe;
  border-color: #b9c5ce #d9e1e7;
}

#punindex .blocktable h2, .pun #vf h2 {
  color: #357082;
}

#adminconsole fieldset th, #adminconsole fieldset td {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun #users1 h2 {
  background: #fff;
}

.pun .blocktable td {
  border-color: #dfe6ee;
}

.pun .blocktable th {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blocktable td.tcl span.stickytext {
  color: #3399CC;
}

/* Main Posts
----------------------------------------------------------------*/

.pun .blockpost {
  background: #f6f9fc;
  border-color: #b9c5ce #d9e1e7;
}

.pun .blockpost h2 {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  background: #fcfdfe;
  border-color: #dfe6ee;
}

.pun .blockpost .postfootright li {
  color: #fcfdfe;
}

.pun .postmsg, #punhelp code, #punhelp samp {
  color: #333;
}

.pun .postsignature, .pun .postmsg .postedit {
  color: #566579;
}

.pun .quotebox {
  background: #f8f9f0;
  border-color: #7aadbd;
  color: #566579;
}

.pun .quotebox cite {
  color: #357082;
}

.pun .codebox, #punhelp .codebox code {
  background: #333;
  color: #fff;
}

.pun .postmsg hr {
  background: #b9c5ce;
}

.pun .postmsg ins, #punhelp samp ins {
  background-color: #ff0;
}

/* Main Forms + Profile
----------------------------------------------------------------*/

.pun .blockform .box, #adstats, #adintro, #postpreview, #posterror {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

#punmisc #rules .box, #punhelp .box {
  border-color: #b9c5ce #d9e1e7;
  background: #f6f9fc;
}

.pun #quickpost h2, #punpost .blockform h2, #punedit .blockform h2, #posterror h2,
#pundelete .blockform h2 {
  background: #ebf1f5;
  color: #357082;
}

.pun .forminfo {
  background: #fff;
  border-color: #dfe6ee;
}

#puninstall form#install .forminfo {
  background: #44699c;
  color: #fff;
}

.pun #posterror .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
}

#puninstall form#install .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
  color: #333;
}

.pun .infldset, #adintro .inbox, #adstats .inbox {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun label, .pun legend, #adminconsole fieldset th {
  color: #357082;
}

.pun fieldset p {
  border-color: #b9c5ce;
}

.pun .blockmenu ul, .pun .blockmenu li {
  border-color: #b9c5ce;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  background: #ffffe6;
}

.pun .blockmenu .isactive a:link, .pun .blockmenu .isactive a:visited {
  color: #333;
  background: #f6f9fc;
}

.pun #viewprofile .box {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

.pun #viewprofile dt, #adstats dt {
  color: #357082;
}

.pun #viewprofile dl, .pun #viewprofile dd, #adstats dl, #adstats dd {
  border-color: #dfe6ee;
}

#adminconsole fieldset td.nodefault {
  background: #d59b9b;
}

.pun .multiselect {
  color: #357082;
}

.pun .checklist {
  background: white;
  border-color: #ccc;
}

/* Status Indicators
----------------------------------------------------------------*/

.pun .icon {
  width: 16px;
  height: 16px;
  border-width: 0px;
  border-color: #e8ecf1 #d4d9dd #dfe3e8 #e8ecf1;
  background-image: url("Kao/icon.png");

}

.pun .iredirect .icon{
  border-color: #b9c5ce;
  border-width: 1px;
  padding: 7px;
}

.pun .inew .icon {
  border-color: #91b3d9 #87a8d1 #6c85bb #7292c3;
  background-image: url("Kao/icon-new.png");
}

div.pun {
  max-width: 100em;
  width: 100%;
  margin: auto auto;
  padding: 0px 0px;
}

/* Intégration du code source
----------------------------------------------------------------*/

.pun .geshicodebox {
  overflow-y:auto;
  overflow: auto;
  width: 95%;
  direction: ltr;
  text-align: left;
  font-size: 10pt;
  max-height: 22em;
  white-space: nowrap;
  padding: 1em;
  background-color: rgb(251, 250, 249);
  color: black;
  margin: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  margin-left: 1em;
}

.pun div.code_root {
  margin-left: 0.5em;
  border-color: rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 0, 0);
  box-shadow: 0px 0px 5px rgb(170, 136, 136) inset;
  border-left: 0.5em solid rgb(170, 0, 0);
}

.pun div.code_user {
  margin-left: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  border-left: 0.5em solid rgb(85, 85, 85);
}

.pun div.code_root:before, .pun div.code_user:before {
  border-bottom: 0px dotted black;
  margin: -1em -1em 0 -1em;
  padding: 0.1em 0.5em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
.pun div.code_root:before {
  content: "en root";
  background: url(/images/root.png) no-repeat right;
  background-size: contain;
}
.pun div.code_root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

.pun div.code_user:before {
  content: "en user";
  background: url(/images/user.png) no-repeat right;
  background-size: contain;
}
.pun div.code_user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

/* Page d'accueil
----------------------------------------------------------------*/


.carre {
  width:31%;
  height:100px;
  background-image:linear-gradient(#2c476d, #44689b);
  float: left;
  margin: 1%;
  border-radius: 8px 8px 8px 8px;

}

.carre h1{
  font-size:160%;
  text-align: center;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre h2{
  padding-left:10px !important;
  font-size:110% !important;
  line-height:1.1 !important;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre a{
  text-decoration: none !important;
  background-repeat:no-repeat;
  background-position:95% 45%;
  box-shadow: 8px 8px 5px #879aa9;
  border-radius: 8px 8px 8px 8px;
  height: 100%;
  display: block;
}

.carre a:hover{
  text-decoration: none !important;
  background-color: #44689b;
  box-shadow: 8px 8px 5px #879aa9;
  background-position:95% 55%;
  border-radius: 8px 8px 8px 8px;
}

#carregauche{
  margin: 1%;
}

#carregauche a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-archive.png');
}

#carregauche2{
  margin: 1%;
}

#carregauche2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-installer.png');
}

#carremilieu{
  margin: 1%;
}

#carremilieu a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-forum.png');
}

#carremilieu2{
  margin: 1%;
}

#carremilieu2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-irc.png');
}

#carredroite{
  margin: 1%;
}

#carredroite a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-asso.png');
}

.news{
  box-shadow: 8px 8px 5px #879aa9;
  background-color:#f0f0f0;
  background-repeat:no-repeat;
  background-position:98% 0%;
  border-radius: 8px 8px 8px 8px;
}

.news h1{
  padding-left: 20px !important;
  padding-top: 10px !important;
  color: #44699C;

}

.news h2{
  padding-top: 10px !important;
  padding-left: 20px !important;
}

.news h5{
  padding-top: 10px !important;
  padding-left: 20px !important;
}



.news p{
  padding-left: 20px !important;
  padding-right: 10px !important;
  padding-top: 0px !important;
}

#news{
  float:left;
  width:64%;
  margin: 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
}

#newsasso{
  float:right;
  width:30%;
  margin: 1% 2% 1% 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
  background-image:url('/images/logo-asso-4-mini.png');
}
 


 

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

Je ne suis pas contre le fait d'avoir un menu sur deux lignes. Je voudrais juste que quand cela arrive, le rendu reste joli

Je mettrai le thème à jour tout à l'heure.

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

kao

Modérateur

Distrib. : Testing

Noyau : Linux 4.quelquechose

(G)UI : Gnome 3

Inscription : 27-09-2012

Site Web

Re : [concours coopératif] nouveau style DF

Je ne suis pas contre le fait d'avoir un menu sur deux lignes. Je voudrais juste que quand cela arrive, le rendu reste joli

Je mettrai le thème à jour tout à l'heure.

Je comprends et je pense que ça passe mieux avec la dernière version pour ce cas de figure (post #380).
Mais je disais juste, que plus on limitera le nombre de menu et la longueur des noms, moins les petites réso seront affectées. C'est à réfléchir éventuellement.

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

Mis à jour.
Bon, je continue à préférer la première version du menu sans bordures à celle en cours.
Elle faisait plus sobre et plus propro à mon avis.

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

Anonyme

Invité

Re : [concours coopératif] nouveau style DF

Bonjour à tous,

Et bien moi, comme je suis largué, je vais me consacrer plutôt sur l'aspect finition.  Le peu que j'ai fait,  je vais le relooker:



Le bleu DF et pour trancher, un léger style anthracite.

Dernière modification par Anonyme (28-03-2017 11:28:57)

bendia

Chadministrateur

Distrib. : openSUSE Tumbleweed, Buster

Noyau : Linux 5.9.1-2-default + Linux 4.19.0-12-amd64

(G)UI : Gnome + Console et un peu Fluxbox

Inscription : 20-03-2012

Site Web

Re : [concours coopératif] nouveau style DF

Mis à jour.
Bon, je continue à préférer la première version du menu sans bordures à celle en cours.
Elle faisait plus sobre et plus propro à mon avis.

Le problème, à mon goût, c'est qu'il faut plus faire ressortir le menu. Comme cela, il me semble que ça ressort bien , ceci dit, il y a d'autres solutions

Voici le css de la photo de mon post plus haut : c'est celui de Kao avec des modif entre les lignes 430 à 450

/*****************************************************************
1. INITIAL SETTINGS
 *****************************************************************/

/*Ajout palmito
----------------------------------------------------------------*/
html{
  height: 100%;
}
body{
  background-color:#406292 !important;
  background-image: url("Kao/background.png") !important;
  background-repeat: repeat !important;
  margin: 0;
  padding: 5px 0 5px 0;!important;
  min-height: 99%;
}

div#wiki_container {
  width: 100em !important;
  margin-top: -20px !important;
  font-family: Arial,Helvetica,sans-serif !important;
  font-size: 0.9em !important;
  margin-left: auto;
  margin-right: auto;
}

#brdtitle h1 {
  display: block;
  background: url("Kao/banniere.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  height: 124px; /* Hauteur de l'image */
  width: 100%; /* largeur de l'image */
  text-indent: -200%;
}

#main .block .box .inbox{
  border-bottom: 2px dotted;
  border-left: 2px dotted;
  border-color: #cad7e1;
  padding: 15px;

}




.pun .thanks {
  border: 1px dotted;
  padding: 10px 20px 10px 20px;
  margin: 10px 0 10px 0;
  border-color:#000;
}

/* Poll */
#ap_poll_input {
}

.ap_poll_hidden { display: none; }

fieldset.ap_poll {
  margin-top: 2em;
  padding: 1em;
  background-color: #F6F9FC;
  border: 1px solid #DFE6EE;
}

.ap_poll legend {
  font-weight: normal;
}

.ap_poll p {
  font-weight: bold;
}

.ap_poll table {
  width: auto;
}

.ap_poll th {
  font-weight: normal;
  padding: .5em 1em .5em 0;
}

.ap_poll td {
  padding: .5em 1em;
}

.ap_poll label {

}

.ap_poll .percent {
  text-align: right;
}

.ap_poll .results .bar {
  height: 20px;
  background-color: #44699C;
}

.ap_poll .results .bar .top {
  background-color: #4F78B2;
  width: 100%;
  height: 10px;
}

.ap_poll .total {
  color: #b7b7b7;
  margin-top: .5em;
  font-style: italic;
}



/* Limited Reset
----------------------------------------------------------------*/

html, /*body,*/ .pun table, .pun div, .pun form, .pun p, .pun h1, .pun h2, .pun h3, .pun h4, .pun h5, .pun pre, .pun blockquote,
.pun ul, .pun ol, .pun li, .pun dl, .pun dt, .pun dd, .pun th, .pun td, .pun fieldset, .pun legend .pun img,
.pun abbr, .pun cite {
  border: 0;
  font-style: normal;
  font-weight: normal;
  margin: 0;
  padding: 0;
}

.pun ul, .pun ol {
  list-style: none;
}

.pun select {
  padding-bottom: 1px;
  padding-top: 1px;
}

/* Content Defaults
----------------------------------------------------------------*/

.pun {
  font: 0.9em  Arial, Helvetica, sans-serif;
}

.pun table, .pun td, .pun th, .pun input, .pun select, .pun optgroup, .pun textarea, .pun legend {
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.pun pre, .pun code {
  font-family:  monospace;
  font-size: 1em;
}

.pun pre code {
  font-size: 1em;
}

.pun table {
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  empty-cells: show;
  width: 100%;
}

.pun h1 {
  font:2.154em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h2, .pun .hd h2 {
  font: 1.462em/1em "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h3 {
  font-size: 1.154em;
  line-height: 1.267em;
  padding: 7px 0;
}

.pun h4 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 7px 0;
}

.pun h5, .pun h6 {
  font-size: 1em;
  font-weight: bold;
  padding: 7px 0;
}

.pun p, .pun ul, .pun ol, .pun dl, .pun th, .pun td, .pun legend {
  padding: 7px 0;
}

.pun strong, .pun th, .pun span.warntext, .pun p.warntext {
  font-weight: bold;
}

.pun em {
  font-style: italic;
}

.pun a, .pun a:link, .pun a:visited {
  text-decoration: none;
}

.pun a:hover, .pun a:active, .pun a:focus {
  text-decoration: underline;
}

.pun .actions span {
  padding-left: 16px;
  padding-right: 8px;
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
}

/* Hidden Elements
----------------------------------------------------------------*/

#brdfooter h2, #brdstats h2, #debug h2, #brdstats .conl dt, #brdstats .conr dt, #modcontrols dt,
#searchlinks dt, div.postright h3, .pun .subscribelink span, #announce .hd, #reportform h2, #punmoderate #vf h2,
#punviewforum #vf h2, .pun .required strong span, .pun .icon div {
  display: block;
  overflow: hidden;
  position: absolute;
  text-indent: -9999em;
  width: 0;
}

/* Generic Float Clear
----------------------------------------------------------------*/

.pun .inbox, .pun #brdmain, .pun .crumbs, .pun .pagepost, .pun .block2col {
  min-height: 1px;
}

* html .pun .inbox, * html .pun #brdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: inline-block;
}

* html .pun .inbox, * html .pun #bdrdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: block;
}

.pun .inbox:after, .pun #brdmain:after, .pun .crumbs:after, .pun .pagepost:after, .pun .block2col:after {
  content: " ";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden;
}

.pun .block2col .inbox:after {
  content: none;
  clear: none;
}

.clearl {
  clear: left;
}


/*****************************************************************
2. COMMON STYLES
 *****************************************************************/

/* Page Layout
----------------------------------------------------------------*/

.pun {
  padding: 30px 40px;
}

#punredirect {
  width:400px;
  float:center;
}

#punredirect .block{
  text-align:center;
}

#punmaint {
  padding: 60px 20% 12px 20%;
}

#puninstall, #pundb_update {
  padding: 20px 10%;
}

.pun .punwrap {
  border: 1px solid;
  padding: 0px 0px 10px 0px;
  box-shadow: 8px 8px 15px #22334c;
}

.pun .top-box {
  height: 0px;
  margin-bottom: 0px;
  position: relative;
  background: url(Air/img/main_top.png) top left no-repeat;
}

.pun .top-box div {
  height: 0px;
  margin-left: 50%;
  background: url(Air/img/main_top.png) top right no-repeat;
}

.pun .end-box {
  /*  margin-top: -17px;*/
  height: 18px;
  position: relative;
  /*  background: url(Air/img/main_end.png) bottom left no-repeat; */
  display:none;
}

.pun .end-box div {
  height: 18px;
  display:none;
}

#punredirect h2, #punmaint h2 {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  margin-bottom: 3px;
}

/* Section Spacing and Borders
----------------------------------------------------------------*/
#brdmain {
  border-style: solid none;
  border-width: 2px 0;
  margin-bottom: 12px;
  padding: 12px 5px;
}

/*#brdmain .subscribelink {
padding: 2px 2px  2px  2px  ;
}*/

#brdfooternav{
  padding: 0 5px 5px 5px;
}


#punindex #brdmain {
  padding-top: 24px;
}

#punredirect #brdmain, #punmaint #brdmain {
  border: 0;
  margin: 0;
  padding: 0;
}

#brdstats {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 24px;
  padding-top: 12px;
}

#brdstats .box{
  padding-top: 12px;
}

#quickpost {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 12px;
  padding-top: 12px;
}

#announce {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  padding-top: 3px;
}

/*****************************************************************
3. COMMON BOARD ELEMENTS
 *****************************************************************/

/* Logo, Description and Main Menu
----------------------------------------------------------------*/

#brdtitle h1 {
  padding: 0 0 0 0;
}

#brddesc {
  display:none;
}

#brddesc p {
  padding: 0;
}

/* Primary Navigation
----------------------------------------------------------------*/

#brdmenu {
  background: #44699c;
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
}

#brdmenu a, #brdmenu a:link, #brdmenu a:visited {
  background: #44699c;
  color: #e3eaf2; /*color: #d4dae2;*/
  background-image:linear-gradient( #44689b, #44689b, #44689b, #44689b, #6796d7);
}

#brdmenu a:hover, #brdmenu a:active, #brdmenu a:focus {
  background: #6796d7;
  background-image:linear-gradient( #44689b,  #6796d7);
  color: #ffffff;
  text-decoration: none;
  border-radius: 8px 8px 0 0;
}

#brdmenu ul {
  padding: 0px;
  text-align:center;
}

#brdmenu li {
  display: inline-block;
}

#brdmenu a:link, #brdmenu a:visited {
  /*border-right-style: groove;
  border-width: 1px;*/
font-size: 1.3em;
display: block;
min-width: 60px;
padding: 10px 8px;
white-space: nowrap;
border-radius: 8px 8px 0 0;  
/*font-weight:bold;*/
}

#navpm acronym {  
 border-bottom: none;                                                                                                                                                                          
}

/* Welcome Box
----------------------------------------------------------------*/

#brdwelcome {
  padding: 10px 8px;
  background-image:linear-gradient(#363434, #1e1d1d);
  background-color: #363434;
  color: #FFFFFF;
}

#brduser {
  color: #2466b0;
}

#brdwelcome .conl, #brdwelcome .conr, #brdwelcome p, #brdwelcome li {
  display: inline;
  padding: 0;
}

#brdwelcome .conl {
  float: left;
}

#brdwelcome a {
  color: #5c83bb;
}

#brdwelcome a:hover {
  color: #91A9C7;
  text-decoration: none;
}


#brdwelcome .conr {
  float: right;
}

#brdwelcome li span {
  background: url(Air/img/bull.png) center left no-repeat;
  padding-left: 18px;
  margin-right: 3px;
  display: inline-block;
  line-height: normal;
  white-space: nowrap;
}

#brdwelcome .conl li:first-child span {
  padding-left: 0;
  background: none;
}

/* Stats
----------------------------------------------------------------*/

#brdstats .conl {
  float: left;
}

#brdstats .conr {
  float: right;
  text-align: right;
}

#brdstats #onlinelist {
  border-top-style: dotted;
  border-top-width: 1px;
  clear: both;
}

#brdstats #onlinelist dt, #brdstats #onlinelist dd {
  display: inline;
}

/* Footer
----------------------------------------------------------------*/

.pun #modcontrols {
  border-style: none none dotted none;
  border-width: 0 0 1px 0;
  margin-bottom: 4px;
  text-align: center;
  width: 100%;
}

.pun #modcontrols dd {
  display: inline;
}

.pun #brdfooter #modcontrols dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter .conl {
  float: left;
}

.pun #brdfooter .conr {
  text-align: right;
  float: right;
}

.pun #brdfooter #poweredby a {
  font-size: 1.077em;
  font-weight: bold;
}

.pun #brdfooter #qjump {
  padding-top: 5px;
}

.pun #brdfooter #qjump * {
  white-space: nowrap;
}

.pun #brdfooter #searchlinks dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter #feedlinks {
  padding-bottom: 0;
}

.pun #brdfooter #feedlinks span {
  background: url(Air/img/feed.png) center left no-repeat;
  display: inline-block;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #debugtime {
  border-style: dotted none none none;
  border-width: 1px 0 0 0;
  margin-top: 7px;
  text-align: center;
}

/* Breadcrumbs, Postlink, Pagination
----------------------------------------------------------------*/

.pun .linkst .inbox, .pun linksb .inbox, .pun .postlinksb .inbox {
  overflow: hidden;
}

.pun .linksb, .pun .postlinksb, .pun .linkst, .pun .crumbs {
  clear: both;
  position: relative;
}

.pun .linkst .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.462em; */
  line-height: 1.211em;
  padding: 7px 0;
}

.pun .linksb .crumbs, .pun .postlinksb .crumbs {
  font-family:  "Trebuchet MS", Helvetica, Arial, sans-serif;
  /*  font-size: 1.154em;*/
}

.pun .linkst .crumbsplus .pagepost {
  border-top-style: dotted;
  border-top-width: 1px;
}

.pun .linksb .crumbsplus .pagepost, .pun .postlinksb .crumbsplus .pagepost {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}

.pun .postlinksb .crumbs {
  margin-right: 11em;
}

.pun .crumbs li {
  float: left;
  padding-right: 0.4em;
  white-space: nowrap;
}

.pun .crumbs li strong {
  font-weight: normal;
}

.pun .pagelink {
  float: left;
  white-space: nowrap;
}

.pun .pagelink strong, .pun .pagelink a, .pun .pagelink span.spacer {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  display: inline-block;
  padding: 0 12px 0 10px;
  margin-right: -6px;
}

.pun .pagelink .item1 {
  border: 0;
}

.pun .pagelink .pages-label {
  display: inline-block;
}

.pun .postlink {
  float: right;
  font-weight: bold;
  text-align: right;
}

.pun .modbuttons {
  float: right;
  padding: 5px 0 3px 0;
}

.pun .modbuttons input {
  margin-left: 8px;
}

.pun .subscribelink {
  position: absolute;
  right: 0;
  text-align: right;
  top: 33px;
}

#punindex .subscribelink {
  top: 0px;
}

#punindex .linksb {
  height: 12px;
}

/*****************************************************************
4. MAIN TABLES
 *****************************************************************/

.pun #brdmain .blocktable {
  position: relative;
}

#punindex #brdmain .blocktable h2, #punsearch #vf h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 1px 1px 0 1px;
  padding-left: 8px;
  position: relative;
  left: 0;
  white-space: nowrap;
  z-index: 100;
}

#punindex .blocktable th.tcl, #punsearch #vf th.tcl {
  font-size: 0;
  text-indent: -9999em;
}

.pun .blocktable .box {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blocktable .box {
  display: inline-block;
}

.pun .blocktable table {
  table-layout: fixed;
  margin-bottom: -1px;
}

.pun .blocktable th {
  padding: 7px 8px;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable td {
  padding: 7px 8px;
  line-height: 1.3077em;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable h3 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 0;
}

.pun .blocktable p {
  padding: 0;
}

.pun .blocktable .tcl p {
  padding: 5px 0 0 0;
}

.pun .blocktable .tcl {
  width: auto;
}

.pun .blocktable .tc2, .pun .blocktable .tc3, .pun .blocktable .tcmod {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  width: 11%;
}

.pun .blocktable .tcr {
  width: 30%;
}

.pun .blocktable td .newtext, .pun .blocktable td .pagestext, .pun .blocktable td .byuser {
  white-space: nowrap;
}

.pun .blocktable .tcl h3 span.newtext {
  font-size: 0.929em;
  font-weight: normal;
}

.pun #vf td.tcl span.stickytext, .pun #vf td.tcl span.closedtext {
  font-size: 1em;
  font-weight: bold;
}

#punsearch #vf .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 18%;
}

#users1 .tcr {
  width: 25%;
}

#users1 .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 25%;
}

#debug {
  margin-top: 12px;
}

#debug .tcl {
  width: 10%;
}

#punredirect #debug .tcl, #punmaint #debug .tcl {
  width: 20%;
}

#debug .tcr {
  width: 90%;
  white-space: normal
}

#punindex .tcr .byuser {
  display: block
}

#punindex td.tc2, #punindex td.tc3, #punindex td.tcr, .pun #vf td.tc2, .pun #vf td.tc3,
.pun #vf td.tcr, #punindex td.tcl div.forumdesc, .pun #vf td.tcl span {
  font-size: 0.923em;
}

.pun #vf td.tcl a {
  font-weight: bold;
}

.pun #vf td.tcl span a {
  font-weight: normal;
}

.pun .blocktable .tclcon {
  height: 1%;
  min-height: 1px;
  overflow: hidden;
  padding: 0 11px 0 12px;
  position: relative;
}

.pun .blocktable .tclcon div {
  width: 100%;
  overflow: hidden;
}

.pun .icon {
  border-style: solid;
  border-width: 8px;
  float: left;
  height: 0;
  overflow: hidden;
  width: 0;
}

.pun .iposted .ipost {
  font-weight: bold;
  left: 0;
  padding-left: 4px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 8px;
}

/*****************************************************************
MAIN POSTS
 *****************************************************************/

/* Structure
----------------------------------------------------------------*/

.pun .blockpost {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blockpost {
  display: inline-block;
}

.pun .blockpost h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  white-space: nowrap;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  height: 1.462em;
  padding: 0.538em 8px 0.538em 236px;
  font-weight: normal;
}

#punsearch .blockpost h2 {
  height: auto;
  padding-left: 36px;
  white-space: normal;
}

#punsearch .blockpost h2 span span {
  white-space: nowrap;
  display: inline-block;
  font: 1.077em "Trebuchet MS", Arial, Helvetica, sans-serif
}

#punsearch .blockpost .icon {
  position: absolute;
  top: 0;
  margin-top: -2.154em;
}

.pun .blockpost h2 .conr {
  float: right;
  text-align: right;
}

.pun .blockpost .inbox {
  float: right;
  position: relative;
  width: 100%;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  border-left-style: solid;
  border-left-width: 1px;
  float: right;
  margin-right: -218px;
  position: relative;
  text-align: left;
  width: 100%;
}

.pun .blockpost .postleft, .pun .blockpost .postfootleft {
  width: 194px;
  padding: 7px 12px 7px 12px;
  float: left;
  margin-left: -218px;
  position: relative;
}

.pun .blockpost .postleft dl {
  padding: 0;
}

#punviewtopic .blockpost dt, #punmoderate .blockpost dt {
  display: block;
  position: absolute;
  padding: 0.538em 0 0.538em 12px;
  height: 1.462em;
  top: -2.615em;
  left: 0;
  overflow: hidden;
  width: 206px;
}

.pun .blockpost dt strong {
  font-size: 1.231em;
  font-weight: bold;
}

.pun .blockpost .postleft dd {
  font-size: 0.923em;
}

.pun .blockpost .postleft .usertitle {
  padding: 4px 0 6px 0;
  font-size: 1em;
}

.pun .blockpost .postleft .postavatar {
  display: block;
  margin: 0 0 4px 0;
}

.pun .blockpost .postright {
  position: relative;
  padding: 4px 230px 7px 18px;
}

.pun .postmsg {
  width:100%;
  overflow: hidden;
  word-wrap: break-word;
}

.pun .blockpost .postfootright {
  position: relative;
  padding: 7px 230px 7px 18px;
  text-align: right;
}

.pun .postfoot p, .pun .postfoot ul {
  padding: 0;
}

.pun .blockpost .postfootright li {
  display: inline;
}

.pun .blockpost .postfootright li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

.pun .blockpost .usercontacts {
  padding: 7px 0;
}

.pun .blockpost .usercontacts .email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun .blockpost .usercontacts .website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

.pun .postsignature hr {
  border:none;
  height: 1px;
  margin-left: 0px;
  text-align: left;
}

/* Content (includes other user content)
----------------------------------------------------------------*/

.pun .usercontent {
  padding: 7px 0;
}

.pun .postmsg p, .pun .postmsg li, #punhelp p samp {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .usercontent h1, .pun .usercontent h2, .pun .usercontent h3,
.pun .usercontent h4, .pun .usercontent h5, .pun .usercontent h6 {
  padding: 7px 0 0 0;
}

.pun .postmsg h5, #punhelp h5 {
  font-size: 1.231em;
  font-weight: bold;
  padding: 7px 0;
}

.pun .usercontent ul, .pun .postmsg ul {
  list-style: disc;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol, .pun .postmsg ol {
  list-style: decimal;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol.alpha, .pun .postmsg ol.alpha {
  list-style: lower-alpha;
}

.pun .usercontent li, .pun .postmsg li {
  padding: 0 3px;
}

.pun .usercontent li p, .pun .postmsg li p {
  padding: 0;
}

.pun span.bbu {
  text-decoration: underline;
}

.pun span.bbs, .pun del {
  text-decoration: line-through;
}

.pun .postmsg ins, #punhelp samp ins {
  text-decoration: none;
}

.pun .blockpost .postmsg .postedit {
  font-size: 0.857em;
}

.pun .blockform .postsignature, .pun .blockpost .postsignature {
  font-size: 0.923em;
}

.pun .codebox {
  border-style: solid;
  border-width: 1px;
  margin: 0.75em 1em;
  padding: 0;
}

.pun .quotebox {
  border-style: solid;
  border-width: 1px 1px 1px 3px;
  margin: 0.75em 1em;
  padding: 0 0.75em;
}

.pun .quotebox cite {
  display: block;
  padding: 0.75em 0 0 0;
  font-weight: bold;
  line-height: 1.462em;
}

.pun .quotebox blockquote {
  overflow: hidden;
  width: 100%;
}

.pun .codebox pre {
  overflow-y:hidden;
  overflow: auto;
  width: 100%;
  direction: ltr;
  text-align: left;
}

* html .pun .codebox pre {
  padding-bottom: 10px;
}

*:first-child+html .pun .codebox pre {
  padding-bottom: 10px;
}

.pun .codebox pre code {
  padding: 0.75em;
  white-space: pre;
}

.pun div[class*=codebox] pre code {
  display: inline-block;
}

* html .pun .codebox pre code {
  display: block;
}

.pun .codebox pre.vscroll {
  height: 32em;
  overflow: auto;
  overflow-y: auto
}

.pun .postmsg img, #punhelp samp img {
  vertical-align: text-top;
}

.pun .postmsg .postimg img {
  max-width: 98%;
  vertical-align: middle;
  margin: 7px 0.5em 7px 0;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-style: solid;
  border-width: 2px;
}

/*****************************************************************
MAIN FORMS
 *****************************************************************/

#punedit .blockform h2, #punpost .blockform h2, #postpreview h2, #posterror h2,
.pun #quickpost h2, .pun #reportform h2, #pundelete .blockform h2 {
  font: 1em/1.462em Arial, Helvetica, sans-serif;
  font-weight: bold;
  white-space: nowrap;
  padding: 10px 19px 4px 37px;
  border: 0;
}

#punpost .blockform h2, #punedit .blockform h2,.pun #quickpost h2,
#pundelete .blockform h2 {
  margin: 1px 1px 0 1px;
  width: 25em;
  position: absolute;
  z-index: 100;
}

.pun #quickpost legend, #punpost legend, #punedit legend {
  width: 25em;
  overflow: hidden;
  white-space: nowrap;
}

.pun .blockform .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 12px;
}

.pun #posterror {
  border-style: solid;
  border-width: 1px;
}

.pun #posterror .box {
  padding: 0 18px 12px 18px;
}

* html .pun .blockform .box, * html .pun #posterror {
  display: inline-block;
}

.pun .blockform .forminfo, .pun .error-info {
  padding: 12px 18px;
  border-style: solid;
  border-width: 1px;
  position: relative;
}

.pun .blockform .forminfo {
  margin-top: 12px;
}

#pundelete .blockform .forminfo {
  margin-top: 33px;
}

.pun .forminfo h3 {
  padding-bottom: 0;
}

.pun .error-list li {
  padding-left: 24px;
  background: url(Air/img/exclaim.png) center left no-repeat;
}

.pun .inform {
  padding: 0 18px;
}

.pun legend {
  font-weight: bold;
  padding: 10px 19px 4px 19px;
}

* html .pun legend {
  margin-left: -7px;
}

*:first-child+html .pun legend {
  margin-left: -7px;
}

.pun .infldset {
  border-style: solid;
  border-width: 1px;
  padding: 12px 18px;
}

#punregister #rules .infldset {
  padding: 5px 18px;
}

.pun fieldset p {
  padding: 0 0 7px 0;
  width: 100%;
}

.pun fieldset .usercontent p {
  padding: 7px 0;
}

.pun fieldset label {
  display: block;
  padding: 0 0 7px 0;
}

.pun label em {
  font-weight: normal;
  font-style: normal;
}

.pun .required strong {
  background: url(Air/img/asterisk.png) center right no-repeat;
  font-weight: normal;
  padding-right: 14px;
  white-space: pre;
  display: inline-block;
  line-height: normal;
}

.pun label input, .pun label select, .pun label textarea {
  margin-top: 2px;
}

.pun label.conl {
  display: inline-block;
  padding-right: 12px;
}

.pun form .buttons {
  padding: 8px 19px 8px 34px;
  margin-bottom: -12px;
}

.pun .blockform .buttons input {
  margin-right: 12px;
}

.pun .rbox {
  padding: 3px 0;
}

.pun .rbox label {
  padding: 3px 0 3px 1.75em;
  position: relative;
  min-height: 1px;
}

* html .pun .rbox label {
  text-indent: -3px;
  height: 1%;
}

.pun .rbox input {
  margin: 3px 0.75em 3px -1.75em;
  float: left;
  position: relative;
  vertical-align: middle;
  padding: 0;
  height: 1em;
  width: 1em;
}

.pun input[type=text], .pun select, .pun textarea {
  font-family:  Verdana, Arial, Helvetica, sans-serif;
}

.pun .txtarea textarea, .pun input.longinput {
  width: 98%;
}

.pun #quickpost .txtarea {
  padding-right: 12px;
  position: relative;
}

.pun .blockform .bblinks {
  padding-top: 0;
}

.pun .blockform .bblinks li {
  display: inline;
}

.pun .blockform .bblinks li span {
  background: url(Air/img/help.png) center left no-repeat;
  margin-right: 8px;
  padding-left: 20px;
  display: inline-block;
}

.pun #quickpost .bblinks {
  padding-top: 0;
}

.pun #quickpost .bblinks li {
  display: inline;
}

.pun #login p.clearb {
  border-top-style: dotted;
  border-top-width: 1px;
  font-size: 0;
  height: 0;
  line-height: 0;
  margin-top: 7px;
  overflow: hidden;
  padding-bottom: 3px;
  padding-top: 7px;
  text-indent: -9999em;
  width: 100%;
}

.pun #postreview {
  padding-top: 12px;
}

.pun #postpreview, .pun #posterror {
  margin-bottom: 12px;
}

.pun #postpreview .postright {
  padding: 0;
}

.pun #postpreview .postbody {
  border-style: solid;
  border-width: 1px;
  float: none;
  margin: 0 18px 12px 18px;
  padding: 0;
  padding: 4px 18px 4px 18px;
  width: auto;
}

.pun span.email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun span.website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

#punmisc #rules .box {
  border-style: solid;
  border-width: 1px;
  padding: 5px 18px;
}


#punhelp .box {
  border-style: solid;
  border-width: 1px;
  padding: 7px 12px;
}

.pun .multiselect {
  float: left;
  padding-bottom: 7px;
}

.pun .checklist {
  border-width: 1px;
  border-style: solid;
  max-height: 9em;
  width: 20em;
  overflow: auto;
  padding: 0.25em 0.5em;
  margin: 0.25em 16px 0 0.15em;
}

.pun .checklist legend {
  padding: 0;
}

.pun .checklist legend span {
  width: auto;
  max-width: 25em;
}

.pun .checklist .checklist-item {
  position: relative;
}

.pun .checklist .checklist-item label {
  padding: 0 0 0 1.75em;
}

.pun .checklist .checklist-item .fld-input {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
}

.pun .checklist .checklist-item input {
  margin: 0;
  height: 1.55em;
  width: 1.55em;
}

/*****************************************************************
PROFILES (+ ADMIN MENU)
 *****************************************************************/

/* Profile / Admin
----------------------------------------------------------------*/

.pun .blockmenu {
  width: 13em;
  float: left;
  padding-bottom: 12px;
}

.pun .block2col .blockform, .pun .block2col .block {
  margin-left: 15em;
}

.pun .blockmenu .block2 {
  padding-top: 19px;
}

.pun .blockmenu ul {
  border-top-style: dotted;
  border-top-width: 1px;
  padding: 0;
}

.pun .blockmenu li {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  font-weight: bold;
  padding: 0;
}

.pun .blockmenu a:link, .pun .blockmenu a:visited {
  display: block;
  padding: 9px 6px 3px 6px;
  min-height: 1px;
  text-decoration: none;
}

* html .pun .blockmenu a:link,  * html .pun .blockmenu a:visited {
  height: 1%;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  text-decoration: none;
}

#viewprofile .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 18px;
}

#viewprofile dt, #adstats dt {
  padding: 7px 0;
  position: absolute;
  width: 13em;
  left: 0;
}

#viewprofile dl {
  border-style: solid none none none;
  border-width: 1px;
  margin: 7px 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#adintro, #adstats {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adintro li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

#adstats .inbox, #adintro .inbox {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adstats dl {
  margin: 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#viewprofile dd, #adstats dd {
  border-style: none none solid none;
  border-width: 1px;
  padding: 7px 0 7px 13em;
}

/*****************************************************************
COLOUR SCHEME
 *****************************************************************/

/* Basic defaults and Common Items
----------------------------------------------------------------*/

html, /*body,*/ .pun {
  background: #f6f9fc;
  color: #333;
}

.pun .punwrap {
  /*  background: #fff;*/
  /*  border-color: #cad7e1; */
  border: none;
  color: #313a45; /*  color: #566579;*/
  margin-bottom: 20px;
}

#brdtitle #brddesc, .pun .pagepost, #brdstats #onlinelist, #brdfooter #searchlinks, #brdfooter #modcontrols,
#punmaint h2, #punredirect h2, #adminconsole .submittop, .pun #debugtime, .pun .pagelink a, .pun .pagelink * {
  border-color: #b9c5ce;
  font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

.pun a, .pun a:link, .pun a:visited {
  color: #2365B0;
}

.pun a:hover, .pun a:active, .pun a:focus {
  color: #004687;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-color: #22538a;
}

.pun .postmsg .postimg a:hover img, .pun .postmsg .postimg a:active img, .pun .postmsg .postimg a:focus img {
  border-color: #b50000;
}



/* Main Tables
----------------------------------------------------------------*/

.pun .blocktable .box {
  background: #fcfdfe;
  border-color: #b9c5ce #d9e1e7;
}

#punindex .blocktable h2, .pun #vf h2 {
  color: #357082;
}

#adminconsole fieldset th, #adminconsole fieldset td {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun #users1 h2 {
  background: #fff;
}

.pun .blocktable td {
  border-color: #dfe6ee;
}

.pun .blocktable th {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blocktable td.tcl span.stickytext {
  color: #3399CC;
}

/* Main Posts
----------------------------------------------------------------*/

.pun .blockpost {
  background: #f6f9fc;
  border-color: #b9c5ce #d9e1e7;
}

.pun .blockpost h2 {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  background: #fcfdfe;
  border-color: #dfe6ee;
}

.pun .blockpost .postfootright li {
  color: #fcfdfe;
}

.pun .postmsg, #punhelp code, #punhelp samp {
  color: #333;
}

.pun .postsignature, .pun .postmsg .postedit {
  color: #566579;
}

.pun .quotebox {
  background: #f8f9f0;
  border-color: #7aadbd;
  color: #566579;
}

.pun .quotebox cite {
  color: #357082;
}

.pun .codebox, #punhelp .codebox code {
  background: #333;
  color: #fff;
}

.pun .postmsg hr {
  background: #b9c5ce;
}

.pun .postmsg ins, #punhelp samp ins {
  background-color: #ff0;
}

/* Main Forms + Profile
----------------------------------------------------------------*/

.pun .blockform .box, #adstats, #adintro, #postpreview, #posterror {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

#punmisc #rules .box, #punhelp .box {
  border-color: #b9c5ce #d9e1e7;
  background: #f6f9fc;
}

.pun #quickpost h2, #punpost .blockform h2, #punedit .blockform h2, #posterror h2,
#pundelete .blockform h2 {
  background: #ebf1f5;
  color: #357082;
}

.pun .forminfo {
  background: #fff;
  border-color: #dfe6ee;
}

#puninstall form#install .forminfo {
  background: #44699c;
  color: #fff;
}

.pun #posterror .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
}

#puninstall form#install .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
  color: #333;
}

.pun .infldset, #adintro .inbox, #adstats .inbox {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun label, .pun legend, #adminconsole fieldset th {
  color: #357082;
}

.pun fieldset p {
  border-color: #b9c5ce;
}

.pun .blockmenu ul, .pun .blockmenu li {
  border-color: #b9c5ce;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  background: #ffffe6;
}

.pun .blockmenu .isactive a:link, .pun .blockmenu .isactive a:visited {
  color: #333;
  background: #f6f9fc;
}

.pun #viewprofile .box {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

.pun #viewprofile dt, #adstats dt {
  color: #357082;
}

.pun #viewprofile dl, .pun #viewprofile dd, #adstats dl, #adstats dd {
  border-color: #dfe6ee;
}

#adminconsole fieldset td.nodefault {
  background: #d59b9b;
}

.pun .multiselect {
  color: #357082;
}

.pun .checklist {
  background: white;
  border-color: #ccc;
}

/* Status Indicators
----------------------------------------------------------------*/

.pun .icon {
  width: 16px;
  height: 16px;
  border-width: 0px;
  border-color: #e8ecf1 #d4d9dd #dfe3e8 #e8ecf1;
  background-image: url("Kao/icon.png");

}

.pun .iredirect .icon{
  border-color: #b9c5ce;
  border-width: 1px;
  padding: 7px;
}

.pun .inew .icon {
  border-color: #91b3d9 #87a8d1 #6c85bb #7292c3;
  background-image: url("Kao/icon-new.png");
}

div.pun {
  max-width: 100em;
  width: 100%;
  margin: auto auto;
  padding: 0px 0px;
}

/* Intégration du code source
----------------------------------------------------------------*/

.pun .geshicodebox {
  overflow-y:auto;
  overflow: auto;
  width: 95%;
  direction: ltr;
  text-align: left;
  font-size: 10pt;
  max-height: 22em;
  white-space: nowrap;
  padding: 1em;
  background-color: rgb(251, 250, 249);
  color: black;
  margin: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  margin-left: 1em;
}

.pun div.code_root {
  margin-left: 0.5em;
  border-color: rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 0, 0);
  box-shadow: 0px 0px 5px rgb(170, 136, 136) inset;
  border-left: 0.5em solid rgb(170, 0, 0);
}

.pun div.code_user {
  margin-left: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  border-left: 0.5em solid rgb(85, 85, 85);
}

.pun div.code_root:before, .pun div.code_user:before {
  border-bottom: 0px dotted black;
  margin: -1em -1em 0 -1em;
  padding: 0.1em 0.5em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
.pun div.code_root:before {
  content: "en root";
  background: url(/images/root.png) no-repeat right;
  background-size: contain;
}
.pun div.code_root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

.pun div.code_user:before {
  content: "en user";
  background: url(/images/user.png) no-repeat right;
  background-size: contain;
}
.pun div.code_user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

/* Page d'accueil
----------------------------------------------------------------*/


.carre {
  width:31%;
  height:100px;
  background-image:linear-gradient(#2c476d, #44689b);
  float: left;
  margin: 1%;
  border-radius: 8px 8px 8px 8px;

}

.carre h1{
  font-size:160%;
  text-align: center;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre h2{
  padding-left:10px !important;
  font-size:110% !important;
  line-height:1.1 !important;
  font-family:  Arial, Helvetica, sans-serif;
}

.carre a{
  text-decoration: none !important;
  background-repeat:no-repeat;
  background-position:95% 45%;
  box-shadow: 8px 8px 5px #879aa9;
  border-radius: 8px 8px 8px 8px;
  height: 100%;
  display: block;
}

.carre a:hover{
  text-decoration: none !important;
  background-color: #44689b;
  box-shadow: 8px 8px 5px #879aa9;
  background-position:95% 55%;
  border-radius: 8px 8px 8px 8px;
}

#carregauche{
  margin: 1%;
}

#carregauche a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-archive.png');
}

#carregauche2{
  margin: 1%;
}

#carregauche2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-installer.png');
}

#carremilieu{
  margin: 1%;
}

#carremilieu a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-forum.png');
}

#carremilieu2{
  margin: 1%;
}

#carremilieu2 a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-irc.png');
}

#carredroite{
  margin: 1%;
}

#carredroite a{
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('/images/btn-asso.png');
}

.news{
  box-shadow: 8px 8px 5px #879aa9;
  background-color:#f0f0f0;
  background-repeat:no-repeat;
  background-position:98% 0%;
  border-radius: 8px 8px 8px 8px;
}

.news h1{
  padding-left: 20px !important;
  padding-top: 10px !important;
  color: #44699C;

}

.news h2{
  padding-top: 10px !important;
  padding-left: 20px !important;
}

.news h5{
  padding-top: 10px !important;
  padding-left: 20px !important;
}



.news p{
  padding-left: 20px !important;
  padding-right: 10px !important;
  padding-top: 0px !important;
}

#news{
  float:left;
  width:64%;
  margin: 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
}

#newsasso{
  float:right;
  width:30%;
  margin: 1% 2% 1% 1%;
  border-width: 1px;
  border-style: solid;
  border-color: #6796d7;
  background-image:url('/images/logo-asso-4-mini.png');
}
 

 

---

Ben
___________________
La seule question bête, c'est celle qu'on ne pose pas.

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

Le problème, à mon goût, c'est qu'il faut plus faire ressortir le menu.

Je trouve qu'il n'y a pas d'ambiguité au fait que ce soit un menu, et qu'il attire suffisamment l'attention, sans non plus devenir un élément graphique à part entière.
Ces boutons intercalaires, ça fait un peu KDE, années 2000-2010

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

Anonyme

Invité

Re : [concours coopératif] nouveau style DF

C'est vrai tiens qu'on dirait du KDE comme style

paskal

autobahn

Lieu : ailleurs

Inscription : 14-06-2011

Site Web

Re : [concours coopératif] nouveau style DF

Les boutons se chevauchent lors du passage sur 2 ligne et +, c'est voulu ?

(KDE, années 2000-2010, c'est toujours mieux que Gnome 2010-2020  )

---

I'd love to change the world
But I don't know what to do
So I'll leave it up to you...

bendia

Chadministrateur

Distrib. : openSUSE Tumbleweed, Buster

Noyau : Linux 5.9.1-2-default + Linux 4.19.0-12-amd64

(G)UI : Gnome + Console et un peu Fluxbox

Inscription : 20-03-2012

Site Web

Re : [concours coopératif] nouveau style DF

Je trouve qu'il n'y a pas d'ambiguité au fait que ce soit un menu, et qu'il attire suffisamment l'attention

Personnellement, je ne suis pas de cet avis   Pour ma part, il ne m'a pas sauter aux yeux alors que je savais quoi chercher. J'imagine quelqu'un non inscrit arrivant sur le site.

Ce que je propose coupe peut-être la poire en deux ?

---

Ben
___________________
La seule question bête, c'est celle qu'on ne pose pas.

paskal

autobahn

Lieu : ailleurs

Inscription : 14-06-2011

Site Web

Re : [concours coopératif] nouveau style DF

Je trouvais les petits liserets visibles tout en restant discrets. 

---

I'd love to change the world
But I don't know what to do
So I'll leave it up to you...

kao

Modérateur

Distrib. : Testing

Noyau : Linux 4.quelquechose

(G)UI : Gnome 3

Inscription : 27-09-2012

Site Web

Re : [concours coopératif] nouveau style DF

Voici le css de la photo de mon post plus haut : c'est celui de Kao avec des modif entre les lignes 430 à 450

Ça centre les boutons mais ça ne les étales pas sur toute la largeur.

Sinon pour un apparence des boutons plus douce, on peut passer à 2px le box shadow de la ligne 446:

  box-shadow: 2px 0px 2px #324b70;

C'est un poil plus discret

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

@bendia: regarde le menu ici: https://www.debian.org/

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

@kao: euh, je ne vois pas trop de différence…

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

bendia

Chadministrateur

Distrib. : openSUSE Tumbleweed, Buster

Noyau : Linux 5.9.1-2-default + Linux 4.19.0-12-amd64

(G)UI : Gnome + Console et un peu Fluxbox

Inscription : 20-03-2012

Site Web

Re : [concours coopératif] nouveau style DF

@captnfab : première réaction : quel menu ?

Après quelques secondes de recherches : ah oui, celui qui apparaît tout en haut, souligné, et non écrasé entre 2 bandeaux 

---

Ben
___________________
La seule question bête, c'est celle qu'on ne pose pas.

Anonyme

Invité

Re : [concours coopératif] nouveau style DF

Mes CSS:

/*****************************************************************
1. INITIAL SETTINGS
*****************************************************************/

/*Ajout palmito    
----------------------------------------------------------------*/
/*background: #ff0000;*/


html, body {
        margin: 0;
        padding: 0;
        background: #eee url('http://pix.tdct.org/upload/original/1392097871.png') repeat-y center;
        color: #666;
}


@font-face {
        font-family:  "Zekton";
        src: url("Anonyme/zekton__.ttf") format("truetype");
        font-weight: normal;
        font-style: normal;
}
@font-face {
        font-family:  "Zekton";
        src: url("Anonyme/zektonbo.ttf") format("truetype");
        font-weight: bold;
        font-style: normal;
}
@font-face {
        font-family:  "Zekton";
        src: url("Anonyme/zektonit.ttf") format("truetype");
        font-weight: normal;
        font-style: italic;
}
@font-face {
        font-family:  "Zekton";
        src: url("Anonyme/zektonbi.ttf") format("truetype");
        font-weight: bold;
        font-style: italic;
}


#brdtitle h1 {
  display: block;
  background: url(http://debian-facile.org/img/df_bleu_test.png);
  background: url('http://pix.tdct.org/upload/original/1392663748.png');
        background-position: 0 0;
  background-repeat: no-repeat;
  height: 110px; /* Hauteur de l'image */
  width: 100%; /* largeur de l'image */
  text-indent: -200%;
}

#main .block .box .inbox{
  border-bottom: 2px dotted;
  border-left: 2px dotted;
  border-color: #cad7e1;
  padding: 15px;
}

.pun .thanks {
  border: 1px dotted;
  padding: 10px 20px 10px 20px;
  margin: 10px 0 10px 0;
  border-color:#000;
}

/* Poll */
#ap_poll_input {
}

.ap_poll_hidden { display: none; }

fieldset.ap_poll {
        margin-top: 2em;
        padding: 1em;
        background-color: #F6F9FC;
        border: 1px solid #DFE6EE;
}

.ap_poll legend {
        font-weight: normal;
}

.ap_poll p {
        font-weight: bold;
}

.ap_poll table {
        width: auto;
}

.ap_poll th {
        font-weight: normal;
        padding: .5em 1em .5em 0;
}

.ap_poll td {
        padding: .5em 1em;
}

.ap_poll label {
       
}

.ap_poll .percent {
        text-align: right;
}

.ap_poll .results .bar {
        height: 20px;
        background-color: #44699C;
}

.ap_poll .results .bar .top {
        background-color: #4F78B2;
        width: 100%;
        height: 10px;
}

.ap_poll .total {
        color: #b7b7b7;
        margin-top: .5em;
        font-style: italic;
}



/* Limited Reset
----------------------------------------------------------------*/

html, body, .pun table, .pun div, .pun form, .pun p, .pun h1, .pun h2, .pun h3, .pun h4, .pun h5, .pun pre, .pun blockquote,
.pun ul, .pun ol, .pun li, .pun dl, .pun dt, .pun dd, .pun th, .pun td, .pun fieldset, .pun legend .pun img,
.pun abbr, .pun cite {
  border: 0;
  font-style: bold;
  font-weight: normal;
  margin: 0 0 0 0;                              
  padding: 0;                                                           /*PAGE GENERALE REDUITE MAIS PAS SUR */                                
}

.pun ul, .pun ol {
  list-style: none;
}

.pun select {
  padding-bottom: 1px;
  padding-top: 1px;
}

/* Content Defaults
----------------------------------------------------------------*/

.pun {
  font: 0.75em Zekton, Arial, Helvetica, sans-serif;
        box-shadow: 0px 7px 30px LightSlateGray,inset 0 -1px 0 0 ;            /* SOULEVEMENT DE LA PAGE TOTALE PAR UN HALO LUMINEUX */
}

.pun table, .pun td, .pun th, .pun input, .pun select, .pun optgroup, .pun textarea, .pun legend {
  font-family: Zekton, Arial, Helvetica, sans-serif;
  font-size: 1em;
       
}

.pun pre, .pun code {
  font-family: monospace;
  font-size: 1em;
}

.pun pre code {
  font-size: 1em;
}

.pun table {
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  empty-cells: show;
  width: 100%;

}

.pun h1 {
  font:2.154em/1em Zekton, "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h2, .pun .hd h2 {
  font: 1.462em/1em Zekton, "Trebuchet MS", Arial, Helvetica, sans-serif;
  padding: 7px 0;
}

.pun h3 {
  font-size: 1.154em;
  line-height: 1.267em;
  padding: 7px 0;
}

.pun h4 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 7px 0;
}

.pun h5, .pun h6 {
  font-size: 1em;
  font-weight: bold;
  padding: 7px 0;
}

.pun p, .pun ul, .pun ol, .pun dl, .pun th, .pun td, .pun legend {
  padding: 7px 0;
}

.pun strong, .pun th, .pun span.warntext, .pun p.warntext {
  font-weight: bold;
}

.pun em {
  font-style: italic;
}

.pun a, .pun a:link, .pun a:visited {
  text-decoration: none;
}

.pun a:hover, .pun a:active, .pun a:focus {
  text-decoration: none;
       
}

.pun .actions span {
  padding-left: 16px;
  padding-right: 8px;
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
}

/* Hidden Elements
----------------------------------------------------------------*/

#brdfooter h2, #brdstats h2, #debug h2, #brdstats .conl dt, #brdstats .conr dt, #modcontrols dt,
#searchlinks dt, div.postright h3, .pun .subscribelink span, #announce .hd, #reportform h2, #punmoderate #vf h2,
#punviewforum #vf h2, .pun .required strong span, .pun .icon div {
  display: block;
  overflow: hidden;
  position: absolute;
  text-indent: -9999em;
  width: 0;
}

/* Generic Float Clear
----------------------------------------------------------------*/

.pun .inbox, .pun #brdmain, .pun .crumbs, .pun .pagepost, .pun .block2col {
  min-height: 1px;
}

* html .pun .inbox, * html .pun #brdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: inline-block;
}

* html .pun .inbox, * html .pun #bdrdmain, * html .pun .infldset, * html .pun .crumbs, * html .pun .pagepost, * html .pun .block2col {
  display: block;
}

.pun .inbox:after, .pun #brdmain:after, .pun .crumbs:after, .pun .pagepost:after, .pun .block2col:after {
  content: " ";
  display: block;
  height: 0;
  font-size: 0;
  clear: both;
  visibility: hidden;
}

.pun .block2col .inbox:after {
  content: none;
  clear: none;
}

.clearl {
  clear: left;
}


/*****************************************************************
2. COMMON STYLES
*****************************************************************/

/* Page Layout
----------------------------------------------------------------*/

.pun {
  padding: 30px 40px;
}

#punredirect, #punmaint {
  padding: 60px 20% 12px 20%;
}

#puninstall, #pundb_update {
  padding: 20px 10%;
}

.pun .punwrap {
  border: 1px solid;
  padding: 0px;
}

.pun .top-box {
  height: 0px;
  margin-bottom: 0px;
  position: relative;
  background: url(Air/img/main_top.png) top left no-repeat;
}

.pun .top-box div {
  height: 0px;
  margin-left: 50%;
  background: url(Air/img/main_top.png) top right no-repeat;
}

.pun .end-box {
/*  margin-top: -17px;*/
  height: 18px;
  position: relative;
/*  background: url(Air/img/main_end.png) bottom left no-repeat; */
 background: none;
}

.pun .end-box div {
  height: 18px;
  margin-left: 50%;
/*  background: url(Air/img/main_end.png) bottom left no-repeat; */
 background: none;
}

#punredirect h2, #punmaint h2 {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  margin-bottom: 3px;
}

/* Section Spacing and Borders
----------------------------------------------------------------*/

#brdmain {
  border-style: solid none;
  border-width: 0 0;                                                    /* LE VILAIN TRAIT GRIS-BLEU SOUS LE HEADER CONNECTE EN TANT QUE */
        margin-bottom: 12px;
  padding: 12px 6px;                                                    /* ECARTER DU BORD DE PAGE "MARQUER TOUTES ... DERNIER UTIL... TOUT EN BAS **/


}

#punindex #brdmain {
  padding-top: 24px;
}

#punredirect #brdmain, #punmaint #brdmain {
  border: 0;
  margin: 0;
  padding: 0;
}

#brdstats {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 24px;
  padding-top: 12px;

}

#brdstats .box{
        padding-top: 12px;
       


}

#quickpost {
  border-style: solid none none none;
  border-width: 2px 0 0 0;
  margin-top: 12px;
  padding-top: 12px;
}

#announce {
  border-style: solid none none none;
  border-width: 7px 0 0 0;
  padding-top: 3px;
}





/*****************************************************************
3. COMMON BOARD ELEMENTS
*****************************************************************/

/* Logo, Description and Main Menu
----------------------------------------------------------------*/

#brdtitle h1 {
  padding: 0 0 10px 0;
}

#brddesc {
        background-image: linear-gradient(#43689B, #43689B,  #43689B);
        color: rgb(255, 255, 255);
         
  border-top-style: none;                                                          /* dotted */
  border-top-width: 4px;                                                           /* FEUILLE PERFOREE SOUS BANNIERE */
        padding: 10px 10px;                                                              /* DEPLACER BIENVENUE CHEZ DEBIAN FACILE */
}

#brddesc p {
  padding: 0;                              
}

#brdmenu ul {
  padding: 0;
}

#brdmenu li {
  float: left;
}

#brdmenu a:link, #brdmenu a:visited {
  border-right-style: solid;
  border-width: 1px;
  display: block;
  min-width: 60px;
  padding: 10px 3px;
  white-space: nowrap;
}

#brdmenu a:hover, #brmenu a:active, #brdmenu a:focus {
  text-decoration: none;
}

/* Welcome Box
----------------------------------------------------------------*/

#brdwelcome {
  background-image: linear-gradient(rgb(54, 52, 52), rgb(30, 29, 29));
        color: rgb(255, 255, 255);
                                                  /* HEADER CONNECTE SOUS L'IDENTITE UTILISATEUR - 2PX C'EST L'ESPACE DES HACHURES */
        border-color: #44699c;
  color: #d4dae2;
        border-radius: 0px 0px 10px 10px;
        padding: 10px 0;
        line-height:8px;
        margin: 0 0 0 0;                                                      /* HEADER ANTHRACITE DESSOUS margin: -6px 2px 0px 2px;  */
       
       
}

#brdwelcome .conl, #brdwelcome .conr, #brdwelcome p, #brdwelcome li {
  display: inline;
  padding: 6px;
}

#brdwelcome .conl {
  float: left;
}

#brdwelcome .conr {
  float: right;
}

#brdwelcome li span {
  background: url(Air/img/bull.png) center left no-repeat;
  padding-left: 18px;
  margin-right: 3px;
  display: inline-block;
  line-height: normal;
  white-space: nowrap;
}

#brdwelcome .conl li:first-child span {
  padding-left: 0;
  background: none;
}

/* Stats
----------------------------------------------------------------*/

#brdstats .conl {
  float: left;
}

#brdstats .conr {
  float: right;
  text-align: right;
}

#brdstats #onlinelist {
  border-top-style: dotted;
  border-top-width: 1px;
  clear: both;
}

#brdstats #onlinelist dt, #brdstats #onlinelist dd {
  display: inline;
}

/* Footer
----------------------------------------------------------------*/

.pun #modcontrols {
  border-style: none none dotted none;
  border-width: 0 0 1px 0;
  margin-bottom: 4px;
  text-align: center;
  width: 100%;
}

.pun #modcontrols dd {
  display: inline;
}

.pun #brdfooter #modcontrols dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter .conl {
  float: left;
}

.pun #brdfooter .conr {
  text-align: right;
        padding: 8px;
  float: right;
}

.pun #brdfooter #poweredby a {
  font-size: 1.077em;
  font-weight: bold;
}

.pun #brdfooter #qjump {
  padding-top: 5px;
}

.pun #brdfooter #qjump * {
  white-space: nowrap;
}

.pun #brdfooter #searchlinks dd span {
  background: url(Air/img/bull.png) center left no-repeat;
  display: inline-block;
  line-height: normal;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #brdfooter #feedlinks {
  padding-bottom: 0;
}

.pun #brdfooter #feedlinks span {
  background: url(Air/img/feed.png) center left no-repeat;
  display: inline-block;
  padding-left: 18px;
  white-space: nowrap;
}

.pun #debugtime {
  border-style: dotted none none none;
  border-width: 1px 0 0 0;
  margin-top: 7px;
  text-align: center;
}

/* Breadcrumbs, Postlink, Pagination
----------------------------------------------------------------*/

.pun .linkst .inbox, .pun linksb .inbox, .pun .postlinksb .inbox {
  overflow: hidden;
}

.pun .linksb, .pun .postlinksb, .pun .linkst, .pun .crumbs {
  clear: both;
  position: relative;
}

.pun .linkst .crumbs {
  font-family: Zekton, "Trebuchet MS", Helvetica, Arial, sans-serif;
  font-size: 1.462em;
  line-height: 1.211em;
  padding: 7px 0;
}

.pun .linksb .crumbs, .pun .postlinksb .crumbs {
  font-family: Zekton, "Trebuchet MS", Helvetica, Arial, sans-serif;
  font-size: 1.154em;
}

.pun .linkst .crumbsplus .pagepost {
  border-top-style: dotted;
  border-top-width: 1px;
}

.pun .linksb .crumbsplus .pagepost, .pun .postlinksb .crumbsplus .pagepost {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}

.pun .postlinksb .crumbs {
  margin-right: 11em;
}

.pun .crumbs li {
  float: left;
  padding-right: 0.4em;
  white-space: nowrap;
}

.pun .crumbs li strong {
  font-weight: normal;
}

.pun .pagelink {
  float: left;
  white-space: nowrap;
}

.pun .pagelink strong, .pun .pagelink a, .pun .pagelink span.spacer {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  display: inline-block;
  padding: 4px 12px 0 10px;
  margin-right: -6px;
}

.pun .pagelink .item1 {
  border: 0;
}

.pun .pagelink .pages-label {
  display: inline-block;
}

.pun .postlink {
  float: right;
  font-weight: bold;
  text-align: right;
}

.pun .modbuttons {
  float: right;
  padding: 5px 0 3px 0;
}

.pun .modbuttons input {
  margin-left: 8px;
}

.pun .subscribelink {
  position: absolute;
  right: 0;
  text-align: right;
  top: 33px;
}

#punindex .subscribelink {
  top: 0px;
}

#punindex .linksb {
  height: 12px;
}

/*****************************************************************
4. MAIN TABLES
*****************************************************************/

.pun #brdmain .blocktable {
  position: relative;
}

#punindex #brdmain .blocktable h2, #punsearch #vf h2 {
  font: 1em/1.462em Zekton, Arial, Helvetica, sans-serif;
  font-weight: bold;
  margin: 1px 1px 0 1px;
  padding-left: 8px;
  position: relative;
  left: 0;
  white-space: nowrap;
  z-index: 100;
}

#punindex .blocktable th.tcl, #punsearch #vf th.tcl {
  font-size: 0;
  text-indent: -9999em;
}

.pun .blocktable .box {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blocktable .box {
  display: inline-block;
}

.pun .blocktable table {
  table-layout: fixed;
  margin-bottom: -1px;
}

.pun .blocktable th {
  padding: 7px 8px;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable td {
  padding: 7px 8px;
  line-height: 1.3077em;
  border-style: none none solid none;
  border-width: 1px;
  text-align: left;
}

.pun .blocktable h3 {
  font-size: 1.077em;
  font-weight: bold;
  padding: 0;
}

.pun .blocktable p {
  padding: 0;
}

.pun .blocktable .tcl p {
  padding: 5px 0 0 0;
}

.pun .blocktable .tcl {
  width: auto;
}

.pun .blocktable .tc2, .pun .blocktable .tc3, .pun .blocktable .tcmod {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  width: 11%;
}

.pun .blocktable .tcr {
  width: 30%;
}

.pun .blocktable td .newtext, .pun .blocktable td .pagestext, .pun .blocktable td .byuser {
  white-space: nowrap;
}

.pun .blocktable .tcl h3 span.newtext {
  font-size: 0.929em;
  font-weight: normal;
}

.pun #vf td.tcl span.stickytext, .pun #vf td.tcl span.closedtext {
  font-size: 1em;
  font-weight: bold;
}

#punsearch #vf .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 18%;
}

#users1 .tcr {
  width: 25%;
}

#users1 .tc2 {
  padding-left: 8px;
  padding-right: 8px;
  text-align: left;
  width: 25%;
}

#debug {
  margin-top: 12px;
}

#debug .tcl {
  width: 10%;
}

#punredirect #debug .tcl, #punmaint #debug .tcl {
  width: 20%;
}

#debug .tcr {
  width: 90%;
  white-space: normal
}

#punindex .tcr .byuser {
  display: block
}

#punindex td.tc2, #punindex td.tc3, #punindex td.tcr, .pun #vf td.tc2, .pun #vf td.tc3,
.pun #vf td.tcr, #punindex td.tcl div.forumdesc, .pun #vf td.tcl span {
  font-size: 0.923em;
}

.pun #vf td.tcl a {
  font-weight: bold;
}

.pun #vf td.tcl span a {
  font-weight: normal;
}

.pun .blocktable .tclcon {
  height: 1%;
  min-height: 1px;
  overflow: hidden;
  padding: 0 11px 0 12px;
  position: relative;
}

.pun .blocktable .tclcon div {
  width: 100%;
  overflow: hidden;
}

.pun .icon {
  border-style: solid;
  border-width: 8px;
  float: left;
  height: 0;
  overflow: hidden;
  width: 0;
}

.pun .iposted .ipost {
  font-weight: bold;
  left: 0;
  padding-left: 4px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 8px;
}

/*****************************************************************
MAIN POSTS
*****************************************************************/

/* Structure
----------------------------------------------------------------*/

.pun .blockpost {
  border-style: solid;
  border-width: 1px;
  margin-bottom: -1px;
  overflow: hidden;
  position: relative;
}

* html .pun .blockpost {
  display: inline-block;
}

.pun .blockpost h2 {
  font: 1em/1.462em Zekton, Arial, Helvetica, sans-serif;
  white-space: nowrap;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  height: 1.462em;
  padding: 0.538em 8px 0.538em 236px;
  font-weight: normal;
}

#punsearch .blockpost h2 {
  height: auto;
  padding-left: 36px;
  white-space: normal;
}

#punsearch .blockpost h2 span span {
  white-space: nowrap;
  display: inline-block;
  font: 1.077em Zekton, "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#punsearch .blockpost .icon {
  position: absolute;
  top: 0;
  margin-top: -2.154em;
}

.pun .blockpost h2 .conr {
  float: right;
  text-align: right;
}

.pun .blockpost .inbox {
  float: right;
  position: relative;
  width: 100%;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  border-left-style: solid;
  border-left-width: 1px;
  float: right;
  margin-right: -218px;
  position: relative;
  text-align: left;
  width: 100%;
}

.pun .blockpost .postleft, .pun .blockpost .postfootleft {
  width: 194px;
  padding: 7px 12px 7px 12px;
  float: left;
  margin-left: -218px;
  position: relative;
}

.pun .blockpost .postleft dl {
  padding: 0;
}

#punviewtopic .blockpost dt, #punmoderate .blockpost dt {
  display: block;
  position: absolute;
  padding: 0.538em 0 0.538em 12px;
  height: 1.462em;
  top: -2.615em;
  left: 0;
  overflow: hidden;
  width: 206px;
}

.pun .blockpost dt strong {
  font-size: 1.231em;
  font-weight: bold;
}

.pun .blockpost .postleft dd {
  font-size: 0.923em;
}

.pun .blockpost .postleft .usertitle {
  padding: 4px 0 6px 0;
  font-size: 1em;
}

.pun .blockpost .postleft .postavatar {
  display: block;
  margin: 0 0 4px 0;
}

.pun .blockpost .postright {
  position: relative;
  padding: 4px 230px 7px 18px;
}

.pun .postmsg {
  width:100%;
  overflow: hidden;
  word-wrap: break-word;
}

.pun .blockpost .postfootright {
  position: relative;
  padding: 7px 230px 7px 18px;
  text-align: right;
}

.pun .postfoot p, .pun .postfoot ul {
  padding: 0;
}

.pun .blockpost .postfootright li {
  display: inline;
}

.pun .blockpost .postfootright li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

.pun .blockpost .usercontacts {
  padding: 7px 0;
}

.pun .blockpost .usercontacts .email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun .blockpost .usercontacts .website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

.pun .postsignature hr {
  border:none;
  height: 1px;
  margin-left: 0px;
  text-align: left;
}

/* Content (includes other user content)
----------------------------------------------------------------*/

.pun .usercontent {
  padding: 7px 0;
}

.pun .postmsg p, .pun .postmsg li, #punhelp p samp {
  font-family: Zekton, Verdana, Arial, Helvetica, sans-serif;
}

.pun .usercontent h1, .pun .usercontent h2, .pun .usercontent h3,
.pun .usercontent h4, .pun .usercontent h5, .pun .usercontent h6 {
  padding: 7px 0 0 0;
}

.pun .postmsg h5, #punhelp h5 {
  font-size: 1.231em;
  font-weight: bold;
  padding: 7px 0;
}

.pun .usercontent ul, .pun .postmsg ul {
  list-style: disc;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol, .pun .postmsg ol {
  list-style: decimal;
  padding: 4px 13px 4px 30px;
}

.pun .usercontent ol.alpha, .pun .postmsg ol.alpha {
  list-style: lower-alpha;
}

.pun .usercontent li, .pun .postmsg li {
  padding: 0 3px;
}

.pun .usercontent li p, .pun .postmsg li p {
  padding: 0;
}

.pun span.bbu {
  text-decoration: underline;
}

.pun span.bbs, .pun del {
  text-decoration: line-through;
}

.pun .postmsg ins, #punhelp samp ins {
  text-decoration: none;
}

.pun .blockpost .postmsg .postedit {
  font-size: 0.857em;
}

.pun .blockform .postsignature, .pun .blockpost .postsignature {
  font-size: 0.923em;
}

.pun .codebox {
  border-style: solid;
  border-width: 1px;
  margin: 0.75em 1em;
  padding: 0;
}

.pun .quotebox {
  border-style: solid;
  border-width: 1px 1px 1px 1px;
  margin: 0.75em 1em;
  padding: 0 0.75em;
}

.pun .quotebox cite {
  display: block;
  padding: 0.75em 0 0 0;
  font-weight: bold;
  line-height: 1.462em;
}

.pun .quotebox blockquote {
  overflow: hidden;
  width: 100%;
}

.pun .codebox pre {
  overflow-y:hidden;
  overflow: auto;
  width: 100%;
  direction: ltr;
  text-align: left;
}

* html .pun .codebox pre {
  padding-bottom: 10px;
}

*:first-child+html .pun .codebox pre {
  padding-bottom: 10px;
}

.pun .codebox pre code {
  padding: 0.75em;
  white-space: pre;
}

.pun div[class*=codebox] pre code {
  display: inline-block;
}

* html .pun .codebox pre code {
  display: block;
}

.pun .codebox pre.vscroll {
  height: 32em;
  overflow: auto;
  overflow-y: auto
}

.pun .postmsg img, #punhelp samp img {
  vertical-align: text-top;
}

.pun .postmsg .postimg img {
  max-width: 98%;
  vertical-align: middle;
  margin: 7px 0.5em 7px 0;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-style: solid;
  border-width: 2px;
}

/*****************************************************************
MAIN FORMS
*****************************************************************/

#punedit .blockform h2, #punpost .blockform h2, #postpreview h2, #posterror h2,
.pun #quickpost h2, .pun #reportform h2, #pundelete .blockform h2 {
  font: 1em/1.462em Zekton, Arial, Helvetica, sans-serif;
  font-weight: bold;
  white-space: nowrap;
  padding: 10px 19px 4px 37px;
  border: 0;
}

#punpost .blockform h2, #punedit .blockform h2,.pun #quickpost h2,
#pundelete .blockform h2 {
  margin: 1px 1px 0 1px;
  width: 25em;
  position: absolute;
  z-index: 100;
}

.pun #quickpost legend, #punpost legend, #punedit legend {
  width: 25em;
  overflow: hidden;
  white-space: nowrap;
}

.pun .blockform .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 12px;
}

.pun #posterror {
  border-style: solid;
  border-width: 1px;
}

.pun #posterror .box {
  padding: 0 18px 12px 18px;
}

* html .pun .blockform .box, * html .pun #posterror {
  display: inline-block;
}

.pun .blockform .forminfo, .pun .error-info {
  padding: 12px 18px;
  border-style: solid;
  border-width: 1px;
  position: relative;
}

.pun .blockform .forminfo {
  margin-top: 12px;
}

#pundelete .blockform .forminfo {
  margin-top: 33px;
}

.pun .forminfo h3 {
  padding-bottom: 0;
}

.pun .error-list li {
  padding-left: 24px;
  background: url(Air/img/exclaim.png) center left no-repeat;
}

.pun .inform {
  padding: 0 18px;
}

.pun legend {
  font-weight: bold;
  padding: 10px 19px 4px 19px;
}

* html .pun legend {
  margin-left: -7px;
}

*:first-child+html .pun legend {
  margin-left: -7px;
}

.pun .infldset {
  border-style: solid;
  border-width: 1px;
  padding: 12px 18px;
}

#punregister #rules .infldset {
  padding: 5px 18px;
}

.pun fieldset p {
  padding: 0 0 7px 0;
  width: 100%;
}

.pun fieldset .usercontent p {
  padding: 7px 0;
}

.pun fieldset label {
  display: block;
  padding: 0 0 7px 0;
}

.pun label em {
  font-weight: normal;
  font-style: normal;
}

.pun .required strong {
  background: url(Air/img/asterisk.png) center right no-repeat;
  font-weight: normal;
  padding-right: 14px;
  white-space: pre;
  display: inline-block;
  line-height: normal;
}

.pun label input, .pun label select, .pun label textarea {
  margin-top: 2px;
}

.pun label.conl {
  display: inline-block;
  padding-right: 12px;
}

.pun form .buttons {
  padding: 8px 19px 8px 34px;
  margin-bottom: -12px;
}

.pun .blockform .buttons input {
  margin-right: 12px;
}

.pun .rbox {
  padding: 3px 0;
}

.pun .rbox label {
  padding: 3px 0 3px 1.75em;
  position: relative;
  min-height: 1px;
}

* html .pun .rbox label {
  text-indent: -3px;
  height: 1%;
}

.pun .rbox input {
  margin: 3px 0.75em 3px -1.75em;
  float: left;
  position: relative;
  vertical-align: middle;
  padding: 0;
  height: 1em;
  width: 1em;
}

.pun input[type=text], .pun select, .pun textarea {
  font-family: Zekton, Verdana, Arial, Helvetica, sans-serif;
}

.pun .txtarea textarea, .pun input.longinput {
  width: 98%;
}

.pun #quickpost .txtarea {
  padding-right: 12px;
  position: relative;
}

.pun .blockform .bblinks {
  padding-top: 0;
}

.pun .blockform .bblinks li {
  display: inline;
}

.pun .blockform .bblinks li span {
  background: url(Air/img/help.png) center left no-repeat;
  margin-right: 8px;
  padding-left: 20px;
  display: inline-block;
}

.pun #quickpost .bblinks {
  padding-top: 0;
}

.pun #quickpost .bblinks li {
  display: inline;
}

.pun #login p.clearb {
  border-top-style: dotted;
  border-top-width: 1px;
  font-size: 0;
  height: 0;
  line-height: 0;
  margin-top: 7px;
  overflow: hidden;
  padding-bottom: 3px;
  padding-top: 7px;
  text-indent: -9999em;
  width: 100%;
}

.pun #postreview {
  padding-top: 12px;
}

.pun #postpreview, .pun #posterror {
  margin-bottom: 12px;
}

.pun #postpreview .postright {
  padding: 0;
}

.pun #postpreview .postbody {
  border-style: solid;
  border-width: 1px;
  float: none;        
        -moz-box-shadow: 5px 5px 2px rgba(0,0,0,0.2);                        /* GAUCHE DROITE ---- HAUT BAS ---- FLOU GAUSSIEN ---- CONTOUR  */
        -webkit-box-shadow: 5px 5px 2px rgba(0,0,0,0.2);
        box-shadow: 5px 5px 2px rgba(0,0,0,0.2);
  margin: 0 18px 12px 18px;
  padding: 0;
  padding: 4px 18px 4px 18px;
  width: auto;
}

.pun span.email {
  background: url(Air/img/email.png) left 65% no-repeat;
  margin-right: 5px;
  padding-left: 21px;
  display: inline-block;
  line-height: normal;
}

.pun span.website {
  background: url(Air/img/ext.png) left 65% no-repeat;
  padding-left: 18px;
  display: inline-block;
  line-height: normal;
}

#punmisc #rules .box {
  border-style: solid;
  border-width: 1px;
  padding: 5px 18px;
}


#punhelp .box {
  border-style: solid;
  border-width: 1px;
  padding: 7px 12px;
}

.pun .multiselect {
  float: left;
  padding-bottom: 7px;
}

.pun .checklist {
  border-width: 1px;
  border-style: solid;
  max-height: 9em;
  width: 20em;
  overflow: auto;
  padding: 0.25em 0.5em;
  margin: 0.25em 16px 0 0.15em;
}

.pun .checklist legend {
  padding: 0;
}

.pun .checklist legend span {
  width: auto;
  max-width: 25em;
}

.pun .checklist .checklist-item {
  position: relative;
}

.pun .checklist .checklist-item label {
  padding: 0 0 0 1.75em;
}

.pun .checklist .checklist-item .fld-input {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0;
  margin: 0;
}

.pun .checklist .checklist-item input {
  margin: 0;
  height: 1.55em;
  width: 1.55em;
}

/*****************************************************************
PROFILES (+ ADMIN MENU)
*****************************************************************/

/* Profile / Admin
----------------------------------------------------------------*/

.pun .blockmenu {
  width: 13em;
  float: left;
  padding-bottom: 12px;
}

.pun .block2col .blockform, .pun .block2col .block {
  margin-left: 15em;
}

.pun .blockmenu .block2 {
  padding-top: 19px;
}

.pun .blockmenu ul {
  border-top-style: dotted;
  border-top-width: 1px;
  padding: 0;
}

.pun .blockmenu li {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  font-weight: bold;
  padding: 0;
}

.pun .blockmenu a:link, .pun .blockmenu a:visited {
  display: block;
  padding: 9px 6px 3px 6px;
  min-height: 1px;
  text-decoration: none;
}

* html .pun .blockmenu a:link,  * html .pun .blockmenu a:visited {
  height: 1%;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  text-decoration: none;
}

#viewprofile .box {
  border-style: solid;
  border-width: 1px;
  padding-bottom: 18px;
}

#viewprofile dt, #adstats dt {
  padding: 7px 0;
  position: absolute;
  width: 13em;
  left: 0;
}

#viewprofile dl {
  border-style: solid none none none;
  border-width: 1px;
  margin: 7px 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#adintro, #adstats {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adintro li span {
  display: inline-block;
  padding-left: 16px;
  margin-left: 8px;
  line-height: normal;
  background: url(Air/img/bull.png) center left no-repeat;
}

#adstats .inbox, #adintro .inbox {
  border-style: solid;
  border-width: 1px;
  padding: 18px;
}

#adstats dl {
  margin: 0;
  padding: 0;
  width: 100%;
  position: relative;
}

#viewprofile dd, #adstats dd {
  border-style: none none solid none;
  border-width: 1px;
  padding: 7px 0 7px 13em;
}

/*****************************************************************
COLOUR SCHEME
*****************************************************************/

/* Basic defaults and Common Items
----------------------------------------------------------------*/

html, body, .pun {
        /* background: #f6f9fc; */                                                /* COULEUR DU FOND PRINCIPAL #f6f9fc */
        /* background-image:linear-gradient(#F6ECD4, #f6f9fc, #F6ECD4);*/
        /* background-image:url('/home/patrick/Shine-Dotted-Grey-Seamless-Pattern-For-Website-Background.jpg'); */
        /* background-image:url('http://pix.tdct.org/upload/original/1391818179.jpg');*/
        color: #333;
}

.pun .punwrap {
        /* background: #fff;*/
        /* border-color: #cad7e1; */
        border: none;
  color: #2C466C;                                                   /* LA PETITE BARRE CHIANTE BLEUATRE #566579 SOUS UTILISATEUR CONNECTES & COULEUR POLICE PRICIPALE */
}

#brdtitle #brddesc, .pun .pagepost, #brdstats #onlinelist, #brdfooter #searchlinks, #brdfooter #modcontrols,
#punmaint h2, #punredirect h2, #adminconsole .submittop, .pun #debugtime, .pun .pagelink a, .pun .pagelink * {
  border-color: #b9c5ce;
  font-family: Zekton, "Trebuchet MS", Helvetica, Arial, sans-serif;
}

.pun a, .pun a:link, .pun a:visited {
  color: #2365B0;
}

.pun a:hover, .pun a:active, .pun a:focus {
  color: #004687;
}

.pun .postmsg .postimg a:link img, .pun .postmsg .postimg a:visited img {
  border-color: #22538a;
}

.pun .postmsg .postimg a:hover img, .pun .postmsg .postimg a:active img, .pun .postmsg .postimg a:focus img {
  border-color: #b50000;
}

/* Primary Navigation#78ABF0
----------------------------------------------------------------*/

#brdmenu {
        background-image: linear-gradient(rgb(54, 52, 52), rgb(30, 29, 29));
        color: rgb(255, 255, 255);
        background-size: 98px 3px, 18px 2px;
        border-color: #44699c
        color: #C1D3DF;
        box-shadow:  0px 0px 6px rgba(0,0,0,.1) inset;
        border-radius: 0 0 0 0 ;
        padding: 8px;
        margin: -6px 0px 0px 0px;
        /*text-shadow: 0px 1px 0px rgba(255,255,255,.3), 0px -1px 0px rgba(0,0,0,.7);*/                        /* OMBRE POUR LE TEXTE */

}

#brdmenu a, #brdmenu a:link, #brdmenu a:visited {
        background-image:linear-gradient(#78ABF0, #2C466C, #2C466C, #44699c);
        height: 40px;                                                                                          /* TAILLE DES BOUTONS EN HAUTEUR */
        border-radius: 0px 0px 7px 7px;                                                                        /* BOUTONS COINS ARRONDIS SUR LE BAS */
        margin-right: 1px;                                                                                     /* ESPACE ENTRE LES BOUTONS */
        margin-top:4px;                                                                                        /* ESPACE ENTRE DEUX RANGEES DE BOUTONS SI BASSE RESOLUTION */
        /* border-color: #44699c; */                                                                           /* ASSOMBRIR AUTOUR DES BOUTONS */  
        color: #d4dae2;                                                                                        /* COULEUR BLANCHE POUR LE TEXTE DES BOUTONS */
        /*box-shadow: 0px 0px 2px #000000;*/
        text-align: center;
        line-height: 29px;
        right: 6px;                                                                                            /* DEPLACER LE GROUPE DE BOUTONS VERS LA DROITE */
        top: -11px;                                                                                             /* DEPLACER LE GROUPE DE BOUTONS VERS LE BAS */
       
box-shadow:
        0 0 0 0 #1E1E1E,                                                                                        /* GAUCHE DROITE ------ HAUT BAS------ FLOU ------- EPAISSEUR CONTOUR */
        0 0 0 0 #34527D;                                                                                        /* #6D91C8 */
        font-size: 1.154em;
        position: relative;
}

#brdmenu a:hover, #brdmenu a:active, #brdmenu a:focus {
         /* background-image:linear-gradient(#ffffff, #2C466C, #44699c); */
         background-image:linear-gradient(#2C466C, #44699c, #44699c);
         height: 40px;
         border-radius: 0px 0px 7px 7px;                                                                        /* BOUTONS COINS ARRONDIS SUR LE HAUT */
         margin-right: 1px;
         margin-top:4px;
         padding-bottom: 8px;                                                                                   /* IMPRESSION D'ENFONCEMENT DES BOUTONS */
         /* transition: all 0.1s; */                                                                            /* ENFONCEMENT DES BOUTONS AVEC RALENTI */
         /* border-color: #44699c; */
         color: #d4dae2;
         /* box-shadow: 0px 0px 2px #000000; */
         box-shadow: 0px 7px 5px CornflowerBlue,inset 0 -1px 0 0 lightgreen;                                    /* LUMIERE */
         /* text-decoration: blink; */                                                                           /* EFFET DE CLIGNOTEMANT APPROCHE SOURIS */
         /* font-size: 1.264em; */                                                                               /* EFFET LOUPE A L'APPROCHE DE LA SOURIS */
         /* right: -40px; */                                                                                     /* DEPLACER LE GROUPE DE BOUTONS VERS LA DROITE */
         top: -8px;                                                                                               /* DEPLACER LE GROUPE DE BOUTONS VERS LE BAS */
}

/* Main Tables LES PAGES DU FORUM
----------------------------------------------------------------*/

.pun .blocktable .box {
        /*background: #fcfdfe; */                                  
        background-image:linear-gradient(#F6ECD4, #fcfdfe);
  border-color: #b9c5ce #d9e1e7 ;
        border-radius: 3px;                
        border-style: none;
        border-width: 1px 2px 1px 2px;
        -moz-box-shadow: 0px 5px 2px rgba(0,0,0,0.2);                                                            /* GAUCHE DROITE ---- HAUT BAS ---- FLOU GAUSSIEN ---- CONTOUR  */
        -webkit-box-shadow: 0px 5px 2px rgba(0,0,0,0.2);
        box-shadow: 0px 5px 2px rgba(0,0,0,0.2);
}

#punindex .blocktable h2, .pun #vf h2 {
  color: #357082;
}

#adminconsole fieldset th, #adminconsole fieldset td {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun #users1 h2 {
  background: #fff;
}

.pun .blocktable td {
  border-color: #978966;   /* LES LIGNES */
}

.pun .blocktable th {
  background-image: linear-gradient(rgb(67, 104, 155), rgb(44, 70, 109), rgb(67, 104, 155));
        border-color: #426799;
        color: #fff;
         
       
}

.pun .blocktable td.tcl span.stickytext {
  color: #3399CC;
}



/* Main Posts
----------------------------------------------------------------*/


.pun .blockpost {
  background: #f6f9fc;
  border-color: #b9c5ce #d9e1e7;
}

.pun .blockpost h2 {
  background: #ebf1f5;
  border-color: #cad7e1;
  color: #357082;
}

.pun .blockpost .postbody, .pun .blockpost .postfoot {
  background: #fcfdfe;
  border-color: #dfe6ee;
}

.pun .blockpost .postfootright li {
  color: #fcfdfe;
}

.pun .postmsg, #punhelp code, #punhelp samp {
  color: #333;
}

.pun .postsignature, .pun .postmsg .postedit {
  color: #566579;
}

.pun .quotebox {
  background: #fff;                                                                                        /* LES PETITES FENETRES DANS LES NEWS */
        box-shadow:2px 2px 2px rgba(0, 0, 0, 0.5), 0 0 10px rgba(0, 0, 0, 0.1) inset;
        color: #747D8B;
        border-color: #6B564F;
        border-radius: 2px 2px 2px 2px;
}

.pun .quotebox cite {
  color: #357082;
}

.pun .codebox, #punhelp .codebox code {
  background: #333;
  color: #fff;
}

.pun .postmsg hr {
  background: #b9c5ce;
}

.pun .postmsg ins, #punhelp samp ins {
  background-color: #ff0;
}

/* Main Forms + Profile
----------------------------------------------------------------*/

.pun .blockform .box, #adstats, #adintro, #postpreview, #posterror {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

#punmisc #rules .box, #punhelp .box {
  border-color: #b9c5ce #d9e1e7;
  background: #f6f9fc;
}

.pun #quickpost h2, #punpost .blockform h2, #punedit .blockform h2, #posterror h2,
#pundelete .blockform h2 {
  background: #ebf1f5;
  color: #357082;
}

.pun .forminfo {
  background: #fff;
  border-color: #dfe6ee;
}

#puninstall form#install .forminfo {
  background: #44699c;
  color: #fff;
}

.pun #posterror .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
}

#puninstall form#install .error-info {
  background: #ffffe1;
  border-color: #dfe6ee;
  color: #333;
}

.pun .infldset, #adintro .inbox, #adstats .inbox {
  background: #f6f9fc;
  border-color: #dfe6ee;
}

.pun label, .pun legend, #adminconsole fieldset th {
  color: #357082;
}

.pun fieldset p {
  border-color: #b9c5ce;
}

.pun .blockmenu ul, .pun .blockmenu li {
  border-color: #b9c5ce;
}

.pun .blockmenu a:hover, .pun .blockmenu a:active, .pun .blockmenu a:focus {
  background: #ffffe6;
}

.pun .blockmenu .isactive a:link, .pun .blockmenu .isactive a:visited {
  color: #333;
  background: #f6f9fc;
  }

.pun #viewprofile .box {
  border-color: #b9c5ce #d9e1e7;
  background: #ebf1f5;
}

.pun #viewprofile dt, #adstats dt {
  color: #357082;
}

.pun #viewprofile dl, .pun #viewprofile dd, #adstats dl, #adstats dd {
  border-color: #dfe6ee;
}

#adminconsole fieldset td.nodefault {
  background: #d59b9b;
}

.pun .multiselect {
  color: #357082;
}

.pun .checklist {
  background: white;
  border-color: #ccc;
}

/* Status Indicators PETIT CARRE DE STATUS
----------------------------------------------------------------*/

.pun .icon {
        background-image: url("http://pix.tdct.org/upload/original/1392185868.png");
  border-color: #AFA794 #d4d9dd #dfe3e8 #AFA794;
        width: 16px;
        height: 16px;
        border-width: 1px;
       
}

.pun .iredirect .icon {
  border-color: #b9c5ce;
        border-width: 1px;
  padding: 7px;
}

.pun .inew .icon {
        background-image: url("http://pix.tdct.org/upload/original/1392186760.png");
  border-color: #AFA794 #d4d9dd #dfe3e8 #AFA794;
}

div.pun {
        max-width: 115em;
        width: 100%;
        margin: auto auto;
        padding: 10px 0px;
}


/* Intégration du code source
----------------------------------------------------------------*/

.pun .geshicodebox {
  overflow-y:auto;
  overflow: auto;
  width: 95%;
  direction: ltr;
  text-align: left;
  font-size: 10pt;
  max-height: 22em;
  white-space: nowrap;
  padding: 1em;
  background-color: rgb(251, 250, 249);
  color: black;
  margin: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  margin-left: 1em;
}

.pun div.code_root {
  margin-left: 0.5em;
  border-color: rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 85, 85) rgb(170, 0, 0);
  box-shadow: 0px 0px 5px rgb(170, 136, 136) inset;
  border-left: 0.5em solid rgb(170, 0, 0);
}

.pun div.code_user {
  margin-left: 0.5em;
  border-color: rgb(85, 85, 85);
  box-shadow: 0px 0px 5px rgb(187, 187, 187) inset;
  border-left: 0.5em solid rgb(85, 85, 85);
}

.pun div.code_root:before, .pun div.code_user:before {
  border-bottom: 0px dotted black;
  margin: -1em -1em 0 -1em;
  padding: 0.1em 0.5em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
.pun div.code_root:before {
  content: "en root";
  background: url(http://images.debian-facile.org/root.png) no-repeat right;
  background-size: contain;
}
.pun div.code_root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

.pun div.code_user:before {
  content: "en user";
  background: url(http://images.debian-facile.org/user.png) no-repeat right;
  background-size: contain;
}
.pun div.code_user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

/* Page d'accueil
----------------------------------------------------------------*/

.carre {
  width:31%;
  height:100px;
  border-radius: 13px 0 13px 0;                                                                      /* ANGLES ARRONDIS DES GROS BOUTONS DE L'ACCUEUIL */
  /* background-color: #44699C; */
  background-image:linear-gradient(#2C466C, #44699c);
  background-size: 98px 3px, 18px 2px;                                                     /* 2PX ESPACES DES HACHURES GROS BOUTONS ACCUEUIL */
  float: left;
  -webkit-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);                                       /* GAUCHE DROITE ---- HAUT BAS ---- FLOU GAUSSIEN ---SI CONTOUR  */
  -moz-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);
  box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);
  margin: 55%;
 
   
  font-size: 0.85em;
}


.carre h1{
  font-size:270%;
  text-align: left;
  /*text-decoration:underline;*/
  color:#888888;                                                                           /* COULEUR PREMIER TEXTE GROS BOUTONS */
  padding-left: 10px
 

}

.carre h2{                                                                                 /* SOUS TEXTE GROS BOUTONS */
  font-size:145% !important;
  line-height: 1.05 !important;
  width:250px;
  padding: 0px 10px;
  margin-left: 2px;
  font-style: normal;  

}

.carre a{
  border-radius: 13px 0 13px 0;
  text-decoration: none !important;
  background-repeat:no-repeat;
  background-position:95% 45%;
  height: 100%;
  display: block;
}

.carre a:hover{
  border-radius: 13px 0 13px 0;
  text-decoration: none !important;
  border-radius: 3px;                                                                      /* ANGLE ARRONDI GROS BOUTONS ACCUEUIL */
  background-color: #44699C;
  background-position:95% 55%;
  box-shadow: none;
}

#carregauche{
  margin: 1%;
}

#carregauche a{
  border-radius: 13px 0 13px 0;
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('http://images.debian-facile.org/btn-archive.png');
}

#carregauche2{
  margin: 1%;
}

#carregauche2 a{
  border-radius: 13px 0 13px 0;
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('http://images.debian-facile.org/btn-installer.png');
}

#carremilieu{
  margin: 1%;
}

#carremilieu a{
  border-radius: 13px 0 13px 0;
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('http://images.debian-facile.org/btn-forum.png');
}

#carremilieu2{
  margin: 1%;
}

#carremilieu2 a{
  border-radius: 13px 0 13px 0;
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('http://images.debian-facile.org/btn-irc.png');
}

#carredroite{
  margin: 1%;
}

#carredroite a{
  border-radius: 13px 0 13px 0;
  display:block;
  width:100%;
  height:100%;
  color:white;
  background-image:url('http://images.debian-facile.org/btn-asso.png');
}

.news{                                                                                                   /* LES PAGES NEWS DE L'ACCEUIL */
  background:#fff;
  -webkit-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);                                                     /* , 0 0 40px rgba(0, 0, 0, 0.1) inset */
  -moz-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);                                                        /* , 0 0 40px rgba(0, 0, 0, 0.1) inset */
  box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);                                                             /* , 0 0 40px rgba(0, 0, 0, 0.1) inset */
  border-radius: 3px;  
  background-repeat:no-repeat;
  background-position: 98% 0%;
 
 

}

.news h1{
  padding-top: 10px !important;
  padding-left: 20px !important;
  color: #44699C;                                                                                         /* TITRES DES FEUILLES NEWS */

}

.news h2{
  padding-top: 10px !important;
  padding-left: 20px !important;
}

.news h5{
  padding-top: 10px !important;
  padding-left: 20px !important;
}


.news p{
  padding-left: 20px !important;
  padding-right: 10px !important;
  padding-top: 0px !important;
}

#news{
  float:left;
  width:64%;
  margin: 1% ;
}

#newsasso{
  float:right;
  width:31%;
  margin: 1% 2% 1% 1%;
  background-image:url('http://images.debian-facile.org/logo-asso-4-mini.png');
 
}


 

Le wiki-base ( Désolé, je ne sais pas faire pour mettre la page à la bonne largeur )

body {
  font-size: 100%;
  margin: 0;
  padding: 0;
  color: #2C466C;
}

#menudf {                                      
  margin:             10px auto 0 auto;
  background: none repeat scroll 0% 0% rgb(246, 249, 252);  
  width:              100%;                
  max-width:          115em;            
  text-align:         left;            
  font: 0.75em Zekton, Arial,Helvetica,sans-serif;
  box-shadow: 0px 7px 30px LightSlateGray,inset 0 -1px 0 0 ;    
}


/******************************
*#brddesc {                   *                                          
*  padding: 10px 0 10px 0;    *          
*                             *              
*  font-weight: normal;       *            
*  margin: 0 0 0 0;           *            
*}                            *                                
*                             *                                  
*#brheader #box{              *                    
*  line-height: 1em;          *              
*}                            *                              
******************************/



#menudf a{                      
  text-decoration:    none;    
}

#menudf h1{                      
  padding: 10px 0 0 0;              
  margin: 0 0 0 0;                
}

#bienvenudf {                
  font-size:          1em;      
 
}

#menudf ul{                  
list-style: none outside;  
}
#menudf li{                
  float: left;
  margin-left: 0em;          
  font-weight: normal;    
 
}

#brdmenu {                  
  position: relative;        
  min-height: 1px;          
   
}

#brdtitle {                
  margin:  0 0 0;        
  padding: 0 0 0px;        
}

#bodydf {                  
  width: 100%;            
  max-width: 115em;          
  margin: 0 auto 0 auto;    
  padding: 0;                                          
  border: none;              
  font: 0.75em Zekton,Arial,Helvetica,sans-serif;
 
}

#dokuwiki__top.site {  
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

#dokuwiki__header {
  padding: 4px 0 0 0;
  margin: -15px 0 0 0;                  /* EH BEN !!!!!! */
  font-weight: normal;
  font-size: 1.09em;
                     
 
}
#dokuwiki__header .group {  
  padding: 0 0 0 0;
  margin: 0 0 10px 0;
}

#dokuwiki__header .group {
  width: 100%;                         /* Largeur du connecté en tant que  */
}

#export_header {
  font-style: bold;
  height: 1em;
  min-height: 50px;
  vertical-align: middle;
  text-align: center;
  margin-bottom: -1em;
  margin-top: -0.8em;
  margin-right: -1.2em;
  margin-left: -1.2em;
}

#export_header img {
  display: inline;
  position: relative;
  float: right;
  height: 32px;
}

.tools {
        background-image: linear-gradient(rgb(54, 52, 52), rgb(30, 29, 29));
       /* background-size: 98px 2px, 18px 2px;                                              2PX C'EST L'ESPACE DES HACHURES */
        border-radius: 0px 0px 10px 10px;
       
}

.tools a {
  text-decoration: none;
  color: rgb(212, 218, 226);
}
.tools a:link {
  color: rgb(212, 218, 226);
}
.tools a:active {
  color: white;
  text-decoration: none;
}
.tools a:hover {
  color: white;
  text-decoration: none;
}

#dokuwiki__usertools {
  position: relative;
  float: left;
  text-align: left;
  top: -3px;                                       /* TEXTE CONNECTE DANS LE HEADER ANTHRACITE */
  right: 0;
  padding: 27px 0 0 0;                             /* EPAISSEUR DU HEADER ANTHRACITE */
 
 
}
#dokuwiki__usertools ul {
  display: inline;
}
#dokuwiki__usertools li {
  font-size: 0.8em;
  margin-left: 1em;
  list-style: none outside none;
  display: inline;
}

#dokuwiki__usertools li.user {
  color: rgb(212, 218, 226);
}

#dokuwiki__header .tools li {
  font-size: 0.95em;
  margin-left: 1em;                        
  list-style: none outside none;
  display: inline;
}

#dw__toc {
  margin-top: 1em;
}

.page a:hover {
  text-decoration: none;
  color: blue;
}

#dw__search {
  background-color:#313131;
  padding:3px 3px 25px;
  width:335px;
  height: 4px;
  box-sizing:border-box;
  border-radius:0px;
 
 
 

 
  position: relative;
  right: 0;                                      /* DEPLACER SEARCH VERS LA DROITE */
  top: -6px;  
  float: right;
  margin-right: 10px;      
  display: inline;
 
 
 


}

#qsearch__out a {
  color: green;
}
#qsearch__out a:hover {
  color: blue;
}


/*************        PAR KAO    **************************/
#dokuwiki__site .mode_show  {
  box-shadow: 0px 7px 30px LightSlateGray,inset 0 -1px 0 0 ;
    background: #ffffff;
}
/**********************************************************/




table.inline tr:hover td {
  color: white;
}

table.inline .row0 th {
  background-color: #173d70;
  color: rgb(212, 218, 226);
  text-transform: uppercase;
  font-weight: bold;
}
table.inline tr:hover.row0 th {
  background-color: #173d70;
  color: white;
}
table.inline .row0 td {
  background-color: #173d70;
  color: rgb(212, 218, 226);
  text-transform: uppercase;
  font-weight: bold;
}
table.inline tr:hover.row0 td {
  background-color: #173d70;
  color: white;
}

.page p {
  font-family: Zekton, sans-serif;
}

.page h1 {
  border-bottom: 3px solid rgb(140, 172, 187);
  font-size: 2.5em;
  font-weight: bold;
  font-family: Zekton, sans-serif;
  margin-left: -1em;
  padding-left: 0.5em;

}

.page h2 {
  border-bottom: 2px solid rgb(160, 192, 207);
  font-size: 2em;
  font-weight: bold;
  margin-left: -1em;
  padding-left: 0.5em;
}

.page h3 {
  font-size: 1.6em;
  font-weight: bold;
  margin: 0.5em 0 0.888em -1em;
  padding-left: 0.5em;
  border-bottom: 1px solid rgb(160, 192, 207);
  display: inline-block;
  padding-right: 0.5em;
}

div.level3, div.level4 {
/*  margin-left: 2em; */
}


.page h4 {
  font-size: 1em;
  text-decoration: underline;

}

.page ul {
  padding-bottom: 0.5em;

}

em.u {
  text-decoration: none !important;
  border-bottom: 1px solid rgb(160, 192, 207);
}

.dokuwiki dl.file dt {
    background-color: #fbfaf9;
    background: -moz-linear-gradient(   top, #ddd 50%, #2E4970 100%);
    background: -webkit-linear-gradient(top, #ddd 50%, #2E4970 100%);
    background: -o-linear-gradient(     top, #ddd 50%, #2E4970 100%);
    background: -ms-linear-gradient(    top, #ddd 50%, #2E4970 100%);
    background: linear-gradient(        top, #ddd 50%, #2E4970 100%);
    color: inherit;
    border: 1px none #000000;
    border-bottom-color: #000000;
    border-top-left-radius: .3em;
    border-top-right-radius: .3em;
    padding: .3em .6em .1em;
    margin-bottom: -1px;
    float: left;

}
.dokuwiki dl.code dt {
    background-color: #fbfaf9;
    background: -moz-linear-gradient(   top, #ddd 50%, #2E4970 100%);
    background: -webkit-linear-gradient(top, #ddd 50%, #2E4970 100%);
    background: -o-linear-gradient(     top, #ddd 50%, #2E4970 100%);
    background: -ms-linear-gradient(    top, #ddd 50%, #2E4970 100%);
    background: linear-gradient(        top, #ddd 50%, #2E4970 100%);
    color: inherit;
    border: 1px none #000000;
    border-bottom-color: #000000;
    border-top-left-radius: .3em;
    border-top-right-radius: .3em;
    padding: .3em .6em .1em;
    margin-bottom: -1px;
    float: left;
}

pre.bash:before {
  height: 1em;
/*  content: "Le code suivant est à taper dans un terminal utilisateur."; */
  display: block;
  background: #ccc;
}
pre.user {
  background-image:linear-gradient(#F6ECD4, #C3C2BE);
  background-size: 98px 2px, 18px 2px;
  border-color: #555;
  border-radius: 3px;
/*  box-shadow: inset 0 0 2px #000; */
  border-left: 0.5em #555 solid;
}

pre.root {
  background-image:linear-gradient(#F6ECD4, #C3C2BE);
  background-size: 98px 2px, 18px 2px;
  border-color: #a55;
  border-radius: 3px;                                                                          
/*  box-shadow: inset 0 0 2px #000; */
  border-left: 0.5em #a00 solid;
}

pre.root:before, pre.user:before {
  border-bottom: 0px dotted black;
  margin: -0.7em -1em 0 -1em;
  padding: 0.1em 3em 0.5em 0.5em;
  margin-bottom: 0.5em;
  height: 1em;
  text-align: left;
  display: block;
  font-size: small;
  font-style: italic;
}
pre.root:before {
  content: "en root";
  background: url(http://images.debian-facile.org/root.png) no-repeat right;
  background-size: contain;
}
pre.root:hover:before {
  content: "Ce code doit être entré dans un shell super-utilisateur.";
}

pre.user:before {
  content: "en user";
  background: url(http://images.debian-facile.org/user.png) no-repeat right;
  background-size: contain;
}
pre.user:hover:before {
  content: "Ce code doit être entré dans un shell utilisateur simple.";
}

#config__manager fieldset {
  background: #fff;
}

 

Dernière modification par Anonyme (17-02-2014 20:38:13)

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

C'est juste le perso.css ?

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

Anonyme

Invité

Re : [concours coopératif] nouveau style DF

EDIT: Je me suis loupé c'est rectifié

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

@Anonyme: pour la largeur, rajoute ce code dans un de tes CSS:

div#wiki_container {
  width: 115em !important;                                    
  max-width: 95% !important;                                  
  margin-top: -10px !important;                                
  font: 0.75em Zekton, Arial, Helvetica, sans-serif !important;
  margin-left: auto;
  margin-right: auto;
}

Mis à jour.

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.

Anonyme

Invité

Re : [concours coopératif] nouveau style DF

En haut de CSS   ?

captnfab

Admin-Girafe

Lieu : /dev/random

Distrib. : Debian

Noyau : Dur

(G)UI : gui gui, je zuis un doiseau

Inscription : 07-07-2008

Site Web

Re : [concours coopératif] nouveau style DF

@Anonyme: et pour virer le soulignement de «MP» dans le menu, rajoute ça dans ton perso.css:

#navpm acronym {      
  border-bottom: none;
}                    

(pour la largeur, où tu veux dans Perso.css ou dans wiki-perso.css.)

---

captnfab,
Association Debian-Facile, bépo.
TheDoctor: Your wish is my command… But be careful what you wish for.