/* ---------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------- IMAGERY --------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */
body { background:#eae8bf url(../images/layup/howletts/bodyBg.jpg) bottom center no-repeat; }
#outer { background: none; }
#header { background:url(../images/layup/howletts/headerBg.gif) top left no-repeat; }
#header #siteSearch { background:url(../images/layup/howletts/siteSearchBg.gif) top left no-repeat; }
#homeRight .signUp { background:url(../images/layup/howletts/signUp.gif) top left no-repeat; }
#homeRight .signUp form { background:url(../images/layup/howletts/signUpFormBg.gif) top left no-repeat; }
#homeRight .jumpWhatsNew .controls a { background:url(../images/layup/howletts/spriteWhatsNewBtn.gif) 0px -15px no-repeat; }
#homeRight .jumpWhatsNew .controls a:hover { background:url(../images/layup/howletts/spriteWhatsNewBtn.gif) 0px 0px no-repeat; }
#homeRight .jumpWhatsNew .controls .active { background:url(../images/layup/howletts/spriteWhatsNewBtn.gif) 0px 0px no-repeat; }
#homeRight .signUp { background:url(../images/layup/howletts/signUp.gif) top left no-repeat; }
#homeRight .signUp form div { background:url(../images/layup/howletts/signUpFormBg.gif) top left no-repeat; }
#homeContent .quickLinks li { background:url(../images/layup/howletts/bullet.gif) 0px 1px no-repeat; }
#list .listItem .thumb { background:url(../images/layup/howletts/noImage166x125.gif) top left no-repeat; }
#boxList .box .thumb { background:url(../images/layup/howletts/noImage166x125.gif) top left no-repeat;  }
#contactArea { background:url(../images/layup/howletts/contactArea.gif) top left no-repeat; }
#footer { background: url(../images/layup/howletts/footerBg.gif) top left no-repeat; }


/* ---------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------- COLOURS --------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */
#homeContent .quickLinks a { color: #6e2306; }
#homeContent .latestNews a { color: #6e2306; }
#homeContent .latestNews .article a { color: #4a3c2d; }
#homeContent .latestNews .article .title { color: #4a3c2d; }
#homeContent .testimonials a { color: #6e2306; }
#homeContent .testimonials .article a { color: #4a3c2d; }
#homeContent .testimonials .article .quoter { color: #4a3c2d; }
#homeRight .signUp { color: #fff; }
#contactArea  { color: #32502a; }
#contactArea a { color: #32502a; }
#contactArea .feedback label { color: #4175ab; }
#contactArea .feedback form span { color: #4175ab; }


/* ---------------------------------------------------------------------------------------------------- */
/* ------------------------------------------ TOP NAVIGATION ------------------------------------------ */
/* ---------------------------------------------------------------------------------------------------- */
#primaryNav.primaryNavHowletts { height: 49px; background:url(../images/layup/howletts/primaryNavBg.gif) top left no-repeat; }
#primaryNav.primaryNavHowletts ul { list-style: none; margin: 0px; padding: 0px; }
#primaryNav.primaryNavHowletts li { padding: 0px; margin: 0px; float: left; background: url(../images/layup/howletts/primaryNavDivider.gif) top right no-repeat; padding-right: 2px; }
#primaryNav.primaryNavHowletts li a { display: block; text-decoration: none; padding: 12px 23px 12px 22px; color: #fff; }
#primaryNav.primaryNavHowletts li a:hover,
#primaryNav.primaryNavHowletts li a.active { background:url(../images/layup/howletts/primaryNavHover.gif) top left repeat-x; color: #fff; }
#primaryNav.primaryNavHowletts li.first { position: relative; }
#primaryNav.primaryNavHowletts li.first a .primaryNavLeft { display: none; position: absolute; top: 0; left: 0; width: 20px; height: 49px;   }
#primaryNav.primaryNavHowletts li.first a:hover .primaryNavLeft { display: block; background:url(../images/layup/howletts/primaryNavHoverLeft.gif) top left no-repeat; }
#primaryNav.primaryNavHowletts li.first a.active .primaryNavLeft { display: block; background:url(../images/layup/howletts/primaryNavHoverLeft.gif) top left no-repeat; }
#primaryNav.primaryNavHowletts li.last { background: none; position: relative; }
#primaryNav.primaryNavHowletts li.last a { padding: 12px 24px 13px 24px; }
#primaryNav.primaryNavHowletts li.last a .primaryNavRight { display: none; position: absolute; top: 0; right: 0; width: 20px; height: 49px;   }
#primaryNav.primaryNavHowletts li.last a:hover .primaryNavRight { display: block; background:url(../images/layup/howletts/primaryNavHoverRight.gif) top right no-repeat; }
#primaryNav.primaryNavHowletts li.last a.active .primaryNavRight { display: block; background:url(../images/layup/howletts/primaryNavHoverRight.gif) top right no-repeat; }
@media screen and (-webkit-min-device-pixel-ratio:0) {
    #primaryNav.primaryNavHowletts li.last a { padding: 12px 21px 13px 21px; }
}

#header #backToGroup { position: absolute; top: 0; right: 484px; }
#header #headJmpAspinall { position: absolute; top: 0; right: 363px; }
#header #headJmpLympne { position: absolute; top: 0; right: 238px; }
#header #headJmpHowletts { position: absolute; top: 0; right: 238px; }


/* ---------------------------------------------------------------------------------------------------- */
/* --------------------------------------- DROP DOWN NAVIGATION --------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */
#primaryNav.primaryNavHowletts ul li ul {	left: -999em; position: absolute; z-index: 9999; background:url(../images/layup/howletts/primaryNavDropdownBg.png) bottom left no-repeat !important; } /* DROPDOWN LIST WITH STARTING POSITION */
#primaryNav.primaryNavHowletts ul li ul li { background:url(../images/layup/howletts/primaryNavDropdownDivider.gif) bottom left no-repeat; }
#primaryNav.primaryNavHowletts ul li:hover ul, #primaryNav.primaryNavHowletts ul li.sfhover ul { left: auto; padding: 0px; margin: 0px; display: block; width: 207px; } /* DROPDOWN LIST REPOSITIONED ON HOVER */
#primaryNav.primaryNavHowletts ul li:hover ul li, #primaryNav.primaryNavHowletts ul li.sfhover ul li { display: block; padding: 0px; margin: 0px; }
#primaryNav.primaryNavHowletts ul li:hover ul li a, #primaryNav.primaryNavHowletts ul li.sfhover ul li a { padding: 11px 5px 11px 20px; margin: 0px; width: 182px; } /* DROPDOWN A TAG STYLES */
#primaryNav.primaryNavHowletts ul li:hover ul li a:hover, #primaryNav.primaryNavHowletts ul li.sfhover ul li a:hover { padding: 11px 5px 11px 20px; margin: 0px; background: #182814 url(../images/layup/howletts/primaryNavDropdownHover.gif) top left no-repeat; } /* DROPDOWN A TAG HOVER STATE */
#primaryNav.primaryNavHowletts ul li ul li a.last, #primaryNav.primaryNavHowletts ul li ul li.sfhover a.last { background: none !important; height: 13px; }  /*LAST ITEM IN DROPDOWN LIST */
#primaryNav.primaryNavHowletts ul li:hover ul li a:hover.last, #primaryNav.primaryNavHowletts ul li.sfhover ul li a:hover.last { padding: 11px 5px 11px 20px; margin: 0px;  background: url(../images/layup/howletts/primaryNavDropdownLastHover.gif) top left no-repeat !important; } /*LAST ITEM IN DROPDOWN LIST HOVER STATE */


/* ---------------------------------------------------------------------------------------------------- */
/* ------------------------------------------ SUB NAVIGATION ------------------------------------------ */
/* ---------------------------------------------------------------------------------------------------- */
#secondaryNav ul li a { background:url(../images/layup/howletts/secondaryNavDivider.gif) bottom left no-repeat; }
#secondaryNav ul li a:hover { background:url(../images/layup/howletts/secondaryNavHoverBtm.gif) bottom left no-repeat; }
#secondaryNav ul li a:hover span { color: #fff; background:url(../images/layup/howletts/secondaryNavHover.gif) top left no-repeat; }
#secondaryNav ul li .active { background:url(../images/layup/howletts/secondaryNavActiveBtm.gif) bottom left no-repeat; }
#secondaryNav ul li .active { background:url(../images/layup/howletts/secondaryNavActiveBtm.gif) bottom left no-repeat; }
#secondaryNav ul li .active span { color: #fff; background:url(../images/layup/howletts/secondaryNavActive.gif) top left no-repeat; }
#secondaryNav ul li .active:hover { background:url(../images/layup/howletts/secondaryNavActiveBtm.gif) bottom left no-repeat; }
#secondaryNav ul li .active:hover span { color: #fff; background:url(../images/layup/howletts/secondaryNavActive.gif) top left no-repeat; }
#secondaryNav ul li .active.noSubNav { color: #fff !important; background:url(../images/layup/howletts/secondaryNavHoverBtm.gif) bottom left no-repeat !important; }
#secondaryNav ul li .active.noSubNav span { color: #fff !important; background:url(../images/layup/howletts/secondaryNavHover.gif) top left no-repeat !important; }
#secondaryNav ul li ul { background: #f5f5e1 url(../images/layup/howletts/secondaryNavSubBg.gif) top left no-repeat; }
#secondaryNav ul li ul li a { background:url(../images/layup/howletts/secondaryNavIcon.gif) 22px 13px no-repeat; }
#secondaryNav ul li ul li a:hover { background:url(../images/layup/howletts/secondaryNavIconHover.gif) 22px 13px no-repeat; }
#secondaryNav ul li ul li .active { background:url(../images/layup/howletts/secondaryNavIconHover.gif) 22px 13px no-repeat; }
#secondaryNav ul li ul li.btm { background:url(../images/layup/howletts/secondaryNavSubBtm.gif) top left no-repeat; }


/* ---------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------- HOME ----------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */
#homeImage { margin-bottom: 0; }
#homeJumps { height: 232px; margin-bottom: 10px; }
#homeJumps .jump { float: left; }


/* ---------------------------------------------------------------------------------------------------- */
/* ------------------------------------- HEADINGS AND PARAGRAPHS -------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */
#homeContent h1 { font-family: Arial, Helvetica, sans-serif; font-size: 2.0em; color: #32502a; line-height: 90%; }
#homeContent h2 { font-family: Arial, Helvetica, sans-serif; font-size: 1.6em; color: #32502a; line-height: 90%; }
#mainContent h1 { font-family: Arial, Helvetica, sans-serif; font-size: 1.8em; color: #231f20; }
#mainContent h2 { font-family: Arial, Helvetica, sans-serif; font-size: 1.4em; color: #231f20; }
#mainContent h3 { font-family: Arial, Helvetica, sans-serif; font-size: 1.2em; color: #231f20; }
#homeContent .quickLinksNews h2 { color: #6e2306; }
#contactArea h3 { font-size: 1.5em; padding: 0px 0px 8px 0px; }
#contactArea .feedback h3 { font-size: 2.1em; padding: 0px 0px 8px 0px; line-height: 90%; color: #4175ab; }
#adoptionScroller .titleBar h2 { font-family: Arial, Helvetica, sans-serif; }
#adoptionScroller .titleBar h2 { font-family: Arial, Helvetica, sans-serif; }
#adoptedAnimalDetails h2 { font-family: Arial, Helvetica, sans-serif; }
#locationContact h2 { font-family: Arial, Helvetica, sans-serif; }
p { padding:0 0 15px 0; margin:0; }


/* ----- ALTERNATIVE BOX LIST ----- */
#boxListAlternative {}
#boxListAlternative  p { text-decoration:underline; font-size: 0.9em !important; padding:0 !important; }
#boxListAlternative .box { width: 343px; margin-top: 15px; margin-right: 7px; margin-bottom: 7px; float: left !important; }
#boxListAlternative .box a { display: block; width: 320px; text-decoration: none; color: #000; font-weight: normal; cursor: pointer; }
#boxListAlternative .box .title { display: block; width: 320px; padding: 0px 0px 8px 0px; font-weight: bold; }
#boxListAlternative .box .thumb { display: block; float: left; padding-right: 12px; position: relative; width: 166px; height: 125px; background:url(../images/layup/howletts/noImage166x125.gif) top left no-repeat;  }
#boxListAlternative .box .thumb .frame { display: block; position: absolute; top: 0px; left: 0px; }
#boxListAlternative .box .details { display: block; float: left; width: 142px; font-size: 0.9em; padding-top: 4px; text-decoration: underline; }
