﻿/*************************************************
Design:  Photograph Your World css style sheet 
Author:  Barry Harman  
Version: 2.1   
Date created:Aug 20, 2007 Last update: 15 November 2009
**************************************************/

/* =Textual */
/*** Sets body, text and main div attrbutes ***/
body {font-family: Verdana, Garamond, Helvetica; background: white; text-align:center; background-color: white;}
h1, h2, h3 { font-family: Verdana, Garamond, Helvetica; }
h1 { margin-top: 5px; margin-left: 20px; font-size: 100%; color: #303030; font-weight: bold; } /*sets main content headings */
h1.a {position:relative; margin-top: 7px; margin-bottom: 0px; margin-left: 10px; text-align: center; font-size: 70%; color: #303030; font-weight: bold; } /*sets main content headings */
h2 { margin-left: 20px; text-align: justify; font-size: 100%; color:#202020; font-weight: normal; }/*sets secondary content headings and bullet lists*/
p { margin-left: 20px; text-align: justify; font-size: 100%; color: #202020; }
p.copyright { text-align: center; font-size: 70%; color: #202020; }
p.margins { margin-top: 0px; margin-bottom: 0px; margin-left: 2px; margin-right: 2px; text-align: left; font-size: 100%; color: #202020; }
p.t{ margin-top: 0px; margin-bottom: 0px; margin-left: 2px; margin-right: 20px; text-align: justify; font-size: 95%; color: #202020; }
.banner {border-style:none;}
.Logo1 {border: 0px; width: 70px; height: 74px }
.Logo2 {border: 0px; width: 156px; height: 74px }
#Address{ float:left; position:relative; display:inline; margin-left: 10px; margin-right:5px; width:146px; height:98px; margin-top: -16px; background-position: right; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif');padding-right: 24px;}
#MainNav { float:left; display:inline; margin-left: 25px; margin-right:5px; width:131px; height: 500px; margin-top: 0px;}
#ContentBannerHead { position:relative;  margin-top: -18px; float: left; width: 750px; height: 100px; border-style: none; text-align: center; background-position: left; background-repeat:no-repeat; padding-left: 30px; }
#ContentAboutUs { float: left; margin-top: -2px; width: 750px; height: 525px;  background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px;}
#ContentLogin { float: left; margin-top: -2px; width: 723px; height: 465px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; }
#ContentContactUs { float: left; margin-top: -2px; width: 723px; height: 465px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left:30px; }
#ContentMainGalleryLinks { float: left; margin-top: -2px; width: 775px; height: 510px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; }
#ContentMainGallery { float: left; margin-top: -2px; width: 723px; height: 574px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; padding-bottom:10px; }
#ContentClientGallery { float: left; margin-top: -2px; width: 732px; height: 660px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; }
#ContentTC { float: left; margin-top: -2px; width: 723px; height: 560px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; }
#ContentPricesC { float: left; margin-top: -2px; width:797px; height:640px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; }
#ContentPricesL { float: left; margin-top: -2px; width:797px; height:535px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left: 30px; }
#ContentLinks { float: left; margin-top: -2px; width: 723px; height: 798px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left:30px; }
#ContentServices { float: left; margin-top: -2px; width: 723px; background-position: left;background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left:30px; }
#ContentServicesC { float: left; margin-top: -2px; width: 723px; height: 500px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left:30px; }
#ContentServicesL { float: left; margin-top: -2px; width: 723px; height: 500px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left:30px; }
#ContentTestimonial { float: left; margin-top: -2px; width:797px; height:758px; background-position: left; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif'); padding-left:30px; }
#SecNavWrapper {  width:1000px; }
#SecNavIndent { float:left; display:inline; width:171px; margin-left: 9px; margin-bottom: 0px; background-position: right; background-repeat:no-repeat; background-image:url('../Icons/vertical.gif');font-size: 80%; font-weight: normal; border-top: 2px solid gray; }
#SecNav { float: left; display:inline; text-align: center; width:818px; margin-left: -10px; margin-right: 0px;  margin-bottom: -2px; font-size: 80%; font-weight: normal; border-top: 2px solid gray; }
#Footer1 { margin-left: 8px; margin-right: 11px; color:#202020; text-align: center;  font-size: 80%; font-weight: bold; border-top: 2px solid gray; }
#Footer2 { margin-left: 20px; margin-right: 30px; color:#202020; font-size: 80%; text-align: center;  font-weight: normal; }
#Footer3 { margin-left: 20px; margin-right: 30px; color:#202020; font-size: 80%; text-align: center;  font-weight: normal; }
div.box1 { margin: 0 auto; text-align:center; }
div.box2 { margin: 0 auto; text-align:center; }
/* =Boxes */	
/***   Sets up 2 round corner content boxes, top for banner and bottom for content   ***/
#box1 { width:1005px; margin: 0 auto; text-align:left; }
.boxtop1 {
	/*make this the same size as the top image*/
	display:block;
	width:1000px;
	height:28px;
	margin-left:1px;
	/*set the image as a background*/
	background-position: left top;	
	background-repeat:no-repeat;	
	background-image:url('../Icons/top.gif');}

/*Defines the bottom of a curved corner box for the page banner */
.boxbottom1 {
	/*make this the same width as the bottom image*/
	/*don’t set the height as this needs to be flexible*/
	display:block;	
	height: 98px;
	width:1000px;	
	/*set the image as a background*/
	background-position: left bottom;
	background-repeat:no-repeat;
	background-image:url('../Icons/bottom.gif') ;
	padding-bottom:0px;	
	margin-left:1px; }	


/*Defines the top of a curved corner box for the page contents */
.boxtop2 {
	/*make this the same size as the top image*/
	display:block;
	width:1000px;
	height:30px;
	margin-left:1px;
	background-image:url('../Icons/top.gif');
	background-position:left top;	
	background-repeat:no-repeat; }	
.preDivider {
	/*puts a visual divider in*/
float:left;
	padding-top:0px;
	width:185px;
	margin-top:9px;
	background-position:161px;
	background-repeat:no-repeat;
	background-image:url('../Icons/vertical.gif'); }
.postDivider {
	/*sets up space after visual divider*/ 
	display:inline;
	width: 100%;
	margin-top:6px;}
	/* hide from IE-mac \*/
	* html .left { margin-right: -3px; }
	* html .right { margin-left: 0px; } 
	/* end hide */ 	
.Spacer {
	/*puts a visual divider in*/
	background-repeat:no-repeat;
	background-image:url('../Icons/vertical.gif'); }
/*Defines the bottom of a curved corner box for the page contents */
.boxbottom2 {
	/*make this the same width as the bottom image*/
	/*don’t set the height as this needs to be flexible*/
	width:1000px;	
	/*set the image as a background*/
	background-position: left bottom;
	background-repeat:no-repeat;	
	background-image:url('../Icons/bottom.gif');
	padding-bottom:1px;	
	margin-left:1px;
	margin-top:-3px; }	

/* =Specific */	
/***  Sets login table attributes  ***/
table.logdetails {
	margin-left:auto; 
	margin-right:auto;
	border-style:ridge;
	border-color:#cb8700; }
input.logCell {
	border-style:ridge;
	border-color:#cb8700; }
/***  Sets T and C text box attributes  ***/
textarea.terms  {
	border-style:ridge;
	border-color:#cb8700; }
/***  Sets T and C text box attributes  ***/
/*** Sets focus area of forms light orange,brown ***/
input:focus, textarea:focus { background-color:#ffd790; border: 1px solid #ffaf40; }
/***   Buffer between content area  and footer ***/
.clear { clear:both; }
/* Clears the float assigned to the BR tag */
.clearit {
	clear: both;
	height: 0;
	line-height: 0.0;
	font-size: 0; }
	
/*** Sets list attrbutes: bulets, colour and word wrap ***/
.bullet { margin-top:-10px; list-style: outside; list-style-image: url("../Icons/butterfly2.gif"); }
.firstLine { margin-top:-7px; }

/* =Table*/
/*** Sets Prices table attributes ***/
table#prices1 {margin-left: auto; margin-right:auto; width:80%; line-height:100%; border:0;}
td p.special { 
	margin-top: 3px;
	margin-bottom: 3px;
	text-align: center;  
	font-weight: bold; }
td.priceCell { 
	width: 50%;
	border-style:ridge;
	border-color:#cb8700; 
	background-color: #FFDD90; }

/***   Sets Single photo and Home page Gallery Link and Table Attributes  ***/
table#AboutUsSinglePhoto {
	float:right;
	margin-left: auto; 
	margin-right: auto;
	margin-left: 20px;
	margin-top: 5px;
	margin-bottom: 20px;
	height: 220px;
	width: 170px;
	border-style: ridge; 
	background-color: #000000; }

.AboutUsPhoto{  border: 3px ridge #997000; padding:10px 10px 10px 10px; }
.AboutUsPhotoInset{  border: 1px ridge #997000; }
#tableWrapper { margin-left:20px; }
table#singlePhoto {
	margin-left:auto; 
	margin-right:auto;
	margin-top: 5px;
	height:160px;
	width:112px;
	border-style: ridge; 
	background-color: #000000; }

.photo{ border: 3px ridge #997000; padding:10px 17px 10px 17px; }
.photoInset{ border:solid 1px; border-color:#997000; }

/***   Sets Home page Gallery Link and Table Attributes  ***/
table#home_page_gallery {
	float:left; 
	margin-top:5px;
	height:306px;
	width:55%;
	border-style: ridge;
	
	background-color: #000000;
	table-layout: auto; display:inline;}

.cell{width:50%; border: 3px ridge #997000; padding:17px 17px 17px 17px; }

#photo-gallery1{ height:250px; width:365px; border: 3px ridge #997000; }

#home_page_gallery_links {
	float:right;display:inline;
	width: 38%;
	text-align:left; 
	margin-left:0px;
	margin-right:20px;
	margin-bottom:-5px;
	background-color: #FFFFFF;
 }
/* =Links*/
/***   Sets Index page links attributes  ***/
#ContentMainGalleryLinks a:link { text-decoration: none; color: black; font-size: 90%; border: 0; }
#ContentMainGalleryLinks a:visited { text-decoration: none; color: #997000; font-size: 90%; border: 0; }
#ContentMainGalleryLinks a:hover, a:active { text-decoration: none; color: #cb8700; font-size: 90%; }
/***   Sets Services page links attributes  ***/
#ContentServicesC a:link { text-decoration: none; color: #cb8700; font-size: 100%;font-weight: bold; }
#ContentServicesC a:visited { text-decoration: none; color: #cb8700; font-size: 100%;font-weight: bold; }
#ContentServicesC a:hover, a:active { text-decoration: none; color: #997000; font-size: 100%;font-weight: bold; }
/***   Sets Services page links attributes  ***/
#ContentServicesL a:link { text-decoration: none; color: #cb8700; font-size: 100%;font-weight: bold; }
#ContentServicesL a:visited { text-decoration: none; color: #cb8700; font-size: 100%;font-weight: bold; }
#ContentServicesL a:hover, a:active { text-decoration: none; color: #997000; font-size: 100%;font-weight: bold; }
/***   Sets Contact us page links attributes  ***/
#LinksCU a:link { text-decoration: none; color: black; font-size: 100%; }
#LinksCU a:visited { text-decoration: none; color: #997000; font-size: 100%; }
#LinksCU a:hover, a:active { text-decoration: none; color: #cb8700; font-size: 100%; }
/***   Sets Prices page links attributes  ***/
#LinksP a:link { text-decoration: none; color: #997000; font-size: 100%; }
#LinksP a:visited { text-decoration: none; color: #997000; font-size: 100%; }
#LinksP a:hover, a:active { text-decoration: none; color: #cb8700; font-size: 100%; font-weight: bold; }
/***   Sets T&C page links attributes  ***/
#LinksTC a:link { text-decoration: none; color: #997000; font-size: 100%; }
#LinksTC a:visited { text-decoration: none; color: #997000; font-size: 100%; }
#LinksTC a:hover, a:active { text-decoration:none; color: #cb8700; font-size: 100%; font-weight: bold; }
/***   Sets link page attributes  ***/
#ContentLinks a:link { text-decoration: none; color: black; font-size: 100%; }
#ContentLinks a:visited { text-decoration: none; color: #cb8700; font-size: 100%; }
#ContentLinks a:hover, a:active { text-decoration: none; color: #997000; font-size: 100%; font-weight: bold; }
/***   Sets Testimonial page attributes  ***/
#ContentTestimonial a:link { text-decoration: none; color: black; font-size: 100%; }
#ContentTestimonial a:visited { text-decoration: none; color: #cb8700; font-size: 100%; }
#ContentTestimonial a:hover, a:active { text-decoration: none; color: #997000; font-size: 100%; font-weight: bold; }
/***   Sets footer link attributes  ***/
a.links:link { text-decoration: none; color: black; font-size: 90%; }
a.links:visited { text-decoration: none; color: #cb8700; font-size: 90%;font-weight: normal; }
a.links:hover, a.links:active { text-decoration: none; color: #997000; font-size: 90%; font-weight: normal; }

#LinksCOF a:link { text-decoration: none; color: #cb8700; font-size: 100%;font-weight: bold; }
#LinksCOF a:visited { text-decoration: none; color: #cb8700; font-size: 100%;font-weight: bold; }
#LinksCOF a:hover, a:active { text-decoration: none; color: #997000; font-size: 100%;font-weight: bold; }

/* =MainNav*/
/***   Sets attributes for side navigation button pull down vertical menu ***/	
#dropmenu, #dropmenu ul {
	padding: 0;
	margin: 0;
	list-style: none;
	font-family: verdana, Arial, Helvetica, sans-serif; }
/*Aligns button text centre and black, removes bullets, sets spacing. */
#dropmenu a{
	text-align: center;
	display: block;
	text-decoration: none;
	font-size: 95%;
	color: black;
	height: 20px; /*sets height of pull down menu block */
	width: 116px; /*sets width of pull down menu block */
	padding: 4px 4px 0px 0px;
	background-image: url(../Icons/menu_button1.gif);
	background-repeat: no-repeat; }
/* The Root-Level list items. Sets height and width of menu button, text colour black */
#dropmenu ul li a  {
	color: black;
	height: 21px; /*sets height of pull down menu block */
	width: 120px; /*sets width of pull down menu block */ }
/* Sub-Menu positioned Absolutely to allow them to appear below their root trigger.
Set to display none to hide them until trigger is moused over.*/
#dropmenu li ul {
	float:left;
	width:100px;
	position: relative;
	display: none; }
/* Sets hovered button image */
#dropmenu ul li a:hover {background: url('../Icons/menu_button2.gif') no-repeat;}
/* Changes the icon when moused over */
#dropmenu li:hover a { background: url('../Icons/menu_button2.gif') no-repeat; font-weight: bold; }
#dropmenu a:active,#dropmenu a:focus { background: url('../Icons/menu_button2.gif') no-repeat; font-weight: normal; }
/* Set the Sub-Menu UL to be visible when its associated
Root-Level link is moused over. */
#dropmenu li:hover ul { display:block;}
/* Sets the Text color of the Sub-Level links when the Root-Level
menu items are moused over. */
#dropmenu li:hover ul a { 
    display:block; height: 20px; /*sets height of pull down menu block */
	width: 100px; /*sets width of pull down menu block */
	color: black;
	font-weight: normal; 
	padding:0px 0px 0px 0px;
	text-align: center;	
	margin-left: 10px;	
 	margin-top: -1px; 
	background: url('../Icons/drop_button1.gif') no-repeat; color:black!important; }

#dropmenu ul .top a:hover { font-style: italic;background: url('../Icons/drop_button2.gif') no-repeat; color:black!important; }
#dropmenu ul .bot a:hover { font-style: italic;background: url('../Icons/drop_button2.gif') no-repeat; color:black!important; }

#dropmenu li { width: auto; }

#nav-home { padding-bottom: 10px; }
#nav-about-us{ padding-bottom: 10px; padding-top: 30px;}
#nav-contact-us { padding-bottom: 10px; padding-top: 30px;}
#nav-terms { padding-bottom: 10px; padding-top: 30px;}
#nav-testimonial { padding-bottom: 10px; padding-top: 30px;}
#nav-client_images { padding-bottom: 10px; padding-top: 30px;}
.topbutton { padding-bottom: 10px; padding-top: 30px; }

/* =SingleButton*/
/***   Sets attributes for single link buttons ***/
table.button_position { padding-left: 20px; margin-left: auto; margin-right: auto; }
/* Bullets off. Padding and margins zeroed*/
#buttons {
	padding: 0px;
	margin: 0px;
	list-style: none;
	font-family: verdana, Arial, Helvetica, sans-serif; }
/*Aligns button text centre and black, removes bullets, sets spacing. */
#buttons a{
	text-align: center;
	display: block;
	text-decoration: none;
	font-size: 95%;
	color: black;
	height: 22px; /*sets height of pull down menu block */
	width: 100px; /*sets width of pull down menu block */
	padding: 0px 0px 0px 0px;
	background-image: url(../Icons/Single_Button1.gif);
	background-repeat: no-repeat; }

/* Sets hovered button image */
#buttons ul li.topmenu a:hover {background: url('../Icons/Single_Button2.gif') no-repeat; }
/* Changes the icon when moused over */
#buttons li:hover a, #buttons a:focus,
#buttons a:active { background: url('../Icons/Single_Button2.gif') no-repeat; } 
/* Set the Sub-Menu UL to be visible when its associated Root-Level link is moused over. */
#buttons li:hover ul { display:block;}
/* Sets the Text color of the Sub-Level links when the Root-Level
menu items are moused over. */
#buttons li:hover ul a { color: black; }
#buttons ul a:hover { background: url('../Icons/Single_Button2.gif') no-repeat;color: black!important; }
#buttons li { width: 120px; }
#nav-client-login{ padding-bottom: 15px; }
#nav-print-prices{ padding-bottom: 15px; }
#nav-TCs{ padding-bottom: 15px; }