body {
    background: url('images/design/grey_scale.png') repeat-x #fff ;
    padding: 0;
    margin: 0;
    font-family: Bitstream Vera Sans, Tahoma, Verdana, Helvetica, sans-serif;
}

/* THE FRAMES/TABS */

div.section {
  position: absolute;
  width: 20% ;
  padding-bottom: 20px
}
#savonet   {  left: 10% ; top: 16% }
#community { right: 10% ; top: 16% }
#liquidsoap { left: 35% ; right: 35% ; top: 10% ; bottom: 10% ; width: 30% }
#main { left: 20% ; right: 20% ; top: 10% ; width: 60% }

img#logo { height: 7em ; border: 0px ; float: left; margin: 10px }
div.section ul { padding-left: 1.2em }

div.section h1 {
  /* background: #111 ; */
  color: #fff ;
  font-size: 1.5em ;
  padding-top: 5px ;
  text-align: center;
  background: #906 ;
  display: block ;
  width: 75% ;
  border-radius: 10px 10px 0px 0px ;
  -moz-border-radius: 10px 10px 0px 0px ;
  margin: 0px 0px 0px 0px ;
}

div.section > div.content {
  padding: 15px ;
  background: #fff ;
  border-color: #906 ;
  border-style: solid ;
  border-width: 5px ;
  margin: 0px 0px 0px 0px ;
}

#liquidsoap h1 { margin-left: auto ; margin-right: auto }
#liquidsoap .content
{
    border-radius: 20px 20px 20px 20px;
    -moz-border-radius: 20px 20px 20px 20px;
}
#community h1 { margin-left: 0 ; margin-right: auto }
#community .content
{
    border-radius: 0px 20px 20px 20px;
    -moz-border-radius: 0px 20px 20px 20px;
}
#savonet h1 { margin-right: 0 ; margin-left: auto }
#savonet .content
{
    border-radius: 20px 0px 20px 20px;
    -moz-border-radius: 20px 0px 20px 20px;
}
#main h1 { margin-right: auto ; margin-left: 20px ; width: 85% }
#main .content
{
    border-radius: 20px 20px 20px 20px;
    -moz-border-radius: 20px 20px 20px 20px;
    text-align: justify;
    padding-left: 8%;
    padding-right: 8%;
}
#main .content img
{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* CODE */

pre {
  padding-left: 10px ;
  border-left: solid 1px ;
  border-right: solid 1px ;
  font: monospace, fixed ;
  white-space: pre ;
  color: #444 ;
  overflow: auto;
}
code {
    background-color: #eee;
    font: monospace, fixed;
}
#main .content img.grab
{
    display: block;
    border: none;
    margin-right: 0;
}

/* NEWS (homepage) */

div.item div.title { font-weight: bold }
div.item div.content {
  margin-left: 1em ;
  border-width: 5px ;
  border-radius: 0px 5px 5px 5px ;
  -moz-border-radius: 0px 5px 5px 5px ;
  margin-bottom: 0.5em ;
}

div.section h2 { color: #906 }

/* MENU */

.menu {
  text-align: center;
  position: relative ;
  right: 20% ; width: 100% ; /* to make it left change "float" below */
  font-weight: bold ;
}

.menu ul{
  padding-left: 0;
  margin: 0;
  height: 20px;
}

.menu ul li{
  list-style: none;
  display: inline;
}

.menu ul li a{
  padding: 2px 0.5em;
  text-decoration: none;
  float: right;
  color: white;
  background-color: #906;
  border-radius: 0px 0px 10px 10px ;
  -moz-border-radius: 0px 0px 10px 10px ;
  border: 0px;
}

.menu ul li form{
  padding: 2px 0.5em;
  text-decoration: none;
  float: right;
  background-color: #906;
  border-radius: 0px 0px 10px 10px ;
  -moz-border-radius: 0px 0px 10px 10px ;
  border: 0px;
}

.menu ul li a:hover{
  background-color: #551A8B; /*You Can Change This Color*/
}

#liq123 {
  list-style-type: none;
  padding-left: 0;
  margin-top: 2em ;
  margin-bottom: 2em ;
  text-align: center;
  word-spacing: -0.3em; /* no space between blocks... */
}

#liq123 div {
  word-spacing: 0px; /* restore spacing... */
  text-align: center;
  display: inline ;
  padding: 4% 2% 4% 2% ;
  margin: 0 0 0 0 ;
}

#liq123 a {
  color: white;
  text-decoration: none;
}

#liq123 #liq123-is {
  background: #c00 ;
}

#liq123 #liq123-dl {
  background: #906;
}

#liq123 #liq123-ej {
  background: #609;
}

.liq-search-hide {
  float: right;
  font-weight: normal;
}

#footer {
  font-size: 8pt;
  text-align: right;
  padding-top: 5em ;
  color: #666;
  clear: both;
}

/* Twitter */
.twtr-hd {
    display: none;
}

.twtr-ft {
    display: none;
}

/* Flows */

#radios .radio {
    font-variant: small-caps;
    font-weight: bold;
    font-size: large;
}

#radios .streams {
    font-variant: normal;
    font-weight: normal;
    font-size: x-small;
}

#radios .stream {
    float: right;
    margin-left: 1ex;
}

#radios .genre {
    font-size: x-small;
    color: #555;
}

#radios .title {
    font-style: italic;
}

#radios a {
    text-decoration: none;
    color: #00f;
}

#radios a:visited {
    color: #00f;
}

#radios a:hover {
    text-decoration: underline;
}

#radios ul {
    list-style-type: none;
    padding: 0;
}

#radios li {
    padding: 1ex;
    margin-bottom: 2ex;
    background: #fbfbfb; /* Old browsers */
    background: -moz-linear-gradient(top, #fbfbfb 0%, #ebebeb 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#ebebeb)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #fbfbfb 0%,#ebebeb 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #fbfbfb 0%,#ebebeb 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #fbfbfb 0%,#ebebeb 100%); /* IE10+ */
    border-color: #c5c5c5;
    border-style: solid;
    border-width: 1px;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#ebebeb',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #fbfbfb 0%,#ebebeb 100%); /* W3C */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

#map {
    margin-bottom: 4ex;
}
