/*--------------------------------------------------------*/
/*  Layout                                                */
/*--------------------------------------------------------*/
#center-wrapper {
    float: left;
    width: 100%;
}

.two-column-layout #center {
    margin: 0 20px 0 290px;
}

.three-column-layout #center {
    margin: 0 270px 0 290px;
}

#left {
    float: left;
    margin-left: -100%;
    width: 250px;
}

#right {
    float: right;
    margin-left: -100%;
    width: 250px;
}

* html .three-column.layout #right {
    margin-left: -250px;
}

#footer {
  clear: both;
}
/*--------------------------------------------------------
 the rest is the same no matter what the column ordering
 and plays no real part in the technique
 ---------------------------------------------------------*/
/*  throat, er cough, float, clearer
 the container div and the clearing rules have no bearing on the
 technique - they're needed here on the footer's behalf
 see http://www.positioniseverything.net/easyclearing.html for
 an explanation of the voodoo applied to #container
 Unfortunately neither of the other two easy clearing methods,
 namely applying either a float or overflow: auto (or hidden) to
 the containing wrapper works.
 http://mezzoblue.com/archives/2005/03/03/clearance/
 http://annevankesteren.nl/2005/03/clearing-floats
 http://www.456bereastreet.com/lab/clearing_floats/
 In both cases, the height of the containing wrapper is set to the
 height of block_1. Great if block_1 is the tallest column, not so good
 if it's not. (Though, of course, it should be noted that both
 methods work just fine in IE because of its infamous broken float
 implementation)
 */
#container:after {
    content: '[DO NOT LEAVE IT IS NOT REAL]';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#container {
    display: inline-block;
}
/*\*/
* html #container {
    height: 1%;
}

#container {
    display: block;
}


/*--------------------------------------------------------*/
/*                                        End of layout   */
/*--------------------------------------------------------*/
/*  Look & feel                                           */
/*--------------------------------------------------------*/

body {
    background: #FFFFFF url(images/img04.gif) repeat-x;
}

.column {



}

#left {
	padding-left: 10px;
}

/*--------------------------------------------------------*/
/*  Tab menu                                              */
/*--------------------------------------------------------*/

#menu {
	width: 770px;
	height: 50px;
	margin: -30px auto 0 auto;
}

#menu ul {
	float: right;
	margin: 0;
	padding: 0;
	list-style: none;
}

#menu li {
	float: left;
	display: block;
	height: 40px;
}

#menu li:hover {
	background: #F9F8F1;
}

#menu a {
	display: block;
	height: 35px;
	width: 80px;
	padding: 5px 20px 0 20px;
	text-align: center;
	text-decoration: none;
	text-transform: lowercase;
	font-weight: bold;
	color: #7F7772; 
}

#menu li.active {
	background: #EDEBD5 url(images/img05.gif) no-repeat;
}

#menu li.active a {
	background: url(images/img06.gif) no-repeat right top;
}



/*--------------------------------------------------------*/
/*  Misc                                                  */
/*--------------------------------------------------------*/
.sound .label {
    margin: 5px;
    font-weight: bold;
}

.sound {
    display: block;
    border: 1px solid #CCC;
}

.sound .controls {
    float: right;
    margin-right: 5px;
}
/* Search */
#search {
    float: right;
    width: 280px;
    padding-top: 20px;
}

#search form {
    margin: 0;
    padding: 0;
}

#search fieldset {
    margin: 0;
    padding: 0;
    border: none;
}

#search legend {
    display: none;
}

#searchinput, #searchsubmit, #quick-login input {
    border: 1px solid #EDEBD5;
    font: bold 100% "Trebuchet MS", Arial, Helvetica, sans-serif;
    color: #7F7772;
}

#searchinput {
    width: 198px;
}

#searchinput, #quick-login input.text {
    padding: 2px 5px;
    background: #FFFFFF url(images/img02.gif) repeat-x;
}

#searchsubmit, #quick-login input.submit {
    background: #FFFFFF url(images/img03.gif) repeat-x left bottom;
}

#quick-login input.text {
    width: 100px;
}

#quick-login label {
    display: block;
    float: left;
    width: 80px;
}

#quick-login {
    text-align: center;
}

#quick-login li {
    margin: 5px 0;
}

#user-panel {
    float: right;
    width: 400px;
    padding-top: 20px;
    text-align: center;
}