/*colors: 
#d67814 - orange a text, replaced with #993300; 
#514632 - dark brown body text,
#744a00 - mid-dark brown submenu dropdown text color 
#faeb6c - yellow fly-out hovered on text 
#ad8c65 - tope color, 
#c0bb85 - footer color
#f4eee6 - off-white body text color
#e7e2c2 - beige background screen colour??
#330000 - maroon links*/



html, body {      /*This is because the html and body tags have default margins and/or padding on nearly all browsers. So we need to write a CSS rule to reset the margins and padding on the html and body tags to zero.http://www.subcide.com/tutorials/csslayout/page4.aspx */
margin: 0;
padding: 0;
list-style:none;
}

body{
margin-top: -60px;
width: 85%;
position: relative;
font-family:helvetica, "sans serif";
color: #514632; /*brown body text*/
text-align: left;
background-color:#330000; /* maroon screen background colour*/
}

h1 {
font-size: 1.8em;
}

h2{
}

h3{
padding-top: 10px;
letter-spacing: .20em;
padding-right: 0;
}

h4{
font-style: italic;
}
h5{
color:#5c3900;		/*poo brown headings*/
font-size: 65%;
text-align: left;
}

p{
font-size: 105%;
text-align: justify;
}

i{

font-size: 100%;
}
sup{
font-size: 64%;
}

ul li {
list-style: none;
text-decoration: none;
margin: 0;
padding: 0;
}




.skillslist ul li{
list-style-type: disc;
line-height: 160%;
}

#textbox a{
color:  #514632;
background-image: none;
 
}

#textbox a:hover, a:visited{
color:#820010;
background-image: none;
}

#wrap {
width: 100%;
margin-left: 4%;
margin-right: 4%;
}
#logo{
margin-top: 62px;
margin-left: -41px;
position: relative;
background:transparent url(./mainimages/bifur_logo1.png); /*a gif didn't allow enough definition of filter effects, since in css a one-off*/
background-repeat: no-repeat;
width:200px;
height: 200px;
z-index: 102;
}
#name{
padding-left: 10px;
margin-top: -125px;
float: left;
margin-left:115px;
position: absolute;				/*absolute positioning and px width for margin-left to prevent float dropping out in IE and header sitting on top of logo*/
background-image: url(./mainimages/p22bifur_header.png);
background-repeat: no-repeat;
overflow: visible;
width:800px;
height: 70px;
z-index: 110;
}
#container{
margin-left:2%;
width:90%;
padding: 0;
}

#pageimage{
width: 100%;					
margin-left: 2%;
overflow: hidden;
height: 399px;
margin-top:-142px !important; /*control position of logo here*/
position:relative;
padding-top: 10px;
z-index: 10;
}
#pageimage img[alt]{
color: #330000;
}

.menu{

height:260px;
position: relative;
z-index:100; 				/*to ensure nav isn't hidden by pageimage*/
float:right !important;
margin-top: -300px;
						/*to position the menu in IE*/
padding-right: 0;
							/*to position the menu in firefox*/
text-align: right;
clear: right;
margin-right: -20px;
overflow: visible;

}

.menu ul li:hover ul, .menu ul li a:visited ul  {
float: left;
height: 50px;
text-align: center;
margin-left: 0;


}

#submenu { 
font-family: arial, sans-serif; 

margin-left:2%; 
width:100%; 
background:#ffffff; 
z-index: 140; 
min-height:50px; 
padding-top:5px; 
text-decoration: none; 
background-image: none;
margin-top: -5px;
}
#submenu ul{margin:0; padding-left:30px; list-style-type: none; padding-top: 5px; 
} 
#submenu a{display: block; text-decoration:none; font-weight: bold; color:#993300; width:11em; background-image: none;} /*bgd image none to remove orange line with upright from flyout css*/

#submenu li {float: left; width: 11em;  font-weight: bold; font-size: 98%; color:#993300;} /* #993300; orange submenu horizontal list*/
#submenu li ul {position: absolute; display: none; background:#330000; height: 120px; width: 10em; border: 2px solid #a65221; } /*#330000; maroon dropdown background box for submenu choices*/

#submenu li:hover ul {display: block;  width:10em; position: absolute;}

#submenu li:hover ul, #submenu li.sfhover ul { z-index: 200;  padding-left: 2em; list-style-type: none;}

#submenu li ul li a:visited {color: #a65221; background:none;} 

#submenu li ul li a {color: #a65221; background:none;} /*dark brown submenu popout active text*/


#submenu li ul li a:hover, a:focus, a:active {color: #ffffff; height: 20px;} /*darker shade of orange for visited text*/

#breadcrumb{
position: relative;
margin-left:2%;
margin-right:2%;	
width: 100%;
min-height:20px;
background:#330000;  /*maroon background color*/
margin-top: -18px;
padding-bottom:6px;
clear: left;
z-index:120;
overflow: visible;
background-image: url(./mainimages/breadcrumb_bgd01.gif);
background-repeat: no-repeat;

}


#breadcrumb li{
float: left;
display: inline;
margin-left: -10px;
margin-right: 12px;
padding-top: 4px;

color:#993300; /*good orange*/
font-weight: bold;

}

#breadcrumb li a{
color: #756649;
text-decoration: none;
background-image: none;

}

#breadcrumb li a:hover {
color: white;
background-image: none;
}


#content{
position:relative;
margin-left:2%;
margin-right:2%;	
width: 100%;
padding: 0;
background:#ffffff; /*color behind text and behind content*/ 
margin-top: -10px;
padding-bottom: 50px;
min-height: 600px;

}
#textbox{
position: relative;
overflow: visible;
z-index: 120;
padding-top: 20px;
width: 60%;			/*if > width property textbox div jumps out of alignment when IE at 800w due to unresolved sidebar div jiggle issue (layout issue? when page is refreshed*/
margin-top: 10px;
margin-left:10px;
padding-left:15px;
background:#ffffff; /*same as content colour*/
padding-bottom: 10px;
margin-bottom: 50px;
margin-right:190px;
min-height:1000px;

}
#diary{
padding: 10px;
border-style: solid;
border-width: 1px;
border-color: #514632;

}

#snow_globe{
margin-left: 110px;
border: 1px solid #330000;
width: 382px;
height:347px;
}

.bodyimages{
display: inline;
position:relative;
z-index:110;
width:280px;
padding:2px 2px 10px 5px;
margin-left: 5px;
height:64px;
overflow: visible;
float: right;

}

.bodyimages1{
display: inline;
position:relative;
z-index:110;
margin-left: 10px;
margin-top: 5px; 
overflow: visible;
float: right;
}

.bodyimages2{
display: inline;
position:relative;
z-index:110;
margin-right:10px;
margin-top: 5px; 
overflow: visible;
float:left;

}
.bodyimages3{
margin-top: 50px;
}
.bodyimages4{
display: inline;
position:relative;
z-index:110;

padding:2px 2px 10px 5px;
margin-left: 50px;
height:64px;
overflow: visible;
}
.bodyimages6{
margin-bottom: 10px;
margin-left: 40px;
}


#extratext {
position: relative;

									 
background-color:#ffffff; /*same as side bar color*/  
padding: 10px;
padding-bottom: 15px;
width:100%;
margin: 10px;
}

#extratext p{
padding: 10px;
}
.textshots{
position:relative;
float: left;
padding-bottom:2px;
padding-top: 2px;
padding-right: 7px;
width: 148px;


}
.textshots_rht{
position:relative;
float: right;
padding-bottom:10px;
padding-top: 2px;
padding-left: 7px;
clear: left;

width: 110px;
}
.captions{
padding-bottom: 50px;

}
.captions_rht{
padding-bottom: 50px;
}




.textshots{
position:relative;
float: left;
padding-bottom:2px;
padding-top: 2px;
padding-right: 7px;
width: 148px;

}
.textshots_rht{
position:relative;
float: right;
padding-bottom:10px;
padding-top: 2px;
padding-left: 7px;
clear: left;
width: 110px;
}
.captions{
padding-bottom: 50px;

}
.captions_rht{
padding-bottom: 50px;
}

#sidebar{
padding:0;
margin-right: 0;
position: absolute;
z-index: 100;
border:0;
width: 190px;
height:1060px;
clear: both;
margin-top: 40px;
background-color: white;	
border:1px solid #330000;
margin-left: 79%;
background-image:url(./mainimages/events_underline1.gif);
background-repeat: no-repeat;
overflow: visible;
padding-bottom: 20px;
}

#sidebar h4{
margin-top: 17px;
font-style: normal;
color: black;
margin-left:19px;
margin-bottom:20px;
}

#sidebar p{
display: inline; /*to fix double margins of sidebar and other display issues in IE6 http://www.dave-woods.co.uk/?p=143*/ 
float:left;
margin-left: 55px;
margin-right:5px;
color: black;
text-align: left;
font-size:78%;
margin-top: 0;  	/*to ensure no top margin for FF*/
line-height:100%;
}


#sidebar a {
color: black;
font-size:85%;
margin-right:2px;
margin-top: 0;
color:#993300;
line-height: 100%;
}



#sidebar a:hover, a:visited{
color:#660000;
background-image: none;
}



 .event1, .event2, .event3, .event4, .event5, .event6, .event7, .event8, .event9, .event10, .event11, .event12{
background-repeat: no-repeat;
float: left;
padding-right: 7px;
width: 190px;
}

.event1{
background-image:url(./mainimages/21june.gif);
padding-bottom: 20px;

}

.event2{
background-image:url(./mainimages/13june.gif);
padding-bottom: 10px;

}
.event3{
background-image:url(./mainimages/18july.gif);
padding-bottom: 25px;
}


.event4{
background-image:url(./mainimages/4july.gif);
padding-bottom: 15px;
}
.k2_logo1 img{
margin-left: -5px;
}

.event5{
background-image:url(./mainimages/22august.gif);
padding-bottom: 15px;
}
.event6{
background-image:url(./mainimages/8august.gif);
padding-bottom: 15px;
}

.event7{
background-image:url(./mainimages/15august.gif);
padding-bottom: 10px;
}

.event8{
background-image:url(./mainimages/5sept.gif);
padding-bottom: 0px;
}
.event9 img{
margin-left: 5px;
}
.event9 p{
margin-bottom: 10px;
padding-top: 15px;
}

.event10{
background-image:url(./mainimages/11july.gif);
padding-bottom:15px;
}
.event11{
background-image:url(./mainimages/31july.gif);
padding-bottom:15px;
}


 

#gallerythumb{
position: relative;
float: right;
clear: both;
margin-right:10px;
z-index: 100;
width:190px;
height: 120px;
border:1px solid #330000;
margin-top: 1000px;
 			/*so gallerythumb div aligns with right margin in IE*/
background: #330000;
background-image:url(./mainimages/gallery_button.gif);

}

#amazonwidget{
margin-left:100px;
}



#textbox_contact{

position: relative;
padding-top: 20px;
min-height: 680px;
margin-right: 100px;
margin-left: 80px;
margin-top: 10px;
padding-left:10px;
background:white;
padding-right: 200px;
padding-bottom: 50px;
overflow: visible;
font-size:108%;
}

#textbox_contact p{
text-align: left;
line-height:20%;

}

#textbox_contact ul li{
text-align: left;
font-size: 108%;
margin-left: -40px;
}
#textbox_contact li{
line-height:180%;
}

#textbox_contact a:link, #textbox_contact a:visited{ 
background: none;					/*to stop .menu styling*/
}
#textbox_contact a{
color:#993300;
letter-spacing: .20em;

text-decoration: none;
}
#textbox_contact a:hover{
color: #330000;
}

#lower_nav{
clear: both;
position: relative; 				/*so z-index works*/
margin-left:2%;
margin-right:2%;
margin-top:-20px;
height: 80px;
width: 100%;
background: white  url(./mainimages/footer_stripe.gif);
background-repeat: no-repeat;
}

#lower_nav ul{
max-width: 100%;
min-width: 50%;
padding-top: 20px;

}
#lower_nav ul li {
position: relative;
display: inline;
margin-left: 90px;
margin-right: 10px;
list-style-type: none;
height: 50px;
text-decoration: none;
color:#993300;
font-family: arial,sans-serif;
font-size:1.1em;
}

#lower_nav  a  {
text-decoration: none;
margin-left: 85px;
margin-right: 10px;
color: #993300;

}
#lower_nav a:hover{
color:#514632;
}



#footer{
clear:both;
position: relative;
text-align: right;

background-image: url(./mainimages/3logos_opaque.png);		/*copyright preferably right but needs to be left so it doesn't disappear at w=800*/
background-repeat: no-repeat;


height: 320px;
margin-top:-27px;
margin-left:6%;
margin-right:-80px;
	
}