/*********************************************************
filename: stylesheet_main.css
author: harold haigh
purpose: truelivingcolour style sheet
*********************************************************/

/*********************************************************
				Elements
*********************************************************/

body { margin: 0px; padding: 0px; text-align: center; font-family: Arial, Helvetica, sans-serif; font-size:13px; background-image: url(images/body_bg.png); background-repeat: repeat-x;}
a img{border: 0px;}
h1 { position:relative; color:#666; font-size:19px; line-height: 25px; left:60px;}
h2 { color:#000; font-size:17px;}
a {color:#09F; font-weight:bold;}
a:hover, a:active { color: #F60; text-decoration:underline;}

/*********************************************************
				HEADER CONTAINER 
*********************************************************/

#header{position:relative; background-repeat: no-repeat; width:900px; height:75px; margin-left:auto; margin-right:auto;}

div#logo{position:relative; margin-left:auto; margin-right:auto; width:450px; top:0px; z-index:2;}

div#link_bg{position:absolute; width:900px; height:100px; left:-5px; top:0px;}

.blank{width:115px;	height:70px;}

div#home{position:absolute; background-image: url(images/home.png); background-repeat: no-repeat; height:95px; top:12px; left:7px; z-index:2;}
div#home:hover{ background-position: -121px 0;}

div#products_services{position:absolute; background-image: url(images/products_services.png); background-repeat: no-repeat; top:12px; left:117px; height:95px; z-index:2;}
div#products_services:hover{background-position: -121px 0;}

div#hints{position:absolute; background-image: url(images/hints.png); background-repeat: no-repeat; top:12px; left:229px; height:95px; z-index:2;}
div#hints:hover{background-position: -121px 0;}

div#links{position:absolute; background-image: url(images/links.png); background-repeat: no-repeat; top:12px; left:339px; height:95px; z-index:2;}
div#links:hover{background-position: -121px 0;}

div#contact_location{position:absolute; background-image: url(images/contact_location.png); background-repeat: no-repeat; top:12px; left:449px; height:95px; z-index:2;}
div#contact_location:hover{background-position: -121px 0;}

div#studio_tv{position:absolute; background-image: url(images/studio_tv.png); background-repeat: no-repeat; top:12px; left:559px; height:95px; z-index:2;}
div#studio_tv:hover{background-position: -120px 0;}

div#howarth_aviation{position:absolute; background-image: url(images/arial_photo.png); background-repeat: no-repeat; top:13px; left:669px; height:95px; z-index:2;}
div#howarth_aviation:hover{background-position: -121px 0;}

div#stuart_rose{position:absolute; background-image: url(images/architecture_landscapes.png); background-repeat: no-repeat; top:12px; left:779px; height:95px; z-index:2;}
div#stuart_rose:hover{background-position: -121px 0;}

/*********************************************************
				Footer CONTAINER 
*********************************************************/

#footer{position:relative; width:100%; height:auto; background-color:#555555;}
ul.mainLinkUl {padding-top: 10px; list-style: none; text-align:center;}
li.mainLinkLi { display:inline; margin: 0; line-height: 5px; padding-left:5px; color:#CCC;}
ul.secondaryLinkUl {padding: 5px; list-style: none; text-align:center; background-color:#333333;}
li.secondaryLinkLi { display:inline; margin: 0; line-height: 30px; padding-left:5px; color:#CCC;}
#footer a { color:#CCC; font-weight:bold; text-decoration:none; }
#footer a:hover, #footer a:active { color:#FFF; text-decoration:underline; }

/*********************************************************
	contextual selectors IDs/classes/elements
*********************************************************/

#container{position:relative; margin-left:auto; margin-right:auto; width:900px; height:auto; text-align: justify; background-color:white;}
#cb{clear:both;}
#contentleft{float:left; width:430px; padding-left:60px;}
#contentright {position:absolute; right:60px; top:200px; width: 260px; background-image:url(images/rightbg.jpg); background-repeat:repeat-y; padding: 10px 15px 5px 10px;}
#contentright2 {position:absolute; right:50px; top:780px; width: 300px;}
#link_header{position:absolute; width: 200px; left:150px;}
#full {position:relative; background-image: url(images/linksBox_bg.png); background-repeat: repeat-y; width:680px; left:150px; padding-top:10px; padding-bottom:20px;}
#full table tr td { 
	text-align:center;
}

#container_contact{position:relative; margin-left:auto; margin-right:auto; width:900px; height:auto; text-align: justify;}
#contactleft {position:relative; width: 190px; left:40px; text-align: left; padding-top: 10px; padding-left: 20px;}
#contactright {position:absolute; float:right; width: 546px; top:180px; right:0px;}
#contactright img {width: 546px; height: 260px;}
#map {position:relative; left:100px; top:0px; width: 350px; z-index:99}
#googlemap{position:relative; margin-right:auto; margin-left:auto;  border:1px solid #78e8e9; width:425px; height:350px;}

#pasleft {position:relative; left:40px; width: 400px; padding-left:20px; padding-top:5px;}
#pasright {position:absolute; right:40px; top:190px; width: 350px; height:420px; padding-right: 0px; text-align:center; background-image: url(images/bgpasmenu.png); background-repeat: repeat-y;}
#pasright table{ border: 1px solid #FFC;}
#pasright table tr{ background-color: #FFFFCC;}
#pasright table tr td {text-align:left; padding: 2px 4px 2px 4px;}
#prod_serv_table{padding:5px; border:1px solid black; background-color:#555555;}
#prod_serv_table td{font-size:x-small; text-align:center; padding:5px; border:1px solid black; background-color:#333333;}
#prod_serv_table a { color:white; text-decoration:none; }
#prod_serv_table a:hover, #prod_serv_table a:active { color: #09F; text-decoration:underline;}
#pasright2 {position:absolute; right:40px; top:640px; width: 350px; height:400px; padding-right: 10px; text-align:justify;}


/* Image divs in products and services page */
img#moviefilm_dvd{float:left; padding-right:10px;}
img#caricature_art{float:right; padding-left:10px;}
img#recycle{float:right; padding-left:10px;}
img#videotape_dvd{float:right; padding-left:10px; width:231px; height:140px;}
img#photo_shoebox{padding-right:10px;}
img#colorslide_processing{float:left; padding-right:10px;}
img#slide_dvd{float:left; padding-right:10px;}
img#fairy_art{float:left; padding-right:10px;}
img#old_art{float:left; padding-right:10px;}
img#restoration_photo{float:right; padding-left:10px;}

/* Slide Show */
div#slideshow {
width: 430px; height: 295px; padding-left:0px;
background-image: url(images/slide_bg.png); background-repeat: no-repeat;
overflow: scroll; /* Allows the slides to be viewed using scrollbar if Javascript isn't available */
position: relative; z-index: 5;
}

div#slideshow ul#nav {
display: none;
list-style: none;
position: relative; top: 210px; z-index: 15;
}

div#slideshow ul#nav li#prev {
position:absolute; top:-105px; left:23px;
}

div#slideshow ul#nav li#next {
position:absolute; top:-105px; right:-7px;
}

div#slideshow ul#nav li a {
display: block; width: 80px; height: 80px; text-indent: -9999px;
}

div#slideshow ul#nav li#prev a {
background-image: url(images/previous.png); background-repeat:no-repeat;
}

div#slideshow ul#nav li#next a {
background-image: url(images/next.png); background-repeat:no-repeat;
}

div#slideshow ul#slides {
list-style: none;
margin-left:auto;
margin-right:auto;
}

div#slideshow ul#slides li {
margin-left:auto;
margin-right:auto;
}
	
img.centerSlides{
position:relative;
width:390px;
top:6px;
left:20px;
}

/* End of Slide Show */