@import url("../fonts/stylesheet.css");

body {
    background-color: #ffcc00;
    font-family: Verdana,Arial,Helvetica,sans-serif,monospace;
    margin: 0;
    padding: 0;
}

a { color: #ff9900; }
a:visited { color: #ce5e00; }
a:hover { color: #666; }

div.topbanner {
    background-color: #ffdd00;
    border: 0;
    margin: 0;
    padding: 2px;
    text-align: right;
    font-size: x-small;
}
.topbanner A {color: #D17117; font-weight: bold;}
.topbanner A:HOVER {color: black;	text-decoration: none;}
.topbanner UL {list-style: none; border: 0; margin: 0;}
.topbanner LI {display: inline; margin: 3px;}



#header {
    font-family: 'Pointy', arial, serif;
    /*text-shadow: 2px 2px 3px #666;*/
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 0px;
}

#title {
    height: 110px;
}

#title h1 {
    /*text-align: center;*/
    font-size: 50px;
    margin: 0px;
    margin-top: 0px;
    margin-left: 50px;
    float:left;
    background-repeat: no-repeat;
    background-image: url(../img/header_bg.png);
    background-size: 100% 100%;
}

/* we disable this effect with IE */
* html #title h1 {
    background-image: none;
}

#title h1 a {
    color: #111;
    text-decoration: none;
}

#title span {
    float: left;
    clear: left;
    margin-left: 53px;
    font-size: 25px;
}

#title img {
    float: right;
    margin: 0px;
    margin-right: 50px;
}

@media screen and (max-width: 950px) {
    #title img {
	margin-top: 20px;
	width: 300px;
    }
}


#menu {
    clear: both;
    margin-left: 30px;
}

#menu h2 {
    font-size: 35px;
    display: inline;
    margin: 10px;
    margin-right: 100px;
    background-repeat: no-repeat;
    background-image: url(../img/header_bg.png);
    background-size: 100% 100%;
}

/* we disable this effect with IE */
* html #menu h2 {
    background-image: none;
}

#menu h2 a {
    color: #222;
    text-decoration: none;
    font-weight: normal;
}

#menu h2 a:hover {
    color: #666;
}

#menutop {
    margin:0;
    margin-left: 20px;
    margin-right: 20px;
    background-color: #ffdd00;
    padding: 2px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: small;
    text-align: right;

    -moz-box-shadow: 2px 2px 8px #937600;
    -webkit-box-shadow: 2px 2px 8px #937600;
    box-shadow: 2px 2px 8px #937600;
}

/*#menutop form { display: inline; }
#menutop input { border: 1px solid black; }*/
#menutop a { color: #b70; }
#menutop a:visited { color: #ce5e00; }
#menutop a:hover { color: #666; }

#all_news {
}

#all_news.with_rbox {
    margin-right: 330px;
}

div.news {
    background-color: white;
    margin: 20px;
    padding: 5px;

    -moz-box-shadow: 2px 2px 8px #937600;
    -webkit-box-shadow: 2px 2px 8px #937600;
    box-shadow: 2px 2px 8px #937600;
}

.news h2 {
    margin: 5px;
    margin-top:0;
    /*border-left: 10px solid #ffcc00;
    padding-left: 5px;*/
    padding-left: 20px;
    background-image: url(../img/icon_new.gif);
    background-repeat: no-repeat;
    background-position: 0px 5px;

    color: #333;
    font-size: large;
}

.news h2 a {
    text-decoration: none;
    color: #333;
}

.news h2 a:hover {
    text-decoration: underline;
    color: black;
}

.news_meta {
    /*text-align: right;*/
    border-top: 1px solid #ddd;
    padding-top: 5px;
    font-size: x-small;
    color: #888;
    margin-left: 12px;
}

.news_meta img {
    float: right;
    margin: 2px;
    margin-left: 5px;
}

.news_body {
    margin: 5px;
    margin-left: 10px;
    margin-right: 10px;
/*    background-color: #fafafa;
    border: 1px solid #e8cfa9;
    padding: 5px;*/
    color: #444;
    font-size: small;
}

.news_body p {
    margin-top: 0px;
    margin-bottom: 10px;
}

.news_body img, .comment_body img {
    max-width: 100%; /* let's resize overflowing images */
    height: auto;
}

.news_footer {
    text-align: right;
    font-size: small;
    margin-right: 12px;
    color: #333;
    margin-top: 5px;
}

#comments {
    margin-left: auto;
    margin-right: auto;

    width: 80%;
    padding: 5px;
    background-color: white;

    -moz-box-shadow: 2px 2px 8px #937600;
    -webkit-box-shadow: 2px 2px 8px #937600;
    box-shadow: 2px 2px 8px #937600;
}

.comment {
    background-color: #fafafa;
    margin: 15px;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px;

    -moz-box-shadow: 2px 2px 8px #666;
    -webkit-box-shadow: 2px 2px 8px #666;
    box-shadow: 2px 2px 8px #666;
}

.comment_head {
    border-bottom: 1px solid #ddd;
    padding-top: 5px;
    font-size: x-small;
    color: #888;
}

.comment_head img {
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
}

.comment_body {
    color: #222;

    padding-bottom: 1px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: small;
    margin: 5px;
    margin-left: 36px;

    border-left: 1px solid #ddd;
}


#rbox {
    clear: right;
    float: right;
    width: 350px;
}

.rbox {
    background-color: #f9f9f9;
    margin: 20px;
    padding: 5px;

    font-size: small;

    -moz-box-shadow: 2px 2px 8px #937600;
    -webkit-box-shadow: 2px 2px 8px #937600;
    box-shadow: 2px 2px 8px #937600;
}

.rbox h3 {
    margin: 3px;
    margin-top: 0px;
    color: #ce5e00;
    font-size: 0.9em;
}

.longcut {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#board {
    word-wrap: break-word;
}

#board .help
{
/*text-align: right;*/
margin: 0px;
margin-bottom: 3px;
}

#board input {
    outline: none;
    border: 1px solid #ce5e00;
    background-color: #fafafa;
    color : #740;
}

#board #controls {
    border: 1px solid #ddd;
    background-color: white;
    padding: 5px;
    margin-bottom: 5px;
}

#board #controls .search {
    float: right;
}

#board #controls #edtIn {
    width: 70%;
}


#board #sstatus {
    float: right;
    margin-right: 5px;
}

#board.large {
    margin-left: auto;
    margin-right: auto;
    width: 95%;
    float: none;
}

#board .day {
    font-size: x-small;
    color: #484;
    background-color: #fdfdfd;
}

#board .date {
/*    font-family: monospace;*/
    cursor: pointer;
}

#board strong {
    color: #ce5e00;
    cursor: pointer;
}

#board div a.lnk {
    text-decoration: none;
}

#board .highlight {
    background-color: #fff0b2;
}

#board .importance1 {
    background-color: #dbffe6;
}


#users .user {
    background-color: #eee;
    margin: 3px;
    margin-bottom: 5px;
    padding: 3px;
    clear: left;
    line-height: 32px;
    overflow: hidden; /* so it does not show scrollbars on small overflows */
    zoom: 1; /* ... */

    -moz-box-shadow: 2px 2px 8px #ccc;
    -webkit-box-shadow: 2px 2px 5px #ccc;
    box-shadow: 2px 2px 8px #ccc;
}

#users .user.connected {
    background-color : #af6;
}

#users .user .avatar {
    display: block;
    float: left;
    margin-right: 5px;
    width: 32px;
    height: 32px;
    text-align: center;
}

#users .user img {
    vertical-align: middle;
}

#users .user span.name {
    font-weight: bold;
    color: #ce5e00;
}

#users .user span.info {
    font-size: 0.7em;
    margin: 3px;
}

.lastcoms .com, .achivs .ach {
    border-top: 1px solid #ddd;
    padding-bottom: 1px;
    zoom: 1; /* "good" old IE layout bug ... */
}

.lastcoms .com div, .achivs .ach div {
    display: inline;
    margin-left: 3px;
    margin-right: 3px;
}

.lastcoms .com .user {
    font-size: 0.7em;
    font-weight: bold;
    /*color: #ce5e00;*/
    color: #444;
}

.achivs .ach .user {
    font-size: 0.7em;
    font-weight: bold;
    color: #CE5E00;
}


.lastcoms .com .ago, .achivs .ach .ago {
    margin-top: 4px;
    font-size: 0.7em;
    width: 60px;
    float: left;
}

.lastcoms .com .title, .achivs .ach .title {
    font-size: 0.7em;
    margin-left: 10px;
}

#misclinks ul {
    list-style-image : url(../img/puce1.png);
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 0px;
    padding-left: 15px;
    font-size: 0.9em;
}


#misclinks li {
}

#misclinks li a {
    text-decoration: none;
}

#misclinks .all, .achivs .all, #picflow .all {
    float: right;
    font-size: 0.85em;
    margin-left: 5px;
}

#misclinks .admin {
    font-size: 0.85em;
}

#picflow {
    overflow: auto;
    padding-left: 8px;
}

#picflow .pic {
    position: relative;
    float: left;
    margin: 3px;

    -moz-box-shadow: 2px 2px 8px #999;
    -webkit-box-shadow: 2px 2px 8px #999;
    box-shadow: 2px 2px 8px #999;
}

#picflow div.pic .shadow {
    height: 14px;
    display: block;
    width: 65px;
    position: absolute;
    top: 1px;
    left: 1px;
    z-index:1;
}

#picflow div.pic img.pic {
    width: 65px;
    height: 65px; /* useful during page loading */
    margin: 0px;
    display: block;
    border: 1px solid #444;
}

#quotes {
}

#quotes .quote {
    margin: 4px;
    font-style: italic;
}

#quotes .sign {
    margin: 4px;
    font-size: 0.85em;
    text-align: right;
}

#quotes .sign strong {
    color: #ce5e00;
}


#births .birth {
    border-top: 1px solid #ddd;
    padding-bottom: 1px;
    zoom: 1;
}

#births .birth div {
    display: inline;
    margin-left: 3px;
    margin-right: 3px;
}

#births .birth.cake div {
    line-height: 30px;
}

#births .birth img {
    vertical-align: top;
    margin: 4px;
    margin-left: 10px;
}

#births .birth .user {
    font-size: 0.9em;
    font-weight: bold;
    color: #ce5e00;
}

#births .birth .date {
    margin-top: 2px;
    font-size: 0.8em;
    width: 40px;
    float: left;
    /*clear:left;*/
}

div.foot_navigator {
    font-size: small;
    text-align: center;
    background-color: #fafafa;
}

#footer {
    clear: both;
    background-color: #ffdd00;
    border: 0;
    margin: 0;
    margin-top: 20px;
    padding: 2px;
    text-align: center;
    color: #D17117;
    /*font-family: 'Pointy', arial, serif;*/
    font-size: small;
}

#footer a {
    text-decoration: none;
    color: #D17117;
}

.author {
    font-weight: bold;
    font-size: 11px;
}

.admin {
    margin-left: 6px;
    float: right;
    font-size: small;
}

.admin.fixed {
    float: none;
    margin-left: 15px;
}

.pager {
    font-size: small;
    text-align: right;
    /*margin-left: 5px;*/
    margin-right: 0px;
    color: #666;
    margin-bottom: -5px;
}

.pager span {
    border: 1px solid #ddd;
    font-weight: bold;
    line-height: 1.7;
}

.pager span:hover {
    background-color: #eee;
}

.pager span a {
    text-decoration: none;
    padding-left: 3px;
    padding-right: 3px;
}

/* used for current page */
.pager .xl {
    padding-left: 3px;
    padding-right: 3px;
}

.editor {
    margin-top: 20px;
    margin-bottom: 10px;
    margin-left: 15px;
}

.editor input, #form input {
    outline: none;
    border: 1px solid #ce5e00;
    background-color: #fafafa;
    color : #ce5e00;
}

/* qxUpload's form */
#form form {
    display: inline;
}

#form div {
    margin: 5px;
}

#form div label {
    font-size: small;
    font-weight: bold;
}

#form.align div label {
    float: left;
    width: 200px;
}

#form.align div label.basic {
    float: none;
    width: auto;
    font-weight: normal;
    font-size: inherit;
    margin-left: 5px;
}


#form #btnValid {
    margin-bottom: 20px;
    margin-left: 200px;
}

#form #grdAgents {
    margin-left: 200px;
}

#form #grdAgents table {
    border-collapse: collapse;
    border: 0;
}

#form #grdAgents tr {
    border: 0;
}

#form #grdAgents th {
    border: 0;
    text-align: left;
    background-color: #ddd;
    padding-right: 30px;
}

#form #grdAgents th a {
    text-decoration: none;
    font-weight: normal;
}

#form #grdAgents td {
    border: 0;
    padding-right: 30px;
}

#form #grdAgents td a {
    font-size: small;
}

#form #grdAgents td.new { color: blue; }
#form #grdAgents td.accepted { color: green; }
#form #grdAgents td.refused { color: #922; }

#socketio.bad {
    color: red;
}

#socketio.good {
    color: green;
}

#socketio_message {
    font-size: small;
    color: grey;
    margin-left: 10px;
}

#error {
    background-color: #f9f9f9;
    width: 80%;
    margin: 20px;
    padding: 5px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;

    color: #f60;

    -moz-box-shadow: 2px 2px 8px #937600;
    -webkit-box-shadow: 2px 2px 8px #937600;
    box-shadow: 2px 2px 8px #937600;
}

#stdpage {

}

/* user profile page */

#user img {
    vertical-align: middle;
    margin: 5px;
}

#user h3, #achivs h3 {
    color: #888;
    font-size: medium;
    margin-bottom: 5px;
}

#user h4, #achivs h4 {
    display: inline;
    margin-top: 5px;
    margin-left: 10px;
    color: #555;
}

#user div.stats, #achivs div.stats {
    font-size: small;
    margin-top: 10px;
}

#user div.stats div, #achivs div.stats div {
    margin: 5px;
}

#user .stats div label  {
    font-weight: bold;
    float: left;
    width: 200px;
}

#user .achiv, #achivs .achiv {
    background-color: #262627;
    color: #898989;
    overflow: auto;
    width: 750px;
    border: 1px solid #999;
    margin-bottom: 5px;
    clear: left;
}

#user .achiv img, #achivs .achiv img{
    float: left;
    margin: 5px;
    margin-right: 10px;
}

#user .achiv .date, #achivs .achiv .date {
    float: right;
    margin: 10px;
    font-size: 0.75em;
}

#user .achiv .today, #achivs .achiv .today {
    color: #696;
}

#user .achiv .desc, #achivs .achiv .desc {
    font-size: 12px;
}

#user .achiv h5, #achivs .achiv h5 {
    color: #e1e1e1;
    font-size: 15px;
    margin:0;
    margin-top: 18px;
}

#user #ach_bar {
    width: 481px;
    background-color: #3a3a3a;
    height: 16px;
    margin-left: 270px;
    margin-top: 7px;
    margin-bottom: 7px;
}

#user #ach_bar div {
    border: 0;
    margin: 0px;
    height: 12px;
    background-color: #aeaeae;
    position: relative;
    top: 2px;
    left: 2px;
}

#user label#ratio {
    float: left;
    font-size: 14px;
    margin-left: 1px;
}


/* Achievements page */
#achivs .stats div label  {
    font-weight: bold;
    float: left;
    width: 370px;
}

#achivs .achiv .date {
    text-align: right;
}

#pic {

}

#pic .main {
    margin: 15px;
    margin-top: 5px;
    position: relative;
    border: 1px solid #444;

    -moz-box-shadow: 2px 2px 8px #444;
    -webkit-box-shadow: 2px 2px 8px #444;
    box-shadow: 2px 2px 8px #444;
    float: left;
}

#pic .main img {
    max-width: 100%;
    height: auto;
    display: block;
}

#pic .main .title {
    margin: 0;
    position: absolute;
    bottom: 0px;
    right: 0px;
    color: #ddd;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    display: block;
}

#pic .main .title span {
    padding: 10px;
    display: block;
}

#pic .infos {
    margin-left: 15px;
}

#pic .infos img {
    margin-right: 5px;
}

#pic .infos .title {
    margin-bottom: 5px;
    text-align: center;
}

#pic #form {
    margin-left: 13px;
    display: none;
}

#pic #modify {
    margin-top: -5px;
    margin-bottom: 5px;
    margin-left: 15px;
    font-size: 12px;
}

#pic .pichelp {
    margin-left: 15px;
    font-size: 12px;
}

#pic .break {
    clear: both;
    line-height: 0;
}

/* General */

.small {
    font-size: xx-small;
    color: #666;
}

.stroked {
    text-decoration: line-through !important; /* so we'll override a.inherit */
}

/* helper for old imported news */
.presentation {
    margin-bottom: 5px;
    font-style: italic;
}

.aside {
    text-align: right;
    font-size: x-small;
    color: #666;
    margin-bottom: 0;
}

.faded {
    color: #a66;
}

.faded2 {
    color: #aaa;
}

a.inherit {
    text-decoration: inherit;
    color: inherit;
}

/* @ver:2 xf */
