body {
 font: 0.9em "Trebuchet MS", "Arial", sans-serif;
 color: rgb(205,205,190);
 }

h1 {
 text-align: left;
 display: block;
 color: rgb(220,220,212);
 margin: 10px 0px 3px 0px;
 font-size: 2.5em;
 line-height: 0.65em;
 font-weight: normal;
 height: 40px;
 padding: 30px 0px 10px 60px;
 border: none;
 }


#photography h1:first-letter {
 text-transform: uppercase;
 }

#home h1 {
 background: url(images2/home_head.jpg) left center no-repeat;
 }

#blog h1 {
 background: url(images2/blog_head.jpg) left center no-repeat;
 }

#design h1 {
 background: url(images2/design_head.jpg) left center no-repeat;
 }

#photography h1 {
 background: url(images2/photography_head.jpg) left center no-repeat;
 }

#about h1 {
 background: url(images2/about_head.jpg) left center no-repeat;
 }
 
#tutorials h1 {
 background: url(images2/tutorials_head.jpg) left center no-repeat;
 }

#music h1 {
 background: url(images2/music_head.jpg) left center no-repeat;
 }

h1.blog {
 margin-bottom: 7px;
 }

h2 {
 text-align: left;
 color: rgb(220,220,212);
 font-size: 1.9em;
 font-weight: bold;
 margin: 0px;
 margin-top: 3px;
 }


h3.blog {
 margin: 3px 0px 0px 0px;
 font-size: 0.8em;
 color: rgb(150,150,80);
 }

h3 {
 text-align: left;
 color: rgb(220,220,212);
 font-size: 1.35em;
 font-weight: bold;
 margin: 0px;
 margin-top: 30px;
 }


h4 {
 font-size: 1.2em;
 font-weight: normal;
 margin: 6px 0px 2px 0px;
 text-align: left;
}

form h3 {
 margin-top: 16px;
}

.portfolio h5 {
 margin: 0px 0px 15px 0px;
 font-size: 0.8em;
 color: rgb(150,150,200);
 }

h5 {
 font-size: 1em;
 margin: 5px 0px 2px 0px;
 text-align: left;
}

h6 {
 font-size: 1em;
 margin: 5px 0px 2px 0px;
 text-align: left;
}

h5.list {
 margin: 0px;
margin-left: 20px;
padding: 0px;
}
 
/* Images */

img {
 border: 1px solid rgb(200,200,200);
 }

img.noborder {
 border: none;
 }

#tutorials img {
 margin-bottom: 10px;
 }

/* Tables */

#tutorials table {
 border: 1px solid rgb(200,200,200);
 margin: 0px auto 20px auto;
 }
 
#tutorials table td {
 border: 1px solid rgb(200,200,200);
 }

/* Paragraphs */

p {
 text-align: left;
 margin: 2px 0px 18px 0px;
 line-height: 1.20em;
 }

p.none {
 margin: 0px;
 }

.show {
 display: none;
 }

.element p {
 text-align: justify;
 }
 
.element li {
 text-align: justify;
 }
 
p.margin-top {
 margin-top: 10px;
 }

p.back {
 font-weight: bold;
 }

.red {
 color: rgb(250,50,50);
}

p.code {
 font: 0.9em "Courier New", "Courier", serif;
 color: rgb(250,180,180);
 margin-left: 30px;
 }

p.cloud {
 text-align: center;
 width: 50%;
 }

p.intro {
	font-style: italic;
}

.italic {
 font-style: italic;
}

#footer ul, #footer p {
 font-size: 0.9em;
 }

#ground_content p {
 text-align: center;
 }

/* Links */

a:link { color: rgb(190,180,120); text-decoration: underline;}
a:visited { color: rgb(170,165,120); text-decoration: underline;}
a:hover { color: rgb(230,220,180); text-decoration: none;}
a:active { color: rgb(250,240,200); text-decoration: none;}

#footer a:link { text-decoration: none;}
#footer a:visited {text-decoration: none;}
#footer a:hover {text-decoration: underline;}
#footer a:active {text-decoration: underline;}


/* Lists */
ul {
 text-align: left;
 list-style-type: square;
 }

ol {
 text-align: left;
 }

ul.news {
 padding: 0px;
 margin: 15px 0px 0px 30px;
 list-style-type: none;
 }

.element ul.news {
 margin: 0px;
 list-style-type: none;
 color: rgb(205,205,190);
 }

ul.news li {
 padding: 10px 0px;
 margin: 0px;
 clear: left;
 }

ul.news span {
 display: block;
 }

ul.news .date {
 position: relative;
 float: left;
 font-style: normal;
 width: 65px;
 height: 72px;
 margin: 0px 5px 0px 0px;
 background: url(images2/news.jpg) center center no-repeat;
 }

ul.news .day {
 position: absolute;
 font-size: 23px;
 left: -1px;
 top: 31px;
 width: 100%;
 text-align: center;
 color: black;
 }
 
ul.news .m_y {
 position: absolute;
 font-size: 15px;
 top: 12px;
 width: 100%;
 text-align: center;
 font-weight: bold;
 margin: 0px auto;
 color: white;
 }

h3.nav_head {
 position: relative;
 display: block;
 padding: 20px 0px 5px 40px;
 margin: 0px;
 height: 40px;
 }

h3#nav_design {
 background: url(images2/design_mini.jpg) left center no-repeat;
 }

h3#nav_photo {
 background: url(images2/photography_mini.jpg) left center no-repeat;
 }

h3#nav_music {
 background: url(images2/music_mini.jpg) left center no-repeat;
 }

h3#nav_about {
 background: url(images2/about_mini.jpg) left center no-repeat;
 }

h3#nav_tutorials {
 background: url(images2/tutorials_mini.jpg) left center no-repeat;
 }

h3#nav_blog {
 background: url(images2/blog_mini.jpg) left center no-repeat;
 }

h3#nav_home {
 background: url(images2/home_mini.jpg) left center no-repeat;
 }

ul.navig {
 margin: -6px 0px 0px 16px;
 text-align: left;
 padding: 0px;
 list-style-type: none;
 }

ul.navig li {
 margin: 0px;
 padding: 0px 0px 2px 22px;
 }


ul#navig_photo li {
 background: url(images2/photography_list.jpg) left center no-repeat;
 }

ul#navig_home li {
 background: url(images2/home_list.jpg) left center no-repeat;
 }

ul#navig_design li {
 background: url(images2/design_list.jpg) left center no-repeat;
 }

ul#navig_music li {
 background: url(images2/music_list.jpg) left center no-repeat;
 }

ul#navig_blog li {
 background: url(images2/blog_list.jpg) left center no-repeat;
 }

ul#navig_tutorials li {
 background: url(images2/tutorials_list.jpg) left 3px no-repeat;
 }

ul#navig_about li {
 background: url(images2/about_list.jpg) left center no-repeat;
 }

ul#link_list {
 margin: -5px 0px 5px 25px;
 padding: 0px;
 list-style-type: none;
 }

ul#link_list li {
 background: url(images2/nav_list.jpg) left top no-repeat;
 padding: 2px 0px 4px 25px;
 margin: 0px;
 }

ul.navig ul {
 list-style-type: circle;
 margin: 5px 0px 5px 40px;
 }

ul.navig ul ul {
 list-style-type: square;
 }

ul#navig_tutorials li li {
 background: none;
 padding: 0px;
 }

ol.padded li {
 padding: 5px 0px;
 }

/* Tutorial stuff */

div.code, div.css_code {
 width: 75%;
 max-height: 150px;
 overflow: auto;
 padding: 10px;
 background: rgb(245,245,245);
 border: 1px solid rgb(210,210,210);
 margin: 0px auto 15px auto;
 }

.code p, .css_code p {
 margin: 2px auto;
 font: 0.9em "Courier New", "Courier", serif;
 }

.css_code p {
 color: rgb(150,0,0);
 }


li span.css_code {
 display: block;
 width: 435px;
 max-height: 200px;
 background: rgb(245,245,245);
 overflow: auto;
 border: 1px solid rgb(210,210,210);
 margin: 10px auto 10px auto;
 padding: 10px;
 font-weight: normal;
 color: rgb(150,0,0);
 font: 1em "Courier New", "Courier", serif;
 }

.code h4, .css_code h4 {
 margin-top: 0px;
 margin-bottom: 8px;
 color: rgb(100,100,100);
 }

.code p {
 color: rgb(0,120,0);
 }
 
.php {
 color: rgb(0,0,240);
 }

.php p {
 color: rgb(0,0,240);
 }
 
.head_fake {
 margin: 0px 0px 8px 0px;
 text-align: left;
 font-weight: bold;
 display: block;
 color: rgb(100,100,100);
 font: 1.2em "Trebuchet MS", "Arial", sans-serif;
 }

span.code, span.css_code {
 color: rgb(250,180,180);
 font-weight: bold;
 }

#rollover_test {
 height: 110px;
 width: 129px;
 border: 1px solid white;
 margin: 0px auto 10px auto;
 }

#rollover_test a .text {
 display: none;
 }

#rollover_test a {
 display: block;
 position: relative;
 height: 100%;
 width: 100%;
 cursor: pointer;
 text-align: center;
 }

#rollover_test .image {
 display: block;
 position: relative;
 width: 100%;
 height: 100%;
 background: url(images2/tutorials_but.jpg) left top no-repeat;
 }

#rollover_test a:hover .image {
 background-position: left -110px;
 }

.block {
	position: relative;
	width: 80px;
	height: 80px;
	background: url(images2/block_l.jpg) center center no-repeat;
	margin: 0px auto;
}

.float_l_block {
	position: relative;
	width: 80px;
	height: 80px;
	background: url(images2/block_l.jpg) center center no-repeat;
	margin: 0px 10px 10px 0px;
	float: left;
}

.float_r_block {
	position: relative;
	width: 80px;
	height: 80px;
	background: url(images2/block_r.jpg) center center no-repeat;
	margin: 0px 0px 10px 10px;
	float: right;
}

.clear_left {
 clear: left;
 }

p.dummy {
 font-style: italic;
 color: rgb(180,180,180);
 }
 
 div.example {
 margin: 10px 40px 10px 40px;
 border: 1px solid rgb(30,30,30);
 padding: 20px;
 }

/* Positioning */

.right {
 text-align: right;
 }
 
.float_left {
 float: left;
 }

p.welcome .float_left {
 display: block;
 }

.float_right {
 float: right;
 }

/* Images */
a img {
 border-width: 4px;
 }

/* Page specific divs */

#comment {
 padding: 10px 0px;
 background: url(images2/tutorials_ruler.jpg) left top no-repeat;
 }

.what {
 font-weight: bold;
 color: rgb(180,220,180);
 }

.blog p {
 text-align: justify;
 }

.pullright {
 position: relative;
 float: right;
 margin-top: 37px;
 width: 180px;
 height: auto;
 font-size: 1.4em;
 line-height: 1.05em;
 padding: 0px 0px 2px 20px;
 }

.pullleft {
 position: relative;
 float: left;
 width: 180px;
 height: auto;
 margin: 0px;
 margin-top: 10px;
 font-size: 1.4em;
 padding: 0px 20px 3px 0px;
 }

.pullleft p {
 text-align: right;
 color: rgb(180,180,160);
 margin: 0px;
 }

.pullright p {
 text-align: left;
 padding: 0px;
 color: rgb(170,170,150);
 margin: 0px;
 }

.blog_mark {
 position: relative;
 float: left;
 top: 10px;
 height: 72px;
 margin: 0px 8px 0px 0px;
 width: 80px;
 color: rgb(210,210,210);
 text-align: center;
 background: url(images2/blog_mark.jpg) right top no-repeat;
 }

.element .blog_mark {
 top: 0px;
 margin: 2px 8px 0px 0px;
 }

.container {
 position: relative;
 top: 10px;
 }

#blog_content h3 {
 margin-top: 5px;
 margin-bottom: 7px;
 }

.blog_mark .day {
 display: block;
 width: 70%;
 position: relative;
 top: 4px;
 left: -5px;
 text-align: center;
 margin: 0px auto;
 padding-left: 0px;
 font-size: 28px;
 font-weight: normal;
 }

.blog_mark .m_y {
 display: block;
 position: relative;
 color: rgb(150,150,150);
 padding-top: 7px;
 left: -4px;
 width: 100%;
 margin: 0px auto;
 text-align: center;
 font-size: 13px;
 font-weight: bold;
 }

div.blog {
 padding: 0px;
}

.ruler {
 width: 100%;
 clear: both;
 margin: 15px 0px;
 height: 8px;
 }

#music .ruler {
 background: url(images2/music_ruler.jpg) center top no-repeat;
 }

#me {
 width: 100px;
 height: 122px;
 position: relative;
 margin: 0px;
 padding-right: 10px;
 background: url(images2/me.jpg) left top no-repeat;
 }

#blog_pictures {
 text-align: left;
 margin: 5px 0px 10px 0px;
 }
 
.clear {
 clear: both;
 }

.clear_two {
 clear: both;
 }

.space {
 position: relative;
 margin: 0px auto;
 width: 100%;
 height: 20px;
 }

.portfolio {
 clear: both;
 padding: 0px;
}

.portfolio p {
 margin-bottom: 30px;
}

#portfolio_body .clear {
 border-bottom: 1px dotted rgb(210,210,210);
 height: 2px;
}

.portfolio .image {
 float: left;
 position: relative;
 top: 5px;
 padding: 0px 10px 3px 0px;
 margin-bottom: 30px;
}

#music .portfolio p {
 margin-bottom: 20px;
 }
 
#music .portfolio .text {
 float: right;
 width: 430px;
 }
 
.portfolio .image p {
 margin: 0px;
 }


.portfolio .text {
 float: right;
 width: 400px;
 }
 
.page {
 text-align: left;
 width: 100%;
 margin: 20px 0px;
 padding: 10px 0px;
 }

.page .noselect {
 padding: 4px 7px;
 margin: 0px 5px;
 border: 1px solid rgb(40,40,40);
 color: rgb(80,80,80);
 font-weight: bold;
 }
 
.page a:link { text-decoration: none;}
.page a:visited { text-decoration: none;}
 
.page a .select {
 padding: 4px 7px;
 margin: 0px 5px;
 border: 1px solid rgb(60,60,60);
 color: rgb(150,150,150);
 background: rgb(50,50,50);
 font-weight: bold;
 }
 
.page a:hover .select {
 background: rgb(209,109,59);
 color: rgb(19,19,19);
 }

#music .page a:hover .select {
 background: rgb(18,151,158);
 }

ul#navigation {
 margin: 0px 60px;
 padding: 0px;
}

.linksy {
 padding: 10px 0px;
 }

p.links {
 margin: 0px;
 margin-bottom: 2px;
 }
 
h1.link {
 position: relative;
 top: 8px;
 margin-top: 28px;
 margin-bottom: 0px;
 }

.linksy h3 {
 margin: 0px;
 font-size: 1.2em;
 padding: 0px;
 }

/* Font sizes */

.f_small {
 font-size: 13px;
}

.f_medium {
 font-size: 19px;
}

.f_large {
 font-size: 24px;
}


.element p.cloud {
 width: 100%;
 margin: 0px auto 15px auto;
  }
 
/* Comments */

#comments_area {
 padding: 10px 0px;
 clear: both;
 background: url(images2/blog_ruler.jpg) top left no-repeat;
 }

.comment {
 margin: 10px auto;
 }
 
.comment h5 {
 margin-top: 2px;
 font-size: 0.8em;
  color: rgb(170,170,200);
 } 
 
.comment .picture {
 border: 1px solid rgb(100,100,100);
 height: 67px;
 width: 60px;
 float: left;
 margin: 0px 10px 0px 0px;
 }

.comment #male {
 background: url(images2/male.jpg) left top no-repeat;
 }

.comment #female {
 background: url(images2/female.jpg) left top no-repeat;
 }

.comment .text {
 width: 490px;
 float: right;
 }

.comment .message {
 padding: 10px 40px 1px 0px;
 background: url(images2/quote_off.jpg) bottom right no-repeat;
 }


.comment .quote_on {
 display: block;
 position: relative;
 top: -10px;
 height: 30px;
 float: left;
 width: 40px;
 padding-right: 10px;
 background: url(images2/quote_on.jpg) top left no-repeat;
 }
 
#chat {
 margin: 15px auto;
 }
 
/* Forms */

.radio {
 float: left;
 margin-bottom: 10px;
 }

#post_form input {
 margin-bottom: 10px;
 }

#comment_form {
 margin-top: 15px;
 background: url(images2/blog_ruler.jpg) top left no-repeat;
 }

#comment_form .red {
 color: rgb(250,180,180);
 }

#comment_form h2 {
 margin: 0px 0px 15px 0px;
 padding-top: 10px;
 }
 
form {
 text-align: left;
}

fieldset {
 border: none;
 }

#design fieldset {
 border: 1px dashed rgb(131,130,19);
 padding: 5px 10px 30px 15px;
 }

#design form p {
 margin-bottom: 5px;
}

.margin_left, #design select, #design input, #design textarea {
 margin-left: 40px;
}

.margin_left input {
 margin: 0px;
}

form #box {
 padding: 7px 0px;
 width: 200px;
 float: left;
 }

form .mess {
 padding: 10px 0px;
 clear: both;
 }

.inp {
 padding: 10px 0px;
 }

.inp input {
 width: 100%;
 }

form .send {
 padding: 10px 0px;
 }

.mess textarea {
 width: 100%;
 }
 
#recaptcha {
 width: 320px;
 float: right;
 }

#wiki_search {
 margin: 15px auto 30px 50px;
 }

/* Essential albums stuff */

.album_head {
 width: 25%;
 margin: 0px 10px;
 float: left;
 }

.album_head h3 {
 margin-top: 0px;
 }
 
#artist {
 width: 38%;
 }
 
.album_head ul {
 padding: 0px 0px 0px 13px;
 margin: 10px 0px;
 }

.artwork {
 float: left;
 padding: 0px 20px 10px 0px;
 }

.album_info {
 float: left;
 }

.review {
 margin: 20px 0px;
 padding: 0px 10px;
 }

.review .ruler {
 margin-top: 25px;
 }

.review h4 {
 margin-top: 6px;
 }
 
.album_info h3 {
 height: 25px;
 padding-left: 30px;
 margin: 10px 0px;
 background: url(images2/guitar.jpg) left center no-repeat;
 text-align: left;
}

.album_info h4 {
 height: 25px;
 padding-left: 30px;
 margin: 10px 0px;
 background: url(images2/cd.jpg) left center no-repeat;
 text-align: left;
 }

.album_info h5 {
 height: 25px;
 padding-left: 30px;
 margin: 10px 0px;
 text-align: left;
 background: url(images2/note.jpg) left center no-repeat;
 }

.tracks {
 padding: 5px 0px;
 }

.tracks ul {
 border: 1px solid rgb(40,40,40);
 margin: 0px;
 padding: 0px;
 list-style-type: none;
 }

.tracks li {
 padding: 3px 0px 3px 10px;
 }

.tracks li.one {
 background: rgb(33,33,33);
 }

.tracks li.two {
 background: rgb(27,27,27);
 }

.tracks li span {
 text-align: right;
 margin: 0px auto;
 padding-left: 5px;
 font-style: italic;
 }
 

/* Photograph */

.photo {
 display: block;
 margin-top: 5px;
 width: 150px;
 height: 173px;
 text-align: center;
 float: left;
 padding: 10px 16px;
 }

.photo img {
 z-index: 10;
 position: relative;
 top: 6px;
 margin: 0px auto;
 z-index: 20;
 border: 1px solid rgb(50,50,50);
 }

.photo span {
 display: block;
 text-align: center;
 font-size: 0.73em;
 font-weight: bold;
 margin: 10px auto;
 }

#gallery a:link { color: rgb(110,110,110); text-decoration: none;}
#gallery a:visited { color: rgb(110,110,110); text-decoration: none;}
#gallery a:hover { color: rgb(190,190,190); text-decoration: none;}
#gallery a:active { color: rgb(190,190,190); text-decoration: none;}

.photo a {
 display: block;
 border: 2px solid rgb(36,36,36);
 padding: 6px 3px 3px 3px;
 text-align: center;
 }

.photo a:hover {
 border: 2px solid rgb(140,140,140);
 }
 
.photo a.on {
 border: 2px solid rgb(200,200,200);
 }

#gallery a.on span {
 color: rgb(200,200,200);
 }

#gallery a img {
 border: none;
 }

#gallery {
 clear: both;
 padding: 0px;
 margin-bottom: 10px;
 background: url(images2/photography_ruler.jpg) top left no-repeat;
 }

#gallery_content {
 padding: 20px 0px 30px 0px;
 background: url(images2/photography_ruler.jpg) bottom left no-repeat;
 }

#gallery_content h2 {
 margin-bottom: 10px;
 }

#gallery_content h2:first-letter {
 text-transform: uppercase;
 }

#main_photo {
 margin: 20px auto 40px auto;
 }

#main_photo img {
padding: 5px;
background: rgb(40,40,40);
 border: 1px solid rgb(100,100,100);
 }

#photo_text {
 position: relative;
 top: 30px;
 }

#photo_text p {
 text-align: center;
 font-weight: bold;
 font-size: 0.8em;
 margin: 0px auto;
 }

#arrow_left {
 position: relative;
 width: 35px;
 height: 49px;
 float: left;
 margin: 0px 0px 30px 82px;
 }

#arrow_left .text {
 display: none;
 }
 
#arrow_left a {
 display: block;
 width: 100%;
 height: 100%;
 }

#arrow_left .image {
 display: block;
 height: 100%;
 width: 100%;
 background: url(photography/images2/arrow_left.jpg) center top no-repeat;
 }

#arrow_left a:hover .image {
 background: url(photography/images2/arrow_left.jpg) center -49px no-repeat;
 }

#arrow_right {
 position: relative;
 width: 35px;
 height: 49px;
 float: right;
 margin: 0px 82px 30px 0px;
 }

#arrow_right .text {
 display: none;
 }
 
#arrow_right a {
 display: block;
 width: 100%;
 height: 100%;
 }

#arrow_right .image {
 display: block;
 height: 100%;
 width: 100%;
 background: url(photography/images2/arrow_right.jpg) center top no-repeat;
 }

#arrow_right a:hover .image {
 background: url(photography/images2/arrow_right.jpg) center -49px no-repeat;
 }
 
