/* - 1. background and title and menu - */
	/* - 1.1 navbar rollover stuff - */
/* - 2. main layout - */
	/* - 2.1 image layout - */
/* - 3. link styles - */
/* - 4. fonts - */


/* - 1. background and title and menu - */

body {
	background-attachment: fixed;
	background-color: #000000;
	background-position: top;
	background-repeat: no-repeat;
	background-image: url('images/random-images/rotate.php'); 
	color: #FFFFFF;
	font-size: 14px;
	font-family: "American Typewriter", "Traveling_Typewriter", "Typenoksidi", "Courier New", Courier, serif;
	overflow: hidden; 

}

#title {
	left: 0;
	height: 60px;
	width: 620px;
	padding-top: 10px;
}
li.title {
	margin: 0;
	padding-top: 20px;
	list-style: none;
	position: absolute;
	top: 0;
}
 
li.title a {
	height: 60px;
	display: block;
}

li.title a span {
	display: none;
}

#title a {
	left: 0; width: 620px;
	background: url(title.png) 0px 0px no-repeat;
}
 
#title a:hover {
	left: 0; width: 620px;
	background: url(title.png) 0px -60px no-repeat;
}


/* - 1.1 navbar rollover stuff - */

#nav_buttons {
	width: 620px;
	height: 30px;
	margin: 0;
	padding: 0;
	position: relative;
}
 
#nav_buttons li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 0;
}
 
#nav_buttons li, #nav_buttons a {
	height: 30px;
	display: block;
}

#nav_buttons li a span {
	display: none;
}

/*first button*/
#bio  {
	left: 0; width: 100px;
}
 
#bio a {
	left: 0; width: 100px;
	background: url(menubar.png) 0px 0px no-repeat;
}
 
#bio a:hover {
	left: 0; width: 100px;
	background: url(menubar.png) 0px -30px no-repeat;
}
 
/*second button*/
#blog  {
	left: 100px; width: 100px;
}
 
#blog a {
	left: 100px; width: 100px;
	background: url(menubar.png) -100px 0px no-repeat;
}
 
#blog a:hover {
	left: 100px; width: 100px;
	background: url(menubar.png) -100px -30px no-repeat;
}
 
/*third button*/
#verbal  {
	left: 200px; width: 100px;
}
 
#verbal a {
	left: 200px; width: 100px;
background: url(menubar.png) -200px 0px no-repeat;
}
 
#verbal a:hover {
	left: 200px; width: -100px;
background: url(menubar.png) -200px -30px no-repeat;
}
 
/*fourth button*/
#visual  {
left: 300px; width: 100px;
}
 
#visual a {left: 300px; width: 100px;
background: url(menubar.png) -300px 0px no-repeat;
}
 
#visual a:hover {left: 300px; width: 100px;
background: url(menubar.png) -300px -30px no-repeat;
}

/*fifth button*/
#mail  {
left: 400px; width: 100px;
}
 
#mail a {left: 400px; width: 100px;
background: url(menubar.png) -400px 0px no-repeat;
}
 
#mail a:hover {left: 400px; width: 100px;
background: url(menubar.png) -400px -30px no-repeat;
}

/*sixth button*/
#misc  {
left: 500px; width: 100px;
}
 
#misc a {left: 500px; width: 100px;
background: url(menubar.png) -500px 0px no-repeat;
}
 
#misc a:hover {left: 500px; width: 100px;
background: url(menubar.png) -500px -30px no-repeat;
}
/* - 2. main layout - */

#wrapper {
	height: auto; 
	margin-left: auto;
	margin-right: auto;
	position:relative;
	width: 800px;
}

#header {
	height: 125px;
	width: 800px;
	border-bottom: solid 1px #FFFFFF;
/* changed border properties to shorthand CSS */
	position:relative;
	padding-left: 15px;
	padding-top: 15px;
}
#columns {
	height: 440px;
	width: 750px;
	margin-top: 15px;
	margin-left: auto;
	margin-right: auto;
	border-top-width: 0px;
	border-top-style: dashed;
	border-top-color: transparent;
	border-bottom-width: 0px;
	border-bottom-style: dashed;
	border-bottom-color: transparent;
}

.fullcol {
	background-color: #000000;
	margin-left: auto;
	margin-right: auto;
	width: 650px;
	height: 370px;

  border:1px solid black;
  /* for IE */
  filter:alpha(opacity=60);
  /* CSS3 standard */
  opacity:0.6;

	margin-top: 20px;
	padding: 10px 25px 25px 35px;
}

#leftcol {
	background-color: #000000;
	float: left;
	width: 300px;
	height: 360px;

  border:1px solid black;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;

	margin-top: 20px;
	overflow: auto;
	padding: 10px 25px 25px 35px;
}
#leftcol img{
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	margin-bottom: auto;


}

#rightcol {
	background-color: #000000;
	border:1px solid black;
	float: right;
	
  border:1px solid black;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;

	width: 300px;
	height: 360px;
	margin-top: 20px;
	overflow: hidden;
	padding: 10px 25px 25px 35px;
}
#rightcol img{
	border: ;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	margin-bottom: auto;
	
}

#section {
	background-color: #FFFFFF;
	height: 50px;
	width: 785px; 
	float: left;
	margin-top: 25px;
	background-image: url('poo-owl.jpg'); 
	background-position: right top;
	background-repeat: no-repeat;
	border-top-width: 2px;
	border-top-style: solid; 
	border-top-color: #ff0000;
	border-bottom-width: 1px;
	border-bottom-style: dashed; 
	border-bottom-color: #FFFFFF;
	padding-left: 15px;
}

#footer {
	left: 0px;
	height: 20px;
	width: 800px;
}

.footer {
	left: 665px;
	margin: 0px;
	list-style: none;
	position: absolute;
	top: 567px;
}
 
.footer a {
	height: 20px;
	display: block;
}

.footer a span {
	display: none;
}

#footer a {
	left: 0; width: 100px;
	background: url(photocredits.png) 0px 0px no-repeat;
}
 
#footer a:hover {
	left: 0; width: 100px;
	background: url(photocredits.png) 0px -20px no-repeat;
}

/* - 2.1 image layout - */

.portfolio-w {
	display: inline;
	float:left;
	list-style: none;
	width: 600px;
}
.portfolio-n {
	width: 300px;
}
.pixtable img{
	padding: 15px 20px 15px 0px;
	border: 1px;
	
}
.pixtable li {
	border: 0px;
	display: inline;
	float:left;
	list-style: none;
	margin-left: -10px;}

/* - 3. image and link styles - */

a:link {
	text-decoration: underline;
	color: #FFFFFF;
}
a:visited {
	text-decoration: underline;
	color: #FFFFFF;
}
a:hover {
	color: #000000;
	background-color: #FFFF00;
	text-decoration: none;
}
a:active {
	text-decoration: none;
	color: #FFFFFF;
}

/* - 4. fonts - */


.slug {
	font-weight: bold;
	font-size: large;
}

.teeny {
	font-size: smaller;
}