/*
Original Template: wordpress theme
Theme Name: Out of Sadness
Theme URI: http://www.wpskins.org/
Author: Free Wordpress Themes
Author URI: http://www.wpskins.org/
	 
The CSS, XHTML and design is released under Attribution-ShareAlike 2.5 Licence if you wish to use it, please refer to the licence.txt file included. [ http://creativecommons.org/licenses/by-sa/2.5/ ]

Redesign and conversion from wordpress to XHTML/CSS by deep_c of http://bagside.com
*/

* {
margin:0;
padding:0;
}
a {
color: #999999;
text-decoration: none;
}

a:hover{
text-decoration: underline;
}

body {
font-family: Arial, sans-serif;
background: url(images/background.jpg) repeat-x top;
}

ul, ol {
list-style-type: none;
}

blockquote, #content ul, #content ol, p, pre {
margin: 0 0 0.5em 0;
}

/************************/
/*     Layout Design    */
/************************/

#page {
width: 1024px;
margin: 0 auto;
background: url(images/baghead.jpg) no-repeat right top;
}

#header {
position: relative;
height: 210px;
}

#wrapper {
clear: both; /* Clear float items in from navi-bar */
}

#content {
float: right;
width: 540px;
}

.left{
float: right;
width: 450px;
}


.sidebar {
float: left;
width: 211px;
margin-top: 60px;
margin-left: 3px;
background: url(images/sidebar.png) repeat-y;
}

/************************/
/*     Header Design    */
/************************/
#headerimg {
position: absolute;
top: 114px;
right:150px;	
}

#headerimg a {
color: #6d6d6d;
font-weight: bold;
}

.description {
font-size: 12px;
display: none;
}

#search-box {
position: absolute;
top: 78px;
right: 30px;
}

#vapp {
position: absolute;
top: 40px;
right: 66px;
font-size: 10px;
font-family: Arial;
font-weight: bold;
}

#vapp, #vapp a {
color: #999999;
text-decoration: none;
}

#vapp a:hover {
text-decoration: underline;
}
/************************/
/*    Sidebar Design    */
/************************/
.sidebar-top, .sidebar-bottom{
font-size: 1px;
line-height: 1px;
height: 7px
}

.ad-top, .ad-bottom {
font-size: 1px;
line-height: 1px;
height: 6px
}

.sidebar-top {
background: url(images/sidebar-top.png) no-repeat;
}

.sidebar-bottom {
background: url(images/sidebar-bottom.png) no-repeat;
}

.ad-top {
background: url(images/ad-top.png) no-repeat;
margin-left: 3px;
margin-top: 3px;
}

.ad {
background: url(images/ad.png) repeat-y;
margin-left: 3px;
padding: 5px;
}

.ad-bottom {
background: url(images/ad-bottom.png) no-repeat;
margin-left: 3px;
}

.sidebar ul {
font-size: 11px;
padding: 5px 10px;
font-family: Arial, sans-serif;
font-weight: bold;
color: #777777;
}

.sidebar ul h2, .advertisement {
font-size: 14px;
margin: 0 0 4px 0;
color: #999999;
font-weight: bold;
background: url(images/heading.png) no-repeat;
padding: 5px;
}

.sidebar ul h2, .proverb {
font-size: 11px;
margin: 0 0 4px 0;
color: #999999;
font-weight: bold;
padding: 5px 10px 5px 0px;
}

.sidebar ul li {
margin-bottom: 20px;
}

.sidebar ul ul {
padding: 0;
}

.sidebar ul ul li {
margin-bottom: 3px;
line-height: 14px;

padding-left: 15px;
}

.pagenavl {
list-style-type: none;
}

.pagenavr {
list-style-type: none;
background: url(images/bullet.png) no-repeat left;
}

.sidebar ul ul ul {
display: none;
}

.sidebar a {
color: #659ec7;
}
.sidebar a:hover {
color: #7c7c7c;
}

.sidebar a:visited {
}

.pow {
font-size: 12px;
}

.pow a {
color: #659ec7;
font-weight: 700;
font-size: 12px;
}
.pow a:hover {
color: #7c7c7c;
text-decoration:none;
}

.pow a:visited {
color: #659ec7;
}


#copyright {
background: url(images/footer.png) no-repeat;
height: 60px;
margin-left: 3px;
margin-top: 2px;
font-size: 10px;
padding: 12px 7px 7px 7px;
width: 412px;
text-align: center;
}

/************************/
/*    Content Global    */
/************************/
blockquote {
font-style: italic;
padding: 0 10px;
}

h1, h2, h3, h4, h5, h6 {
color:;
}

h1 {
font-size: 30px;
color: #555;
}

h2 {
font-size: 18px;
}

h3 {
font-size: 14px;
}

h4 {
font-size: 12px;
}

h5 {
font-size: 12px;
}

h6 {
font-size: 12px;
}

code, pre {
overflow: auto;
white-space: pre;
font-family: Courier;
}

#content ul {
padding-left: 50px;
list-style-type: square;
}

#content ol {
padding-left: 25px;
list-style-type: decimal;
}

/************************/
/*    Content Design    */
/************************/
.post {
margin: 10px 0 20px 0;
font-size: 12px;
line-height: 14px;
padding-right: 20px;
}

.post-header {
height: 41px;
border-bottom: 1px solid #cccccc;
margin-bottom: 10px;
}
.post h2 {
line-height: normal;
text-align: right;
padding: 14px 10px 5px 0px;
color: #999999;
}

.post h2 a:hover, h2 a:visited, h2 a {
color: #999999;
}

.post .posted {
font-size: 10px;
line-height: normal;
float: left;
width: 150px;
color: #999999;
padding-top: 10px;
padding-left:20px;
}

.post .title {
float: right;
width: 320px;
background: url(images/post-title.png) no-repeat right;
}
.post p {
margin: 5px 0;
}

.post a {

}

.post img {
max-width: 100%;
margin: 3px;
}

.entry {
color: #999999;
}

.entry a {
color: #659ec7;
}

.entry a:hover {
color: #7c7c7c;
}

.postmetadata {
margin: 5px 0;
font-size: 10px;
line-height: normal;
}

p.alt {
font-size: 10px;
}

.entry-tags {
display: block;
}

.navigation {
height: 1em;
font-size: 12px;
margin: 5px 0;
}

#nav-above {
margin-bottom: 10px;
}

#nav-below {
margin-top: 10px;
}

.alignleft, .nav-previous {
float: left;
}

.alignright, .nav-next {
float: right;
}

a img {
border: none;
}

#author, #email, #url, #comment {
border: 1px solid #cccccc;
background-color: #fff;
padding: 3px;
font-family: Verdana, sans-serif;
font-size: 10px;
}

.clear {
clear: both;
}

#spic, #spic2 {
height: 241px;
width: 375px;
margin-left: 82px;
}

#portfolio {border:1px solid #909090; width:330px; height:240px; background:#ddd url(img/portfolio.jpg); margin:0 auto;}
#portfolio img {display:none;}
#portfolio ul {margin:0; padding:0; width:330px; height:30px; list-style-type:none; background:#333 url(img/ncom2.jpg) no-repeat 0 200px; margin-top:210px;}
#portfolio ul li {display:block; width:10px; height:30px; float:left; position:relative;}
#portfolio ul li a, #portfolio ul li a:visited {display:block; width:10px; height:30px; text-decoration:none; cursor:default;}
#portfolio ul li a em {display:none;}
#portfolio ul li a:hover {background:#f0f;}
#portfolio ul li a:hover em {display:block; position:absolute; left:0; top:-210px; width:330px; height:210px; background:#eee url(img/ncom2.jpg) no-repeat 0 0;}
#portfolio ul li a:hover em#e2 {left:-10px; background-position: -18px 0;}
#portfolio ul li a:hover em#e3 {left:-20px; background-position: -36px 0;}
#portfolio ul li a:hover em#e4 {left:-30px; background-position: -54px 0;}
#portfolio ul li a:hover em#e5 {left:-40px; background-position: -72px 0;}
#portfolio ul li a:hover em#e6 {left:-50px; background-position: -90px 0;}
#portfolio ul li a:hover em#e7 {left:-60px; background-position: -108px 0}
#portfolio ul li a:hover em#e8 {left:-70px; background-position: -126px 0;}
#portfolio ul li a:hover em#e9 {left:-80px; background-position: -144px 0;}
#portfolio ul li a:hover em#e10 {left:-90px; background-position: -162px 0;}

#portfolio ul li a:hover em#f1 {left:-100px; background-position: -180px 0;}
#portfolio ul li a:hover em#f2 {left:-110px; background-position: -198px 0;}
#portfolio ul li a:hover em#f3 {left:-120px; background-position: -216px 0;}
#portfolio ul li a:hover em#f4 {left:-130px; background-position: -234px 0;}
#portfolio ul li a:hover em#f5 {left:-140px; background-position: -252px 0;}
#portfolio ul li a:hover em#f6 {left:-150px; background-position: -270px 0;}
#portfolio ul li a:hover em#f7 {left:-160px; background-position: -288px 0}
#portfolio ul li a:hover em#f8 {left:-170px; background-position: -306px 0;}
#portfolio ul li a:hover em#f9 {left:-180px; background-position: -324px 0;}
#portfolio ul li a:hover em#f10 {left:-190px; background-position: -342px 0;}

#portfolio ul li a:hover em#g1 {left:-200px; background-position: -360px 0;}
#portfolio ul li a:hover em#g2 {left:-210px; background-position: -378px 0;}
#portfolio ul li a:hover em#g3 {left:-220px; background-position: -396px 0;}
#portfolio ul li a:hover em#g4 {left:-230px; background-position: -414px 0;}
#portfolio ul li a:hover em#g5 {left:-240px; background-position: -432px 0;}
#portfolio ul li a:hover em#g6 {left:-250px; background-position: -450px 0;}
#portfolio ul li a:hover em#g7 {left:-260px; background-position: -468px 0}
#portfolio ul li a:hover em#g8 {left:-270px; background-position: -486px 0;}
#portfolio ul li a:hover em#g9 {left:-280px; background-position: -504px 0;}
#portfolio ul li a:hover em#g10 {left:-290px; background-position: -522px 0;}

#portfolio ul li a:hover em#h1 {left:-300px; background-position: -540px 0;}
#portfolio ul li a:hover em#h2 {left:-310px; background-position: -558px 0;}

.cen {
text-align: center;
line-height: 50%;
}

.port a, a:visited {
font-size: 100%;
font-family: arial;
text-decoration: none;
color: #000099;
}

.port a:hover {
font-size: 100%;
font-family: arial;
color: #333;
text-decoration: none;
}

.box {
padding: 2px;
color: #555;
font-size: 100%;
font-family: arial;
border: 1px solid #000;
background-color: #f6f6f6;
}


.imgleft {
float: left;
border: 1px solid #000;
}

#wp {position:relative; width:545px; margin-bottom: 10px;}
#thumbs {width:550px; float:left; margin-bottom: 10px;}
#thumbs a {display:block; float:left; margin:0 0 5px 5px; width:50px; height:50px; border:1px solid #fff;}
#thumbs a img {width:50px; height:50px; border:0;}
#thumbs a:hover {border-color:#eee;}
#thumbs a:hover img {position:absolute; width:auto; height:auto;left:80px; top:80px; border:3px solid #333;}

#cel li {
line-height: 1.3em;
margin-left: -15px;
list-style: url(img/li.png)
}

#contform {
	background: transparent;
	padding: 1px 0px 1px 1px;
}


form, label, input { 
	font-size : 0.95em;	
} 

fieldset { 
	padding : 0 0.9em;
	background: transparent;
	width:95%;
}

legend {
	font-size:1.2em;
	color: #003399;
}

label { 
	text-align:left;
	position : relative; 
	width : 10em; 
	display : block; 
	margin : .5em 0; 
	padding:2px;
}

label input { 
	position : absolute; 
	left : 80%; 
	top : 2px; 
	width : 18em; 
	border:1px solid black;
	padding:2px;
}

label input:focus {
	background-color:#dedede;
} 

input.submit { 
	margin-left:22em;
	width:50px;
}

input, textarea{
width: 200px;
margin-bottom: 5px;
}

textarea{
width: 100%;
height: 100px;
}

select {
color: #039;
font-weight: bold;
margin-left: .5em;
}

#contform br { 
display : none; 
}

#info dl {
  clear:both;
  width:528px;
  height:26em;
  margin:2em auto;}
#info dt {
  margin-bottom:1em; 
  font-weight:bold;}
#info dd {
  width:33%; 
  float:left; 
  margin:0;}

#info ol.first {
  counter-reset:item 0;}
#info ol.second {
  counter-reset:item 21;}
#info ol.third {
  counter-reset:item 41;}

#info ol li {
  display: block;}
#info ol li:before {
  content: counter(item) ". "; 
  counter-increment: item 1;}
  
  a.screen, a.screen:visited {
  color:#22b1e1; 
  position:relative; 
  z-index:1;
  }
  a.screen b {
  position:absolute;
  visibility:hidden;
  width:300px;
  height:0;
  border:1px solid #000;
  margin: -150px 0 0 10px;
  }
  a.screen:hover {
  text-decoration:none; 
  border:0; 
  z-index:1000;
  }
  a.screen:hover b {
  visibility:visible;
  height:250px;
  cursor:pointer;
  z-index:500; 
  }
  a.screen:hover b img {
  border:0;
}