/* -------------------------------------------- Haupt CSS fuer alle Seiten -------------------------------------------- */

/* ---------------- CSS-Reset ------------------- */
html, body, a, div, h1, h2, h3, h4, h5, h6, span, p, img, strong, ul, li, table, th, td, tr {
	margin: 0px;
	padding: 0px;
	border: 0px none;
	font-weight: normal;
	font-style: inherit;
	font-family: inherit;
	font-variant: inherit;
	text-decoration: none;
	table-layout: inherit;
}


/* ---------------- Body / HTML ------------------- */

html {
    font-size: 100%;
    background-color: #fffef7;
}

body {
		font-family: Helvetica, Arial, sans-serif;
		font-size: 1.2em;
		font-weight: normal;
		color: black;
		margin: 0rem auto 2rem auto;
}

/* ---------------- layout ------------------- */

header {

    background: url(../img/js_header.png) left top no-repeat transparent;
    background-size: cover;
    height: 250px;
    min-width: 850px;
}

header:after {
    content: ' ';
    display: block;
    height: 250px;
background: rgba(255,254,247,0);
background: -moz-linear-gradient(top, rgba(255,254,247,0) 0%, rgba(255,254,247,0.55) 22%, rgba(255,254,247,0.7) 42%, rgba(255,254,247,0.71) 43%, rgba(255,254,247,0.78) 61%, rgba(255,254,247,0.92) 75%, rgba(255,254,247,1) 87%, rgba(255,254,247,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,254,247,0)), color-stop(22%, rgba(255,254,247,0.55)), color-stop(42%, rgba(255,254,247,0.7)), color-stop(43%, rgba(255,254,247,0.71)), color-stop(61%, rgba(255,254,247,0.78)), color-stop(75%, rgba(255,254,247,0.92)), color-stop(87%, rgba(255,254,247,1)), color-stop(100%, rgba(255,254,247,1)));
background: -webkit-linear-gradient(top, rgba(255,254,247,0) 0%, rgba(255,254,247,0.55) 22%, rgba(255,254,247,0.7) 42%, rgba(255,254,247,0.71) 43%, rgba(255,254,247,0.78) 61%, rgba(255,254,247,0.92) 75%, rgba(255,254,247,1) 87%, rgba(255,254,247,1) 100%);
background: -o-linear-gradient(top, rgba(255,254,247,0) 0%, rgba(255,254,247,0.55) 22%, rgba(255,254,247,0.7) 42%, rgba(255,254,247,0.71) 43%, rgba(255,254,247,0.78) 61%, rgba(255,254,247,0.92) 75%, rgba(255,254,247,1) 87%, rgba(255,254,247,1) 100%);
background: -ms-linear-gradient(top, rgba(255,254,247,0) 0%, rgba(255,254,247,0.55) 22%, rgba(255,254,247,0.7) 42%, rgba(255,254,247,0.71) 43%, rgba(255,254,247,0.78) 61%, rgba(255,254,247,0.92) 75%, rgba(255,254,247,1) 87%, rgba(255,254,247,1) 100%);
background: linear-gradient(to bottom, rgba(255,254,247,0) 0%, rgba(255,254,247,0.55) 22%, rgba(255,254,247,0.7) 42%, rgba(255,254,247,0.71) 43%, rgba(255,254,247,0.78) 61%, rgba(255,254,247,0.92) 75%, rgba(255,254,247,1) 87%, rgba(255,254,247,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffef7', endColorstr='#fffef7', GradientType=0 );
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffef7', endColorstr='#fffef7', GradientType=0 );
}

main,
footer {
    width: 70%;
    margin: 3rem auto;
    min-width: 850px;
    padding: 0 20px;
    box-sizing: border-box;
}





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



h1 {
    color: #93412b;
    font-size: 3em;
	margin-bottom: 20px;
	font-weight: bold;
}


h2 {
    color: #93412b;
	font-size: 2.5em;
	margin-bottom: 15px;
}

h3 {
    color: #93412b;
	font-size: 2em;
	margin-bottom: 10px;
}

p {
	line-height: 15px;
	margin-bottom: 15px;
	line-height: 1.7em;
}

.cited {
    font-style: italic;
    font-size: .8em;
}

.u {text-decoration: underline;}
.b {font-weight: bold;}
.i {font-style: italic}
.align_right {text-align: right;}
.align_left {text-align: left; margin-right: 10px;}
.align_center {text-align: center;}
.float_left {float: left;}
.float_right {float: right;}
.clear_both {clear: both;}
strong {font-weight: bold;}
.special { color: #b7595b; font-weight: bold; }
.keyword { color: #db6f50; font-weight: bold; font-style: italic;}
.gray {color: gray;}

/* Links */
main a:link,
main a:visited {
	color: #eb690b;
	font-weight: bold;
}

main a:focus,
main a:hover,
main a:active {color: #eb690b;}

ul {
    list-style-position: outside;
    margin-bottom: 20px;
    padding-left: 22px;
}

ol {
    margin-bottom: 20px;
    padding-left: 30px;
}

li {
    line-height: 1.4em;
}


/* ------- Article ------- */


h1 {
    color: #93412b;
    font-size: 2.7em;
	margin-bottom: 20px;
}

#buy_form input[type=button] {
    display: inline-block;
    padding: 1px 20px 3px 20px;
    background-color: #93412b;
    color: white;
    border: 1px solid white;
    font-size: 1em;
    height: 32px;
}

#buy_form input[type=button]:hover {
    background-color: white;
    color: #93412b;
    border: 1px solid #93412b;
}

#buy_form select {
    display: inline-block;
    font-size: 1em;
    background-color: white;
    color: #93412b;
    border: 1px solid #93412b;
    height: 32px;
}


/* ------- Chat ------- */


#chat {
    width: 100%;
    background-color: white;
    border: 1px solid #9c352f;
    height: 20rem;
    position: relative;

}

#chat_window {
    background-color: white;
    width: 85%;
    float: left;
    height: 95%;
}

#chat_history {
    position: absolute;
    bottom: 8%;
    max-height: 92%;
    padding: 0px 0px 5px 7px;
}

#chat_history p {
    font-size: .6em;
    margin: 0;
}

#chat_text {
    height: 8%;
    position: absolute;
    bottom: 0;
    width: 85%;
}

#chat_text input {
    width: 98%;
    display: block;
    margin: auto;
}

#chat_members {
    list-style-type: none;
    height: 100%;
    width: 15%;
    margin-left: 85%;
    border-left: 1px solid #9c352f;
    text-align: right;
    box-sizing: border-box;
    min-width: 100px;
    font-size: .8em;
    padding-top: 5px;

}

#chat_members li {
    line-height: 1.2em;
    padding: 5px 10px 2px 15px;
}


#chat_members .highlighted {
    background-color: #c14d45;
    color: white;
}
.chat_member {font-weight: bold;}
.chat_member1 { color: #3626c8;}
.chat_member2 { color: #e38d0b;}

#member_search {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 15%;
    height: 8%;
}

#member_search input {
    width: 88%;
    display: block;
    margin: auto;
    text-align: right;
}