new background (http://clbuchananphotography.smugmug.com/gallery/6398171_BSS7M#406652023_b85VQ-A-LB)
the CSS is fixed
I would like this to be my theme throughout my website but if that's not possible I will settle for just the home page.
Ok, I think I got it all figured out. It adds your new background and the
slideshow to your header.
This is your whole header, replace the whole thing.
<div id="my_header">
<div id="my_banner"> </div>
<div id="headerSS">
<script>
var ssConfig = {
AlbumID: '6082071',
newWindow: 'false',
transparent: 'true',
splash: '/photos/382375877_npyRq-M.jpg',
showLogo: 'false',
clickUrl: '/Galleries',
showThumbs: 'true',
showButtons: 'false',
crossFadeSpeed: '350'
};
SM.flash.insertSlideshow(777, 215, ssConfig, 'transparent');
</script>
</div> <!-- closes headerSS -->
<div class="menu">
<ul>
<li><a href="/">Home</a></li>
<li><a class="drop" href="/Galleries">Portfolio
<!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/Galleries/614956">Weddings</a></li>
<li><a href="/Galleries/614957">Portraits</a></li>
<li><a href="/Galleries/614958">Landscapes</a></li>
<li><a href="/Galleries/614961">Other</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="/">Investment</a></li>
<!--[if IE 7]><!--><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<li><a class="drop" href="/Galleries">Services
<!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/galleries">Photography</a></li>
<li><a href="/Albums%20Gallery">Album Design</a></li>
<li><a href="/Galleries/614961">Digital Enhancement</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a class="drop" href="http://clbuchananphotography.com/gallery/6082385_xMtiJ/1/381668717_ZCKWz/Large">Information
<!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="/gallery/6109715_WZKeF">About Me</a></li>
<li><a href="/gallery/6082385_xMtiJ/1/381668717_ZCKWz/Large">Contact Me</a></li>
<li><a href="http://clbuchanan.blogspot.com">Blog</a></li>
</ul>
</li>
<li><a href="/Clients">Proofing</a></li>
</ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</div> <!-- closes menu -->
</div> <!-- closes my_header -->
This is your whole CSS, replace the whole thing.
body {
background: url(/photos/406652023_b85VQ-O.jpg) repeat;
background-position: center top;
}
#my_header {
width: 834px;
height: 227px;
border-bottom: 40px solid #e1ccff;
margin: 0 auto; /* top right/left bottom*/
padding: 0 10px;
}
#headerSS {
position: relative;
left: 160px;
top: -205px;
width: 677px;
}
#my_banner {
width: 232px;
height: 213px;
margin: 0px 10px; /* top right bottom left */
background: url(/photos/405927018_fTr2U-L.gif) no-repeat;
_background: none;
_filter:progid:DXImageTransform.Microsoft.AlphaIma geLoader(enabled=true,
sizingmethod=image,src='/photos/405927018_fTr2U-L.gif');
}
/* #bioBox {background: #EFE2FE !important;} */
/* CSS Dropdown Nav Bar */
/* Original code by Stu Nicholls of */
/* http://www.cssplay.co.uk/ */
/* Edited by me for content, formatting and some elements */
/* Please help support CSSPlay at: */
/* http://www.cssplay.co.uk/support.html */
/* Common Styling */
.menu {
position: relative;
top: -202px;
display: block;
z-index: 99;
/* padding: 20px 0px 30px 0px; */ /* spacing around menu - top right bottom left */
height: 30px; /* menu container (div .menu) */
width: 620px; /* width of menu - minimize this until doesn't wrap to two lines - too large
effects centering */
margin: 0 auto; /* this should center navbar, if not tweak with left's below */
}
.menu ul {
padding: 10px 0px 10px 0px; /* this effects menu centering if too big */
margin:0 auto; /* this maybe not needed? */
list-style-type: none;
}
.menu ul li {
/* margin: 0 2px 0 2px; */ /* adds space between main menu boxes */
float:left; /* WARNING: float right reverses menu */
position:relative !important; /* ***** Carbonite fix ***** */
}
.menu ul li a,
.menu ul li a:visited {
display: block;
font-size: 1.27em; /* main buttons */
color: #26005C; /* main buttons text non-hover*/
text-decoration:none;
text-align: center; /* centers text in buttons */
width: 100px; /* main box width */
height: 20px; /* main box height */
/* border: 1px solid #2D006B; */ /* start your design with borders on, easier to position DD's &
FO's */
/* border-width: 1px 1px 1px 1px; */
background: #e1ccff; /* main button color */
padding-left: 0px;
line-height: 20px; /* positions text up/down in box */
}
* html .menu ul li a, .menu ul li a:visited {
width: 104px; w\idth: 104px; /* IE main button */
}
.menu ul li ul {
display: none;}
/* */
/* Specific to Non-IE browsers */
/* */
.menu ul li:hover a {
color: #B580FF; /* main when hover DD */
background: #e1ccff; /* main when hover DD */
}
.menu ul li:hover ul {
display: block;
position: absolute !important; /* ***** Carbonite fix ***** */
top: -4px; /* FF DD up down */
margin-top: 17px; /* FF main mouse active vertical */
left: 0px; /* FF DD right left */
width: 104px; /* unknown */
}
.menu ul li:hover ul li ul {
display: none;
}
.menu ul li:hover ul li a {
display: block;
background: #e1ccff; /* DD FO non-hover */
color: #26005C; /* DD FO non-hover */
height: auto;
line-height: 20px; /* DD FO box height */
padding: 0px 0px;
width: 100px; /* DD FO box width */
}
.menu ul li:hover ul li a:hover {
background: #DABFFF; /* DD FO hover */
color: #B580FF; /* DD FO hover */
}
.menu ul li:hover ul li:hover ul {
display: block;
position: absolute;
left: 102px; /* FF FO right left */
top: -27px; /* FF FO up down */
width: 146px; /* FF FO box width */
}
/* */
/* Specific to IE browsers */
/* */
.menu ul li a:hover {
/* text-decoration: none; */ /* might be needed */
color: #B580FF; /* main hover */
background: none; /* main hover */
}
.menu ul li a:hover ul {
display: block;
position: absolute !important; /* ***** Carbonite fix ***** */
top: 2px; /* DD container up down */
background: #DABFFF; /* gets rid of DD container */
margin-top: 7px; /* DD container up down */
left: 0px; /* DD right left */
}
.menu ul li a:hover ul li a {
display: block;
background: #e1ccff; /* IE DD color non-hover */
color: #B580FF; /* IE DD color non-hover */
height: auto;
line-height: 20px; /* IE DD FO box height */
padding: 0px;
width: 145px; /* IE DD FO box */
}
.menu ul li a:hover ul li a ul {
visibility:hidden;
position:absolute;
height: 0;
width: 0;
}
.menu ul li a:hover ul li a:hover {
background: #DABFFF; /* DD FO hover */
color: #B580FF; /* DD FO hover */
}
.menu ul li a:hover ul li a:hover ul {
display: block;
position: absolute;
top: -22px; /* FO up down */
color: #B580FF; /* unknown */
left: 147px; /* FO right left */
}
/*ADD TO FIX IE*/
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width: 125px;
w\idth: 139px;
}
/* another hack for IE5.5 */
* html .menu ul ul {
top: 30px;
t\op: 31px; /* IE gap between main bar and the dropdown items */
}
/* style the table so that it takes no part in
the layout - required for IE to work */
.menu table {
position:absolute;
top:auto 0; left:0;
}
/* yet another hack for IE5.5 */
* html .menu ul ul a {
width: 125px; /* unknown */
w\idth: 104px; /* DD FF width */
}
/*END EXTRA ADDS FOR IE*/
/* ADD TO HIDE EXTRA LEVELS */
/* make the 2nd level visible when
hover on 1st level list OR link */
.menu ul a:hover ul, /* IE */
.menu ul:hover ul { /* FF */
visibility:visible;
}
/* keep the 3rd level hidden when you
hover on 1st level list OR link */
.menu ul a:hover ul ul, /* IE */
.menu ul:hover ul ul { /* FF */
visibility:hidden;
}
/* keep the 4th level hidden when you
hover on 2nd level list OR link */
.menu ul li a:hover ul li a:hover ul ul, /* IE */
.menu ul li:hover ul li:hover ul ul { /* FF */
visibility:hidden;
}
/* make the 3rd level visible when you hover
over 2nd level list OR link */
.menu ul a:hover ul a:hover ul, /* IE */
.menu ul:hover ul:hover ul { /* FF */
visibility:visible;
}
/* make the 4th level visible when you
hover over 3rd level list OR link */
.menu ul li a:hover ul li a:hover ul li a:hover ul, /* IE */
.menu ul li:hover ul li:hover ul li:hover ul { /* FF */
visibility:visible;
}
/* ==== END NAVBAR CODE ==== */
#bioBox {background-color: #000000;}
#breadcrumb {display: none;}
#bioBox .photo {
display: none;
}
#content.userKeywords,
#header_wrapper, #footer_wrapper, #cobrand_footer,
#category, #subcategory, #header,
#smugmug, .smugmug #header, .smugmug #footer {
margin-left: 15px;
margin-right: 15px;
min-width: 755px;
width: auto;
_width: expression(document.documentElement.clientWidth < 790? "760px" : "auto");
}
.miniBox {width:122px; text-align:center; height:210px; margin:0 28px;}
.miniBox .photo {float:none; width:122px; height:auto; _height:1px;}
.miniBox .albumTitle {width:122px;}
.miniBox .description {width:122px;}
.miniBox .updated {width:122px;}
.loggedIn .miniBox {height:auto; min-height:300px;}
.loggedIn .miniBox .smbuttons {margin:0 auto; width:122px;}
.loggedIn .miniBox input {width:122px;}
.loggedIn .miniBox textarea {width:112px;}
.boxBottom .albumLarge {width:192px; height:350px; text-align:center; margin:0 24px;}
.albumLarge .photoLarge {float:none; width:192px; height:auto; _height:1px;}
.albumLarge .albumTitle {width:192px;}
.albumLarge .description {width:192px;}
.albumLarge .updated {width:192px;}
.loggedIn .boxBottom .albumLarge {height:auto; min-height:450px;}
.loggedIn .albumLarge .smbuttons {margin:0 auto; width:192px;}
.loggedIn .albumLarge input {width:192px;}
.loggedIn .albumLarge textarea {width:182px;}
a img.imgBorder, .imgBorder {border: solid 2px #fff !important;}
a:hover img.imgBorder, .imgBorderOn {border: solid 3px #fff !important;}
.loginLink { display: none; }
.cartlink_footer { display: none; }
.rssLink {display: none; }
.gallery_6106821 #myText {
margin: 0 auto;
width: 600px;
background: #eee;
color: #444;
padding: 0 20px 5px 20px;
}
/* START gallery 6109715 */
.gallery_6109715 #albumDescription {
margin-top: 40px; /* gap from navbar at top */
background: #efe2ff; /* background of description box */
padding: 20px 40px 40px 40px; /* top right bottom left */
} /* spacing inside box from edges */
.gallery_6109715 .myPhoto {
float: left; /* allows the text to flow to the right */
padding: 0 30px 10px 0; /* top right bottom left */
} /* spacing of text around photo */
.gallery_6109715 .myPhoto img {
border: 4px ridge #22093d; /* add border around photo */
}
.gallery_6109715 .myTitle {
font-family: Arial, Comic Sans MS, verdana;
font-size: 20px;
color: #120622;
font-weight: bold;
text-align: center;
margin: 0 auto 30px auto; /* top right bottom left */
}
.gallery_6109715 .myText {
font-family: Arial, Comic Sans MS, verdana;
font-size: 16px;
color: #120622;
font-weight: normal;
text-align: justify;
}
.gallery_6109715 .myEmail {color: #e1ccff;}
.gallery_6109715 .myEmail:hover {color: #e1ccff;}
.gallery_6109715 .contactForm {color: #e1ccff;}
.gallery_6109715 .contactForm:hover {color: #e1ccff;}
/* things you can hide on page */
.gallery_6109715 #albumNav_top,
.gallery_6109715 #albumNav_bottom,
.gallery_6109715 .journal_entry, /* hides photos in gallery */
.gallery_6109715 #breadcrumb {display: none;}
.loggedIn .gallery_6109715 #breadcrumb {display: block;}
/* END gallery 6109715-contact page */
/* things you can hide on page */
.gallery_6082385 #albumNav_top,
.gallery_6082385 #albumNav_bottom,
.gallery_6082385 #breadcrumb {display: none;}
.loggedIn .gallery_6082385 #breadcrumb {display: block;}
/* END gallery 6082385 */
}
.gallery_6114800 .nophotos h3 {display: none;}
.gallery_6114800 #albumNav_top,
.gallery_6114800 #albumNav_bottom,
.gallery_6114800 #breadcrumb {display: none;}
.loggedIn .gallery_6114800 #breadcrumb {display: block;
/* END gallery 6114800-thank you page */
}
.gallery_6356536 .nophotos h3 {display: none;}
.gallery_6356536 #albumNav_top,
.gallery_6356536 #albumNav_bottom,
.gallery_6356536 #breadcrumb {display: none;}
.loggedIn .gallery_6356536 #breadcrumb {display: block;
/* END gallery 6356536-Peyton's Gallery */
}
.gallery_6358238 #albumNav_top,
.gallery_6358238 #albumNav_bottom,
.gallery_6358238 #breadcrumb {display: none;}
.loggedIn .gallery_6358238 #breadcrumb {display: block;
.gallery_6358238 .journal_entry,
/* END gallery 6358238-Peyton's SS Gallery */
}
.gallery_6115656 .nophotos h3 {display: none;}
.gallery_6115656 #albumNav_top,
.gallery_6115656 #albumNav_bottom,
.gallery_6115656 #breadcrumb {display: none;}
.loggedIn .gallery_6114800 #breadcrumb {display: block;
/* END gallery 6115656-calander page */
}
#cobrand_footer .nav,
#cobrand_footer .text { font:bold 8px/8px arial, helvetica, sans-serif; color:grey0;}
}
.photoDetail {display: none;}
#photoKeywords {display: none;}