/*global reset*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend
/*table, caption, tbody, tfoot, thead, tr, th, td ------------- greyed out due to problem with contact form error messages*/{
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline}

/*used to eliminate IE page shift*/
html{overflow-y: scroll}

html, body{height: 100%} 

body{
background:  #000 url('./images/background.jpg') repeat-y top center;
font: 1em/1.3em Verdana, Tahoma, Geneva, sans-serif;
color:       #fff}

#wrapper{ 
position: relative; 
margin:   0 auto; 
width:    960px}

#site_header{ 
position: relative; 
width:    960px; 
height:   140px}

#top_links{
float:     right; 
font-size: 12px}

#top_links li{
display:         inline; 
text-decoration: none}

a#accessCurrent{color: #cf0}

#logo{float: left}

#logo h1{
float: left;
width: 400px}

#logo h1 a{
width:      400px;
height:     100px;
display:    block;
background: url('./images/logo.png') no-repeat 0 0}

#logo h1 a:hover{background-position: 0 -100px}

#logo h1 a span{display: none}

h2{
position:    relative;
text-indent: -9000px}

a.hide{
position: absolute;
left:     -9000px;
top:      0}

a.hide:focus, a.hide:active{left: 0} 

#main, .home_about, .home_secret, .photos_bg,div.blog_bg, #blogsidebar, img.blog_img, .tooltip:hover span, .worktooltip:hover span, .joke_column_first, .joke_column_second, .joke_column_third, .links_column_first, .links_column_second, .links_column_third, .converterbox, #useful_sidebar, #useful_info_box, #galleria_background{
-moz-box-shadow:    rgba(0,0,0,0.50) 20px 20px 50px 5px;
-webkit-box-shadow: rgba(0,0,0,0.50) 20px 20px 50px;
box-shadow:         rgba(0,0,0,0.50) 20px 20px 50px 5px;
-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

#main{
position:   relative; 
width:      920px;
background: url('./images/mainBg.png') repeat 0 0;
padding:    10px 20px 30px;
text-align: left;
min-height: 100%;
height:     auto !important;
height:     100%}

h3{
margin-bottom: 20px;
font-family:   Georgia, "Times New Roman", serif;
color:         #a8b934;
font-size:     1.4em;
font-weight:   bold;
line-height:   1.1em}

.home_about, .home_secret{
position:      relative; /*added position relative so i could use absolute positioning on button */
float:         left;
background:    url('./images/green_bg.png') no-repeat 0 0; 
width:         440px; 
height:        22.25em;
margin-bottom: 30px}

.home_secret{
float:        right; 
margin-right: 2px}
	
h4#about, h4#blog{
background:  url('./images/about.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 34px; 
width:       300px;
margin:      10px 0 0 50px}

h4#blog{
background: url('./images/blog.png') no-repeat 0 0; 
margin-top: 30px}

h4#secret{
background:  url('./images/secret.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 50px; 
width:       300px;
margin:      10px 0 0 50px}

.continue_reading{color: #999}

.body_text{
position:    relative; 
background:  url('./images/text_background.png') no-repeat 0 0; 
padding:     20px 10px;
margin:      20px 0 10px;

-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

p{padding: 5px}

#testimonial{
color: #eaf4a9;
margin: 20px 0 -10px 0}

#galleria_background{
background:    url('./images/galleria_background.png') no-repeat 0 0; 
width:         920px; 
height:        510px;
margin-bottom: 50px}

#galleria{
width:  850px;
margin: 20px auto}

blockquote{margin: 30px; 0}

.bqstart{
float:         left;
height:        45px;
margin-left:   -40px;
margin-right:  30px;
margin-top:    -60px;
padding-top:   45px;
margin-bottom: 10px;     
color:         #a8b934;
font:          italic 700% serif}

.bqend{
float:        right;
height:       25px;
margin-top:   -40px;     
margin-right: 50px;     
color:        #a8b934;
font:         italic 700% serif}

.five_list_info{
position: relative;
float:        left;
background:   url('./images/five_list_info.png') no-repeat 0 0; 
width:        280px; 
height:       297px;
margin-right: 40px}

.alternate{ color:#999} 

h4#listen{
background:  url('./images/listen.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 23px; 
width:       189px;
margin:      20px 0 10px 45px}

h4#movies{
background:  url('./images/movies.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 23px; 
width:       240px;
margin:      20px 0 10px 20px}

h4#sites{
background:  url('./images/sites.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 24px; 
width:       156px;
margin:      20px 0 10px 55px}

.info_list{list-style-type: none}
	
.info_list li{	
padding-left: 14px;
padding-right: 5px;
line-height:  2em; 
font-size:    16px}

.list_image{
float:         right; 
padding-top:   6px; 
padding-right: 10px;
cursor:        help}

/*#badge{ <!--currently removed-->
position: absolute; 
bottom:   -60px; 
right:    -20px}*/

p.move_over{
padding:    15px; 
margin-top: 20px} /*needed to move paragraph over so inline with body_text on about page*/

a#meabout{
position:        relative; 
float:           right; 	
display:         block;
width:           450px;
height:          401px;	
background:      url('./images/me_about.png') no-repeat 0 0;	
text-decoration: none;
z-index:         99;	
cursor:          default}

a#meabout:hover{background-position: 0 -401px}

h5{
font-family:  Georgia, "Times New Roman", serif;	
color:        #ccf;
font-size:    1.2em;
font-weight:  bold;
padding-left: 5px}

.bullet{
position:   relative;
list-style: none;
margin:     10px 0}

.bullet li{ 
background:     url('./images/bullet.png') no-repeat 0 40%; 
padding-left:   30px;
padding-bottom: 5px}

ol.toppers{ 
margin-left: 30px; 
color:       #99cc33} 

ol.toppers li{list-style: decimal}

ol.toppers span{color: #fff}

#breadcrumb{
position:     absolute;
top:          -2.9em; 
right:        0;
font-size:    12px; 
font-variant: small-caps;
color:        #999}

.trigger{ /*collapsible divs*/
float:         left;
width:         880px;
height:        30px;
background:    url('./images/toggle_bg.png') repeat 0 0; 
margin-bottom: 7px; 
padding:       7px 20px 3px;
font:          italic 1.1em arial, Helvetica, sans-serif}

.trigger a{	
text-decoration: none;
display:         block;
padding-left:    50px}

a.trigger_link:link    {color: #fff}
a.trigger_link:visited {color: #0f0}
a.trigger_link:hover   {color: #cf0}
a.trigger_link:active  {color: #f33}

.togdown {background-position: left bottom} 

.toggle_container{
width:   880px;
margin:  0 auto;
padding: 20px 0;
clear:   both;
display: none}/*added to stop quick flash of content on page entry.......this stops the content being shown when javascript disabled however*/


/************** photos section *******************/
.photos_bg{
position:      relative; /*added position relative so i could use absolute positioning on button */
float:         left;
background:    url('./images/green_bg.png') no-repeat 0 0; 
width:         440px; 
height:        21.25em;  
margin-bottom: 40px}

.float_right{float: right}

h4#family, h4#punks, h4#friends_uk, h4#friendsabroad, h4#fountain, h4#places{
background:  url('./images/family.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 34px; 
width:       300px;
margin:      10px 0 0 50px}

h4#punks{background: url('./images/punks.png') no-repeat 0 0}

h4#friends_uk{background: url('./images/friendsuk.png') no-repeat 0 0}

h4#friendsabroad{background: url('./images/friendsabroad.png') no-repeat 0 0}

h4#fountain{background: url('./images/fountain.png') no-repeat 0 0}

h4#places{background: url('./images/places.png') no-repeat 0 0}

.dots{
margin:  20px auto; 
padding: 5px;
width:   390px; 
height:  18em;
border:  2px dotted #330}

.photos_pics{
float:       right;
margin-left: 5px}

#toyoutube{ 
position:    absolute;
bottom:      -80px; 
right:        0;
background:  url('./images/toyoutube.png') no-repeat 0 0;
width:       170px; 
height:      156px; 
display:     block;
text-indent: -9999px}

#toyoutube:hover {background-position: 0 -156px}



/************** blog section *******************/
div.blog_bg{
position:      relative;
float:         left;
background:    url('./images/blog_bg.png') no-repeat 0 0;
width:         600px;
padding:       20px;	
margin-bottom: 30px;
color:         #aba6a3}
	
#blogsidebar{
background: url('./images/blog_sidebar.png') no-repeat 0 0;
float:      right;
width:      200px;
padding:    10px;
height:     600px}

h4#archives{
background:  url('./images/archives.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 34px; 
width:       120px;
margin:      20px 0 0 45px}

.date{
float:      left; 
background: url('./images/calendar.png') no-repeat 0 0; 
height:     64px; 
width:      63px; 
margin:     0 10px 10px 0}
	
.date p{
font-family:    "Trebuchet MS", Arial, sans-serif;
text-align:     center;
text-transform: uppercase;
color:          #666;
padding:        0}

.year{
display:     block;
font-size:   15px;
height:      16px;
text-shadow: 2px 2px 2px #000;
color:       #fff}

.month{
display:     block;
font-size:   15px;
height:      16px;
padding-top: 6px}

.day{
display:   block;
font-size: 18px}

.blogheader{
position:    relative;	
background:  url('./images/dark_bg.png') repeat 0 0; 
height:      1.7em; 
padding:     5px;
margin:      0 10px 20px 90px;

-moz-border-radius:    12px;
-khtml-border-radius:  12px;
-webkit-border-radius: 12px;
border-radius:         12px}

img.blog_img{	
float:  right;
margin: 0 0 5px 5px;
border: 3px solid #151414}



/************** stuff section *******************/	 
ul#stuff {
list-style: none;
background: url('./images/stuff_bg.png') no-repeat 0 0;
position:   relative;
width:      700px;
height:     623px;
margin:     0 auto}	
	
ul#stuff li{ position: absolute}
	
ul#stuff li a{ 
display:     block;  
height:      100%; 
text-indent: -9000px} 
	
#music{ 
width:  320px;  
height: 70px;
top:    100px;
left:   145px} 

#fun{ 
width:  210px;  
height: 45px;
top:    178px;
left:   295px} 

#useful{ 
width:  370px;  
height: 75px;
top:    238px;
left:   210px} 

#links{ 
width:  275px;  
height: 66px;
top:    324px;
left:   170px} 


/************** music section *******************/
#player-holder{	
float:  left;	
margin: 2.5em 3.13em 2.5em 0;

-moz-box-shadow:    rgba(0,0,0,0.50) 20px 20px 50px 5px;
-webkit-box-shadow: rgba(0,0,0,0.50) 20px 20px 50px;
box-shadow:         rgba(0,0,0,0.50) 20px 20px 50px 5px}

ul#musiclist{
float:           left;
width:           31.25em;
list-style-type: none;
margin:          40px 0 0 50px;
font-size:       16px}

ul#musiclist li{
background: url('./images/bullet.png') no-repeat 0 40%; 
padding-left:   30px;
padding-bottom: 5px}

.list_image2{cursor: help}

.tooltip, .worktooltip{
position: relative;
cursor:   help}

.tooltip span, .worktooltip span{
position:    absolute;
margin-left: -999em}

.tooltip:hover span, .worktooltip:hover span{
position:     absolute; 
width:        400px;	
left:         -14em; 
top:          -5em;
font-family: Calibri, Tahoma, Geneva, sans-serif;
z-index:     99;
margin-left: 0}

tooltip a:hover{background: transparent}

.tooltipstyle{
background: #330; 
border:     2px solid #000; 
color:      #fff;
padding:    5px 5px 5px 10px}

.tooltipstyle img{
float:        left;
margin-right: 10px}

#music_cloud{
position: absolute;
top:      150px;
right:    -80px}

#no_flash{
background-color: #fff;
position:         absolute; 
top:              50px;
right:            120px;
width:            200px;
padding:          5px; 
color:            #c00; 
text-align:       center; 
border:           2px solid #c00;

-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

#music_list_wrapper{margin-top: 50px}


#music_list_wrapper .five_list_info .info_list li{font-size: 14px}

h4#singles, h4#albums, h4#noughties{
height:      0; 
overflow:    hidden; 
padding-top: 50px ; 
font-size:   14px}

h4#singles{
background:  url('./images/singles.png') no-repeat 0 0; 
width:       234px;
margin:      20px 0 0 22px}

h4#albums{
background:  url('./images/albums.png') no-repeat 0 0; 
width:       232px;
margin:      20px 0 0 23px}

h4#noughties{
background:  url('./images/noughties.png') no-repeat 0 0; 
width:       213px;
margin:      20px 0 0 40px}

#brad{	
position: absolute; 
bottom:   -60px; 
left:     80px}

#ruts{
position: absolute; 
bottom:   -60px; 
left:     30px}

#dk{
position: absolute;
bottom:   -50px;
left:     -30px}


/************** fun section *******************/
#funwrapper{
position:   relative;
margin-top: 50px}

#col_one, #col_three{ /*also used on links page*/
float: left;
width: 33%}

#col_two{            /*also used on links page*/
float:          left;
width:          34%; 
*width:         33%; /*IE7 hack*/
padding-bottom: 30px}

.joke_column_first, .joke_column_second, .joke_column_third{
position:    relative;
background:  url('./images/first_third_col_bg.png') no-repeat 0 0; 
width:       90%;
text-align:  center;
padding-top: 10px}

.joke_column_second{background: url('./images/joke_column_second_bg.png') no-repeat 0 0}

.joke_column_first{
margin-left:   10px;
margin-bottom: 30px}

.joke_column_second{margin-left: 15px; margin-bottom:30px}

.joke_column_third{	
margin-left:   20px; 
margin-bottom: 30px}

.dark_alternate, .brown_alternate{
background:  url('./images/dark_bg.png') repeat 0 0;
padding:     8px;
color:       #ccc;
line-height: 26px;

-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

.brown_alternate{
background: url('./images/brown.png') repeat 0 0;
color:      #aba6a3;
margin:     10px 0} 

.fun_content{padding: 20px 10px}

#smasher, #blocks{	
padding:    80px 5px 15px 5px;
background: url('./images/smasher.png') no-repeat 50% 3%}

#blocks{background: url('./images/blocks.png') no-repeat 50% 3%}

a.fun_download{
background:  url('./images/fun_download.png') no-repeat 0 0; 	
width:       131px;
height:      35px;
display:     block;
text-indent: -9999px;
margin:      7px 0 0 70px}
	
a.fun_download:hover{background-position: 0 -35px}

.fun_content .tooltip:hover span{
width: 250px;	
left:  -1.1em; 
top:   -10.50em}

#brain{
margin-top:    30px; 
margin-bottom: 30px}

#bilko{
position:   absolute;
bottom:     -40px; 
left:       -20px;
background: url('./images/bilko.png') no-repeat 0 0; 
width:      100px;
height:     102px}

#sid{
position:   absolute;
bottom:     -40px; 
left:       40px;
background: url('./images/sid.png') no-repeat 0 0; 
width:      100px;
height:     102px}

#midwife{
position:   absolute;
bottom:     -80px; 
left:       400px;
background: url('./images/midwife.png') no-repeat 0 0; 
width:      170px;
height:     156px}	

#rigsby{
background: url('./images/rigsby.png') no-repeat 0 0; 
position:   absolute;
right:      4.0em; 
top:        7.7em; 
width:      260px;
height:     325px}



/************** links section *******************/
.links_column_first, .links_column_second, .links_column_third{
background:    url('./images/links_first_third_bg.png') no-repeat 0 0; 
width:         90%;
padding:       10px 5px;
margin-bottom: 50px}

.links_column_second{background: url('./images/links_second_bg.png') no-repeat 0 0}

.links_column_first{margin-left: 8px}
.links_column_second{margin-left: 15px}
.links_column_third{margin-left: 20px}	

.links_column_first h5, .links_column_second h5, .links_column_third h5 {text-align: center}

ul.stuff_links{
position:   relative;
margin-top: 20px;
list-style: none}

ul.stuff_links li{padding-left: 15px}

.links_dark, .links_alternate{
background: url('./images/dark_bg.png') repeat 0 0;
font-size:  14px;
border:     1px solid #330;
padding:    5px;
margin:     10px 5px;

-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

.links_alternate{
background: url('./images/links_alternate.png') repeat 0 0;
border:     1px solid #161603}

ul.stuff_links li a:link, ul.stuff_links li	a:visited{
color: #ccc; 
text-decoration: none}

ul.stuff_links li a:hover{color: #cf0}
ul.stuff_links li a:active {color: #f33}

h5.special_fav{
background:  url('./images/spec_fav.png') no-repeat 0 0; 
height:       0; 
overflow:     hidden; 
width:        160px;
padding-top: 42px;
margin:      0 auto;}

a#nes, #terena{
background:      url('./images/nes.png') no-repeat 0 0;	
display:         block;
width:           198px;
text-decoration: none;
margin:          20px auto;
height:          0; 
overflow:        hidden; 
padding-top:     56px}

a#nes:hover{background-position: 0 -56px}

a#terena{
background:   url('./images/terena.png') no-repeat 0 0; 
width:       100px;
margin:      20px auto;
padding-top: 95px}

a#terena:hover{background-position: 0 -95px}
	
.clear_bottom_margin{margin-bottom: 0}

.fav_content{	
font-size: 14px; 
text-align:left;
color:     #f7efe7}



/************** Useful stuff section *******************/
.converterbox{
position:   relative;
float:      left;
background: url('./images/converters_green_bg.png') no-repeat 0 0;
width:      300px;
margin:     80px 0 0 130px; 
padding:    15px}

.converterbox fieldset{
border:  2px dotted #330; 
padding: 5px 5px 10px}

#converter_heading{
font-variant: small-caps; 
text-align:   center}

#converter_title{
margin-bottom: 20px;
font-size:     14px; 
text-align:    center; 
color:         #ccc}

.label{
float:      left; 
width:      6.25em; 
text-align: right}

input#txtNumber1, input#txtResult{
float:       left; 
text-align:  left;
width:       9em; 
margin-left: 0.63em}

input#txtNumber1{margin-bottom: 0.63em}

input#txtNumber1:hover{
background:         #e3dfdb;
-webkit-box-shadow: 0px 0px 4px #000}

.converterbox #button{ 
margin-left: 8em;
* margin-left: 7em;
margin-top:  1.25em}

.converterbox #reset{
margin-left: 8em;
* margin-left: 7em;
margin-top:  0.63em}

#useful_sidebar{ 
background:    url('./images/useful_sidebar_bg.png') no-repeat 0 0;
float:         right;
width:         260px;
padding:       10px;
margin-bottom: 20px}

.sidebar_sub{
background:   url('./images/dark_bg.png') repeat 0 0; 
font-variant: small-caps;
border-right: 10px solid #141401;
border-left:  10px solid #141401;
text-align:   center; 
margin:       20px 0;
	
-moz-border-radius:    12px;
-khtml-border-radius:  12px;
-webkit-border-radius: 12px;
border-radius:         12px} /*not sure if keep*/
	
h4#useful{
background:  url('./images/useful.png') no-repeat 0 0; 
height:      0; 
overflow:    hidden; 
padding-top: 34px; 
width:       170px;
margin:      20px 0 0 50px}	

#pete_useful{
position:   absolute;
top:        0;
left:       10px;
width:      640px;
height:     800px;
background: url('./images/useful_bg.png') no-repeat 0 0}

#converters_bg{
position:   absolute; 
top:        40px;
left:       30px;
background: url('./images/converters_bg.png') no-repeat 0 0; 
width:      37.5em; 
height:     700px}

#useful_info_box{
position:      relative;
float:         left;	
width:         550px;
background:    url('./images/useful_info_box_bg.png') repeat 0 0; 
margin-bottom: 20px;
padding:       10px}

.bold{
font-weight: bold;
color:       #f4fbe6}
	
ul#phish li{margin-bottom:10px}

#safety{
position:   absolute;
bottom:     -65px; 
left:       -25px;
background: url('./images/safety.png') no-repeat 0 0;  
width:      110px;
height:     112px}	




/************** Work stuff section *******************/
#work_list{
position:        relative; 
list-style-type: none;
margin-left:     60px}
		  
#work_list li{  
float:   left;
display: inline;	
margin:  5px;
width:   150px;
height:  150px}

.work_empty{background: url('./images/work_bg.png') no-repeat 0 0}  

#work_list li a{
display:     block;
width:       150px;
height:      150px;
text-indent: -9000px}	

#work_list li#photoshop a, #work_list li#websites  a, #work_list li#fireworks a, 
#work_list li#templates a, #work_list li#current   a, #work_list li#after     a{

-moz-box-shadow:    rgba(0,0,0,0.50) 20px 20px 50px 5px; 
-webkit-box-shadow: rgba(0,0,0,0.50) 20px 20px 50px;
box-shadow:         rgba(0,0,0,0.50) 20px 20px 50px 5px;

-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

	
#work_list li#photoshop a{ background: url('./images/photoshop.png') no-repeat 0 0}
#work_list li#websites  a{ background: url('./images/websites.png') no-repeat 0 0}
#work_list li#fireworks a{ background: url('./images/fireworks.png') no-repeat 0 0}
#work_list li#templates a{ background: url('./images/templates.png') no-repeat 0 0}
#work_list li#current   a{ background: url('./images/current.png') no-repeat 0 0}
#work_list li#after     a{ background: url('./images/after.png') no-repeat 0 0}

#work_list li#photoshop a:hover, #work_list li#websites a:hover, #work_list li#fireworks a:hover, 
#work_list li#templates a:hover, #work_list li#current a:hover, #work_list li#after a:hover{ background-position: 0 -150px} 

.websites_bg{
position:    relative; 
background:  url('./images/websites_bg.png') no-repeat 0 0;
width:       920px; 
height:      24.38em;
margin:      40px 0 60px;
padding-top: 5px;

-moz-box-shadow:    rgba(0,0,0,0.50) 20px 20px 50px 5px;
-webkit-box-shadow: rgba(0,0,0,0.50) 20px 20px 50px;
box-shadow:         rgba(0,0,0,0.50) 20px 20px 50px 5px}

.websites_bg, .websitesheader, .visit_site{
-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

.websitesheader{
position:    relative;	
background:  url('./images/dark_bg.png') repeat 0 0; 
height:      1.7em; 
padding:     5px;
margin:      10px 30px;
line-height: 25px}

.websites_img{float: left}

.websites_about{
float:     left; 
margin:    30px 0 0 30px; 
width:     390px; 
font-size: 16px}
	 
.tick{ 
float:      left;
margin:     30px 0 0 30px;
list-style: none;
font-size:  16px}

.tick li{ 
background:     url('./images/tick.png') no-repeat 0 0; 
padding-left:   30px;
padding-bottom: 5px}

.small_icons{
position:   absolute; 
bottom:     20px; 
left:       335px;	
list-style: none}
	 
.small_icons li{display: inline}

.visit_site a{
position:   absolute; 
bottom:     25px; 
right:      30px; 
width:      142px;
height:     38px;
display:    block;
background: url('./images/visit_site.png') no-repeat 0 0}

.visit_site a:hover{background-position: 0 -38px}

.hide_link{display: none}

.worktooltip:hover span{
width:      12em;
left:       -2em;
top:        -3em;
text-align: center}

#current_img{
float:  left;
margin: 10px 10px 10px 0;

-moz-box-shadow:    rgba(0,0,0,0.50) 20px 20px 50px 5px;
-webkit-box-shadow: rgba(0,0,0,0.50) 20px 20px 50px;
box-shadow:         rgba(0,0,0,0.50) 20px 20px 50px 5px}
	
#current_job{margin: 20px 30px 0 30px}

#simpleviewer_background{
background:   url('./images/simpleviewer_bg.png') no-repeat 0 0; 
width:        920px; 
height:       600px;
padding-left: 10px}
	 
#painters{ /* under construction images */
position:   relative; 
left:       -20px;
background: url('./images/painters.png') no-repeat 0 0; 
width:      960px; 
height:     500px}

#paintbrush{
position:   absolute;
top:        -118px;
left:       330px;	
background: url('./images/paintbrush.png') no-repeat 0 0;
width:      110px;
height:     116px} 

.greenbutton, #greenbuttonabout, #greenbuttonblog, #greenbuttonfun{
position:   absolute; bottom: 2px; right: 2px;	
display:    block;
width:      40px;
height:     40px;
background: url('./images/greenbutton.png') no-repeat 0 0}

#greenbuttonblog{position: absolute; bottom: 2px; right: 0px}
#greenbuttonabout{position: absolute; bottom: 53%; right: 0px}
#greenbuttonfun{position: absolute; bottom: 13px; right: 120px}

.greenbutton:hover, #greenbuttonabout:hover, #greenbuttonblog:hover, #greenbuttonfun:hover{background-position: 0 -40px}

.greenbutton span, #greenbuttonabout span, #greenbuttonblog span, #greenbuttonfun span{display: none}

.clear{clear: both}

#noscript{
background-color: #fff;
padding-left:     100px; 
border:           3px solid #c00;
font:             small-caps 1.3em "Courier New", Courier, monospace;
color:            #c00;
margin:           20px;
letter-spacing:   2px;

-moz-border-radius:    20px;
-webkit-border-radius: 20px;
-khtml-border-radius:  20px;
border-radius:         20px}

a:link    {color: #bac974; text-decoration: none}
a:visited {color: #bac974; text-decoration: none}
a:hover   {color: #cf0}
a:active  {color: #f33}

#footer{
position:   relative; 
bottom:     0;  
display:    block; 
background: url('./images/foots.png') no-repeat 0 0; 
width:      960px; 
height:     340px; 
margin-top: 100px}