@charset "utf-8";
/*Reimaged.co.uk CSS yay!! this is all my work warts un all - well except the reset, css popup and lightbox - opacity stops it validating css2.1*/

/*Reset http://meyerweb.com/eric/tools/css/reset/*/
php, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, acronym, em, font, img, b, u, i, center, dl, dt, dd, form, fieldset, label, legend{ margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}body {line-height: 1;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}/* remember to define focus styles! */:focus {outline: 0;}/* remember to highlight inserts somehow! */ins {text-decoration: none;}

/*Basic decs*/
php {margin-bottom:1px;}
body {position:relative; background:#FFF; color:#000;font-family: "trebuchet ms", arial, helvetica, sans-serif; z-index:1;}
a {color:#000; text-decoration:none;}
a:hover, a.active {color: #39b0ff;text-decoration:underline;}
a.active {font-weight:600;}
img, img a {border:none;}
.clear {clear:both;}

/*Structure*/

/*Top of page nav*/
#head{position: relative; width:100%; height:48px; background:#666 url(gfx/head-x.jpg) top left repeat-x; z-index:5;}
#logo { position:fixed ; top:0; right:0; width:300px; height:42px; z-index:2;}
#logoa { position:absolute; top:0; right:0; width:300px; height:42px; z-index:6;}
#menu {padding:6px 0 0 0; margin: 0 ; list-style:none; height:40px; font-weight:bold;}
.menuactive
#menu li {float:left;}
#menu li a {display:block; height:40px; line-height:40px; padding:0 20px 0 0; float:left; color:#fff; text-decoration:none;}
#menu li a span {display:block; height:40px; float:left; padding:0 0 0 20px; cursor:pointer;}
#menu li a:hover, li.menuactive a {background:url(gfx/tab_a.gif) no-repeat right top;  }
#menu li a:hover span, li.menuactive span {background:url(gfx/tab_b.gif) no-repeat left top; }

#icons{}

/*Main Content*/
#content{color:#000; border-top:2px solid #39b0ff; }
.textblock {width:550px; margin:10px; padding:5px;}
#content span {color:#39b0ff; font-size:larger;}
 
/* 
***********************************************
***********************************************
STYLING FOR PHOTOGRPAHIC GALLERY AND SCRAPBOOK
THIS IS A MESS AND NEEDS A REWORK AT SOME POINT
***********************************************
***********************************************
*/

#gallery {position:relative; width:745px;margin: 10px auto 0 auto; }
#gallerywide {position:relative; width:885px;margin: 10px auto 0 auto; }
#slide {float:left; width:90px; margin-top:6px; margin-left:110px;}
#stage {float:left;}
#slideinfo {float:left; width:200px; margin-top:7px; margin-left:10px;}
#arrows {position: absolute; top:400px; right:80px; width:130px; height:64px;}
#arrowswide {position: absolute; top:250px; right:80px; width:130px; height:64px;}
/*Gallery Photonav*/
.smallslide {float:left; width:60px; height:90px; margin-bottom:3px; margin-left:25px; background:url(gfx/thumbs-dropshadow.png) 0 0 no-repeat;/* for IE */filter:alpha(opacity=60); /* CSS3 standard */ opacity:0.6;}
.smallslidewide {float:left; width:90px; height:60px; margin-bottom:3px; background:url(gfx/thumbs-dropshadow-wide.png) 0 0 no-repeat;/* for IE */filter:alpha(opacity=60); /* CSS3 standard */ opacity:0.6;}
.smallslide img, .smallslidewide img {padding: 3px 0 0 3px;}
.active, .smallslide:hover, .smallslidewide:hover {/* for IE */ filter:alpha(opacity=100); /* CSS3 standard */opacity:1.0;}

/*Gallery Stage*/
.largeslide {width:325px; height:475px; background:url(gfx/450-dropshadow.png) 0 0 no-repeat; margin:0 auto;}
.largeslide img, .largeslidewide img {padding: 8px 0 0 8px;}
.largeslidewide {width:475px; height:325px; background:url(gfx/450-dropshadow-wide.png) 0 0 no-repeat;}

/*Gallery Slide Info*/
#slideinfo span {color:#39b0ff; font-weight:bold; font-size:larger;}
#slideinfo p {padding-bottom:10px;}

/*Gallery Arrows*/
.prevpage, .previmg, .nextimg, .nextpage {float:left; width:63px; height:32px;/* for IE */filter:alpha(opacity=60); /* CSS3 standard */ opacity:0.6;}
.prevpage:hover, .previmg:hover, .nextimg:hover, .nextpage:hover {/* for IE */ filter:alpha(opacity=100); /* CSS3 standard */opacity:1.0;}

/*Scrapbook*/
#scrapgallery {width:640px;margin: 0 auto 50px auto; }
#scrapbreadcrumb {width:630px; height:20px; margin:0 5px ; padding-top:10px; border-bottom:1px solid #39b0ff; }
#scrapbreadcrumb span { font-size: larger; color:#39b0ff;}
#scrapstage {float: left; width:640px;margin:20px 0 50px 0 ;}
/*Thanks again Mr Meyers*/
#scrapstage a span {display: none;}
#scrapstage a:hover span {display: block;position:absolute;bottom:0;left:0;width:150px;height:30px;z-index:2;background:#000;color:#39b0ff;font-size:small; text-align: center;padding-top:10px;/* for IE */filter:alpha(opacity=80); /* CSS3 standard */ opacity:0.8; }
#scrapstage dt {width:630px; margin: 0 5px; color:#39b0ff; font-size:large; clear:both;border-bottom:1px solid #39b0ff;}
.scrapthumb {position:relative; float: left; width:150px; height:150px; background:#CCC; margin:5px;}
.scrapthumb img {width:120px; height:120px; padding:10px; background:#fff; margin:5px;}

/*About Page*/

#aboutstage {width:520px; padding:10px; margin: 0 auto;}
#aboutstage a{ color:#39b0ff; text-decoration:underline;}
#aboutstage span {color:#39b0ff; font-size:24px; font-weight:600;}
#aboutstage p {text-align:justify;line-height: 140%; margin-bottom: 1.4em;}
#littleme { position:fixed; bottom:38px; right:0; width:140px; height:185px; }

/*Thanks page*/
.thanks{ background:url(gfx/thanks.png) bottom right no-repeat; border-bottom:1px solid #39b0ff;}

.imagerestore1 a {background:url(images/restore/case1-un.jpg); width: 288px;  height:432px; display:block;}
.imagerestore1 a:hover {background:url(images/restore/case1-re.jpg);}
.imagerestore2a a {background:url(images/restore/case2a-un.jpg); width: 288px;  height:432px; display:block;}
.imagerestore2a a:hover {background:url(images/restore/case2a-re.jpg);}
.imagerestore2b a {background:url(images/restore/case2b-un.jpg); width: 288px;  height:432px; display:block;}
.imagerestore2b a:hover {background:url(images/restore/case2b-re.jpg);}
.imagerestore3 a {background:url(images/restore/case3-un.jpg); width: 432px;  height:288px; display:block;}
.imagerestore3 a:hover {background:url(images/restore/case3-re.jpg);}
.imagerestore4 a {background:url(images/restore/case4-un.jpg); width: 432px;  height:288px; display:block;}
.imagerestore4 a:hover {background:url(images/restore/case4-re.jpg);}



/* 
***********************************************
***********************************************
END OF CRAPPY PHOTOGRAPHIC STYLING!!!!!!!!!!!!!
***********************************************
***********************************************
*/


/*Footer and Footer nav */
#footer { position:fixed; bottom:0; left:0;width:100%;/*width:900px; height:50px; margin-top:30px;*/ height:47px; }
#copyright { position:fixed; bottom:0; left:0;width:100%; height: 15px;z-index:5;}

/*Logo and simple nav*/
#footer dl {float:left; width: 350px; height:30px; margin-top:15px; margin-left:5px; /*width: 350px; height:30px; float:left;margin-top:15px;*/ }
#footer dd {float: left; padding-right:18px;}
#footer dd a {font-size:23px;}

#copyright p {text-align:center; font-size:10px; color:#39b0ff;}
#copyright a{ color:#39b0ff; text-decoration:underline;}

/*Using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
h1.swap {width:300px; height:47px; margin: 0 auto; background-repeat:no-repeat;}
h1.swap span, h2.swap span {display:none;}
#footer.indexfooter h1 {background-image:url("gfx/reimaged.png");}
#footer.photographyfooter h1 {background-image:url("gfx/photography.reimaged.png");}
#logo.restorationlogo h1 {background-image:url("gfx/restoration.reimaged.png"); position:relative ;z-index:2;}
#logoa.restorationlogoa h1 {background-image:url("gfx/restorationa.reimaged.png");}
#footer.prepressfooter h1 {background-image:url("gfx/prepress.reimaged.png");}
#footer.printandwebfooter h1 {background-image:url("gfx/printandweb.reimaged.png");}