/*************************************
*                                    *
*       Paul Peek Photography        *
*           01502 514644             *
*                                    *
*    All content copyright © 2009    *
*                                    *
*************************************/

body {

	behavior: url("scripts/csshover3.htc");

	background-image: url(../images/bg2.gif);
	background-position: center top;
	background-repeat: repeat-x;
	background-color: #07224e;
	
	margin: 0px;
	
	font-family: Arial, Verdana, Helvetica, san-serif;
	font-size: 12px;
	color: #666666;
	
	text-align: center;
}

.clear { clear: both; }

#wrap {
	width: 1200px; height: 800px;
	
	left: 50%; margin-left: -600px;
	position: absolute; z-index: 1;
}
#wrap2 {
	width: 900px;
	margin: 0 auto;
	text-align: left;
}
#contain {
	width:900px;
	float: left;
}


.blend img {
opacity: 0;
-moz-opacity: 0;
-khtml-opacity:0;
filter: alpha(opacity=0);
}


/* Splash Page */

#splash_wrap {
	width:940px;
	margin: 0 auto;
	margin-top: 50px;
	text-align: center;
}

#splash_links {
	width: 940px; height: 475px;
	float: left;
	margin-top: 25px;
}

#splash_footer {
	width: 940px;
	float: left;
	margin-top:-25px;
}

a.splash_weddings {
	width:300px; height: 475px;
	background-image: url('../images/splash_weddings.png');
	float: left;
}
a.splash_portraits {
	width:300px; height: 475px;
	background-image: url('../images/splash_portraits.png');
	margin: 0px 20px 0px 20px;
	float: left;
}
a.splash_commercial {
	width:300px; height: 475px;
	background-image: url('../images/splash_commercial.png');
	float: left;
}
a.splash_weddings:hover, a.splash_portraits:hover, a.splash_commercial:hover { background-position: 0px -475px; }

.splash_blue { font-size: 16px; color: #22baea; }
.splash_white { font-size:12px; color: #ffffff; }
.splash_tiny { font-size:9px; color: #ffffff; }

/*============================================================
  Page Header
============================================================*/

#TopHeader { width:900px; height: 74px; margin-top: 20px; }

#TopHeaderLeft {
	width:300px;
	float: left;
}

#TopHeaderRight {
	width:600px;
	margin-top: 30px;
	float: left;
	text-align: right;
}

/*============================================================
  Page Header / Menu Navigation
============================================================*/

#bodyHead { width: 900px; height: 32px; margin-top: 20px; }

.bodyHeadLC {
	display: block;
	width: 8px; height: 32px;
	background-image: url(../images/menu_left.gif);
	background-repeat: no-repeat;
	float: left;
}

#bodyHeadCont {
	width: 900px; height: 32px;
	background-image: url(../images/menu_repeat.gif);
	background-repeat: repeat-x;
	float: left;
}

.bodyHeadRC {
	display: block;
	width: 8px; height: 32px;
	background-image: url(../images/menu_right.gif);
	background-repeat: no-repeat;
	float: left;
}

/*============================================================
  Page Content Container 
============================================================*/

#Container {
	width: 900px;
	background-color: #ffffff;
	float: left;
}

#top_bar {
	width: 900px; height: 15px; overflow: hidden;
	background-image: url(../images/top_bar.gif);
	background-repeat: repeat-x;
	background-position: top;
}
.top_bar_text {
	display: block;
	margin: 2px 0px 0px 20px;
	font-size: 14px;
	color: #93cdfe;
	font-weight: bold;
}

.top_coloured_bar {
	display: block; overflow: hidden;
	width:900px; height: 3px;
	background-color: #bbbbbb;
	margin: 0px 0px 0px 0px;
}

#Content {
	width: 900px;
	float: left;
}

.bottom_shadow {
	display: block; overflow: hidden;
	width: 900px; height: 4px;
	background-image: url(../images/bottom_shadow.gif);
	background-repeat: repeat-x;
}


/* EVERY PAGE */

#pageHeader {
	width:900px; height:175px;
	position: relative;
}
#pageHeaderTitle {
	width: 100%; height: 33px;
	background-color: #ffffff;
	border-bottom: 1px #eeeeee solid;
	position: absolute;
	bottom: 0px; left: 0px;
	
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}
#pageHeader h1 {
	width: 100%; height: 33px;
	margin: 0px; padding: 0px; padding-left: 30px;
	line-height: 31px; font-weight: normal;
	color: #373737; font-size: 16px;
	position: absolute;
	bottom: 0px; left: 0px;
}


/*============================================================
  Every Page Left Hand Column 
============================================================*/

#bodyLeftColumn {
	width: 250px; height: 460px;
	margin-top: 0px;
	border: 0px;
	float: left;
}

.LeftBox {
	width: 190px;
	margin: 20px 20px -8px 28px;
	padding: 0px 0px 0px 0px;
}

.LeftBoxInner {
	margin: 0px;
	padding: 9px 0px 5px 8px;
	background-color: #eeeeee;
	border: 2px #4c7eae solid;
	border-top: 0px;
	border-bottom: 0px;
}
.LeftBoxInnerCont {
	width: 190px; padding: 0px;
	margin: 0px;
}
.LeftBoxInnerContTest {
	width: 190px;
	padding: 0px;
	margin: 0px;
	position: relative;
}
.LeftBoxInnerContTestInner {
	width: 170px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 2px 10px;
	text-align: center;
}


/*============================================================
  Every Page Right Hand Column 
============================================================*/

#bodyRightColumn {
	width: 626px;
	height: 410px;
	margin: 20px 0px 0px 0px;
	float: left;
}

#bodyFullColumn {
	width: 836px;
	margin: 30px 0px 0px 30px;
	padding: 0px 0px 20px 0px;
	float: left;
}


#bodyLeft {
	width:550px; min-height: 100px;
	margin-right: 36px;
	float: left;
}

#bodyRightCol {
	width: 250px; min-height: 100px;
	float: left;
}

.rightImageWrap {
	width: 250px;
	padding-bottom: 15px;
	float: left;
}

.rightImageBoxP {
	width: 250px; height: 370px;
	border: 1px #cccccc solid;
	background-color: #f1f1f1;
	float: left;
}

.rightImageBoxP img { width:240px; height: 360px; margin: 5px 5px 0px 5px; background-color: #ffffff; }

.rightImageBoxLS {
	width: 250px; height: 170px;
	border: 1px #cccccc solid;
	background-color: #f1f1f1;
	float: left;
}

.rightImageBoxLS img { width:240px; height: 160px;	margin: 5px 5px 0px 5px; background-color: #ffffff; }


/* HOME PAGE PHOTO BOX */

#homeRotatingPhotos {
	width: 856px; height: 416px;
	padding: 0px;
	background-color: #eeeeee;
}

#homeRotatingPhotosInner {
	width: 840px; height: 400px;
	margin: 8px 0px 0px 8px;
	background-color: #ffffff;
	overflow: hidden;
	position: absolute; z-index: 1;
}

.rightImageBox {
	margin: 0px 0px 0px 30px;
	float:right;
}


/*============================================================
  Page Footer 
============================================================*/

#bodyFoot { width: 900px; height: 61px; float: left; }

.bodyFootLC {
	display: block;
	width: 9px; height: 61px;
	background-image: url(../images/bottom_leftcorner.gif);
	background-repeat: no-repeat;
	float: left;
}

#bodyFootCont {
	width: 900px; height: 61px;
	background-image: url(../images/bottom_repeat.gif);
	background-repeat: repeat-x;
	float: left;
}

#bodyFootLeft {
	margin: 5px 10px 0px 10px;
	float: left;
}

#bodyFootRight {
	margin: 7px 10px 0px 10px;
	float: right;
	text-align: right;
}

.bodyFootRC {
	display: block;
	width: 9px; height: 61px;
	background-image: url(../images/bottom_rightcorner.gif);
	background-repeat: no-repeat;
	float: left;
}

#outerFoot { width: 900px; height: 60px; float: left; }

#outerFootLeft {
	margin: 15px 10px 0px 10px;
	float: left;
}

#outerFootRight {
	margin: 15px 10px 0px 10px;
	float: right;
	text-align: right;
}

/*============================================================
  Every Page General 
============================================================*/

a.logolink { display: block; padding: 11px 10px 0px 15px; float: left; }


/*============================================================
  Products 
============================================================*/

.productRow {
	width:840px; height: 400px;
	margin: 20px 0px 0px 0px;
	float: left;
}

.productWrap {
	width: 170px; height: 400px;
	margin: 0px 20px 0px 20px;
	float: left;
}

.productBox {
	width: 170px; height: 200px;
	border: 1px #cccccc solid;
	background-color: #f1f1f1;
	float: left;
}

.productPhoto {
	width:160px; height:190px;
	margin: 5px 5px 0px 5px;
	background-color: #ffffff;
	float: left;
}

.productText {
	width:160px; height: 100px;
	margin: 10px 0px 0px 0px;
	float: left;
}

/*============================================================
  Contact Page
============================================================*/

.pageContactLeft {
	width: 300px;
	height: 340px;
	margin: 0px 10px 0px 0px; 
	float: left;
}

.pageContactBox {
	width: 300px; height: 180px;
	margin: 0px 10px 10px 0px; 
	float: left;
	text-align: right;
}

#pageContactMapBox {
	background-color: #ffffff;
	padding: 3px;
	border: 1px #dddddd solid;
}
#pageContactMapBox:hover {
	border: 1px #eeeeee solid;
}

#pageContactMapBoxInner {
	width:300px; height: 300px;
}

/*============================================================
  Links
============================================================*/

.links_box {
	width: 200px;
	height: 75px;
	float: left;
	text-align: center;
}


/*============================================================
  Clients
============================================================*/

.clientsLogoBox {
	height: 84px;
	margin: 8px; margin-right: 7px;
	padding: 4px 4px 0px 4px;
	background-color: #eeeeee;
	float: left;
}


/*============================================================
  Gallery pages
============================================================*/

#pageGalleryBox {
	float: left;
}

#GalleryMenu {
	margin: 15px 10px 0px 0px;
	float: left;
}

#GalleryRotatingPhotoBox {
	width: 590px; height: 397px;
	border: 1px #dddddd solid;
	margin: 15px 0px 0px 15px;
	float: left;
	overflow: hidden;
	position: relative;
	background-image: url('../images/gallery_loading.gif');
	background-position: 5px 5px;
}

#GalleryCopy {
	margin: 5px 5px 0px 5px; width: 580px; height: 387px; position: absolute; top: 0px; left: 0px; z-index: 9; overflow: hidden; }

#GalleryRotatingPhoto {
	width: 580px; height: 387px;
	margin: 5px 5px 0px 5px;
	overflow: hidden;
	position: absolute; z-index: 2;
}

#GalleryMenu ul {
	margin: 0px; padding: 0px;
	list-style: none;
}

#GalleryMenu ul li a {
	display: block;
	width: 200px; height: 28px;
	background-image: url('../images/gallery_menu.gif');
	border: 0px;
	margin: 0px 0px 1px 0px;
	padding-left: 15px;
	line-height: 28px;
	font-size: 14px;
	color: #777777;
	text-decoration: none;
	overflow: hidden;
}

#GalleryMenu ul a:hover { background-position: 0px -28px; color: #ffffff; }
#GalleryMenu ul a.GalleryMenuAct { background-position: 0px -28px; color: #ffffff; }

#GalleryMenu ul a.GalleryLinkGrn { background-image: url('../images/gallery_menu_green.gif'); color: #52904d; }

/*============================================================
  Album Pages
============================================================*/

#album_container {
	width:575px; height: 300px;
	margin: 50px 0px -60px 30px;
	position: relative;
}


.album_back {
	width:140px; height: 30px;
	display: block; overflow: hidden;
	background-image: url(../images/album_back.gif);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	position: absolute; top: -40px; left: 218px;
}

.album_back:hover { background-position: 0px -30px; }

.album_arrow_left {
	width:75px; height: 75px;
	display: block; overflow: hidden;
	background-image: url(../images/album_prev.gif);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	position: absolute; top: 90px; left: -30px; z-index: 9;
}

.album_arrow_right {
	width:75px; height: 75px;
	display: block; overflow: hidden;
	background-image: url(../images/album_next.gif);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	position: absolute; top: 90px; right: -30px; z-index: 9;
}

.album_arrow_left:hover, .album_arrow_right:hover { background-position: 0px -75px; }

#albums_container {
	height: 211px;
}
#albums_text {
	margin-top: 80px;
	text-align: center;
}

.album_red {
	display: block; overflow: hidden; width:129px; height:211px;
	background-image: url(../images/albums/coverRed.gif);
	background-repeat: no-repeat; background-position: 0px 0px;
	margin: 20px 35px 0px 45px; float: left;
}
.album_leather {
	display: block; overflow: hidden; width:129px; height:211px;
	background-image: url(../images/albums/coverLeather.gif);
	background-repeat: no-repeat; background-position: 0px 0px;
	margin: 20px 30px 0px 45px; float: left;
}
.albumcover03 {
	display: block; overflow: hidden; width:129px; height:211px;
	background-image: url(../images/albums/cover03.gif);
	background-repeat: no-repeat; background-position: 0px 0px;
	margin: 20px 30px 0px 45px; float: left;
}

.albumcoverpreview {
	display: block; overflow: hidden; width:129px; height:211px;
	background-image: url(../images/albums/coverPreview.gif);
	background-repeat: no-repeat; background-position: 0px 0px;
	margin: 20px 30px 0px 45px; float: left;
}

.album_red:hover, .album_leather:hover, .albumcover03:hover, .albumcoverpreview:hover, 
.portraitcover_01:hover {  background-position: 0px -211px; }
.familycover_01:hover {  background-position: 0px -211px; }


.portraitcover_01 {
	display: block; overflow: hidden; width:129px; height:211px;
	background-image: url(../images/portrait_books/cover01.gif);
	background-repeat: no-repeat; background-position: 0px 0px;
	margin: 20px 30px 0px 45px; float: right;
}

.familycover_01 {
	display: block; overflow: hidden; width:129px; height:211px;
	background-image: url(../images/books_family/cover01.gif);
	background-repeat: no-repeat; background-position: 0px 0px;
	margin: 20px 30px 0px 45px; float: right;
}


/*============================================================
  Testimonials Pages
============================================================*/

.testimonial_wrap {
	width: 388px; height: 190px;
	margin: 15px 15px 0px 15px;
	float: left;
}
.testimonial_box {
	width:388px; height: 165px;
	background-image: url('../images/testimonial_box.jpg');
}
.testimonial_inner {
	margin:16px 20px 0px 20px;
	float:left;
}


.MainTestimonialBox {
	width: 600px;
	margin: 10px 0px 10px 15px;
	float: left;
}

.MTBH_top { display: block; width:600px; height: 7px; background: url(../images/testimonial_box_top.gif); float: left; }

.MTBM_mid { width: 600px; background: url(../images/testimonial_box_mid.gif) repeat-y; float: left; }
.MTBM_pic { width:80px; margin: 4px 5px 5px 11px; float: left; }
.MTBM_text { width: 489px; margin: 5px 5px 5px 5px; float: left; }

.MTBF_bottom { display: block; width:600px; height: 7px; background: url(../images/testimonial_box_bottom.gif); float: left; }


/*============================================================
  Terms / Legal / Privacy Policy
============================================================*/

#termsbox {
	width: 560px;
	height: 280px;
	padding: 15px;
	margin: 24px;
	overflow: auto;
	background-color: #f0f0f0;
	border: 1px #dddddd solid;
}

/*============================================================
  MyGallery
============================================================*/

#mygallery_mainBox {
	width: 840px; padding-bottom: 100px;
	float: left;
}

.mygallery_mainboxleft {
	width:280px; height: 300px;
	float: left; display: block;
	margin: 15px 15px 0px 90px;
	border: 1px #d6d6d6 solid;
	padding: 15px 15px 0px 15px;
	background:url('../images/greenbox_top.gif') repeat-x top;
}
.mygallery_mainboxright {
	width:280px; height: 300px;
	float: left; display: block;
	margin: 15px 90px 0px 15px;
	border: 1px #d6d6d6 solid;
	padding: 15px 15px 0px 15px;
	background:url('../images/greenbox_top.gif') repeat-x top;
}

.mygallery_row {
	width:840px;
	float: left;
}

.mygallery_galleryBox {
	width: 100px;
	margin: 0px 10px 0px 10px;
	float: left;
	
}


/*============================================================
  Pop up boxes and other non-page related sections
============================================================*/

.btnClose {
	display: block;
	width: 56px; height: 19px;
	background-image: url(../images/close.png);
	position: absolute; right: 35px; top: -4px;
	cursor: pointer;
}

#popBoxBack {
	width:1200px; height: 800px;
	background-image: url(../images/popBox_bg.png);
	display: none;
	left: 50%; margin-left: -600px;
	position: absolute;
	z-index: 8;
}

#popBox {
	width:550px; height: 360px;
	background-image: url(../images/popBox.png);
	display: none;
	left: 50%; margin-left: -275px;
	margin-top: 150px;
	position: absolute;
	z-index: 9;
	text-align: center;
	overflow: hidden;
}

#popBoxInner {
	width:510px; height: 320px;
	margin: 35px 0px 0px 20px;
	float: left;
}

#popFeedback {
	width: 120px; height: 120px;
	background-image: url(../images/popFeedback.png);
	background-position: 0px 0px;
	position: absolute;
	top: 0px; left: 0px;
	z-index: 7;
	cursor: pointer;	
}
#popFeedback:hover { background-position: 0px -120px; }

#siteSurveyBox {
	width:300px; height: 160px;
	padding: 20px 0px 0px 0px;
	margin: 0 auto;
}

#site_survey_hate { 
	width: 80px; height: 160px;
	background-image: url(../images/site_survey_hate.jpg);
	background-position: 0px 0px;
	margin: 0px 10px 0px 10px;
	cursor: pointer; float: left;
}

#site_survey_ok { 
	width: 80px; height: 160px;
	background-image: url(../images/site_survey_ok.jpg);
	background-position: 0px 0px;
	margin: 0px 10px 0px 10px;
	cursor: pointer; float: left;
}

#site_survey_love { 
	width: 80px; height: 160px;
	background-image: url(../images/site_survey_love.jpg);
	background-position: 0px 0px;
	margin: 0px 10px 0px 10px;
	cursor: pointer; float: left;
}