@charset "utf-8";
/* CSS Document */

body {padding:0; margin:0; background:#373737; }

#content { 
		position:relative;
		height:500px;
		width:704px;
		padding:0; 
		margin:auto; 
		top:40px;
		
		}
		
#content2 { 
		position:relative;
		height:500px;
		width:990px;
		padding:0; 
		margin:auto; 
		top:40px;
		
		}
		

#header{
		margin:0;
		padding:0;
		position:relative;
		top:0px;
		height:320px;
		width:400px;
		left:90px;
		background:url(../images/waterdrops.JPG);
		border:1px solid;
		border-color:#222222;
				}
				
#header2{
		margin:0;
		padding:0;
		position:relative;
		top:0px;
		height:288px;
		width:835px;
		left:25px;
		background:url(../images/header2.jpg);
		}						

#header3{
		margin:0;
		padding:0;
		position:relative;
		top:0px;
		height:288px;
		width:835px;
		left:25px;
		background:url(../images/header8.jpg);
		}		
		
#header4{
		margin:0;
		padding:0;
		position:relative;
		top:0px;
		height:288px;
		width:835px;
		left:25px;
		background:url(../images/header4.jpg);
		}	
		
		#header5{
		margin:0;
		padding:0;
		position:relative;
		top:0px;
		height:288px;
		width:835px;
		left:25px;
		background:url(../images/header5.jpg);
		}	
		
		#header6{
		margin:0;
		padding:0;
		position:relative;
		top:0px;
		height:288px;
		width:835px;
		left:25px;
		background:url(../images/header7.jpg);
		}	
#block { 
		margin:0;
		padding:0;
		background-color:#595959;
		position:absolute;
		height:340px;
		width:460px;
		left:65px;
		top:145px;
				}
				
#block2 { 
		margin:0;
		padding:0;
		background-color:#595959;
		position:absolute; 
		min-height:400px;
		width:850px;
		left:66px;
		top:112px;
				}			
				
#biggerblock { 
		margin:0;
		padding:0;
		background-color:#595959;
		position:absolute;
		height:480px;
		width:590px;
		left:65px;
		top:5px;
				}				
		
		
		

.biggerblock2text {
margin:0;
padding:0;
margin-left:10px;
margin-right:54px;

}

#nav { 
		margin:0;
		padding:0;
		width:170px;
		position:absolute;
		left:-170px;
		bottom:0px;
							}				
				
				
#flashword { 
		margin:0;
		padding:0;
		position:absolute;
		height:290px;
		width:100px; 
		left:378px;
		top:3px;
		z-index:3;	
						}
						
#flashword2 { 
		margin:0;
		padding:0;
		position:absolute;
		height:290px;
		width:100px; 
		right:-18px;
		top:85px;
		z-index:3;	
						}						
						
#greycorner {
		margin:0;
		padding:0;
		position:absolute;
		background:url(images/greycorner.jpg);
		right:-41px;
		bottom:-1px;
		width:102px;
		height:59px;
		z-index:3;
		}
		
#contentarea {margin:25px 0 20px 30px; padding:0; position:relative; width:775px;}		
		
img.colourfish{margin:0; padding:0; position:absolute; top:343px; left:-60px;}		
		
/*text styles*/

h3 {margin:0;
padding:10px 0px 5px 0px; font-family: arial, "century gothic", sans-serif; 
color:#c1c1c1; font-size:12px; line-height:15px;}		

h1 {padding:6px 0px 12px 0px; margin:0px; font-family: verdana, "century gothic", sans-serif; 
color:#cdea1f; font-size:15px; line-height:20px;}

h2 {padding:12px 0px 7px 0px; margin:0px; font-family: verdana, "century gothic", sans-serif; 
color:#66c91f; font-size:13px; line-height:20px;}

h4 {margin:0;
padding:12px 0px 15px 0px; font-family: verdana, "century gothic", sans-serif; 
color:#c1c1c1; font-size:12px; line-height:15px;}		
	

				
p {
margin:0;
padding:0px;
padding-bottom:10px;
padding-right:15px;
font-family: verdana, sans-serif; 
color:#C1C1C1; font-size:11px; text-align:justify;
line-height:normal; }

.highlight{
color:#8FC415;
}
.author{
color:#7A8C6C;
font-size:11px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

p.box {
padding:5px 15px 15px 15px;
}
p.smalltext {
font-size:12px; 
padding-top:17px;
}
p.smalltext_lesspad {
font-size:12px; 
line-height:16px;
padding-bottom:10px;

}

a {
padding:5px 0px 0px 0px;
margin:0;
text-decoration:none;
font-family: verdana, sans-serif; 
color:#7dba00; 
-webkit-transition:color 0.6s ease-in;  
-moz-transition:color 0.6s ease-in;  
-o-transition:color 0.6s ease-in;  
transition:color 0.6s ease-in;
}

a:hover {
color:#408CFf;
-webkit-transition:color 0.2s linear;  
-moz-transition:color 0.2s linear;  
-o-transition:color 0.2s linear;  
transition:color 0.2s linear;
  }
  
ul li {list-style-image:url(images/list.jpg);}

/*nav styles*/

#nav ul {
margin:0px;
padding:0 0 2px 0;
list-style-type:none;
}


#nav li {
margin:0; padding:0 17px 0 0;
text-align:right;
line-height:15px;
list-style-image:none;
}

#nav li a {
display:block;
padding:6px 0 0 6px;
margin:0;
text-decoration:none;
font-family:"century gothic", verdana, sans-serif;
color:#C1C1C1; font-size:14px; line-height:15px;
-webkit-transition:color 0.6s ease-in;  
-moz-transition:color 0.6s ease-in;  
-o-transition:color 0.6s ease-in;  
transition:color 0.6s ease-in;  
}

#nav li a:hover {
color:#7dba00;
-webkit-transition:color 0.2s linear;  
-moz-transition:color 0.2s linear;  
-o-transition:color 0.2s linear;  
transition:color 0.2s linear;  
}

/*end nav styles*/

.folio{
padding:0;
margin:0;
padding-bottom:5px;}

#contact {
		margin:0;
		padding:0;
		position:absolute;
		height:310px;
		width:271px;
		left:17px;
		top:10px;
		margin-top:10px;
		}
		

		
		
#waterimage{
margin:0;
		padding:0;
		position:absolute;
		left:290px;
		height:250px;
		width:72px;
		top:25px;
		
		}
		
#leftcornerimage{
padding:0;
margin:0;
position:absolute;
left:-1px;
top:265px;
background:url(images/leftcorner.jpg);
height:56px;
width:59px;
}




#dflogo{
padding:0;
margin:0;
position:relative;
top:19px;
left:63px;
background:url(images/doodlefishlogo.jpg);
width:218px;
height:68px;
}

#dflogobigpage{
padding:0;
margin:0;
position:relative;
top:-1px;
left:-38px;
background:url(images/doodlefishlogo2.jpg);
width:37px;
height:177px;
}

#reflection {
padding:0;
margin:0;
position:absolute;
		background:url(images/reflect.jpg);
		left:-38px;
		bottom:-48px;
		width:524px;
		height:47px;
		z-index:2;
		}
		
#reflection2 {
padding:0;
margin:0;
position:absolute;
		background:url(images/reflectnew.jpg);
		left:-31px;
		bottom:-54px;
		width:914px;
		height:53px;
		z-index:2;
		}		
		
#biggerreflection {
padding:0;
margin:0;
position:absolute;
		background:url(images/reflect2.jpg);
		left:-38px;
		bottom:-48px;
		width:654px;
		height:47px;
		z-index:2;
		}		
		
/* fading scroll method from http://www.cssplay.co.uk */		

.scrollfade_container {padding:0; width:490px; position:absolute; 
left:20px;
top:0px;
margin:0; }

.bigcontent {
margin:0;
padding:0;
width:490px; height:480px;
overflow: auto;
}

.fade_top {
margin:0;
padding:0;
position: absolute;
height: 25px;
width:100%;
top:0; left:0;
background:url(images/fade_top.png);
}
.fade_bottom {
margin:0;
padding:0;
position: absolute;
height: 25px;
width:100%;
bottom:0; left:0;
background:url(images/fade_bottom.png);
}

/*endscrllblock*/

img.recentwork {
margin:0;
padding:0;
position:absolute;
top:0;
left:237px;
}


/* gallery CSS */
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/photo_click.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

#gallery {margin:0; padding:0;}
#gallery ul {list-style:none; padding:0; margin:0; position:absolute; width:250px;  height:162px; left:446px; top:-21px;}

#gallery ul li {padding:0; display:inline; width:114px; height:76px; float:left; margin:0 6px 6px 0;}

#gallery ul li a {margin:0; padding:0; display:block; width:114px; height:76px; text-decoration:none; border:1px solid #999999;}


#gallery ul li a img {display:block; width:114px; height:76px; border:0;}
#gallery ul li a img.logo {width:0px; height:0px;}
#gallery ul li a img.site {width:0px; height:0px;}

#gallery ul li a:hover img.logobw{display:none;}
#gallery ul li a:hover img.logo{width:114px; height:76px;}
#gallery ul li a:hover{border-color:#ddd;}

	#gallery ul li a:hover img.site {position:absolute; left:0px; top:167px; width:168px; height:185px; border:1px solid #999999; z-index:30;}

#gallery ul li span {display:block; position:absolute; left:174px; top:-16px; width:0px;font-family:verdana, arial, sans-serif; color:#373737; font-size:0px; line-height:0px; text-align:justify;}
#gallery ul li span h3 {color:#373737; font-size:0px; line-height:0px; width:0px;}


#gallery ul li a:hover span {display:block; color:#959595; top:166px; width:140px; font-size:11px; line-height:15px;}
#gallery ul li a:hover span h3 {width:190px; color:#66c91f; font-size:13px; line-height:20px;}
#gallery ul li a:hover span b {color:#444;}

/*endrecentworkgallery*/


h2.news{
font-size:13px;
text-align:left;
line-height:normal;
font-family:Geneva, Arial, Helvetica, sans-serif;
color:#B9EB43;
}

h1.news{
font-size:13px;
text-align:left;
line-height:normal;
font-family:Geneva, Arial, Helvetica, sans-serif;
color:#BFEC37;
}

#newsletter-form{
position:relative;
top:0px;
left:420px;
background-color:#373737;
}

.cat_textbox_small{
border:0;
background-color:#CCCCCC;
font-size:10px;
width:150px;
}

.cat_button{
border:0;
font-size:10px;
margin-top:10px;
}

.item{
font-size:10px;
color:#999999;
}


.portfolio_item {
border-bottom:1px solid #ffffff;
margin:10px 0 20px;
min-height:160px;
padding:10px 0 20px;
}

.portfolio_thumb {
float:left;
margin:0 20px 20px 0;
}

.portolfio_list_words {
margin-left:250px;
}

p.portolfio_item {
color:#ffffff;
font-family:verdana,sans-serif;
font-size:11px;
line-height:normal;
margin: 0;
padding:0 20px 10px 0;
text-align:justify;
}

.portfolio_large_image {
float:right;
margin:20px 20px 20px 20px;
}

.portfolio_words {
width: 370px;
margin: 0 20px 20px 0px;
}


p.portfolio_words {
color:#ffffff;
font-family:verdana,sans-serif;
font-size:11px;
line-height:normal;
margin: 0;
padding:0 20px 10px 0;
text-align:justify;
}
