/* page structure */
@import url(http://my.opera.com/community/css/themes/mainstructure1.css);

#wrap0 {
    margin: 0em auto;
    max-width: 100%;
    width:75em;
    background-color: white;
    -webkit-box-shadow: 0.6em 0.6em 0.6em rgba(0, 0, 0, 0.5); box-shadow: 0.6em 0.6em 0.6em rgba(0, 0, 0, 0.5);
}

#sidewrap { 
    width: 18em;
    margin-right: 2em;
 }

#topbar2 { margin-left: 2em; }

/* basic page typography */
body {
    font: 11px/1.5em "Lucida Grande","Lucida Sans Unicode",verdana,geneva,sans-serif;
    color: #333;
    background-color: #D6D1A6;
    line-height: 1.5em;
}

h1, h2, h3, h4, h5, h6, h1.title a:link, h1.title a:visited {
    font-family: helvetica, arial, verdana, sans-serif;
    font-weight: normal;
    padding: 0;
    color: #999;	
}

h3 {
	font-size: 130%;
	margin-bottom: 0.3em;
}

h4 {
	font-size: 110%;
	margin-bottom: 0.2em;
}

a, a:link, a:visited { color: #8B0000; }

ul, ol { line-height: 1.5em; list-style-position: outside;  margin-left: -0.1em; line-height: 1.6em;}
ol {  list-style-type:upper-roman; }

/* style header*/
#wrap3 { margin: 0; width: 100%;}
#wrap4 { margin: 0; }

#top2 { 
    height: 14em;
    background: white url(http://files.myopera.com/dstorey/images/1braillogo.png) no-repeat top 55em;
    border-top:0.2em solid #8B0000;
    border-bottom: 0.1em solid #E5E5E5;
}

#top2 h1, #subtitle {
    display: block;
    width: 28em;
    height: 3em;
    overflow: hidden;
    line-height: 15em;
}

#top2 h1 {
   background: transparent url("images/Slightlyajar2.png") no-repeat 0 0;
   margin-top: 0.8em;
   margin-left: 1em;
   height: 0.8em;
}

#subtitle {
   background: transparent url("images/openweb2.png") no-repeat 0 0;
   margin-left: 2em;
}

/* style menu */
#menu {
     background: white;
     font-weight: bold;
     text-shadow: grey 0 0.1em 0.1em;
     font-size: 95%;
}

#menu a { 
    border-top: 0.3em solid white;
    width: 5em;
    text-align: center;
}

#menu a:hover {
    color: black;
    border-color: #8B0000;
    font-family: georgia, times, "times new roman", serif; 
    font-style: italic;
    text-shadow: none;
}

#menu a#selected {
    color: black;
    border-color: #999;
}

/* style content */
#main {
     width: 40em; 
     padding-right: 8em;
     border-right: 0.1em #DCDCDC dotted;
}

.post, .comments, #newcomment { padding-left: 4em; }

div.content > p:first-child:first-letter, .articleImage +  p:first-letter, h3.Vs + p:first-letter, #excerpt + br + p:first-letter, .column p:first-child:first-letter {
      color: silver;
      font-size: 5em;
      font-family: times, "times new roman", serif;
      margin: 0.1em 0.2em -0.2em 0.2em; 
      float: left;
      line-height: 90%;
}

.content p { text-indent: 2em; }

.postdate, .tags, .articleImage + p,  h3.Vs + p, div.content p:first-child, #excerpt + br + p, h3 + p, h4 + p {
     text-indent: 0em;
     text-transform: none;
}

.content ol li > p,  .content ol + p {  text-indent: 0em; }


/* style article sidebox */
.articleImage, .altarticleImage {
    float: right;
    width: 250px;
    height: 187px;
    margin: 0 0.8em 0.8em 1.6em; 
    border: 0.1em solid #D3D3D3; 
    -webkit-box-shadow: 0.4em 0.3em 0.6em rgba(0, 0, 0, 0.5); box-shadow: 0.4em 0.3em 0.6em rgba(0, 0, 0, 0.5);
}

.altarticleImage {
   float: left;
   margin: 0.4em 1.6em 0.8em 0.8em;  
}

.articleImage p, .altarticleImage p {
   text-align: center;
   text-indent: 0em;
   color: white; 
   letter-spacing: 0.1em;
   padding: 0.7em 0 0 0;     
   text-shadow: silver 0.1em 0.1em 0.1em;  
   background-color: black;
   position: relative; 
   /* The following makes the text appear over the image, and sets it slighly transparent */ 
   top: -3.9em; 
   left: 0em;
   opacity: 0.7; 
   z-index: 10; 
   width: 100%; 
   height: 2.4em;
}

h3.Vs {
     font-size: 160%;
     color: black;
}

h3.Vs img {
   vertical-align:middle;
   border: solid 1px #808080;
}

/* style comments */
.bot {
 -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
       border-radius: 1em;
      border: 1px solid #D3D3D3;;
}

.comment2 .bot { background-color: #D3D3D3; }
.comment2  .avatar { float: right; }
.comment2 .text { margin: 0 69px 0 0; }

.ownercomment .bot {  background-color: black;  opacity: 0.7;
  }
.ownercomment .text { color: white; letter-spacing: 0.1em; text-shadow: silver 0.1em 0.1em 0.1em line-height: 1.6em;  
}

textarea#message { resize: vertical; }

/* style sidebar */

.sidebox h2 { 
    color:black;
    font-weight: bold;
    text-align: center;
}

.sidebox {
       -webkit-border-top-right-radius: 5px;
       -webkit-border-top-left-radius: 5px;
       -moz-border-radius: 5px 5px 0 0;
       border-radius: 5px 5px 0 0;
       border: 1px solid #D3D3D3;
       padding: 0 1em 1em 1em;
}

#myphoto div img { margin: 0;}

#qp { padding: 0; }

#userinfo dt {
   font-weight: bold;
   text-align: right;
}

#userinfo dd {
     padding-left: 15px;
}

/* calendar style */
#side caption a#calendarmonth {
      background-color: white;
      color: black;
      font-weight: bold;
      text-align: center;
      text-transform: none;
}
#calendar th { color: grey;}
#calendar td { font-weight: bold; border: none;}
#calendar td.l { background-color: #D3D3D3;  -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
       border-radius: 5px;}
#calendar td.l a {color: white !important; text-decoration: none; }

/* footer style */
#footer {
    border-top: 1px solid #DCDCDC;
    border-bottom: 1px solid #DCDCDC;
    padding: 1em 0;
}

#footer a {
   color: black;
   text-decoration: none;
}

