body {
	background-color: #5b5b5b;
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-size: 14px;
	line-height: 18px;
	color: #f9f9f9;
    margin: 0;
    padding: 0;
}

h2 { font-family: 'Josefin Sans', arial, serif; }/*for name Graeme Webb at top*/


/*grey bands full width*/
#band1 {
	background-color: #5b5b5b;
	width: 100%;
	height: 150px;
	margin-top: 0px;
	
}


#band2 {
	background-color: #757575;
	width: 100%;
	height: auto;
	margin-top: 0;
		
}

#band2a {
	background-color: #757575;
	width: 100%;
	height:600px;
	margin-top: 0;
	
}


#band3 {
	background-color: #5b5b5b;
	width: 100%;
	height: 120px;
	margin-top: 0px;
	
}
/*end bands*/


/*content within each band, numbered correspondingly*/
#container1	{
	margin: auto auto;
	width: 980px;	
	
}

#container2	{
	margin: auto auto;
	width: 980px; 
	
}

#container3	{
	margin: auto auto;
	width: 980px;	
	
}


#container2a	{
	background-image: url(http://www.graemewebb.com/images/dawnenn.jpg);
	margin: auto auto;
	width: 980px;
	height: 600px;
	background-repeat: no-repeat;		
	
}

.logo {
	position: relative; bottom: 260px; right: 430px;
	float: right;
	}
.box1 {

	width: 450px;	
	z-index: 5;
	font-size: 3em;
	font-family: 'Josefin Sans', arial, serif;
	position: relative; top: 110px;
	
}

.box1a	{
	float: right;
	width: 350px;
	z-index: 10;
	position: relative; top: 105px; left: 180px;
}
	
	
.box2 {
	margin: auto auto;
	width: 980px;	
	margin-top: 0px;
	margin-bottom: 0px;	
	
}


.box3 {
	width: 450px;	
	margin-top: 0px;
	position: relative; top: 10px;	
	
}
/* end content within each band */

/* Print page  csstest.php */                   
#tcontent	{
	display: table;
	
	padding-top:90px;
}

	#maincontent	{
		display: table-cell;
		background-color: #656565;
		width: 550px;
		padding: 20px 30px 20px 30px;
		
	}
	
	aside	{
		display: table-cell;
		background-color: #5b5b5b;
		padding: 20px 20px 0 20px;
		width: 250px;
	}	
	
	
	aside2	{
		display: table-cell;
		width: 50px;
		
	}                                          
/* end Print page */


.boxgall {
	margin: auto auto;
	width: 900px;
	min-height: 600px;	
	
	
	
}

.boxgallsq {
	margin: auto auto;
	width: 600px;
	min-height: 600px;	
	margin-bottom: 20px;
	
}


/* ref number and title on individual image pages */
.boxrefno	{
	float: left;
	font-family: 'Josefin Sans', arial, serif;
	padding: 10px 15px 0px 0px;
	position: relative; top: 3px;
	
}

.hey	{
	float: left;
	font-size: 1.5em;
	font-family: 'Josefin Sans', arial, serif;
	padding: 10px 0px 0px 0px;;
	
	
}
/* ref number and title on individual image pages */

/* for gallery thumbnails */
.slide1	{
	float: left;
	width: 280px;
	padding: 10px;
	font-family: 'Josefin Sans', arial, serif;
	text-align: center;
	font-size: 1.2em;
	/*outline: 1px dotted red;*/	
}
/* end gallery thumbnails */


.video	{
	width: 600px;
	font-family: 'Josefin Sans', arial, serif;
	font-size: 1.5em;
	margin: inherit;
	
}


.copyright	{
	width: 400px;
	margin: auto auto;
	font-size: 0.7em;
	position: relative; top: 80px;
	
}

.clearboth	{
	clear:both;
}







/***********************/
/*bio box on bio page*/
/***********************/
#biobox {
	
	padding: 20px;
	width:630px;
	color: #f9f9f9;
	position: relative; top: 20px; right: 20px;
	margin-left: 50px;
		
}


#biobox .transparency {
	opacity: 0.5;
	filter: alpha(opacity=50);
	-moz-opacity:0.5; 
	background-color: #5b5b5b;
	width: 650px;
	height: 260px;	
	position: absolute;
		
}

.biocontent {
	padding: 20px;
	position: relative; left: 20px; bottom: 10px;
	z-index: 30;
		
}
/****************/
/*end bio box*/
/****************/


/*links at top right*/
.landlink {
	
	
	float: left;
	position: relative; top: -10px; left: 640px;
	z-index: 10;
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-size: 0.35em;
		
}
/* end links at top right */


a {
	color: #f9f9f9;
    text-decoration:  none;
}

a:link  {color: #f9f9f9;
           
}

a:visited  {color: #f9f9f9;
			 
}
a:hover  {color: #c2c2c2;}



/* buy print button */
	a.buttonbuy { 	
    width: 250px;
    height: 30px; 
    color: #eee; 
    font-size: 1.1em;
    text-transform: uppercase; 
    text-align:center;
    margin-top: 10px;
    background-color: #18a5cc;
    border: none;
}

a.buttonbuy {
 
... 
 
/* -- CSS3 Transition - define which property to animate (i.e. the shadow)  -- */
-webkit-transition: -webkit-box-shadow 0.3s linear;
 
/* -- CSS3 Shadow - create a shadow around each input element -- */ 
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#18a5cc), to(#0a85a8)); 
background:  -moz-linear-gradient(25% 75% 90deg,#0a85a8, #18a5cc); 
 
/* -- CSS3 - Rounded Corners -- */
-webkit-border-radius: 4px;
-moz-border-radius: 4px; 
border-radius: 4px;
 
}a.buttonbuy:hover { 		
    -webkit-box-shadow: 0px 0px 20px #000;
    -moz-box-shadow: 0px 0px 20px #000; 
    box-shadow: 0px 0px 20px #000;		
    cursor:  pointer; 
}
/* end buy print button */


/* For "Legacy" pages only */

.legtitle{
	margin: auto auto;
	width: 500px;
	z-index: 5;
	font-size: 2em;
	font-family: 'Josefin Sans', arial, serif;
	
	
}
	


/*Take me to the photo's Button for Legacy pages*/

a.buttonleg { 
	float: left;	
    width: 250px;
    height: 20px; 
    color: #eee; 
    font-size: 1.1em; 
    text-align: center;
    vertical-align: text-middle;
    background-color: #18a5cc;
    border: none;
    padding: 5px 0px 5px 0px;
  
   
/* -- CSS3 Transition - define which property to animate (i.e. the shadow)  -- */
-webkit-transition: -webkit-box-shadow 0.3s linear;
 
/* -- CSS3 Shadow - create a shadow around each input element -- */ 
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#18a5cc), to(#0a85a8)); 
background:  -moz-linear-gradient(25% 75% 90deg,#0a85a8, #18a5cc); 
 
/* -- CSS3 - Rounded Corners -- */
-webkit-border-radius: 4px;
-moz-border-radius: 4px; 
border-radius: 4px;
 
}


a.buttonleg:hover { 		
    -webkit-box-shadow: 0px 0px 20px #000;
    -moz-box-shadow: 0px 0px 20px #000; 
    box-shadow: 0px 0px 20px #000;		
    cursor:  pointer;  


/*End Take me to the photo's button for Legacy pages*/