/* CSS Document */

body{
	padding:0 0 14px 0;
	margin:0;
	color:#000;
	background: #efefef url(../images/page-backer.jpg) repeat-x;
	font:12px Arial, Helvetica, Tahoma, Arial, sans-serif;
}
div, h1, h2, p, form, label, input, textarea, img, span{
	margin:0; padding:0;
}

a, a:visited {color:#006600; text-decoration:underline}

a:hover {color:#996633; text-decoration:none}

ul{
	margin:0; 
	padding:0; 
	list-style-type:none;
	font-size:0;
}
.spacer{
	clear:both; 
	font-size:0; 
	line-height:0;
}
/*------------------------------------------------body--------------------*/


/*------------------------------------------------ButtonPad--------------------*/
#toppanel-text {
width:1000px;
text-align:left;
margin:0 auto;
height:35px;
background:none;
color:#efefef;
font-size:11px;
}
#toppanel-text .lefttext {
float:left; margin-top:15px
}
#toppanel-text .righttext {
float: right; margin-top:15px
}

#toppanel-text .righttext a, #toppanel-text .righttext a:visited  { color:#FFFFFF; text-decoration:none}
#toppanel-text .righttext a:hover { color:#FFFF00; text-decoration: underline}
#menuholder {
text-align:center;
font-size:12px;
font-weight:normal;
	width:1000px;
	height:30px;
	margin:0 auto;
	background:url(../images/menu-backer3.jpg) repeat-x ;
	
}
#ButtonPad{
	width:1062px;
	height:42px;
	position:relative;
	margin:0 auto;
}
#ButtonPad ul{
	width:1090px;
	height:42px;
	position:absolute;
	left:31px;
}
#ButtonPad ul li{
	background:url(../images/button.jpg) right top no-repeat;
	width:111px;
	height:42px;
	float:left;

}
#ButtonPad ul li a{
	display:block;
	padding:8px 14px;
	font:bold 12px/27px Arial, Helvetica, sans-serif;
	color:#EBEBEB;
	background-color:inherit;
	text-decoration:none;
	text-align:center;
	height:42px;
}
#ButtonPadul li a:hover{
	background:url(../images/button-over.gif) 0 0 repeat-x;
	color:#fff;
	background-color:inherit;
}
#ButtonPad ul li a.hover{
	display:block;
	background:url(../images/button-over.gif) 0 0 repeat-x;
	padding:8 14px;
	font:bold 11px/27px Arial, Helvetica, sans-serif;
	text-decoration:none;
}


/*------------------------------------------------header--------------------*/

#header{
	/*background:url(images/header.jpg) 0 0 no-repeat;*/
	width:1000px;
	height:354px;
	position:relative;
	margin:0 auto;
}
#header .headerPad{
	width:1000px;
	position:absolute;
	height:149px;
	background: url(../images/swoosh-2.png) no-repeat;
	z-index:1;
}

#header .headerPad iframe {
padding:0;
margin:0;

}

#header .flashPad{
	width:1000px;
	height:149px;

}

#header .textPad{
	width:352px;
	height:41px;
	z-index:1;
	position:absolute;
	text-indent:-5000px;
	top:280px;
	right:50px;
}
#header .footerPad{
	width:1000px;
	position:absolute;
	height:49px;
	background:url(../images/footerPad.png) 0 0 no-repeat;
	z-index:1;
	top:310px;
}


#header img.logo{
	position:absolute;
	right:40px;
	top:30px;
	width:215px;
	height:81px;
}
#header h1{
	background:url(../images/slogan.gif) 0 0 no-repeat;
	width:484px;
	height:32px;
	position:absolute;
	left:411px;
	top:108px;
	text-indent:-10000px;
}
#header p{
	font:normal 12px/19px Arial, Helvetica, sans-serif;
	color:#fff;
	background-color:inherit;
	position:absolute;
	left:411px;
	top:142px;
}
#header p span.txt1{
	color:#fff;
	background-color:#1E6887;
}


/*------------------------------------------------header--------------------*/

/*------------------------------------------------body--------------------*/
#body{
float:none;
	width:1000px;
	margin:0 auto;
	background: #efefef url(../images/body-backer.jpg) repeat-x;
	padding-top:10px;
	
	}
/*------------------------------------------------/body--------------------*/


/*------------------------------------------------headerText--------------------*/
H1 {font-size:130%; padding-left:10px;}

#headerText{
	width:950px;
	margin:0 auto;
	color:#07492B;
	margin: 0 0 15px 10px;	
	}
	
#headerText span{
	font:bold 22px/28px Arial, Helvetica, sans-serif;
	color:#07492B;
	background-color:inherit;
	margin: 10px 10px;

}

/*------------------------------------------------/headerText--------------------*/

/*------------------------------------------------left--------------------*/
#left{
	width:295px;
	float:left;
	background:#efefef;
	margin:0;
	padding:0;
	height:300px;
}

.left {
	float: left;
	padding: 0 0px 0 0px
}

#left p.leftTxt{
	font:normal 16px/18px Arial, Helvetica, sans-serif;
	color:#07492B;
	padding:5px 10px;
}

/*------------------------------------------------left--------------------*/

#centrePanel {
float: left;
width:410px;
margin:0 0 0 0px;
height:300px;
background: #efefef url(../images/centre-backer.png) 0 0 no-repeat;
}
*html #centrePanel {
top:100px
}

#centrePanel #content {
height:240px;
overflow: hidden;
padding:2px 10px;
margin:5px auto;
}
#centrePanel #content H1 {
margin:0; padding:0; color:#124A23
}

#centrePanel #content p {
padding: 5px
}
#centrePanel #content .p1 {
float:left;
width: 175px; 
padding:2px;
margin-top:5px;
}
#centrePanel #content .p2 {
float:left;
width: 170px; 
padding:2px;
margin-top:5px;
margin-left:5px;
}
#centrePanel #content span.openquote {font-size:28px; color:#CCCCCC;}
#centrePanel #content span.endquote {font-size:28px; color:#CCCCCC;}

#centrePanelprojects {
background:#efefef;
float:right;
width:680px;

}
#centrePanelprojectsinc {
background:#efefef;
float:right;
width:700px;
height:300px;

}
#centrePaneldesign {
float:left;
padding: 5px 10px 5px 15px;
margin:0;
height:290px;
width:680px;
background: #efefef url(../panel/designs-panel-backer.png) no-repeat;
}
#centrePaneldesign #content {
height:265px;
overflow:hidden;
}
#centrePaneldesign #content H1 {
color:#124A23;
padding:0;
margin:0;
}
#centrePaneldesign #content p {
padding: 5px 10px
}
#centrePaneldesign #content .p1 {
float:left;
width: 200px; 
padding:2px 0px;
margin-top:5px;
}
#centrePaneldesign #content .p2 {
float:left;
width: 200px; 
padding:2px 10px;
margin-top:5px;
}
#centrePaneldesign #content .p3 {
float:left;
width: 200px; 
padding:2px;
margin-top:5px;
}
/*------------------------------------------------right--------------------*/
#right{
	width:295px;
	float:right;
	padding:0;
	margin:0;
}
#right .bio {
height:300px;
background-color:#efefef; 
/*background: #efefef url(../panel/ds-right-full.png) no-repeat;*/
margin:0 auto;
text-align:center
}
#right .bio img { padding:2px;}

#right p.rightTxt1{
	font:normal 18px/22px Arial, Helvetica, sans-serif;
	color:#07492B;
	background-color:inherit;
	padding:0 0 0 10px;
}

#right p.rightTxt2{
	font:normal 18px/22px Arial, Helvetica, sans-serif;
	color:#07492B;
	background-color:inherit;
	padding:10px 0 0 10px;
}


#right p.rightTxt1 span{
	font:bold 13px/18px Arial, Helvetica, sans-serif;
	color:#5F860B;
	background-color:inherit;
}

#image{
	width:300px;
	height:144px;
	background:url(../images/boarder.gif) 0 0 no-repeat;
	margin:0 0 4px 0;
	padding:5px 10px 6px 10px;
}
	
#right p.boxTxt1{
	float:left;
	border-left:#F9F9F1 solid 2px;
	font:normal 11px/16px "Trebuchet MS", Arial, Helvetica, sans-serif;
	width:255px;
}

#right p.boxTxt1 span{
	font:normal 19px/17px Arial, Helvetica, sans-serif;
	color:#A66400;
	background-color:inherit;
	margin:10px 0 10px;
	display:block;
	width:260px;
}

/*------------------------------------------------right--------------------*/

/*------------------------------------------------body--------------------*/

/*------------------------------------------------footer--------------------*/
#footer{ clear:both;
	width:1000px;
	height:57px;
	margin:0 auto;
	background: #efefef url(../images/footer-holder.jpg) no-repeat;
	color:#fff;
	position:relative;
}

#footer span.copyright{
	font:normal 90% Arial, Helvetica, sans-serif;
	color:#efefef;
	background:none;
	position:absolute;
	left:19px;
	top:30px;
	width: 500px;
}
#footer span.middot  {
font-size:28px; font-weight:bold; margin-top:5px
}
#footer span.copyright a, #footer span.copyright a:visited {
color:#efefef; text-decoration:none
}
#footer span.copyright a:hover {color:#000; text-decoration:none}
/*scroller function*/
div#scrollbar {
float:right;
    display:block; /* initially display:none; to hide from incapable */
    }

div#wn	{ 
    position:relative;
    width:240px; height:240px;
    overflow:hidden;
	}
    
div#scrollbar { 
  position:relative;
  margin-top:1px;
  right:5px;
  width:11px; height:240px; 
  font-size:1px;  /* so no gap or misplacement due to image vertical alignment */
  }
div#scrollbarprojects { 
  position:relative;
  right:5px;
  float:right;
  margin-top:1px;
  width:11px; height:200px;
  margin:0;
  padding:0; 
  font-size:1px;  /* so no gap or misplacement due to image vertical alignment */
  }
div#trackprojects { 
  position:absolute; left:0; top:12px;
  width:11px; height:176px;
  background: #89BB88;
  }  
   
div#track { 
  position:absolute; left:0; top:12px;
  width:11px; height:216px;
  background: #89BB88;
  }
div#dragBar {
  position:absolute; left:1px; top:1px;
  width:9px; height:20px;
  background-color:#fefefe;
  }  
div#up { position:absolute; left:0; top:0; }  
div#down { position:absolute; left:0; bottom:0; }

/* for safari, to prevent selection problem  */
div#scrollbar, div#track, div#dragBar, div#up, div#down {
    -moz-user-select: none;
    -khtml-user-select: none;
}


/* so no gap or misplacement due to image vertical alignment
font-size:1px in scrollbar has same effect (less likely to be removed, resulting in support issues) */
div#scrollbar img {
    display:block; 
    } 
/*------------------------------------------------footer--------------------*/
/* sIFR section */

/* These are standard sIFR styles... do not modify */
@media screen {
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
  }
  
  .sIFR-hasFlash h3 span {
	font-size: 30px;
	line-height:10px;
	visibility: visible;
	margin:0px;
	padding:0px;
}
  .sIFR-hasFlash h3 span .title {
	font-size: 30px;
	line-height:10px;
	visibility: visible;
	margin:0px;
	padding:0px;
}
}

@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
  }
}

/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {
  /* Example:
  .sIFR-active h1 {
    font-family: Verdana;
    visibility: hidden;
  }
  */
}