/*
    CSS style sheet for http://people.opera.com/howcome
    May be reused by anyone for any purpose
    background based on design from http://www.squidfingers.com/patterns/
*/

html { background: url(../2005/img/bg.png) } 

body { 
  margin: 3em; padding: 1em; background: white; 
  border: 1px solid black; font: 14px "Trebuchet MS", serif 
}

h1 { text-align: center; font: 3em Georgia, serif;  margin: 0.7em 0 0.2em; }

h1 a { color: black }

h2 {  
  font: 1.5em Georgia, serif; 
  padding: 0;
  margin: 0.8em 0 0.2em; 
}

h2.side {
  float: left;
  padding: 0;
  margin: 0; 
  width: 21%;
  text-align: right;
  font: 2em Georgia, serif;
  clear: left;
}

div.box {
  text-align: justify;
  margin: 0;
  padding: 0;
  margin-left: 23%;
  margin-right: 130px;
  margin-bottom: 1em;
  padding-left: 0.5em;
  padding-right: 1em;
  border-left: thin dotted black;
}

address { display: block; margin: 1em; }

#news li {
  margin: 0; padding: 0;
  list-style: none;
  margin-left: 1em;
}

#news{
  margin: 0; padding: 0;
  list-style: none;
  text-indent: -1em;
}


p { margin: 0.6em 0; padding: 0 }
p.sb { margin-top: 1em }

a { text-decoration: none }

q:before { content: "«" }
q:after { content: "»" }

q, blockquote { font-style: italic }

img { border: none; }

table.views td {
  font-style: italic;
  padding: 0.2em;  
  text-align: right;
  border: none;
  border-right: 1px dotted black;
}

table.views td + td {
  text-align: left;
  border: none;
}

.photo {
  width: 90px;
  float: right; clear: right;
  text-align: left;
  margin: 0.5em 20px 0.5em 0.5em;
}

/* complex selector to bypass IE */
HTML>BODY .photo { margin: 0.5em 40px 0.5em 0.5em; }

/* complex selector to bypass IE */
HTML>BODY .ego { margin-top: -25px }

@page { margin: 10% }
@media print {
  html { background: white }
  body { margin: 0; padding: 0; border: none }
}


@media handheld, all and (max-width: 400px) {

html { background: black; }

body { 
  font: 12px sans-serif;
  margin: 4px;
  padding: 2px;
  max-width: 400px;
  background: white;
}

h2 {
  padding: 0;
  margin: 0.8em 0 0.2em;
  font-variant: normal;
  text-align: left;
  float: none;
  width: auto;
}

div.box { margin: 0; padding: 0; border: none;   text-align: left; }

div.photo { padding: 0; margin: 0 0 3px 10px; border: none; }

/* complex selector to bypass IE */
HTML>BODY .ego { margin: 0 }

table.views { 
  margin: 0.5em 0;
  border-collapse: collapse; 
  border: 1px solid black;
}

table.views td, table.views td + td {
  padding: 0.2em;  
  text-align: right;
  border: 1px solid black;
  border-left-width: 0;
}

table.views td + td  {
  text-align: left;
}


p, ul, ol {
  padding: 0;
  margin: 0.3em 0 0.6em;
  list-style-position: inside;
}

}

@media handheld and (max-width: 300px) {
  * { text-align: left ! important }
  .photo { display: none }
  body { background: black; color: white }
  a { color: #AAF }
}

