/* ----------------------------------------------------------------------------------------------------------
    
    Structure:
    display; position; float; z-index; overflow; width; height; margin; padding; border; background; align; font;

    Content:
    
        1) HTML tags, reset
        2) Universal styles (display, float, margin, text-align...)
        3) Layout
        4) Page: Home
        Z) Others
        
---------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------------
1) HTML tags, reset
---------------------------------------------------------------------------------------------------------- */

* {margin:0; padding:0;}
body, div, span, p, a, img, ul, ol, li, caption, table, thead, tbody, tfoot, tr, th, td, form, fieldset, legend, label, dl, dt, dd, blockquote, applet, object, h1, h2, h3, h4, h5 {border:0;}
body {padding:0px 0; font:0.8em/1.5 "arial", serif; text-align:center;}

a {text-decoration:none;}

h1, h2, h3, h4, h5, h6 {margin:10px 0 10px 0;}
h1 {font-size:260%; font-weight:normal; letter-spacing:-1px;}
h2 {font-size:160%; font-weight:normal;}
h3 {font-size:140%; font-weight:normal;}
h4, h5 {font-size:100%;}

p, table, ul, ol, dl, fieldset {margin:15px 0;}

table {border-collapse:collapse; border-spacing:0; font-size:100%;}
th {text-align:center; font-weight:bold;}
th, td {padding:3px 7px;}

ul, ol {margin-left:30px;}
ul ul, ol ol {margin:0; margin-left:20px;}
ol {list-style-type:decimal;}
li {display:list-item;}

dt {font-weight:bold;}
dd {margin-left:30px;}

fieldset {position:relative; padding:10px;}
legend {position:absolute; top:-1em; margin:0; padding:5px 10px; font-size:100%; font-weight:bold;}

/* ----------------------------------------------------------------------------------------------------------
2) Universal styles (display, float, margin, text-align...)
---------------------------------------------------------------------------------------------------------- */

.box {min-height:1px;}
.box:after {display:block; visibility:hidden; clear:both; line-height:0; font-size:0; content:".";}

.relative {position:relative;}

.clear {clear:both;}

.f-left {float:left !important;} img.f-left {float:left; margin-right:15px;}
.f-right {float:right !important;} img.f-right {float:right; margin-left:15px;}

.t-left {text-align:left !important;}
.t-center {text-align:center !important;}
.t-right {text-align:right !important;}
.t-justify {text-align:justify !important;}

.va-top {vertical-align:top;}
.va-middle {vertical-align:middle;}
.va-bottom {vertical-align:bottom;}

.nom {margin:0 !important;}
.nomt {margin-top:0 !important;}
.nomb {margin-bottom:0 !important;}

.noscreen {display:none;}

.bigger {font-size:110%;}
.smaller {font-size:85%;}
    
/* ----------------------------------------------------------------------------------------------------------
3) LAYOUT
---------------------------------------------------------------------------------------------------------- */
#top-bar { 
		text-align:center;  
		font-size:.7em;
		border-bottom: 3px solid #FF9900;
		background:#585858;
		padding-right:35px;
		text-decoration:none;} 
		
#main {width:780px; margin:auto; text-align:left;}

#design-web {width:780px; 
			background:#585858;
			margin:auto; 
			text-align:left;
			height:140px;
			white-space: nowrap;
			overflow: scroll;
			padding:10px;}
#design-elements {}

 /* slider specific CSS */


        .sliderGallery {
            background: url(http://spencerdavidson.ca/jquery/productbrowser_background_20070622.jpg) no-repeat;
            overflow: hidden;
            position: relative;
            padding: 10px;
            height: 160px;
            width: 560px;
        }
        
        .sliderGallery UL {
            position: absolute;
            list-style: none;
            overflow: none;
            white-space: nowrap;
            padding: 0;
            margin: 0;
        }
        
        .sliderGallery UL LI {
            display: inline;
        }
        
        .slider {
            width: 542px;
            height: 17px;
            margin-top: 140px;
            margin-left: 5px;
            padding: 1px;
            position: relative;
            background: url(http://spencerdavidson.ca/jquery/productbrowser_scrollbar_20070622.png) no-repeat;
        }
        
        .handle {
            position: absolute;
            cursor: move;
            height: 17px;
            width: 181px;
            top: 0;
            background: url(http://spencerdavidson.ca/jquery/productbrowser_scroller_20080115.png) no-repeat;
            z-index: 100;
        }
        
        .slider span {
            color: #bbb;
            font-size: 80%;
            cursor: pointer;
            position: absolute;
            z-index: 110;
            top: 3px;
        }
        
        .slider .slider-lbl1 {
            left: 50px;
        }
        
        .slider .slider-lbl2 {
            left: 107px;
        }
        
        .slider .slider-lbl3 {
            left: 156px;
        }

        .slider .slider-lbl4 {
            left: 280px;
        }

        .slider .slider-lbl5 {
            left: 455px;
        }

    
#header {position:relative;}

#logo {padding-top:25px; font-weight:normal; float:right;}	
      	  			  /*----------------------------------------------------------------------------------------------------------
				SEARCH DISABLED
      	  #search {position:absolute; bottom:15px; right:0; padding:7px;}
      	  #search #search-input {width:175px; padding:3px;}
      	  #search #search-submit {padding:2px; font:normal 100%/1.2 "arial",sans-serif;}
		---------------------------------------------------------------------------------------------------------- */

	#nav {clear:both; padding:0; border-left:0 !important; border-right:0 !important;}
   	#navbut {padding:0px 0pxm 0px 0px;}
    #nav ul {margin:0; padding:0; list-style:none; font:100%/1.8 Helvetica, Arial, sans-serif;}
    #nav ul li {display:inline; margin:0; padding:0;}
    #nav ul li a {display:block; float:left; padding:0px 40px 0px 0px; border:0;}
    #nav ul li#nav-active a {border:0; font-weight:bold;}

	#content {position:relative; padding:10px 0 30px 0; overflow:hidden;}

	#footer {clear:both; font-size:85%;}
	
	#bottom-bar {
		font-size:.7em;
		border-top: 13px solid #282828;
		background:#383838;}

/* ----------------------------------------------------------------------------------------------------------
4) Page: Home
---------------------------------------------------------------------------------------------------------- */

#topstory {float:right; width:500px; margin:20px 0px 0px 0px;}

#topstory-title {padding:15px;}
#topstory-title2 {padding:15px;}
#topstory-title h2 {margin:10; margin-bottom:2px;}
#topstory-title p.date {margin:0; font-size:85%;}
    
#topstory-perex {display:block; padding:15px 15px 15px 0px; font-size:110%;}
#topstory-perex p {margin:10px 0px 0px 15px; text-align:left;}

#aside {float:left; line-height:1.7em!important;;  width:260px; margin:0px 10px 0px 0px; text-transform:uppercase; text-align:left; font-size:80%;}

#photos {margin:0 35 35px; font-size:0; line-height:0;}
#photos a {border:2; border-bottom-color:#999999}
#photos img {display:block; float:left; width:150px; height:110px; margin-left:60px; border:0;}

.col30 {float:left; width:370px; clear:both;}
.col30.margin {margin:0 40px 0 0; border 0px 1px}

.col30 h4 {margin-bottom:3px;}
.col30 ul {margin:20px 0 !important;}
.col30 p.date {margin:0; font-size:85%;}
.col30 p.bb {padding-bottom:20px; background:url("../design/dot-02.gif") 0 100% repeat-x;}
.col30 p img.f-left {margin-right:10px;}
.col30 p {position:relative;}

/* ----------------------------------------------------------------------------------------------------------
Z) Others
---------------------------------------------------------------------------------------------------------- */

ul.ul-list {margin:15px 0; padding:0; list-style:none;}
ul.ul-list li {margin:0; margin-bottom:6px; padding:0; padding-left:20px; }

.hx-style01 {clear:both;font-size:.85em; background:url("../design/dot.gif") 0 50% repeat-x; }
.hx-style01 span {margin-left:15px; padding:0 5px; font-weight:bold;text-transform:uppercase;}

.hx-style02 {clear:both;}
.hx-style02 span {margin-right:15px; margin-top: 10px; padding:0 5 0 50px; font-weight:bold; text-transform:uppercase;}


a.ico-more {padding:5px 7px; border:0 !important;float:left; margin:0px 0px 15px 0px;}

.hidden {display: none;}

/* ----------------------------------------------------------------------------------------------------------
 Spencer
---------------------------------------------------------------------------------------------------------- */
.col99 {float:left; width:780px;}
.col99.margin {margin:0 40px 0 0;}
.col99 h4 {margin-bottom:3px;}
.col99 ul {margin:20px 0 !important;}
.col99 p.date {margin:0; font-size:85%;}
.col99 p.bb {padding-bottom:20px; background:url("../design/dot-02.gif") 0 100% repeat-x;}
.col99 p img.f-left {margin-right:10px;}
.col99 p {position:relative;}

/* forms.css */
label {font-weight:bold;}
fieldset {padding:1.4em;margin:0 0 1.5em 0;border:3px solid #606060;}
legend {font-weight:bold;font-size:1.2em; background: #00FF00}
input.text, input.title, textarea, select {margin:0.5em 0;border:3px solid #bbb;}
input.text:focus, input.title:focus, textarea:focus, select:focus {border:3px solid #666;}
input.text, input.title {width:695px;padding:5px;}
input.title {font-size:1.5em;}
textarea {width:695px;height:250px;padding:5px;}
.error, .notice, .success {padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}

/* slideshow */
#slideshow * { margin: 0; padding: 0; }
#slideshow { background: url('http://spencerdavidson.ca/BarackSlideshow/images/bg_shadow.gif') no-repeat top; position: relative; padding: 14px 0 15px; width: 603px; height: 306px; margin-left:70px;  }
#slideshow #menu, #slideshow #pictures, #slideshow #loading { position: absolute; }
#slideshow #loading { background: url('http://spencerdavidson.ca/BarackSlideshow/images/spinner2.gif'); display: block; top: 158px; left: 205px; text-indent: -5000px; width: 24px; height: 24px; visibility: hidden; z-index: 5; }
#slideshow #pictures { background: url('http://spencerdavidson.ca/BarackSlideshow/images/bg.jpg'); width: 437px; height: 277px; left: 0; overflow: hidden; }
#slideshow #pictures li { display: block; position: absolute; top: 0; width: 437px; }
#slideshow #menu { background: url('http://spencerdavidson.ca/BarackSlideshow/images/bg_side.jpg'); list-style-type: none; width: 166px; height: 257px; right: 0; padding-top: 20px; overflow:hidden}
#slideshow #menu li { display: block; z-index: 1000; position: relative; }
#slideshow #menu li a { display: block; font: 11px "Lucida Grande", "Verdana"; text-decoration: none; padding: 5px 0 7px 28px; z-index: 1000; color: #ccc; line-height: 14px; vertical-align: middle; }
#slideshow #menu li a:hover { color: #fb9a17; }
#slideshow #menu li.current a { font: 15px "Georgia"; color: #fff; padding: 5px 0 5px 28px; line-height: 18px; }
#slideshow #menu li.background { background: url('http://spencerdavidson.ca/BarackSlideshow/images/arrow.gif') no-repeat left center; position: absolute; font-size: 1px; height: 7px; width: 4px; z-index: 5; }