body{
  background: url("background.png") repeat; 
  background-size: 900px auto;
  color:#1b1f2a;
  margin:0;
  padding:0;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size:12px;
  position: relative;
}

body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(20, 25, 35, 0.5);
  z-index: -1;
}

a{ color:#1f4f8c; text-decoration:underline; }
a:hover{ color:#c30000; text-decoration:none; }
a:visited{ color:#7a1fa0; }

.wrap{
  width:780px;
  margin:14px auto;
  border:2px solid #5e6b86;
  background:#e6e9f1;
  filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,strength=2);
}

.topbar{
  background:#384a6b;
  color:#dfe7ff;
  font-size:11px;
  padding:4px 8px;
  border-bottom:1px solid #21324f;
}

.topbar .mini{
  font-family: Courier New, Courier, monospace;
  letter-spacing:0.2px;
}

.banner{
  height:110px;
  border-bottom:2px solid #697a98;
  background:#22314e;
  position: relative;
  overflow: hidden;
}

/* banni&egrave;re avec pellicule anim&eacute;e */
.bannerInner{
  height:110px;
  background-image: url("film.gif");
  background-repeat: repeat;
  background-position: center center;
  background-size: auto 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bannerInner .title {
  margin: 0;
  font-family: Verdana, Arial, sans-serif;
  font-size: 46px;
  font-weight: bold;
  color: #e8d890;
  text-shadow: 3px 3px 6px #000000, -1px -1px 2px #000000, 1px -1px 2px #000000, -1px 1px 2px #000000;
  letter-spacing: 5px;
  z-index: 10;
  position: relative;
}

.bannerInner .subtitle {
  position: absolute;
  bottom: 12px;
  left: 28px;
  font-family: 'Courier New', Courier, monospace;
  font-size: 11px;
  color: #9aa6c8;
  z-index: 10;
}

.nav{
  background:#c7cfdf;
  border-top:1px solid #eff3ff;
  border-bottom:1px solid #8794ad;
  padding:6px 8px;
  font-size:11px;
}
.nav .sep{ color:#6d7690; padding:0 6px; }

.content{
  padding:8px;
}

.crumb{
  font-size:11px;
  color:#4b5368;
  margin-bottom:6px;
}

.notice{
  background:#fffbe0;
  border:1px solid #d0c679;
  padding:6px 8px;
  font-size:11px;
  margin-bottom:8px;
}

.construction{
  vertical-align:middle;
  margin-right:6px;
}

/* Table layout & "forum look" */
table.forum{
  width:100%;
  border-collapse:collapse;
  background:#f5f6fb;
  border:1px solid #7b88a2;
}
table.forum th{
  text-align:left;
  font-size:11px;
  padding:6px 6px;
  color:#e9efff;
  border-bottom:1px solid #1e2b43;
  background:#3a4f78;
  background-image: url("data:image/gif;base64,R0lGODlhAQAgAIABAN7l/wAAACH5BAEAAAEALAAAAAABACAAAAIYjI+py+0Po5y02ouz3rz7D4biSJbmiQAAOw==");
}
table.forum td{
  font-size:12px;
  padding:6px 6px;
  border-top:1px solid #d2d8e7;
  border-bottom:1px solid #ffffff;
  vertical-align:top;
}
.rowAlt{ background:#eef2fa; }
.topicTitle{
  font-weight:bold;
  letter-spacing:0.2px;
}
.topicMeta{
  font-size:10px;
  color:#5f687f;
  margin-top:3px;
  font-family: Courier New, Courier, monospace;
}
.lastReply{
  font-size:11px;
  color:#2a3142;
  white-space:nowrap;
}
.tiny{
  font-size:10px;
  color:#6a738a;
}

/* Icons (fake pixel) */
.ico{
  width:14px; height:14px;
  display:inline-block;
  vertical-align:middle;
  margin-right:6px;
  background-repeat:no-repeat;
  background-position:center center;
}

/* envelope */
.icoNew{
  background-image:url("data:image/gif;base64,R0lGODlhDgAOAIABANjY2P///yH5BAEAAAEALAAAAAAOAA4AAAIjjI+py+0Po5y02ouz3rz7D4biSJbmiaaqK7rtC8FADs=");
  border:1px solid #8a98b4;
  background-color:#e8eefc;
}
/* film strip */
.icoFilm{
  background-image:url('data:image/svg+xml;utf8,\<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14">\<rect width="14" height="14" fill="%23d7dde9" stroke="%238a98b4"/>\<rect x="3" y="2" width="8" height="10" fill="%233a4f78" opacity="0.6"/>\<rect x="1" y="2" width="2" height="2" fill="%233a4f78"/><rect x="1" y="6" width="2" height="2" fill="%233a4f78"/><rect x="1" y="10" width="2" height="2" fill="%233a4f78"/>\<rect x="11" y="2" width="2" height="2" fill="%233a4f78"/><rect x="11" y="6" width="2" height="2" fill="%233a4f78"/><rect x="11" y="10" width="2" height="2" fill="%233a4f78"/>\</svg>');
  border:1px solid #8a98b4;
  background-color:#e8eefc;
}

/* layout main table */
table.layout{
  width:100%;
  border-collapse:collapse;
}
td.maincol{ width:560px; padding-right:8px; }
td.sidecol{ width:200px; }

/* sidebar boxes */
.box{
  border:1px solid #7b88a2;
  background:#f1f3fa;
  margin-bottom:8px;
}
.box h3{
  margin:0;
  padding:6px 6px;
  font-size:11px;
  color:#eef3ff;
  background:#4a5f87;
  border-bottom:1px solid #2b3b5a;
  letter-spacing:0.3px;
  text-transform:uppercase;
}
.box .inner{
  padding:6px;
  font-size:11px;
  color:#2b3140;
}

.counter{
  font-family: "Courier New", Courier, monospace;
  font-size:11px;
  background:#0f1420;
  color:#7CFF6B;
  padding:4px 6px;
  border:1px solid #4a5f87;
  letter-spacing:1px;
}

.annonce{
  background:#ffff88;
  border:2px solid #ff6600;
  padding:7px 10px;
  margin-bottom:8px;
  font-size:11px;
  color:#1b1f2a;
  line-height:1.5;
}

.poll label{ display:block; margin:3px 0; }
.poll input{ vertical-align:middle; }

.search input.text{
  width:160px;
  font-size:11px;
  padding:2px;
  border:1px solid #8794ad;
  background:#ffffff;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}
.search input.btn{
  font-size:11px;
  padding:2px 6px;
  border:1px solid #3a4f78;
  background:#c7cfdf;
  cursor:pointer;
}

.login input{
  width:160px;
  font-size:11px;
  padding:2px;
  border:1px solid #8794ad;
  margin-bottom:4px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}
.login .btn{
  width:auto;
  padding:2px 8px;
  border:1px solid #3a4f78;
  background:#d7dde9;
  cursor:pointer;
}

.newsletter input{
  width:160px;
  font-size:11px;
  padding:2px;
  border:1px solid #8794ad;
  margin-bottom:4px;
}

.muted{
  color:#6a738a;
  font-size:10px;
}

/* Footer */
.footer{
  background:#c7cfdf;
  border-top:1px solid #8794ad;
  padding:8px;
  font-size:10px;
  color:#3f475b;
}
.footer .links{
  margin-top:4px;
}

.hrgif{
  height:9px;
  margin:8px 0;
  border-top:1px solid #7b88a2;
  border-bottom:1px solid #ffffff;
  background:#c7cfdf url("data:image/gif;base64,R0lGODlhBAAJAIAAAK6usr+/v////yH5BAEAAAEALAAAAAAEAAkAAAIRjI+py+0Po5y02ouz3rz7D4biSJbmiQAAOw==") repeat-x;
}


/* Topic page styles */
.topicHeader{
  background:#3a4f78;
  color:#eef3ff;
  padding:8px;
  border:1px solid #7b88a2;
  margin-bottom:8px;
}

.topicHeader h1{
  margin:0 0 6px 0;
  font-size:16px;
  color:#ffffff;
  font-weight:bold;
}

.topicHeader .topicMeta{
  font-size:10px;
  color:#c7d0e8;
  font-family: Courier New, Courier, monospace;
}

.post{
  border:1px solid #7b88a2;
  background:#f5f6fb;
  margin-bottom:8px;
  display:table;
  width:100%;
  table-layout:fixed;
}

.postAuthor{
  display:table-cell;
  width:150px;
  background:#e8ecf7;
  border-right:1px solid #aab5cf;
  padding:8px;
  vertical-align:top;
  font-size:11px;
}

.postAuthor .username{
  font-weight:bold;
  font-size:12px;
  color:#1f4f8c;
  margin-bottom:4px;
}

.founder{
  color:#d4a017 !important;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}

.postAuthor .rank{
  font-size:10px;
  color:#5f687f;
  margin-bottom:6px;
}

.postAuthor .avatar{
  width:80px;
  height:80px;
  border:1px solid #8a98b4;
  background:#ffffff;
  margin:6px 0;
  display:block;
}

.postAuthor .stats{
  font-size:10px;
  color:#4b5368;
  margin-top:6px;
  line-height:1.5;
}

.postContent{
  display:table-cell;
  padding:8px;
  vertical-align:top;
}

.postHeader{
  padding-bottom:6px;
  margin-bottom:8px;
  border-bottom:1px solid #d2d8e7;
  font-size:10px;
  color:#5f687f;
}

.postBody{
  font-size:12px;
  line-height:1.6;
  color:#1b1f2a;
}

.postBody p{
  margin:0 0 10px 0;
}

.postActions{
  margin-top:12px;
  padding-top:8px;
  border-top:1px solid #d2d8e7;
  font-size:11px;
}

.postActions a{
  margin-right:12px;
}

.pagination{
  text-align:center;
  font-size:11px;
  padding:8px;
  background:#e8ecf7;
  border:1px solid #aab5cf;
  margin-bottom:8px;
}

.pagination a{
  padding:2px 6px;
  margin:0 2px;
  border:1px solid #7b88a2;
  background:#f5f6fb;
  text-decoration:none;
}

.pagination a:hover{
  background:#3a4f78;
  color:#ffffff;
}

.pagination .current{
  padding:2px 6px;
  margin:0 2px;
  background:#3a4f78;
  color:#ffffff;
  font-weight:bold;
}

.replyBox{
  border:1px solid #7b88a2;
  background:#f5f6fb;
  padding:8px;
}

.replyBox h3{
  margin:0 0 8px 0;
  font-size:12px;
  color:#3a4f78;
}

.replyBox textarea{
  width:100%;
  height:120px;
  padding:4px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size:12px;
  border:1px solid #8794ad;
  background:#ffffff;
  box-sizing:border-box;
}

.replyBox .buttons{
  margin-top:8px;
}

.replyBox input.btn{
  font-size:11px;
  padding:4px 12px;
  border:1px solid #3a4f78;
  background:#d7dde9;
  cursor:pointer;
  margin-right:6px;
}

* html .wrap { width:780px; } /* IE6 */
