/* STYLESHEET - copyright to: NADIA -  DREAMWEAVERRESOURCES.COM */

html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6{  /* set everything to zero for a good  
starting point.  This way, you can avoid certain issues.  You add padding and margins to specific elements themselves*/

margin: 0; /* sets the margins to zero on the body */
padding: 0; /* sets the padding to zero on the body */
border: 0; /* deletes any borders */	
}

/* stops shorter pages from jumping when there is no scrollbar */
html { min-height:100%; margin-bottom:1px; }

body {
	background-color: #666666; /*sets the body background colour  */
	background-image: url(../images/background.gif); /*body background image */
	background-position: center; /*centres the background image */
	color: #333; /*default font colour on page*/
	font-family: Arial, Helvetica, sans-serif; /*default font on page*/
	font-size: 101%; /*default font size  set to 101% */
	margin: 0 auto;
	min-width: 770px;/*minimum width anything under you get scroll bars this prevents our page becoming smaller than the wrapper */
	padding: 0; /*padding set to zero */
	text-align: center; /* IE to make sure the layout is centred*/
	}
	
#wrapper {
	background-color: #FFF; /*sets the background colour of our wrapper div to white */
	background-image: url(../images/wrapper-background.gif);/* sets the wrapper margins to zero */
	padding: 0;/* sets the wrapper padding to zero */
	text-align: left; /* aligns the text to the left, see also the IE hack in the body where we align the text centre */
	width: 740px;/* sets the wrapper width */
	border-bottom: 1px solid #898A3A;
	border-left: 1px solid #898A3A;
	border-right: 1px solid #898A3A;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-repeat: repeat-y;
}

#logo {
	height: 35px;/*sets the height of the logo div*/
	background-image: url(../images/topbanner.jpg);/*the background image of the logo div*/
}

#topnav {
width: 742px;/*sets the width for our top nav bar div*/
}

#topnav li {
display: block;
padding: 0;   /*padding set to zero */
float: left;  /*positions the top nav to the left */
}

#topnav ul {
height: 30px;     /*sets the height of the menu items */
margin: 0;      /*margin set to zero */
padding-top: 10px;   /*padding set to zero */
text-align: center;  /*aligns the link text centre */
margin: 0px;
}

#topnav ul li a {
color: White;/*font colour for top nav text link */
display: block;/* makes the links act like a button*/
font-size: .80em;/*sets the font size */
font-weight: bold;
  height: 15px;
text-decoration: none;     /*removes the default underline*/
width: 121px;      /*sets the width of the links - you may need to readjust if you add any more links that currently available */
padding-top: 10px;   /*positions the link text*/
background-color: #F87B16;
}

#topnav ul li a:hover {
color: White;    /*sets the font colour*/
display: block;    
text-decoration: underline;  /* underlined appearance */
	}

#topnav a:active {  
color: #FFF;       /*sets the font color for the top nav state*/
display: block;   /*displays block as to act like a button*/
}

/* header - large image div */
#leftlogo {
background-image: url(../images/sdheader.jpg);     /*the background image for the leftlogo div*/
float: left;                                  /*positions the div to the left*/
height:  234px;        /* the height of our background image*/
width: 740px;  /* the width which is also the same as our background image*/
margin-top: 0px;  
background-repeat: no-repeat;   /*no repeat for our background image*/
}

#content {
width: 740px;/* the content div is the same as our wrapper div and inside the content div we have placed the nav div and the contentright div*/
clear: both; /* this is a clearer ; ensures the content is  placed below the logoleft and logoright divs*/
}

#content .contentright {
float: right;
margin-top: 16px;
padding: 0 15px 10px 15px;
text-align: left;
width: 480px;
line-height: 120%;
background-color: White;	
}
/*styles the black text portion in the headers */
.blacktext {
color: black;
}

 #content .contentright p {
font-size: .9em;
margin-bottom: 1em;
}

 #content .contentright H1 {
color: #F87B16;
font-size: 1.0em;
margin-top:8px;
margin-bottom: 8px;
border-bottom: 1px dotted #87883A; /*places a solid border under the H1*/
 }
#content .contentright H2 {
color: #F87D19;
font-size: .90em;
margin-top:6px;
margin-bottom: 6px;
border-bottom: 1px dotted #87883A;   /*places a solid border under the H2*/
 }

#nav {
float: left;
padding-top: 18px;/*IE hack to ensure our nav lines into position*/
padd\ing-top: 22px;  /*this and the following position the Nav in accordance with the wrapper background and also creates the appearence of a column*/
padding-left:10px;  /*sets the right to 10 pixels as to position the nav in accordance with the wrapper background*/
margin-right: 3px;
ma\rgin-right: 0;    /*fixes the nav alignment to the bg in IE5.5*/
width: 192px;   /*ensures the content is  placed below the logoleft divs*/
}

/*styling the right navigation*/
#nav ul {
border-top: 1px solid White;  /*places a border on the top of the menu box*/
font-size: 90%;   /*sets the font size for the right nav*/
margin: 0;
padding: 0;
list-style-type: none;/*removes the list style*/
}

#nav ul li{
border: 1px solid White; /*sets a border*/	
border-width: 0 1px 1px 1px;/*sets the border width - none at top as we have already declared it on the ul element*/
margin: 0;/*set the margin to zero*/		
}

#nav a, 
#nav a:visited {
color: #333333; /*font colour */
display: block;   /*display set to block */
padding: 6px;    /*gives a bit of breathing space to our text from the block */
text-decoration: none;    /*removes the default underline*/
background-color: #B5BC5D;   /*background colour */
height: 1%;   /* bug fix for IE to create the block hover effect */
}

#nav a:hover {
color: White;   /*hover font colour */
background-color: #F87B16;    /*hover background colour */
}

#nav a:active {
color: #70702F;  
background-color: #D8AD01;    
}

#nav a:focus {
color: #000;
text-decoration: none;/*removes the default underline*/
background-color: #DDE194;/*sets the background colour */
}
/* styles the current page navbar color */
#nav a.currentLink {
background-color: #F87D19;
color: #333333;
}

#footer {
color: #747538;           /*font colour for the footer div*/
font-size: 80%;         /* font size*/
text-align: center;      /*aligns the text centre*/
width: 500px;           /*width of the footer div*/
padding: 10px;          
border-top: 1px dotted black;
margin-left: 214px;    
}
/* HEADING STYLES */
h1 {
font-size: 100%;
}
h2 {
font-size: 95%;
}

/* DEFAULT LINK STYLES */
a:link{
color: #898A48;
text-decoration: underline;/*removes the underline*/
}
a:visited{
color: #898A48;
}
a:hover{
color: #333;
}
a:active{
color: #333;
}
/* DIV HOLDING SMALL PIC ICONS BOTOTM OF PAGE */
#portcon {
	/* [disabled]border-top-color: black; */
	/* [disabled]border-top-style: dotted; */
	/* [disabled]border-top-width: 1px; */
	background-color: #FFFFFF;
	width: 514px;
	margin-left: 217px;
	padding-left: 4px;
	padding-right: 4px;
	height: auto;
	clear: both;  /* clears the floated div */
}
/* GIVES THE ICONS A BORDER */
#portcon a img {
border: 2px solid #F87D19;
}
#portcondualrow {
	border-top: 1px dotted black;
	background-color: #FFFFFF;
	width:514px;
	margin-top: 10px;
	margin-left: 217px;
	padding-left:4px;
	padding-right: 4px;
	padding-top: 10px;
	height: 149px;
	clear: both;  /* clears the floated div */
}
#portcondualrow a img {
	border: 2px solid #F87D19;
}

/* form styles */
form {
margin:0;
padding:0;
}

input.txt{	
float: left;
background-color: #F3F3D5;
border: 1px solid #888A41;
margin: 4px;
}

/* STYLES THE SUBMIT BUTTON */
input.btn {
border: 1px solid  #888A41;
background-color: #F3F3D5;
color: #666666;
margin-left: 130px;  /* set margin so it sits under the input fields */
}

form p {
clear: left;
margin:0;
padding: 0;
padding-top: 5px;
}

form p label{
color:#666666;
float: left;
width: 30%;
font: bold 0.9em Arial, Helvectica, sans-serif;
}

/* comments area */
form p textarea {
float: left;
background-color: #F3F3D5;
border: 1px solid #888A41;
margin: 4px;
font: bold 0.9em Arial, Helvectica, sans-serif;
}

fieldset {
padding:30px;
border: 1px solid #DEE192;
margin-bottom: 15px;
}

legend {
font: bold 1.0em Arial, Helvectica, sans-serif;
color: #888A41;
background-color: #FFF;
}

/* STYLES THE FOCUS ON THE INPUT FIELDS */
form p textarea:focus, form p input:focus, form p select:focus {
	background-color: #E1E2C1;
	color: #464545;
	}
.arial_11_point_green/* END FORM STYLES */
 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #535428;
}
.arial_10pt/* END FORM STYLES */
 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	margin-left: 0px;
}
.arial_24pt/* END FORM STYLES */
 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24pt;
	margin-left: 0px;
}
.arial_24pt_37space/* END FORM STYLES */
 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24pt;
	margin-left: 44px;
}
#portfolio_wrapper {
	width: 742px;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
}
