Accordian PanelTab margin in IE6

Greetings learned ones.
I am currently working on a site, and since I've recently
acquired web premium CS3 and am using dreamweaver, I thought I'd
use the Spry Accordian widget.
Of course, my rendition looks great in FF, but IE6 throws
margin or something between the accordianpaneltab's
You can see my dilemna currently at
http://rfk.ipapilot.org/new/menu.html
I know I've added some styling effects, but even with the
vanilla CSS this still had small spacing between those tabs.
Any help would be greatly appreciated.
-Trevor

The accordion is triggering a bug in IE that seems to happen
within tables. The bug is triggered by programatically placing a
class name on an element. Even if that classname has no style rule
defined. We worked around it in the latest version of the Accordion
which you can find here:
http://labs.adobe.com/technologies/spry/widgets/accordion/SpryAccordion.js
Save that file into your SpryAssets folder of your site, over
the one that Dreamweaver placed into your site. Let us know if that
fixes things for you.
--== Kin ==--

Similar Messages

  • Dreamweaver Accordian not working in IE6

    I've added the Spry Accordian function to a page but it only
    works correctly in Safari 2. On opening the page in both Firefox
    and IE 6 only the first level displays, the second and third level
    are invisible. Only after clicking in the general area where I know
    they should be displayed do they appear. In Safari on the Mac the
    function works perfectly. Can someone give me an idea what's
    happening? Here is the link:
    http://www.gaudettedsn.com/288thirdstreet/homedesign.html.
    Dreamweaver's browser check says this line is a problem but it
    doesn't give me any clue what to do about it: <link
    href="../SpryAssets/SpryAccordion.css" rel="stylesheet"
    type="text/css" />
    Thanks

    CAcharlie wrote:
    > I've added the Spry Accordian function to a page but it
    only works correctly in
    > Safari 2. On opening the page in both Firefox and IE 6
    only the first level
    > displays, the second and third level are invisible. Only
    after clicking in the
    > general area where I know they should be displayed do
    they appear. In Safari on
    > the Mac the function works perfectly. Can someone give
    me an idea what's
    > happening? Here is the link:
    Windows XP: In my Firefox 2, I see 3 accordion headers that
    all work correctly:
    Gourmet Kitchens
    Even more noteworthy features
    Added comfort, convenience and safety
    I have IE7 and those same items appears and change based upon
    which one I click on. But I do see a small gap between one header
    and the next. This may be due to some CSS rendering
    issues/differences, but not sure.
    FYI: You may get better/quicker responses for questions like
    this one in the general Dreamweaver forum rather than this one that
    is focused on Dreamweaver Extensions and is not highly trafficked.
    Danilo Celic
    | Extending Knowledge Daily :
    http://CommunityMX.com/
    | Adobe Community Expert

  • Margin differences IE6 vs Firefox 2

    If you create a page using the code below you will see that
    the left margin is completely different in IE 6 and Firefox.
    Do I have a coding error or do I need to set the margin and
    then if IE is used set it again with a different value?
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN" "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    #sub-section {
    width: 195px;
    padding: 3px 2px 0 0;
    background-color:#CCCCCC;
    display: block;
    #sub-section ul {
    width: 165px;
    margin-left: 10px;
    #sub-section ul li {
    font-size: 12px;
    padding-bottom: 5px;
    list-style: none;
    #sub-section ul li ul li {
    list-style-image:url(/common/images/pointer.gif);
    list-style-position: inside;
    margin-left: 0px;
    #sub-section a, #sub-section a:link {
    color: #000066;
    text-decoration: none;
    font-weight: bold;
    #sub-section a.active, #sub-section a:hover {
    color: #6666CC;
    text-decoration: underline;
    background-image: url(/common/images/pointer.gif) no-repeat
    left center;
    -->
    </style>
    </head>
    <body>
    <div id="sub-section">
    <ul>
    <li><a href="#">Link 1</a></li>
    <li><a href="#">Link 2
    </a>
    <ul>
    <li><a href="#">Sub Link1</a></li>
    <li><a href="#">Sub Link 2</a></li>
    <li><a href="#">Sub Link 3
    </a>
    <ul>
    <li><a href="#">Sub Sub Link 1
    </a></li>
    </ul>
    </li>
    </ul>
    </li>
    <li><a href="#">Link 3</a></li>
    <li><a href="#">Link 4</a></li>
    <li><a href="#">Link 5</a></li>
    <li><a href="#">Link 6 </a></li>
    </ul>
    </div>
    </body>
    </html>

    DC_Eric escreveu:
    > If you create a page using the code below you will see
    that the left margin is
    > completely different in IE 6 and Firefox.
    > Do I have a coding error or do I need to set the margin
    and then if IE is used
    > set it again with a different value?
    >
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
    > "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    > <html xmlns="
    http://www.w3.org/1999/xhtml">
    > <head>
    > <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1" />
    > <title>Untitled Document</title>
    > <style type="text/css">
    > <!--
    > #sub-section {
    > width: 195px;
    > padding: 3px 2px 0 0;
    > background-color:#CCCCCC;
    > display: block;
    > }
    >
    > #sub-section ul {
    > width: 165px;
    > margin-left: 10px;
    > }
    >
    > #sub-section ul li {
    > font-size: 12px;
    > padding-bottom: 5px;
    > list-style: none;
    > }
    >
    > #sub-section ul li ul li {
    > list-style-image:url(/common/images/pointer.gif);
    > list-style-position: inside;
    > margin-left: 0px;
    > }
    >
    > #sub-section a, #sub-section a:link {
    > color: #000066;
    > text-decoration: none;
    > font-weight: bold;
    > }
    >
    > #sub-section a.active, #sub-section a:hover {
    > color: #6666CC;
    > text-decoration: underline;
    > background-image: url(/common/images/pointer.gif)
    no-repeat left center;
    > }
    > -->
    > </style>
    > </head>
    >
    > <body>
    > <div id="sub-section">
    >
    >
    <a href="#">Link 1</a></li>
    >
    <a href="#">Link 2
    > </a>
    >
    >
    <a href="#">Sub Link1</a></li>
    >
    <a href="#">Sub Link 2</a></li>
    >
    <a href="#">Sub Link 3
    > </a>
    >
    >
    <a href="#">Sub Sub Link 1 </a></li>
    >
    > </li>
    >
    > </li>
    >
    <a href="#">Link 3</a></li>
    >
    <a href="#">Link 4</a></li>
    >
    <a href="#">Link 5</a></li>
    >
    <a href="#">Link 6 </a></li>
    >
    > </div>
    > </body>
    > </html>
    >
    http://www.webcredible.co.uk/user-friendly-resources/css/
    zerof
    http://www.educar.pro.br/
    Apache - PHP - MySQL - Boolean Logics - Project Management
    Você deve, sempre, consultar uma segunda opinião!
    Deixe todos saberem se esta informação foi-lhe
    útil.
    You must hear, always, one second opinion! In all cases.
    Let the people know if this info was useful for you!

  • Spry Accordian IE6 display problem

    Hi have some test data in a site using the Accordian panels.
    The url is
    http://208.106.129.95/cfbc/news-events.php#
    In IE6, the item called "Test Event 2" is behaving rather
    strangely. While it opens when you click on the heading, if you put
    your mouse over another heading, the content area goes blank.
    Not even sure where to begin with this one. The other samples
    there seem to work fine and don't exhibit this behaviour.

    A follow up to this. I changed the items on the page. What I
    noticed is that if I open a tab, move down below the open tab to
    the next tab and just hover the mouse over the title, the content
    in the open tab disappears. Then if I either scroll up, or put the
    mouse over a tab above the open tab, the content comes back. It
    only happens in IE6. I tried removing all the div's I've inserted
    in to format the content, just leaving the AccordianPanelContent
    div around the content, it still does the same thing.

  • IE6 margin difficulties

    Hi experts,
    I'm using CSS.
    I have a table cell with an id name, containing copy. In
    Firefox, the space between the top of the page and the header (the
    first bit of text) is fine. In IE6, there is no space at all. To
    fix it, I tried adding a top margin of 10px. Now it looks ok in
    IE6, but is too big in all other browsers I've tested.
    Can anyone give me the trick for getting it to be right in
    all browsers? I imagine a special CSS statement directed at IE6 and
    ignored by other browsers, or a couple of statements that
    compensate, or override, depending on the browser.
    Any quick hints out there? I'm working against a deadline, so
    prompt replies are very much appreciated in advance.
    Richard

    If you give a margin value for an element and things don't
    look the same
    across different browsers, there are two common reasons:
    1. There is a default padding on the element (or the
    cellpadding attribute
    of the table is used).
    2. The margin and/or padding is actually on an adjacent
    element (common with
    heading tags, which have default bottom margins, and
    <p> tags).
    "RTalbott" <[email protected]> wrote in
    message
    news:e90t7g$db9$[email protected]..
    > Hi experts,
    >
    > I'm using CSS.
    >
    > I have a table cell with an id name, containing copy. In
    Firefox, the
    > space
    > between the top of the page and the header (the first
    bit of text) is
    > fine. In
    > IE6, there is no space at all. To fix it, I tried adding
    a top margin of
    > 10px.
    > Now it looks ok in IE6, but is too big in all other
    browsers I've tested.
    >
    > Can anyone give me the trick for getting it to be right
    in all browsers?
    > I
    > imagine a special CSS statement directed at IE6 and
    ignored by other
    > browsers,
    > or a couple of statements that compensate, or override,
    depending on the
    > browser.
    >
    > Any quick hints out there? I'm working against a
    deadline, so prompt
    > replies
    > are very much appreciated in advance.
    >
    > Richard
    >

  • Spry Accordian Panel not Working in IE6

    I'm designing on a Mac in Dreamweaver CS3 and the Spry widget
    Accordian is not expanding right when testing in IE6. Does anyone
    know if there is a fix for this?
    Missy

    The samples work fine In IE6.
    So if u can give us a piece of code & constructor or a
    online url so we could investigate this behavior.

  • Spry Accordian Tabs Question

    Hi
    I'm trying to create a spry accordian menu for a navbar and am having some trouble.
    This is the first time I've tried it so I would appreciate any help.
    The Client would like the tabs to be:
    Home
    Students
       High School Students
       College Students
    Professionals
    Parents/Educators
    Seminars
    Bio
    Q  & A Blog
    Testimonials
    So all they would like High School Students and College Students to be child tabs underneath the parent tabs and all other tabs to be parent tabs.
    They asked for a spry accordian.
    They want the nav bar to be on the left.
    Here is the link to the website online:
    http://www.elynncohen.com/index2spry2.html#
    and here are my questions:
    1. The spry accordian has a box around it on mouse down but I can't figure out how to get rid of it. I've checked all the CSS rules for the spry accordian and none of them seem to have rules around them.
    2. All the tabs have a content area underneath them and we only want content areas underneath the student tab. You see how it goes when you click on any of the tabs, you get a little thing that says content 1, 2 etc. I tried deleting them in the code and the page goes completely crazy when I do and the nav bar areas stretch all the way across the page.
    3. I can't figure out how to get the child tabs (which would be the tabs under students which say high school and college) to have two tabs. You will see that it does have the high school tab there now. When I try cutting and pasting the code to try to get two tabs, it does not work. The spry accordian framework only creates one content area under each tab.
    4. I'd like the child tabs to have a narrower height than the parent tabs, and be indented so that they will clearly be set off and different than the parent tabs.
    Any help would be much appreciated!
    Thanks!!!
    Here is my code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Your Career Direction Career and College Counseling</title>
    <meta name="Keywords" content="career counseling, college counseling, job search, career choice, college options, career options, work, jobs, new opportunities, career change, new career, new job" />
    <meta name="Description" content="Your Career Direction :: Career and College Counseling" "Considering your college choices & career options" "Preparing for the world of work after college" "Seeking a new position to further your career"
    "In-transition and considering new opportunities"
    "Seeking to make a significant and meaningful career change"  />
    <meta name="Publisher" content="Your Career Direction, LLC" />
    <meta name="Copyright" content="Copyright 2012, Your Career Direction, LLC. All rights reserved." />
    <meta name="Author" content="Lisa Mark" />
    <meta name="Language" content="en-US" />
    <meta name="distribution" content="global" />
    <meta name="revisit-after" content="10 days" />
    <meta name="Robots" content="All" />
    <link rel="Index" href="index.html" />
    <link rel="Site Map" href="sitemap.html" />
    <script type="text/javascript" src="//use.typekit.net/ifb2bte.js"></script>
    <script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
    <script type="text/javascript">try{Typekit.load();}catch(e){}</script>
    <style type="text/css">
    <!--
    body {
        margin: 0;
        padding: 0;
        color: #000;
        font-size: 100%;
        line-height: 1.4;
        background-image: url(images/background.gif);
        background-repeat: repeat;
    /* ~~ Element/tag selectors ~~ */
    ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
        padding: 0;
        margin: 0;
    h1, h2, h3, h4, h5, h6, p {
        margin-top: 0;     /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
        padding-right: 15px;
        padding-left: 15px;
    .container .sidebar1 h3 {
        padding-left: 0px;
        color: #C60651;
        font-size: x-large;
    h1 strong {
        color: #C60651;
        font-size: 90%;
        font-family: "Binary ITC Bold";
    h1 strong em {
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
        border: none;
    /* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
    a:link {
        color:#414958;
        text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
    a:visited {
        color: #4E5869;
        text-decoration: underline;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
        text-decoration: none;
    /* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
    .container {
        width: 80%;
        max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
        min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
        background: #FFF; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
        margin-top: 0;
        margin-bottom: 0;
        margin-right: auto;
        margin-left: auto;
        border-right-width: thick;
        border-left-width: thick;
        border-right-style: solid;
        border-left-style: solid;
        border-right-color: #C60651;
        border-left-color: #C60651;
    /* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
    .header {
        padding-top: 40px;
    #Quote {
        float: right;
        clear: left;
        margin-right: 1%;
    /* ~~ These are the columns for the layout. ~~
    1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
    2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
    3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
    4) If you prefer your nav on the right instead of the left, simply float these columns the opposite direction (all right instead of all left) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
    .sidebar1 {
        float: left;
        width: 15%;
        padding-bottom: 10px;
        margin-top: 40px;
        margin-left: 25px;
        background-color: #FFF;
        font-family: museo-sans;
    arial;
        max-width: 200px;
        min-width: 180px;
    .content {
        float: left;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 10;
        font-family: museo-sans;
    arial;
        margin-top: 40px;
        padding-right: 10px;
        width: 50px;
        font-size: large;
    .container .content p {
        padding-top: 0px;
    .sidebar2 {
        float: left;
        width: 20%;
        background-color: #D3CCB2;
        margin-top: 40px;
        padding-top: 10px;
        border-top-color: #FFF;
        border-right-color: #FFF;
        border-bottom-color: #FFF;
        border-left-color: #FFF;
        border-right-width: 5px;
        font-family: museo-sans;
    arial;
        font-size: 90%;
        right: 12%;
    /* ~~ This grouped selector gives the lists in the .content area space ~~ */
    .content ul, .content ol {
        padding-top: 0px;
        padding-right: 25px;
        padding-bottom: 15px;
        padding-left: 40px;
        font-family: museo-sans; arial;
        font-size: 100%;
        color: #666;
    .container .content p {
        font-family: museo-sans;
    arial;
        padding-top: 0px;
        padding-left: 17px;
        padding-bottom: 0px;
    #Quote {
        float: right;
        clear: both;
    /* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
    ul.nav {
        list-style: none; /* this creates the space between the navigation on the content below */
        font-family:museo-sans; arial;
        line-height: 250%;
    .nav {
        font-family: museo-sans;
    arial;
        padding-left: 0px;
    ul.nav li {
        font-family: museo-sans; arial;
        padding-bottom: 10px;
    ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
        display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
        text-decoration: none;
        color: #333333;
        background-color: #FFF;
        font-family: museo-sans; arial;
        padding-top: 5px;
        padding-right: 5px;
        padding-bottom: 10px;
        padding-left: 15px;
    ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
        color: #C60651;
        font-family:museo-sans; arial;
        background-color: #FFF;
        background-image: url(images/navbar2.gif);
        padding-bottom: 10px;
    .content img {
    /* ~~The footer ~~ */
    .footer {
        position: relative;/* this gives IE6 hasLayout to properly clear */
        clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
        padding-top: 0px;
        padding-right: 0;
        padding-bottom: 10px;
    /* ~~miscellaneous float/clear classes~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: right;
        margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-right: 8px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    .container .content {
        width: 50%;
        font-size: large;
        font-family: museo-sans; arial;
    #footer {    width: 100%;
        background-color: #FFF;
    .container .sidebar2 h4 img {
        padding-left: 20px;
        padding-top: 0px;
    .sidebar2 p img {
        border: medium solid #C60651;
    #Insert_logo2 {
        border-top-width: 4px;
        border-right-width: 4px;
        border-bottom-width: 4px;
        border-left-width: 4px;
        border-top-color: #fff;
        border-right-color: #fff;
        border-bottom-color: #fff;
        border-left-color: #fff;
    .container .content p .content strong {
        font-family: museo-sans; arial;
    .container .content .content {
        font-family: museo-sans; arial;
    .container .content ul li strong {
        font-family: museo-sans;
    arial;
        font-size: 95%;
        line-height: 150%;
        list-style-type: disc;
    .container .content ul {
    test {
        font-family: "Binary ITC Bold";
    .container .sidebar2 p img {
        margin-right: auto;
        margin-left: auto;
        border-top-width: medium;
        border-right-width: medium;
        border-bottom-width: medium;
        border-left-width: medium;
        border-top-color: #C60651;
        border-right-color: #C60651;
        border-bottom-color: #C60651;
        border-left-color: #C60651;
    li strong {
        line-height: 130%;
        list-style-type: circle;
        color: #978980;
    .container .content ul {
    .container .sidebar1 .nav {
        margin-top: 10px;
        margin-bottom: 10px;
    .sidebar1 .nav li {
        padding-bottom: 10%;
    .nav li a {
        background-image: url(images/navbar2.gif);
        background-repeat: no-repeat;
        background-position: right center;
        left: auto;
        right: auto;
        clip: rect(auto,auto,auto,auto);
    .container .sidebar1 .nav li a {
    .container .sidebar1 h6 {
        padding: 0px;
        color: #000000;
    #footer h3 strong {
        font-size: 60%;
        color: #978980;
    .container .content p {
        padding-right: 0%;
        padding-left: 0%;
        font-size: 85%;
    .container .sidebar2 p {
        padding-right: 8%;
        padding-left: 8%;
        padding-top: 5px;
    #Insert_logo2 #Insert_logo2 {
        padding-left: 15px;
    .container .content ul {
        color: #C60651;
    h6 {
        color: #978980;
        font-family: museo-sans;
    arial;
        font-size: 82%;
        padding-left: 20%;
        text-align: left;
        text-indent: 8px;
    .nav li a {
        padding-bottom: 10px;
    h8 {
        font-family: museo-sans; arial;
        font-size: 100%;
    h4 {
        font-family: museo-sans;
    arial;
        font-size: 100%;
        color: #C60651;
        padding-left: 17px;
        padding-top: 5px;
        padding-bottom: 0px;
    .container .content p {
        padding-left: 17px;
        padding-right: 30px;
    .sidebar1 h8 strong {
        font-size: 80%;
        font-family:museo-sans; arial;
    .container .sidebar1 h7 {
        font-size: 40%;
        color: #978980;
    h7 {
        font-family: museo-sans; arial;
        font-size: 15%;
    .container .sidebar1 h8 {
        font-family: museo-sans; arial;
    .sidebar2 p img {
            max-width: 100%;
    .container .content img {
        padding-left: 3%;
    img {
        position: static;
        text-align: left;
    body,td,th {
        font-family: museo-sans; arial;
    h5 {
        font-size: 150%;
        color: #C60651;
        padding-left: 0px;
        font-family:museo-sans; arial;
    .container .content p {
        padding-left: 17px;
        padding-right: 30px;
        font-size: 87%;
    .container .sidebar2 p {
        font-size: 90%;
    .container .sidebar1 .nav li {
        font-family: museo-sans;
    arial;
    .container .sidebar1 .nav li a {
        padding-left: 0px;
        margin-bottom: 0px;
        height: 30px;
    li a {
        padding-left: 2px;
    -->
    </style><!--[if lte IE 7]>
    <style>
    .content { margin-right: -1px; } /* this 1px negative margin can be placed on any of the columns in this layout with the same corrective effect. */
    ul.nav a { zoom: 1; }  /* the zoom property gives IE the hasLayout trigger it needs to correct extra whiltespace between the links */
    </style>
    <![endif]-->
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css">
    </head>
    <body><script type="text/javascript">
    function pageWidth() {
    return window.innerWidth != null? window.innerWidth : document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body != null ? document.body.clientWidth : null;
    function pageHeight() {
    return window.innerHeight != null? window.innerHeight : document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body != null? document.body.clientHeight : null;
    </script>
    <div class="container">
      <div class="header"><!-- end .header -->
        <p class="clearfloat"><a href="#index.html" id="Insert_logo2"><img src="images/YCD-logo-tag-RGB-web-SM.gif" alt="Your Career Direction Logo" name="Insert_logo" width="50%" id="Insert_logo2" style="background: #FFF
        ; display:block;" /></a></p>
        <div id="Quote"><img src="images/quote.gif" alt="Choose a job you love" width="355" height="81"></div>
        <p class="clearfloat"> </p>
    </div>
      <div class="sidebar1">
        <ul class="nav">
          <li>
            <div id="Accordion1" class="Accordion" tabindex="0">
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Home</a></div>
                <div class="AccordionPanelContent">Content 1</div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Students</a></div>
                <div class="AccordionPanelContent"><a href="#">High School</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Professional</a></div>
                <div class="AccordionPanelContent">Content 3</div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Parent/Educator</a></div>
                <div class="AccordionPanelContent">Content 4</div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Seminars</a></div>
                <div class="AccordionPanelContent">Content 5</div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Bio</a></div>
                <div class="AccordionPanelContent">Content 6</div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Q &amp; A Blog</a></div>
                <div class="AccordionPanelContent">Content 7</div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Testimonials</a></div>
                <div class="AccordionPanelContent">Content 8</div>
              </div>
            </div>
          </li>
        </ul>
      </div>
      <div class="content">
    <p>Given today's competitive job market, global economy, and changed corporate culture,
    we can no longer depend upon others to ensure our professional futures. Choosing or
    changing your career direction requires self-reflection, career education and an action plan.</p>
    <img src="images/Whether-you-are-.gif" alt="Whether you are considering your college choices and career options" width="197" height="31" align="left">
    <ul>
          <br><br><li><strong>Considering your college choices &amp; career options</strong></li>
          <li><strong>Preparing for the world of work after college</strong></li>
          <li><strong>Seeking a new position to further your career</strong></li>
          <li><strong>In-transition and considering new opportunities</strong></li>
          <li><strong>Seeking to make a significant and meaningful career</strong> <strong>change</strong></li>
        </ul>
    <img src="images/Onethingisforsureraster.gif" width="352" height="49" alt="One thing is for sure, we all want to direct our own careers, our own lives!">
    <br><p> Building a successful and rewarding career requires linking your interests, education and experience with employment trends, growth industries, and career choices. It takes making smart decisions about your college major, vocational training and continuing education options. With enthusiasm, persistence and top notch job search skills, you can succeed in finding a path to career that is right for you.</p>
    <p> We are your advocate. We listen, assess, strategize, inspire, counsel, and network on your behalf. With a personalized, holistic approach, we'll work with you to help you create an action plan; a path designed to get you to where you want to go and become what you want to be.</p>
    <img src="images/yourcareerourpassionraster.gif" width="441" height="20" alt="At Your Career Direction, YOUR career is our passion!"> </div>
      <div class="sidebar2">
        <p><img src="images/Counselingastudent.gif" width="100%" alt="Lisa Mark counseling a student"></p>
        <p>Our mission is to help you explore, choose and create your direction for an exciting and rewarding career path.</p>
         <p>We incorporate our experience with today's job market and career counseling expertise with your passions and interests. We'll introduce you to new career ideas, target companies and generate job and internship opportunities for you.</p>
         <p>We provide step by step guidance to ensure your success during the college application, job interview
    and decision making process.
    </p>
    </div>
      <div class="footer">
        <div id="footer">
          <h6 align="left"> Your Career Direction, LLC •  96 Harvard Avenue, Maplewood, N.J. 07040 • (973) 996-0207 • [email protected]</h6>
        </div>
        <p> </p>
      <!-- end .footer --></div>
    <!-- end .container --></div>
    <script type="text/javascript">
    var Accordion1 = new Spry.Widget.Accordion("Accordion1");
    </script>
    </body>
    </html>

    1. The spry accordian has a box around it on mouse down but I can't figure out how to get rid of it. I've checked all the CSS rules for the spry accordian and none of them seem to have rules around them.
    2. All the tabs have a content area underneath them and we only want content areas underneath the student tab. You see how it goes when you click on any of the tabs, you get a little thing that says content 1, 2 etc. I tried deleting them in the code and the page goes completely crazy when I do and the nav bar areas stretch all the way across the page.
    3. I can't figure out how to get the child tabs (which would be the tabs under students which say high school and college) to have two tabs. You will see that it does have the high school tab there now. When I try cutting and pasting the code to try to get two tabs, it does not work. The spry accordian framework only creates one content area under each tab.
    4. I'd like the child tabs to have a narrower height than the parent tabs, and be indented so that they will clearly be set off and different than the parent tabs.
    1. Line 454
    <div id="Accordion1" class="Accordion" tabindex="0" style="outline: none;">
    2 & 3. Change your code from Line 455 - 491:
    <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Home</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Students</a></div>
                <div class="AccordionPanelContent"><a href="#">High School</a><br/><a href="#" style="margin-top: -30px;">College</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Professional</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Parent/Educator</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Seminars</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Bio</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Q &amp; A Blog</a></div>
              </div>
              <div class="AccordionPanel">
                <div class="AccordionPanelTab"><a href="#">Testimonials</a></div>
              </div>
            </div>
          </li>
        </ul>
      </div>
    4. Append your HTML for child tabs like this:
    <div class="AccordionPanelContent" id="submenu"><a href="#">High School</a></div>
    Create a new #submenu css rule in your CSS document and set styling the way you want it.

  • Spry Menu Bar and Spry Accordians quit working.

    I for the life of me can not figure out why these quit working both the spry menu bar and my accordians quit working,  .  Here is the site I am working on http://www.online-antiques-and-collectibles.com
    The pages are in .php so http://www.online-antiques-and-collectibles.com/index.php
    I use a dell PC with windows 7.  Godaddy is the webserver.  I am also using a template.  The site pages are HTML5 and PHP. 
    so someone please help me find out the bug I did to this thing.  I really have too much work into this as of now to start over with a new template page if I do not have to?
    Any suggestions would be great.  Thanks in advance for your help.
    Here is the code from my index page
    <!doctype html>
    <html><!-- InstanceBegin template="/Templates/deco.dwt.php" codeOutsideHTMLIsLocked="false" -->
    <head>
    <meta charset="utf-8">
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>Untitled Document</title>
    <!-- InstanceEndEditable -->
    <!-- InstanceBeginEditable name="head" -->
    <!-- InstanceEndEditable -->
    <link href="styles.css" rel="stylesheet" type="text/css">
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css">
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    </head>
    <body>
    <div class="container">
      <div class="header">
        <header><img src="Assets/Images/DECO BANNER.fw.png" width="954" height="228" alt="Deco Designs and Collectibles Header"></header>
      </div>
      <div class="Nav">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="index.php">Home</a></li>
          <li><a href="#" class="MenuBarItemSubmenu">Browse</a>
            <ul>
              <li><a href="antiques/antique-categories.php">Antique Categories</a></li>
              <li><a href="collectibles/collectible-categories.php">Collectible Categories</a></li>
            </ul>
          </li>
          <li><a href="search.php" title="Search Deco Designs and Collectibles Website">Search</a></li>
          <li><a href="cost.php" title="What Deco Designs and Collectibles Cost">Costs</a></li>
    <li><a href="register.php" title="Register for a Deco Designs and Collectibles Seller Account">Register</a></li>
          <li><a href="login.php" title="Login to your Deco Designs and Collectibles Sellers Account">Login</a></li>
          <li><a href="contact-us.php" title="Contact Us at Deco Designs and Collectibles">Contact Us</a></li>
          <li><a href="about-us.php" title="About Us at Deco Designs and Collectibles">About Us</a></li>
        </ul>
      </div>
      <div class="sidebar1">
        <div><strong>ANTIQUES</strong></div>
        <div id="Accordion1" class="Accordion" tabindex="0">
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Antiquities Middle Ages</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/antiquities-middle-ages-antiques/byzantine-antiques/byzantine-antiquities. php" title="Byzantine Antiques">Byzantine Antiquities</a></p>
    <p><a href="antiques/antiquities-middle-ages-antiques/celtic-antiques/celtic-antiquities.php" title="Celtic Antiques">Celtic Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/egyptian-antiques/egyptian-antiquities.ph p" title="Egyptian Antiques">Egyptian Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/far-eastern-antiques/far-eastern-antiquit ies.php" title="Far Eastern Antiques">Far Eastern Antiquities </a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/greek-antiques/greek-antiquities.php" title="Greek Antiques">Greek Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/holy-land-antiques/holy-land-antiquities. php" title="Holy Land Antiques">Holy Land Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/islamic-antiques/islamic-antiquities.php" title="Islamic Antiques">Islamic Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/near-eastern-antiques/near-eastern-antiqu ities.php" title="Near Eastern Antiques">Near Eastern Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/neolithic-antiques/neolithic-antiquities. php" title="Neolithic and Paleolithic Antiques">Neolithic and Paleolithic Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/reproduction-antiquities/reproduction-ant iquities.php" title="Reproduction Antiquities">Reproduction Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/roman-antiques/roman-antiquities.php" title="Roman">Roman Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/south-italian-antiques/south-italian-anti quities.php" title="South Italian Antiques">South Italian Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/the-americas-antiques/the-americas-antiqu ities.php" title="The Americas Antiques">The Americas Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/viking-antiques/viking-antiquities.php" title="Viking Antiques">Viking Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/price-guides-and-publications-for-antiqui ties-middle-ages/price-guides-and-publications-for-antiquities-middle-ages.php" title="Price Guides and Publications for Antiquities Middle Ages">Price Guides and Publications for Antiquities Middle Ages</a></p>
    <p><a href="antiques/antiquities-middle-ages-antiques/other-antiquities/other-antiquities-middl e-ages.php" title="Other Antiquities Middle Ages Antiques">Other - Antiquities Middle Ages</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Architectural and Garden Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/architectural-and-garden-antiques/alabaster/alabaster-architectural-and-ga rden-antiques.php" title="Antique Alabaster">Alabaster - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/brass/brass-architectural-and-garden-ant iques.php" title="Antique Brass">Brass - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/bronze/bronze-architectural-and-garden-a ntiques.php" title="Antique Bronze">Bronze - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/cast-iron/cast-iron-architectural-and-ga rden-antiques.php" title="Antique Cast Iron">Cast Iron - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/chrome/chrome-architectural-and-garden-a ntiques.php" title="Antique Chrome">Chrome - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/copper/copper-architectural-and-garden-a ntiques.php" title="Antique Copper">Copper - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/crystal/crystal-architectural-and-garden -antiques.php" title="Antique Crystal">Crystal - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/glass/glass-architectural-and-garden-ant iques.php" title="Glass">Glass - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/gold/gold-architectural-and-garden-antiq ues.php" title="Antique Gold">Gold - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/iron/iron-architectural-and-garden-antiq ues.php" title="Antique Iron">Iron - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/marble/marble-architectural-and-garden-a ntiques.php" title="Marble">Marble - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/mixed-materials/mixed-materials-architec tural-and-garden-antiques.php" title="Mixed Material Antiques">Mixed Materials - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/pewter/pewter-architectural-and-garden-a ntiques.php" title="Antique Pewter">Pewter - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/porcelain/porcelain-architectural-and-ga rden-antiques.php" title="Antique Porcelain">Porcelain - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/silver/silver-architectural-and-garden-a ntiques.php" title="Antique Silver">Silver - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/steel/steel-architectural-and-garden-ant iques.php" title="Antique Steel">Steel - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/stone/stone-architectural-and-garden-ant iques.php" title="Antique Stone">Stone - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/synthetic/synthetic-architectural-and-ga rden-antiques.php" title="Synthetic Antiques">Synthetic - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/tole/tole-architectural-and-garden-antiq ues.php" title="Antique Tole">Tole - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/wood/wood-architectural-and-garden-antiq ues.php" title="Antique Wood">Wood - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/other-architectural-and-garden-antiques/ other-architectural-and-garden-antiques.php" title="Other Architectural and Garden Antiques">Other - Architectural and Garden Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Asian Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/asian-antiques/amulets/amulets-asian-antiques.php" title="Antique Asian Amulet">Amulets - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/armor/armor-asian-antiques.php" title="Antique Asian Armor">Armor - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/baskets/baskets-asian-antiques.php" title="Antique Asian Basket">Baskets - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/bells/bells-asian-antiques.php" title="Antique Asian Bell">Bells - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/bowls/bowls-asian-antiques.php" title="Antique Asian Bowl">Bowls - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/boxes/boxes-asian-antiques.php" title="Antique Asian Boxe">Boxes - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/bracelets/bracelets-asian-antiques.php" title="Antique Asian Bracelet">Bracelets - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/brush-pots/brush-pots-asian-antiques.php" title="Antique Asian Brush Pot">Brush Pots - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/brush-water/brush-washer-asian-antiques.php" title="Antique Asian Brush Washer">Brush Washers - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/dolls/dolls-asian-antiques.php" title="Asian Antique Doll">Dolls - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/fans/fans-asian-antiques.php" title="Asian Antique Fan">Fans - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/furniture/furniture-asian-antiques.php" title="Asian Antique Furniture">Furniture - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/glasses-and-cups/glasses-and-cups-asian-antiques.php" title="Asian Antique Glass and Cup">Glasses and Cups - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/incense-burners/incense-burners-asian-antiques.php" title="Asian Antique Incense Burner">Incense Burners - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/ink-stones/ink-stones-asian-antiques.php" title="Asian Antique Ink Stone">Ink Stones - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/katana/katana-asian-antiques.php" title="Asian Antique Katana">Katana - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/kimonos-robes-and-textiles/kimonos-robes-and-textiles-asian -antiques.php" title="Asian Antique Kimono, Robe, and Textile">Kimonos, Robes and Textiles - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/masks/masks-asian-antiques.php" title="Asian Antique Mask">Masks - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/necklaces-and-pendants/necklaces-and-pendants-asian-antique s.php" title="Asian Antique Necklace and Pendant">Necklaces and Pendants - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/netsuke/netsuke-asian-antiques.php" title="Asian Antique Netsuke">Netsuke - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/paintings-scrolls-and-prints/paintings-scrolls-and-prints-a sian-antiques.php" title="Asian Antique Painting, Scroll and Print">Paintings, Scrolls and Prints - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/plates/plates-asian-antiques.php" title="Asian Antique Plate">Plates - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/pots/pots-asian-antiques.php" title="Asian Antique Pot">Pots - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/rings/rings-asian-antiques.php" title="Asian Antique Ring">Rings - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/seals/seals-asian-antiques.php" title="Asian Antique Seal">Seals - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/snuff-bottles/snuff-bottles-asian-antiques.php" title="Asian Antique Snuff Bottle">Snuff Bottles - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/statues/statues-asian-antiques.php" title="Asian Antique Statue">Statues - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/swords/swords-asian-antiques.php" title="Asian Antique Sword">Swords - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/tea-caddies/tea-caddies-asian-antiques.php" title="Asian Antique Tea Caddie">Tea Caddies - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/teapots/teapots-asian-antiques.php" title="Asian Antique Teapot">Teapots - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/tubas/tubas-asian-antiques.php" title="Asian Antique Tuba">Tubas - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/vases/vases-asian-antiques.php" title="Asian Antique Vase">Vases - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/other-asian-antiques/other-asian-antiques.php" title="Other Asian Antiques">Other Asian Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Books and Manuscripts Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/books-and-manuscripts-antiques/americana/americana-books-and-manuscripts-a ntiques.php" title="Americana Book">Americana - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/art-and-photography/art-and-photography-boo ks-and-manuscripts-antiques.php" title="Art Book and Photography Book">Art and Photography - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/biography-and-autobiography/biography-and-a utobiography-books-and-manuscripts-antiques.php" title="Biography and Autobiography Book">Biography and Autobiography - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/children/children-books-and-manuscripts-ant iques.php" title="Children Book">Children's - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/cooking/cooking-books-and-manuscripts-antiq ues.php" title="Cook Book">Cooking - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/exploration-and-travel/exploration-and-trav el-books-and-manuscripts-antiques.php" title="Exploration Book and Travel Book">Exploration and Travel - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/fraternal-social-organizations/fraternal-so cial-organizations-books-and-manuscripts-antiques.php" title="Fraternal and Social Organization Book">Fraternal, Social Organizations - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/history/history-books-and-manuscripts-antiq ues.php" title="History Book">History - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/home-and-garden/home-and-garden-books-and-m anuscripts-antiques.php" title="Home Book and Garden Book">Home and Garden - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/law-and-government/law-and-government-books -and-manuscripts-antiques.php" title="Law Book and Government Book">Law and Government - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/literature-and-fiction/literature-and-ficti on-books-and-manuscripts-antiques.php" title="Literature Book and Fiction Book">Literature and Fiction - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/military-and-war/military-and-war-books-and -manuscripts-antiques.php" title="Military Book and War Book">Military and War - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/outdoor-and-nature/outdoor-and-nature-books -and-manuscripts-antiques.php" title="Outdoor Book and Nature Book">Outdoor and Nature - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/performing-arts/performing-arts-books-and-m anuscripts-antiques.php" title="Performing Art Book">Performing Arts - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/pulps/pulps-books-and-manuscripts-antiques. php" title="Pulp Book">Pulps - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/reference/reference-books-and-manuscripts-a ntiques.php" title="Reference Book">Reference - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/religion-and-spirituality/religion-and-spir ituality-books-and-manuscripts-antiques.php" title="Religious Book and Spirituality Book">Religion and Spirituality - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/science-and-medicine/science-and-medicine-b ooks-and-manuscripts-antiques.php" title="Science Book and Medicine Book">Science and Medicine - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/sports/sports-books-and-manuscripts-antique s.php" title="Sport Book">Sports - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/vintage-paperbacks/vintage-paperbacks-books -and-manuscripts-antiques.php" title="Vintage Paperback">Vintage Paperbacks - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/other-books-and-manuscripts-antiques/other- books-and-manuscripts-antiques.php" title="Other Book and Manuscrpit Antiques">Other - Books and Manuscripts Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Carvings Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/carvings-antiques/african-carvings/african-carvings-antiques.php" title="African Carving">African - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/anri-wood-carvings/anri-wood-carvings-antiques.php" title="Ari Wood Carving">Anri Wood - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/chinese-carvings/chinese-carvings-antiques.php" title="Chinese Carving">Chinese - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/intuit-carvings/intuit-carvings-antiques.php" title="Intuit Carving">Intuit - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/ironwood-carvings/ironwood-carvings-antiques.php" title="Ironwood Carving">Ironwood - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/jade-carvings/jade-carvings-antiques.php" title="Jade Carving">Jade - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/stone-carvings/stone-carvings-antiques.php" title="Stone Carving">Stone -  Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/wood-carvings/wood-carvings-antiques.php" title="Wood Carving">Wood - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/other-antique-carvings/other-carvings-antiques.php" title="Other Antique Carving">Other - Antique Carvings</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Ceramic and Porcelain Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/ceramic-and-porcelain-antiques/amphora/amphora-ceramic-and-porcelain-antiq ues.php" title="Amphora">Amphora - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/bavaria/bavaria-ceramic-and-porcelain-antiq ues.php" title="Bavaria">Bavaria - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/bellek-bellek-american-or-bellek-irish/bell ek-bellek-american-or-bellek-irish-ceramic-and-porcelain-antiques.php" title="Belleek">Belleek, Belleek American or Belleek Irish - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/capodimonte/capodimonte-ceramic-and-porcela in-antiques.php" title="Capodimonte">Capodimonte - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/celadon/celadon-ceramic-and-porcelain-antiq ues.php" title="Celadon">Celadon - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/celadon-northern-or-southern/celadon-northe rn-or-southern-ceramic-and-porcelain-antiques.php" title="Northern Celadon or Southern Celadon">Celadon, Northern or Southern - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/chintz-grimwades-royal-winton-lefton-shelll y/chintz-grimwades-royal-winton-lefton-shelly-ceramic-and-porcelain-antiques.php" title="Chintz, Grimwades (Royal Winton), Lefton, Shelly">Chintz, Grimwades   (Royal Winton), Lefton, Shelly - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/cookie-jars-hall-hull-mccoy-redwing-shelly/ cookie-jars-hall-hull-mccoy-redwing-shelly.php" title="Antique Cookie Jars">Cookie Jars, Hall, Hull, McCoy,   Redwing, Shelly - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/copeland-spode/copeland-spode-ceramic-and-p orcelain-antiques.php" title="Copeland Spode">Copeland Spode - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/dedham-pottery/dedham-pottery-ceramic-and-p orcelain-antiques.php" title="Dedham Pottery">Dedham Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/delftware/delftware-ceramic-and-porcelain-a ntiques.php" title="Delftware">Delftware - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/dresden-meissen/dresden-meissen-ceramic-and -porcelain-antiques.php" title="Dresden Meissen">Dresden Meissen - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/famille-rose/famille-rose-ceramic-and-porce lain-antiques.php" title="Famille Rose">Famille   Rose - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/fiesta/fiesta-ceramic-and-porcelain-antique s.php" title="Fiesta">Fiesta - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/flow-blue/flow-blue-ceramic-and-porcelain-a ntiques.php" title="Flow Blue">Flow Blue - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/fulper/fulper-ceramic-and-porcelain-antique s.php" title="Fulper">Fulper - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/grueby-pottery/grueby-pottery-ceramic-and-p orcelain-antiques.php" title="Grueby Pottery">Grueby Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hall-pottery/hall-pottery-ceramic-and-porce lain-antiques.php" title="Hall Pottery">Hall Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/haviland-china/haviland-china-ceramic-and-p orcelain-antiques.php" title="Haviland Ching">Haviland China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hull-pottery/hull-pottery-ceramic-and-porce lain-antiques.php" title="Hull Pottery">Hull Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hummel-items-figurines-plates/hummel-items- figurines-plates-ceramic-and-porcelain-antiques.php" title="Hummel, Items, Figurines, Plates">Hummel, Items, Figurines, Plates - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hummel-goebel/hummel-goebel-ceramic-and-por celain-antiques.php" title="Hummel Goebel">Hummel Goebel - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/kpm-figurines-plates-plaques/kpm-figurines- plates-plaques-ceramic-and-porcelain-antiques.php" title="KPM, figurines, plates, plaques - Ceramic and Porcelain Antiques">KPM, figurines, plates, plaques - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/lenox-china/lenox-china-ceramic-and-porcela in-antiques.php" title="Lenox China">Lenox China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/limoge-china/limoge-china-ceramic-and-porce lain-antiques.php" title="Limoge China">Limoge China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/lladro-porcelains/lladro-porcelains-ceramic -and-porcelain-antiques.php" title="Lladro Porcelain">Lladro Porcelains - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/majolica/majolica-ceramic-and-porcelain-ant iques.php" title="Majolica">Majolica - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/mccoy-pottery/mccoy-pottery-ceramic-and-por celain-antiques.php" title="McCoy Pottery">McCoy Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/minton-china/minton-china-ceramic-and-porce lain-antiques.php" title="Milton China">Minton China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/newcomb-college-pottery/newcomb-college-pot tery-ceramic-and-porcelain-antiques.php" title="Newcomb College Pottery">Newcomb College Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/niloak-pottery/niloak-pottery-ceramic-and-p orcelain-antiques.php" title="Niloak Pottery">Niloak Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/nippon-china/nippon-china-ceramic-and-porce lain-antiques.php" title="Nippon China">Nippon China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/noritake-china/noritake-china-ceramic-and-p orcelain-antiques.php" title="Noritake China">Noritake China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/old-sleepy-eye/old-sleepy-eye-ceramic-and-p orcelain-antiques.php" title="Old Sleepy Eye">Old Sleepy Eye - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/onion-meissen/onion-meissen-ceramic-and-por celain-antiques.php" title="Onion Meissen">Onion   Meissen -  Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/oriental/oriental-ceramic-and-porcelain-ant iques.php" title="Oriental Ceramic and Porcelain">Oriental - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/parian-ware/parian-ware-ceramic-and-porcela in-antiques.php" title="Parian Ware">Parian Ware -  Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/piano-babies/piano-babies-ceramic-and-porce lain-antiques.php" title="Piano Babies">Piano Babies Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/pickard-china/pickard-china-ceramic-and-por celain-antiques.php" title="Pickard China">Pickard China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/quimper/quimper-ceramic-and-porcelain-antiq ues.php" title="Quimper Ceramics">Quimper Ceramics - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/red-wing-pottery/red-wing-pottery-ceramic-a nd-porcelain-antiques.php" title="Red Wing Pottery">Red Wing Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rockingham-rockingham-brown-glazed-wares/ro ckingham-rockingham-brown-glazed-wares-ceramic-and-porcelain-antiques.php" title="Rockingham and Rockingham Brown Glazed Wares">Rockingham, Rockingham Brown Glazed Wares - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rookwood-pottery/rookwood-pottery-ceramic-a nd-porcelain-antiques.php" title="Rookwood Pottery">Rookwood Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rose-canton-rose-mandarin-rose-medallion/ro se-canton-rose-mandarin-rose-medallion-ceramic-and-porcelain-antiques.php" title="Rose Canton, Rose Mandarin and Rose Medallion">Rose Canton, Rose Mandarin, Rose Medallion - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rosenthal-porcelain/rosenthal-porcelain-cer amic-and-porcelain-antiques.php" title="Rosenthal">Rosenthal Porcelain - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/roseville-pottery/roseville-pottery-ceramic -and-porcelain-antiques.php" title="Roseville Pottery">Roseville Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-bayreuth/royal-bayreuth-ceramic-and-p orcelain-antiques.php" title="Royal Bayreuth">Royal Bayreuth - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-bohn/royal-bohn-ceramic-and-porcelain -antiques.php" title="Royal Bonn">Royal Bonn - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-coppenhagen/royal-coppenhagen-ceramic -and-porcelain-antiques.php" title="Royal Coppenhagen">Royal   Coppenhagen - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-crown-derby/royal-crown-derby-ceramic -and-porcelain-antiques.php" title="Royal Crown Derby">Royal Crown Derby - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-doulton/royal-doulton-ceramic-and-por celain-antiques.php" title="Royal Doulton">Royal Doulton - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-worchester/royal-worchester-ceramic-a nd-porcelain-antiques.php" title="Roayl Worchester">Royal   Worcester - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/satsuma/satsuma-ceramic-and-porcelain-antiq ues.php" title="Satsuma">Satsuma - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/sevres/sevres-ceramic-and-porcelain-antique s.php" title="Sevres">Sevres - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/shawnee-pottery/shawnee-pottery-ceramic-and -porcelain-antiques.php" title="Shawnee Pottery">Shawnee Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/shelley/shelley-ceramic-and-porcelain-antiq ues.php" title="Shelley">Shelley - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/staffordshire/staffordshire-ceramic-and-por celain-antiques.php" title="Straffordshire">Staffordshire - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/stangl-pottery-birds/stangl-pottery-birds-c eramic-and-porcelain-antiques.php" title="Stangl Pottery">Stangl Pottery Birds - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/tiles/tiles-ceramic-and-porcelain-antiques. php" title="Ceramic and Porcelain Tile">Tiles - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/toby-jugs/toby-jugs-ceramic-and-porcelain-a ntiques.php" title="Toby Jug">Toby Jugs - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/van-briggle/van-briggle-pottery-ceramic-and -porcelain-antiques.php" title="Van Briggle Pottery">Van Briggle Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/wedgewood/wedgewood-ceramic-and-porcelain-a ntiques.php" title="Wedgwood Pottery">Wedgwood - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/weller-pottery/weller-pottery-ceramic-and-p orcelain-antiques.php" title="Weller Pottery">Weller Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/willow-pattern-china/willow-pattern-ceramic -and-porcelain-antiques.php" title="Willow Pattern China">Willow Pattern China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/zanesville-pottery/zanesville-pottery-ceram ic-and-porcelain-antiques.php" title="Zanesville Pottery">Zanesville Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/other-ceramic-and-porcelain-antiques/other- ceramic-and-porcelain-antiques.php" title="Other Antique Ceramic and Porcelan">Other - Ceramic and Porcelain Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Clocks Antiques</div>
            <div class="AccordionPanelContent">
              <p> <a href="antiques/clocks-antiques/antique-clocks/pre-1930-clocks-antiques.php" title="Antique Clock"> Antique Clocks - Pre 1930</a></p>
              <p><a href="antiques/clocks-antiques/parts-and-tools-for-clocks-antiques/parts-and-tools-for-cl ocks-antiques.php" title="Antique Clock Parts and Tools">Parts and Tools for Antique Clocks</a></p>
              <p><a href="antiques/clocks-antiques/price-guides-and-publications-for-clocks-antiques/price-gu ides-and-publications-for-clocks-antiques.php" title="Price Guides and Publications for Antique Clocks">Price Guides and Publications for Antique Clocks</a></p>
              <p><a href="antiques/clocks-antiques/other-clocks-antiques/other-clocks-antiques.php" title="Other Antique Clock">Other - Antique Clocks</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Comics Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/comics-antiques/antique-comics/comics-pre-1930-antiques.php" title="Antique Comic">Antique Comics (Pre 1930)</a></p>
              <p><a href="antiques/comics-antiques/other-comic-pre-1930-antiques/other-comic-pre-1930-antique s.php" title="Other Antique Comic">Other - Antique Comics (Pre 1930) </a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Decorative Arts Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/decorative-arts-antiques/bottles/bottles-decorative-arts-antiques.php" title="Antique Bottle">Bottles - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/bowls/bowls-decorative-arts-antiques.php" title="Antique Bowl">Bowls - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/boxes/boxes-decorative-arts-antiques.php" title="Antique Box">Boxes - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/butter-pats/butter-pats-decorative-arts-antiques. php" title="Butter Pat">Butter Pats - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/candle-holders/candle-holders-decorative-arts-ant iques.php" title="Candle Holder">Candle Holders - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/candle-sticks/candle-sticks-decorative-arts-antiq ues.php" title="Candle Stick">Candle Sticks - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/clocks/clocks-decorative-arts-antiques.php" title="Antique Clock">Clocks - Decorative Arts Antiques </a></p>
              <p><a href="antiques/decorative-arts-antiques/compotes/compotes-decorative-arts-antiques.php" title="Compotes">Compotes - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/creamers-and-sugar-bowls/creamers-and-sugar-bowls -decorative-arts-antiques.php" title="Creamers and Sugar Bowls">Creamers and Sugar Bowls - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/crocks/crocks-decorative-arts-antiques.php" title="Crocks">Crocks - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/cups-and-saucers/cups-and-saucers-decorative-arts -antiques.php" title="Cup and Saucer">Cups and Saucers - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/decanters/decanters-decorative-arts-antiques.php" title="Decanter">Decanters - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/dishes/dishes-decorative-arts-antiques.php" title="Antique Dish">Dishes - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/figurines-and-statues/figurines-and-statues-decor ative-arts-antiques.php" title="Figurines and Statues">Figurines and Statues - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/jars/jars-decorative-arts-antiques.php" title="Antique Jar">Jars - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/lamps/lamps-decorative-arts-antiques.php" title="Antique Lamp">Lamps - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/mirrors/mirrors-decorative-arts-antiques.php" title="Mirror">Mirrors - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/perfume-bottles/perfume-bottles-decorative-arts-a ntiques.php" title="Perfume Bottle">Perfume Bottles - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/picture-frames/picture-frames-decorative-arts-ant iques.php" title="Picture Frame">Picture Frames - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/pitchers/pitchers-bottles-decorative-arts-antique s.php" title="Pitcher">Pitchers - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/planters/planters-decorative-arts-antiques.php" title="Planter">Planters - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/plates/plates-decorative-arts-antiques.php" title="Antique Plate">Plates - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/platters-and-trays/platters-and-trays-decorative- arts-antiques.php" title="Platter and Tray">Platters and Trays - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/salt-and-pepper-shakers/salt-and-pepper-shakers-d ecorative-arts-antiques.php" title="Salt and Pepper Shaker">Salt and Pepper Shakers - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/stained-glass-windows/stained-glass-windows-decor ative-arts-antiques.php" title="Stained Glass Window">Stained Glass Windows - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/stemware/stemware-decorative-arts-antiques.php" title="Antique Stemware">Stemware - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/tea-caddies/tea-caddies-decorative-arts-antiques. php" title="Antique Tea Caddie">Tea Caddies - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/teapots-and-tea-sets/teapots-and-tea-sets-decorat ive-arts-antiques.php" title="Teapot and Tea Set">Teapots and Tea Sets - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/tiles/tiles-decorative-arts-antiques.php" title="Antique Tile">Tiles - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/tureens/tureens-decorative-arts-antiques.php" title="Tureen">Tureens - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/urns/urns-decorative-arts-antiques.php" title="Urn">Urns - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/vases/vases-decorative-arts-antiques.php" title="Vase">Vases - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/wooden-ware/wooden-ware-decorative-arts-antiques. php" title="Antique Wooden Ware">Wooden Ware - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/other-decorative-arts-antiques/other-decorative-a rts-antiques.php" title="Other Decorative Arts Antiques">Other - Decorative Arts Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Dolls and Doll Houses Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/dolls-and-doll-houses-antiques/china-head-dolls/china-head-dolls-antiques. php" title="China Head Doll">China Head Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/cloth-lenci-dolls/cloth-lenci-dolls-antique s.php" title="Cloth Lence Doll">Cloth Lenci Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/early-dolls/early-dolls-dolls-antiques.php" title="Early Doll">Early Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/gemran-bisque-dolls/german-bisque-dolls-ant iques.html" title="German Bisque Doll">German Bisque Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/german-character-dolls/german-character-dol ls-antiques.php" title="German Character Doll">German Character  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/kewpies-dolls/kewpies-dolls-antiques.php" title="Hard Plastic Doll">Hard Plastic  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/kewpies-dolls/kewpies-dolls-antiques.php" title="Kewpie Doll">Kewpies  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/madame-alexander-dolls/madame-alexander-dol ls-antiques.php" title="Madame Alexander Doll">Madame Alexander  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/papier-machie-dolls/papier-machie-dolls-ant iques.php" title="Papier Mache Doll">Papier Mache  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/r-john-wright-dolls/r-john-wright-dolls-ant iques.php" title="R. John Wright Doll">R. John Wright  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/shirley-temple-composition-dolls/shirley-te mple-composition-dolls-antiques.php" title="Shirley Temple Composition Doll">Shirley Temple Composition  Dolls - Antique</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/other-dolls-antiques/other-dolls-antiques.p hp" title="Other Antique Dolls">Other Antique Dolls</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/doll-houses/doll-house-dolls-antiques.php" title="Doll House and Doll Houses">Doll House Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Ethnographic Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/ethnographic-antiques/african-ethnographic-antiques/african-ethnographic-a ntiques.php" title="African Antique">African - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/latin-american-ethnographic-antiques/latin-american- ethnographic-antiques.php" title="Latin American Antique">Latin American - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/native-american-ethnographic-antiques/native-america n-ethnographic-antiques.php" title="Native American Antique">Native American - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/pacific-islands-andoceania-ethnographic-antiques/pac ific-islands-andoceania-ethnographic-antiques.php" title="Pacific Island Antique">Pacific Islands and Oceania - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/price-guides-and-publications-ethnographic-antiques/ price-guides-and-publications-ethnographic-antiques.php" title="Price Guides and Publications - Ethnographic Antiques">Price Guides and Publications - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/other-ethnographic-antiques/other-ethnographic-antiq ues.php" title="Other - Ethnographic Antiques">Other - Ethnographic Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Furniture Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/furniture-antiques/danish-furniture/danish-furniture-antiques.php" title="Danish Furniture">Danish Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/edwardian-furniture/edwardian-furniture-antiques.php" title="Edwardian Furniture">Edwardian Furniture - Antiques </a></p>
              <p><a href="antiques/furniture-antiques/french-furniture/french-furniture-antiques.php" title="French Furniture">French  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/mid-century-modern-furniture/mid-century-modern-furnitu re-antiques.php" title="Mid Century Modern Furniture">Mid Century Modern Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/mission-furniture/mission-furniture-antiques.php" title="Mission Furniture">Mission  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/george-nelson-furniture/george-nelson-furniture-antique s.php" title="George Nelson Furniture">George Nelson Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/victorian-furniture/victorian-furniture-antiques.php">V ictorian  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/heywood-wakefield-furniture/heywood-wakefield-furniture -antiques.php" title="Heywood Wakefield Furniture">Heywood Wakefield  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/other-antique-furniture/other-furniture-antiques.php" title="Other Antique Furniture">Other - Antique Furniture </a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Gasoline Pumps Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/gasoline-pumps-antiques/gasoline-pumps/gasoline-pumps-antiques.php" title="Antique Gas Pump">Gasoline Pumps Antiques</a></p>
              <p><a href="antiques/gasoline-pumps-antiques/gasoline-pump-parts/gasoline-pump-parts-antiques.p hp" title="Antique Gas Pump Parts">Gasoline Pump Parts Antiques</a></p>
              <p><a href="antiques/gasoline-pumps-antiques/reproduction-gasoline-pumps/reproduction-gasoline- pumps-antiques.php" title="Reproduction Gas Pump">Reproduction Gasoline Pumps Antiques</a></p>
              <p><a href="antiques/gasoline-pumps-antiques/reproduction-gasoline-pump-parts/reproduction-gaso line-pump-parts-antiques.php" title="Reproduction Gas Pump Parts">Reproduction Gasoline Pump Parts Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Glass Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/glass-antiques/agata-glass/antique-agata-glass.php" title="Agata Glass">Agata Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/amberina-glass/antique-amberina-glass.php" title="Amberina Glass">Amberina Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/baccarat-glass/antique-baccarat-glass.php" title="Baccarat Glass">Baccarat Glass -  Antique</a></p>
              <p><a href="antiques/glass-antiques/bohemian-glass/antique-bohemian-glass.php" title="Bohemian Glass">Bohemian Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/bristol-glass/bristol-glass-antiques.php" title="Bristol Glass">Bristol Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/cambridge-glass/antique-cambridge-glass.php" title="Cambridge Glass">Cambridge Glass -  Antique</a></p>
              <p><a href="antiques/glass-antiques/cameo-glass/antique-cameo-glass.php">Cameo Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/cambridge-glass/antique-cambridge-glass.php" title="Carnival Glass">Carnival  Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/cranberry-glass/cranberry-glass-antiques.php" title="Cranberry Glass">Cranberry Glass Antique</a></p>
              <p><a href="antiques/glass-antiques/cut-glass/cut-glass-antiques.php" title="Cut Glass">Cut Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/depression-glass/depression-glass-antiques.php" title="Depression Glass">Depression Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/duncan-and-miller-glass/duncan-and-miller-glass-antiques.ph p" title="Duncan and Miller Glass">Duncan and Miller Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/eapg-early-ame

    Can you please post a example of what your are talking about?  Here is another site I am using Spry on and this site works ..  http://www.sub-zero-refrigeration.com
    I think this is what you are refering too.  Please let me know.
    """"<script src="/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-1.9.1.min.js" type"text/javascript"></script>
    <script type="text/javascript">
          window.AgMode = "publish";
          cellRolloverColor="#a1a1a1";                   
          cellColor="#c0c0c0";
          </script>
    </script>""""""
    <!DOCTYPE HTML>
    <html lang=en><!-- InstanceBegin template="/Templates/cityweather.dwt" codeOutsideHTMLIsLocked="false" -->
        <head>
        <meta charset="utf-8">
    <!-- InstanceBeginEditable name="head" -->
    <title>Best AC / HVAC / Furnace Repair - Orland Park, Oak Lawn, Tinley Park, Frankfort, Oak Forest, IL </title>
    <meta name="description" content="Sub Zero Refrigeration Heating and Air Conditioning is a furnace and AC repair contractor in Orland Park, Oak Lawn, Tinley Park, Oak Forest and Frankfort Il.">
    <meta name="keywords" content="Repair, Heating, Air Conditioning, Refrigeration, Furnace, AC, Ice Maker, Ice Machine, Orland Park, Oak Lawn, Tinley Park, Oak Forest, Frankfort, Insatllation,Sales, Maintenance">
    <style type="text/css">
    body,td,th {
        font-size: 100%;
    </style>
    <style type="text/css">
    body {
        margin-left: 5px;
        margin-right: 5px;
    </style>
    <meta name="msvalidate.01" content="49FF257D7BCD932B5FFB37AA0138ED93" />
    <meta name="msvalidate.01" content="D1F605709ED62957017E2ED7F48A35AF" />
    <!-- InstanceEndEditable -->
        <meta name="author" content="Ted Wagner" />
        <meta name="google-site-verification" content="-iGiLKN5W90OD90NqAgOAjezTufISVwxh5QS9FFlwy0" />
        <link rel="icon" type="image/vnd.microsoft.icon" href="/favicon.ico" />
        <link href="twoColFixLtHdr.css" rel="stylesheet" type="text/css">
        <link href="/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
        <meta name="DC.title" content="Sub Zero Refrigeration Heating and Air Conditioning" />
        <meta name="geo.placename" content="3662 147th St, Midlothian, IL 60445, USA" />
        <meta name="geo.position" content="41.625766;-87.710394" />
        <meta name="geo.region" content="US-IL" />
        <meta name="ICBM" content="41.625766, -87.710394" />
        <meta name="rating" content="general" />
    <script src="/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-1.9.1.min.js" type"text/javascript"></script>
    <script type="text/javascript">
          window.AgMode = "publish";
          cellRolloverColor="#a1a1a1";                   
          cellColor="#c0c0c0";
          </script>
    </script>
    <!--[if lt IE 7.]> <script defer type="text/javascript" src="../resources/js/pngfix.js"></script> <![endif]-->
    <!--[if gt IE 6]> <link rel="stylesheet" href="../resources/css/ie7.css"></link> <![endif]-->
    <!--[if lt IE 7.]> <link rel="stylesheet" href="../resources/css/ie6.css"></link> <![endif]-->
    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-23232524-3']);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    </script></head>
    <body>
    <div class="container">
      <div class="header"><img src="/Assets/Images/Subby.gif" width="125" height="190" alt="Sub Zero Refrigeration Heating and Air Conditioning Suburban Chicago Logo"><!-- end .header --><img src="/Assets/Images/HeaderOriginal.jpg" alt="Sub Zero Refrigeration Heating and Air Conditioning Repair Services Chicago Illinois." width="835" height="190" border="0" usemap="#Map2">
        <map name="Map2">
          <area shape="rect" coords="5,4,827,179" href="/index.html" alt="Sub Zero Refrigeration Heating and Air Conditioning Midlothian Illinois 708-385-2418">
        </map>
      </div>
      <div class="header">
        <ul id="MenuBar2" class="MenuBarHorizontal">
            <li><a href="/airconditioning.html" class="MenuBarItemSubmenu">Cooling</a>
              <ul>
                <li><a href="/residentialairconditioning.html" class="MenuBarItemSubmenu">Residential Air Conditioning</a>
                  <ul>
                    <li><a href="/installac.html">Installation</a></li>
                    <li><a href="/repairairconditioning.html">Repair</a></li>
                    <li><a href="/salesairconditioning.html">Sales</a></li>
                    <li><a href="/maintainac.html">Maintenance</a></li>
                    <li><a href="/financing.html">Financing</a></li>
                  </ul>
                </li>
    <li><a href="/commercial-rooftop-products.html" class="MenuBarItemSubmenu">Commercial Air Conditioning</a>
                <ul>
        <li><a href="/commercial-rooftop-installation.html">Installation</a></li>
        <li><a href="/commercial-rooftop-repair.html">Repair</a></li>
        <li><a href="/commercial-rooftop-sales.html">Sales</a></li>
        <li><a href="/maintaincommercialrooftop.html">Maintenance</a></li>
      </ul>
    </li>
    </ul>
          </li>
            <li><a href="/heating.html" class="MenuBarItemSubmenu">Heating</a>
              <ul>
                <li><a href="/residentialheating.html" title="Residential Furnace Products" class="MenuBarItemSubmenu">Residential Heating</a>
                  <ul>
    <li><a href="/furnace-installation.html">Installation</a></li>
    <li><a href="/repairfurnace.html">Repair</a></li>
    <li><a href="/salesfurnace.html">Sales</a></li>
    <li><a href="/maintainfurnace.html">Maintenance</a></li>
    <li><a href="/financing.html">Financing</a></li>
                  </ul>
                </li>
                <li><a href="/heat-pump-products.html" class="MenuBarItemSubmenu">Residential Heat Pump</a>
                  <ul>
                    <li><a href="/heat-pump-installation.html">Installation</a></li>
                    <li><a href="/repairheatpump.html">Repair</a></li>
                    <li><a href="/salesheatpump.html">Sales</a></li>
                    <li><a href="/maintainheatpump.html">Maintenance</a></li>
                    <li><a href="/financing.html">Financing</a></li>
                  </ul>
                </li>
                <li><a href="/commercial-rooftop-products.html" class="MenuBarItemSubmenu">Commercial Heating</a>
                  <ul>
                    <li><a href="/commercial-rooftop-installation.html">Installation</a></li>
                    <li><a href="/commercial-rooftop-repair.html">Repair</a></li>
                    <li><a href="/commercial-rooftop-sales.html">Sales</a></li>
                    <li><a href="/commercial-rooftop-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/refrigeration.html" class="MenuBarItemSubmenu">Refrigeration</a>
              <ul>
                <li><a href="/walk-in-cooler-products.html" class="MenuBarItemSubmenu">Walk In Cooler</a>
                  <ul>
                    <li><a href="/walk-in-cooler-installation.html">Installation</a></li>
                    <li><a href="/walk-in-cooler-repair.html">Repair </a></li>
                    <li><a href="/walk-in-cooler-sales.html">Sales</a></li>
                    <li><a href="/walk-in-cooler-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/walk-in-freezer-products.html" class="MenuBarItemSubmenu">Walk In Freezer</a>
                  <ul>
                    <li><a href="/walk-in-freezer-installation.html">Installation</a></li>
                    <li><a href="/walk-in-freezer-repair.html">Repair</a></li>
                    <li><a href="/walk-in-freezer-sales.html">Sales</a></li>
                    <li><a href="/walk-in-freezer-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/reach-in-cooler-products.html" class="MenuBarItemSubmenu">Reach In Cooler </a>
                  <ul>
                    <li><a href="/reach-in-cooler-installation.html">Installation</a></li>
                    <li><a href="/reach-in-cooler-repair.html">Repair</a></li>
                    <li><a href="/reach-in-cooler-sales.html">Sales</a></li>
                    <li><a href="/reach-in-cooler-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/reach-in-freezer-products.html" class="MenuBarItemSubmenu">Reach In Freezer</a>
                  <ul>
                    <li><a href="/reach-in-freezer-installation.html">Installation</a></li>
                    <li><a href="/reach-in-freezer-repair.html">Repair</a></li>
    <li><a href="/reach-in-freezer-sales.html">Sales</a></li>
    <li><a href="/reach-in-freezer-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/floral-cooler-products.html" class="MenuBarItemSubmenu">Floral Cooler</a>
                  <ul>
                    <li><a href="/floral-cooler-installation.html">Installation</a></li>
                    <li><a href="/floral-cooler-repair.html">Repair</a></li>
                    <li><a href="/floral-cooler-sales.html">Sales</a></li>
                    <li><a href="/floral-cooler-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/icemachine.html" class="MenuBarItemSubmenu">Ice Maker</a>
              <ul>
                <li><a href="/hoshizakiicemachines.html" class="MenuBarItemSubmenu">Hoshizaki Ice Machine</a>
                  <ul>
                    <li><a href="/hoshizaki-ice-machine-installation.html">Installation</a></li>
                    <li><a href="/hoshizaki-ice-machine-repair.html">Repair</a></li>
                    <li><a href="/hoshizaki-ice-machine-sales.html">Sales</a></li>
                    <li><a href="/hoshizaki-ice-machine-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/manitowocicemachine.html" class="MenuBarItemSubmenu">Manitowoc Ice Machine</a>
                  <ul>
                    <li><a href="/manitowoc-ice-machine-installation.html">Installation</a></li>
                    <li><a href="/manitowoc-ice-machine-repair.html">Repair</a></li>
                    <li><a href="/manitowoc-ice-machine-sales.html">Sales</a></li>
                    <li><a href="/manitowoc-ice-machine-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/scotsmanicemachines.html" class="MenuBarItemSubmenu">Scotsman Ice Machine</a>
                  <ul>
                    <li><a href="/scotsman-ice-machine-installation.html">Installation</a></li>
                    <li><a href="/scotsman-ice-machine-repair.html">Repair</a></li>
                    <li><a href="/scotsman-ice-machine-sales.html">Sales</a></li>
                    <li><a href="/scotsman-ice-machine-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/iaq.html" class="MenuBarItemSubmenu"> Air Quality</a>
              <ul>
                <li><a href="/iaqeac.html">Electronic Air Cleaner</a></li>
                <li><a href="/iaqaprilairehumidifier.html">Humidifier</a></li>
                <li><a href="/iaquvlights.html">UV Germicidal Lights</a></li>
              </ul>
          </li>
            <li><a href="/jobphotos.html" class="MenuBarItemSubmenu">Job Photos</a>
              <ul>
    <li><a href="/jobphotoscommercialrooftop.html">Commercial Rooftop Heating and Air Conditioning Photos</a></li>
    <li><a href="/jobphotoscommercialrefrigeration.html">Commercial Refrigeration Photos</a></li>
    <li><a href="/jobphotoscommercialicemachine.html">Commercial Ice Machine Photos</a></li>
    <li><a href="/jobphotosairconditioning.html">Residential Air Conditioning Photos</a></li>
    <li><a href="/jobphotosfurnace.html">Residential Heating Photos</a></li>
    <li><a href="/jobphotosnaturalgasairconditioning.html">Natural Gas Air Conditioning Photos</a></li>
    <li><a href="/jobphotosmitsubishimrslim.html">Mitsubishi Mr Slim Ductless Heating and Ductless Air Conditioner Job Photos</a></li>
    <li><a href="#" class="MenuBarItemSubmenu">Boiler Photos</a>
                <ul>
                    <li><a href="/jobphotoscommercialboiler.html">Commercial Boiler Photos</a></li>
                    <li><a href="/jobphotosresidentialboiler.html">Residential Boiler Photos</a></li>
                  </ul>
                </li>
                <li><a href="/jobphotosheatpump.html">Heat Pump Photos</a></li>
                <li><a href="/jobphotosindoorairquality.html">Indoor Air Quality Photos</a></li>
                <li><a href="/jobphotossheetmetalonsite.html">Sheet Metal Made On-Site Job Photos</a></li>
                <li><a href="/jobphotoscranelift.html">Crane Lift Job Photos</a></li>
                <li><a href="/otherphotos.html">Other Miscellaneous Sub Zero Refrigeration Photos</a></li>
                <li><a href="/Assets/Videos/videos.html">Sub Zero Refrigeration Heating and Air Conditioning Videos</a></li>
              </ul>
            </li>
            <li><a href="/savings.html" class="MenuBarItemSubmenu">Savings</a>
              <ul>
                <li><a href="/monthlyspecials.html">Monthly Specials</a></li>
                <li><a href="/rebate.html">Manufacturers Rebates</a></li>
                <li><a href="/furnacerebates.html" class="MenuBarItemSubmenu">Utility Company Rebates</a>
                  <ul>
                    <li><a href="/comed.html">Com Ed</a></li>
                    <li><a href="/nicor.html">Nicor</a></li>
                  </ul>
                </li>
                <li><a href="/websitecoupons.html">Website Coupons</a></li>
              </ul>
            </li>
            <li><a href="/aboutus.html" class="MenuBarItemSubmenu">About Us</a>
              <ul>
                <li><a href="/chicago-service-area.html">Our Service Area</a></li>
                <li><a href="/ourmissionstatement.html">Our Mission Statement</a></li>
                <li><a href="/ourfamily.html">Our Family</a></li>
                <li><a href="/employees.html" class="MenuBarItemSubmenu">Our Staff</a>
                  <ul>
                    <li><a href="/budwagner.html">Bud Wagner</a></li>
                    <li><a href="/timwagner.html">Tim Wagner</a></li>
                    <li><a href="/daveallen.html">Dave Allen</a></li>
                    <li><a href="/larryskarr.html">Larry Skarr</a></li>
                    <li><a href="/terryburke.html">Terry Burke</a></li>
                    <li><a href="/nikooplt.html">Niko Oplt</a></li>
                    <li><a href="/ginaames.html">Gina Ames</a></li>
                    <li><a href="/laurakane.html">Laura Kane</a></li>
                  </ul>
                </li>
                <li><a href="/whychoosesubzero.html" class="MenuBarItemSubmenu">Why Choose Sub Zero Refrigeration?</a>
                  <ul>
                    <li><a href="/ourreviews.html">Our Reviews and Testimonials</a></li>
                    <li><a href="/ourcompetitionsreviews.html">Some of Our Competitions Reviews</a></li>
                    <li><a href="/americanstandardcustomercaredealer.html">American Standard Customer Care Dealer</a></li>
                    <li><a href="/customersurveys.html">American Standard Customer Satisfaction Surveys</a></li>
                    <li><a href="/betterbusinessbureau.html">The Better Business Bureau</a></li>
                  </ul>
                </li>
                <li><a href="/hvac-careers.html" class="MenuBarItemSubmenu">HVACR Careers</a>
                  <ul>
                    <li><a href="/hvac-technician-jobs.html">HVAC Technician</a></li>
                    <li><a href="/hvac-installer-jobs.html">HVAC/R Technician</a></li>
                    <li><a href="/hvacr-installer-jobs.html">HVAC/R Installer</a></li>
                    <li><a href="/hvac-sales-jobs.html">HVAC/R Sales</a></li>
                    <li><a href="/hvacr-jobs.html">Commercial Refrigeration Technician</a></li>
                  </ul>
                </li>
                <li><a href="/helpfullinks.html">Helpful Links</a></li>
                <li><a href="/favorite-sites.html">Our Favorite Websites</a></li>
                <li><a href="/easilyleaveusareview.html" class="MenuBarItemSubmenu">Easily Leave Us a Review</a>
                  <ul>
                    <li><a href="http://local.yahoo.com/info-84317831-sub-zero-refrigeration-midlothian" target="_blank">On &quot;Yahoo Local&quot;</a></li>                <li><a href="http://www.yelp.com/biz/sub-zero-refrigeration-midlothian-2" target="_blank">On &quot;Yelp&quot;</a></li>
                    <li><a href="http://www.merchantcircle.com/business/Sub.Zero.Refrigeration.708-385-2418" target="_blank">On &quot;Merchant Circle&quot;</a></li>
                    <li><a href="https://plus.google.com/108215910665703095824/about?gl=us&hl=en" target="_new">On &quot;Google Places&quot;</a></li>
                    <li><a href="http://www.bing.com/local/details.aspx?lid=YN270x5360008" target="_blank">On &quot;Bing&quot;</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/contactus.html">Contact </a></li>
        </ul></div>
      <table width="952" border="1" cellspacing="5">
        <tr>
          <th colspan="2" scope="col"><table width="942" border="1" align="center" cellspacing="5">
            <tr>
              <td><div align="center"><a href="/repairairconditioning.html"><img src="/Assets/Images/air-conditioner-repair.jpg" width="85" height="103" alt="Air Conditioning Repair Orland Park, Oak Lawn, Tinley Park, Oak Forest, Frankfort, IL"></a></div></td>
              <td><div align="center"><a href="/repairfurnace.html"><img src="/Assets/Images/furnace-repair.jpg" width="85" height="103" alt="Furnace Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/repairheatpump.html"><img src="/Assets/Images/heat-pump-repair.jpg" width="85" height="103" alt="Heat Pump Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/repairiaq.html"><img src="/Assets/Images/humidifier-repair.jpg" width="103" height="103" alt="Humidifier Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/estimate_1.png" width="158" height="85" alt="Schedule a Free Estimate Online for Sub Zero Refrigeration"></a></div></td>
            </tr>
            <tr>
              <td><div align="center"><a href="/repairairconditioning.html">Air Conditioning Repair</a></div></td>
              <td><div align="center"><a href="/repairfurnace.html">Heating   Repair</a></div></td>
              <td><div align="center"><a href="/repairheatpump.html">Heat Pump Repair</a></div></td>
              <td><div align="center"><a href="/repairiaq.html">Humidifier Repair</a></div></td>
              <td><div align="center"><a href="/schedule-a-free-estimate.html">Schedule  Estimate</a></div></td>
            </tr>
            <tr>
              <td><div align="center"><a href="/repairrooftop.html"><img src="/Assets/Images/commercial-rooftop-air-conditioning-repair.jpg" width="141" height="103" alt="Commercial Air Conditioning Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/refrigeration-repair.html"><img src="/Assets/Images/refrigeration-repair.jpg" width="103" height="103" alt="Commercial Refrgeration Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/commercial-ice-maker-repair.html"><img src="/Assets/Images/ice-machine-repair.jpg" width="103" height="103" alt="Commercial Ice Maker Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/walk-in-cooler-repair.html"><img src="/Assets/Images/Beer_Cave_Booth.jpg" width="150" height="100" alt="Commercial Walk in Cooler Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/service_1.png" alt="Schedule a Service Call online for Sub Zero Refrigeration" width="105" height="90"></a></div></td>
            </tr>
            <tr>
              <td><div align="center"><a href="/repairrooftop.html">Commercial AC Repair</a></div></td>
              <td><div align="center"><a href="/refrigeration-repair.html">Refrigeration Repair</a></div></td>
              <td><div align="center"><a href="/commercial-ice-maker-repair.html">Ice Maker Repair</a></div></td>
              <td><div align="center"><a href="/walk-in-cooler-repair.html">Walk in Cooler Repair</a>
              </div></td>
              <td><div align="center"><a href="/sales.html">Schedule Service</a></div></td>
            </tr>
          </table></th>
        </tr>
      </table>
      <!-- InstanceBeginEditable name="Main Content" -->
      <table width="940" border="1" align="right" cellpadding="5" cellspacing="4">
        <tr>
          <td colspan="2" scope="col"><h1>Sub Zero Refrigeration Heating and Air Conditioning serving Orland Park, Oak Lawn, Tinley Park, Frankfort, Oak Forest, Midlothian and surrounding areas.</h1>
            <h3>Sub Zero Refrigeration Heating and Air Conditioning has been family owned and operated for over 40 years. We like to think of ourselves as one of the best heating and air conditioning contractors in Chicago.</h3>
          <h2><strong>Sub Zero Refrigeration <a href="repairfurnace.html">Heating Repair</a> and <a href="repairairconditioning.html">Air Conditioning Repair</a></strong></h2>
          <p>Sub Zero Refrigeration is a full service Refrigeration Heating and Air Conditioning or HVAC repair company providing quality workmanship and superb customer service.  Sub Zero offers you the best in heating repair, air conditioning repair, refrigeration and HVAC services to include: installation, repair, sales and maintenance of all major refrigeration, AC and heating equipment and indoor air quality products. We are a local Chicago heating and air conditioning, commercial refrigeration, service and repair company large enough to get the job   done and small enough for you to know we care about our commercial and residential customers. Our central location of <a href="../midlothian.html">Midlothian</a> Illinois allows us to provide fast reliable repair service to all of the <a href="ourservicearea.html">Chicago  Suburban cities</a> and towns such as <a href="../orlandpark.html">Orland Park</a>, <a href="../oaklawn.html">Oak Lawn</a>, <a href="../tinleypark.html">Tinley Park</a>, <a href="frankfort.html">Frankfort IL</a>, <a href="../oakforest.html">Oak Forest</a>, <a href="../newlenox.html">New Lenox</a> and <a href="ourservicearea.html">surrounding communities</a>.</p></td>
        </tr>
        <tr>
          <td colspan="2" scope="col"> </td>
        </tr>
        <tr>
          <td width="649" scope="col"><h2><strong><a href="repairairconditioning.html">Air Conditioning Repair Service</a></strong></h2>      
             <p>Sub Zero Refrigeration Heating and Air Conditioning is a <a href="repairairconditioning.html">full service air conditioning repair</a> company providing <a href="repairrooftop.html">commercial</a> and <a href="repairairconditioning.html">residential service</a>, <a href="installac.html">installation</a>, <a href="repairairconditioning.html">repair</a>, <a href="salesairconditioning.html">sales</a> and <a href="maintainac.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="alsip.html">Alsip</a>, <a href="burbank.html">Burbank IL</a>, <a href="burrridge.html">Burr Ridge</a>, <a href="chicagoridge.html">Chicago Ridge</a>, <a href="countryside.html">Countryside</a> and <a href="ourservicearea.html">surrounding communities</a>.<br>
          Read More&gt;&gt; <a href="repairairconditioning.html">AC Repair Service</a></p></td>
          <th width="285" valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="/Assets/Images/air-conditioning-repair-services.png" width="270" height="200" alt="Air Conditioning Repair Services"></a></p>
            <p><a href="repairairconditioning.html">Air Conditioning Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="repairfurnace.html">Heating Repair Service</a></strong></h2>
            <p>Sub Zero Refrigeration Heating and Air Conditioning is a full service <a href="repairfurnace.html">heating repair</a> or <a href="repairfurnace.html">furnace repair</a> company providing <a href="commercial-rooftop-repair.html">commercial HVAC repair</a> and <a href="repair.html">residential HVAC service</a>, <a href="furnace-installation.html">installation</a>, <a href="repairfurnace.html">repair</a>, <a href="salesfurnace.html">sales</a> and <a href="maintainfurnace.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="crestwood.html">Crestwood</a>, <a href="darien.html">Darien</a>, <a href="evergreenpark.html">Evergreen Park</a>, <a href="flossmoor.html">Flossmoor</a>, <a href="frankfort.html">Frankfort IL</a> and <a href="ourservicearea.html">surrounding communities</a>.<br>
          Read More&gt;&gt; <a href="repairfurnace.html">Heating Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairfurnace.html"><img src="/Assets/Images/heating-repair-services.png" width="270" height="200" alt="Heating Repair Services"></a></p>
            <p><a href="repairfurnace.html">Heating Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="walk-in-cooler-repair.html">Commercial Refrigeration Repair Service</a></strong></h2>      
             <p>Sub Zero Refrigeration Heating and Air Conditioning is a full service <a href="refrigeration-repair.html">refrigeration repair</a> company providing <a href="refrigeration-repair.html">service</a>, <a href="refrigeration.html">installation</a>, <a href="refrigeration-repair.html">repair</a>, <a href="refrigeration-sales.html">sales</a> and <a href="maintaincommercialrefrig.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="hickoryhills.html">Hickory Hills</a>, <a href="hinsdale.html">Hinsdale</a>, <a href="homerglen.html">Homer Glen</a>, <a href="homerglen.html">Goodings</a>, <a href="hometown.html">Hometown</a>, <a href="homewood.html">Homewood</a> and <a href="ourservicearea.html">surrounding communities</a>. <br>
          Read More&gt;&gt;  <a href="/refrigeration-repair.html">Commercial Refrigeration Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><img src="/commercial-refrigeration-repair.png" width="270" height="200" alt="Commercial Refrieration Repair"></p>
            <p><a href="/refrigeration-repair.html"> Refrigeration Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="iaqaprilairehumidifier.html">Humidifier Repair Service</a></strong></h2>
            <p>Sub Zero Refrigeration Heating and Air Conditioning is a factory authorize Trane, Honeywell and Aprilaire sales, <a href="iaqaprilairehumidifier.html">installation</a> and <a href="iaqaprilairehumidifier.html">service company</a> in the <a href="ourservicearea.html">Suburban Chicago</a> towns including <a href="lagrange.html">La Grange</a>, <a href="lagrangepark.html">La Grange Park</a>, <a href="lemont.html">Lemont</a>, <a href="lockport.html">Lockport</a>, <a href="manhattan.html">Manhattan IL</a>, <a href="midlothian.html">Midlothian</a>, <a href="mokena.html">Mokena</a>, <a href="monee.html">Monee</a> and surrounding <a href="chicago.html">Chicago</a> <a href="ourservicearea.html">communities.</a><br>
              Read More&gt;&gt; <a href="iaqaprilairehumidifier.html">Humidifier   Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="http://www.sub-zero-refrigeration.com/Assets/Images/humidifier-repair.jpg" alt="Humidifier Repair by Sub Zero Refrigeration" height="250" width="250"></a></p>
            <p><a href="iaqaprilairehumidifier.html">Humidifier Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="walk-in-cooler-repair.html">Walk in Cooler Repair Service</a></strong> <a href="walk-in-freezer-repair.html"><strong>Walk in Freezer Repair Service</strong></a></h2>
            <p>Sub Zero Refrigeration Heating and Air Conditioning is a <a href="walk-in-cooler-repair.html">full service walk in cooler and freezer repair</a> company providing <a href="repairrooftop.html">commercial service</a>, <a href="walk-in-cooler-repair.html">installation</a>, <a href="repairairconditioning.html">repair</a>, <a href="walk-in-cooler-sales.html">sales</a> and <a href="walk-in-freezer-maintenance.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="newlenox.html">New Lenox</a>, <a href="oakforest.html">Oak Forest</a>, <a href="oaklawn.html">Oak Lawn</a>, <a href="orlandhills.html">Orland Hills</a>, <a href="orlandpark.html">Orland Park</a>, <a href="palosheights.html">Palos Heights</a>, <a href="paloshills.html">Palos Hills</a> and <a href="ourservicearea.html">surrounding communities.</a><br>
              Read More&gt;&gt; <a href="walk-in-cooler-repair.html">Walk in Cooler Repair Service</a> <a href="walk-in-freezer-repair.html">Walk in Freezer Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="/Assets/Images/nikohome.png" width="270" height="145" alt="Air Conditioning Repair Services"></a></p>
            <p><a href="walk-in-cooler-repair.html">Walk in Cooler Repair Service</a></p>
            <p><a href="walk-in-freezer-repair.html">Walk in Freezer Repair Service </a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><p><a href="reach-in-cooler-repair.html"><strong>Commercial Refrigerator Repair</strong></a><strong> and <a href="reach-in-freezer-repair.html">Commercial Freezer Repair </a></strong><a href="reach-in-freezer-repair.html"></a><br>
            Sub Zero Refrigeration Heating and Air Conditioning is a <a href="repairairconditioning.html">full service refrigeration repair</a> company providing <a href="reach-in-cooler-repair.html">reach in cooler service</a> and <a href="reach-in-freezer-repair.html">reach in freezer service</a>, <a href="reach-in-freezer-installation.html">reach in installation</a>, <a href="reach-in-freezer-repair.html">reach in repair</a>, <a href="reach-in-cooler-sales.html">reach in sales</a> and <a href="reach-in-cooler-maintenance.html">reach in maintenance</a> to Suburban <a href="chicago.html">Chicago</a> towns including <a href="palospark.html">Palos Park</a>, <a href="peotone.html">Peotone</a>, <a href="steger.html">Steger</a>, <a href="tinleypark.html">Tinley Park</a>, <a href="willowsprings.html">Willow Springs</a>, Willowbrook, <a href="worth.html">Worth</a> and <a href="ourreviews.html">surrounding communities</a>.<br>
          Read More&gt;&gt; <a href="repairairconditioning.html"></a><a href="reach-in-cooler-repair.html">Commercial Refrigerator Repair</a> and <a href="reach-in-freezer-repair.html">Commercial Freezer Repair </a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="/Assets/Images/DSCF0092.png" width="243" height="177" alt="Air Conditioning Repair Services"></a></p>
            <p><a href="walk-in-cooler-repair.html">Commercial Refigeration  Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td colspan="2" scope="col"><p>Blog Updates Coming Soon.</p></td>
        </tr>
      </table>
      <tr>
      <td width="809"><!-- InstanceEndEditable -->
      <!-- end .content -->
        <!--Page Footer-->
      <div align="left" class="footerblue" id="footer"> </div>
      <div align="center" class="footerblue" id="footer">
        <table width="900" border="0" align="center" cellpadding="5" cellspacing="3" bgcolor="#B7E4EA" id="background_blue">
          <tr align="center" class="background_blue" style="text-align: center;">
            <td valign="middle" class="table_blue_background" id="background_blue" scope="col"><p align="center" class="background_blue"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/service_1.png" alt="Schedule a Service Call online for Sub Zero Refrigeration" width="105" height="85"></a></a></td>
            <td valign="middle" class="table_blue_background" id="background_blue" scope="col"><p align="center" class="background_blue"><a href="https://www.facebook.com/subzerorefrig" target="_new"><img src="/Assets/Images/facebook.png" alt="Find us on Facebook Sub Zero Refrigeration " name="background_blue2" width="100" height="100" id="background_blue2" /></a></p></td>
            <td id="background_blue" scope="col"><a href="http://www.twitter.com/subzerorefrig" target="_new"><img src="/Assets/Images/twitter_follow.gif" alt="Follow us on Twitter Sub Zero Refrigeration" width="89" height="45" border="0" class="background_blue" /></a></td>
            <td id="background_blue" scope="col"><div align="center"><a href="http://www.youtube.com/user/mrsubzerorefrig" target="_new"><img src="/Assets/Images/you-tube.jpg" width="75" height="75" alt="Watch us on YouTube Sub Zero Refrigeration" longdesc="http://www.youtube.com/mrsubzerorefrig"></a></div></td>
            <td id="background_blue" scope="col"><div align="center"><a href="https://plus.google.com/108215910665703095824/about?gl=us&hl=en" target="_new"><img src="/Assets/Images/google+.png" width="100" height="100" alt="Review Us on Google Plus Sub Zero Refrigeration " longdesc="https://plus.google.com/u/0/108598412013907889976/posts"></a></div></td>
            <td id="background_blue" scope="col"><div align="center"><a href="http://www.bbb.org/chicago/business-reviews/heating-and-air-conditioning/sub-zero-refriger ation-in-midlothian-il-7695" target="_new"><img src="/Assets/Images/BBB.png" width="133" height="75" alt=" Sub Zero Refrigeration and Chicago Better Business Bureau"></a></div></td>
            <td id="background_blue" scope="col"><div align="center"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/estimate_1.png" width="158" height="85" alt="Schedule a Free Estimate Online for Sub Zero Refrigeration"></a></a></div></td>
          </tr>
        </table>
        <table border="0" cellpadding="0" cellspacing="0" class="footerblue">
          <tr>
            <th class="footerblue" style="font-family: Arial, Helvetica, sans-serif" scope="col"><div align="left"><span class="footer"><img src="/Assets/Images/truck.jpg" alt="Sub Zero Refrigeration Heating and Air Conditioning Chicago" width="240" height="109" align="left"></span><span class="footerblue" style="font-family: Arial, Helvetica, sans-serif"><span class="footer"><img src="/Assets/Images/footer_right.jpg" alt="Sub Zero Refrigeration Heating and Air Conditioning" width="717" height="109" align="left"></span></span>
            </div>
              <p class="footer">QUICK LINKS</p>
              <p class="footer"><a href="/index.html" >Home</a> | <a href="/financing.html">Financing</a> | <a href="/aboutus.html">About Us</a> | <a href="/repair.html" >Repair</a> | <a href="/sales.html" >Sales</a> | <a href="/maintain.html" >Maintenance</a> | <a href="/products.html" >Products</a> | <a href="/jobphotos.html" >Our Job Photos</a> | <a href="/savings.html" >Cool Savings</a> | <a href="/social.html"  target="_new">Social</a> | <a href="/contactus.html" >Contact Us</a> | <a href="/schedule-a-free-estimate.html" >Schedule Free New Equipment Estimate</a> | <a href="/schedule-a-free-estimate.html">Schedule Service</a><br>
                <a href="/repairairconditioning.html">Air Conditioning Repair</a> | <a href="/repairfurnace.html" >Heating Repair</a> | <a href="repairheatpump.html">Heat Pump Repair</a> | <a href="/repairiaq.html" >Humidifier Repair</a><br>
    <a href="/repairrooftop.html">Commercial Air Conditioning Repair</a> | <a href="/refrigeration-repair.html" >Refrigeration Repair</a> | <a href="/commercial-ice-maker-repair.html" > Ice Maker Repair</a> | <a href="/walk-in-cooler-repair.html">Walk In Cooler Repair</a><br />
              </p>
              <div>
                <div align="center">
              </div>
                <address align="center" class="footer">Sub Zero Refrigeration is located at 3662 147th St. Midlothian, Illinois 60445</address>  <p align="center" class= "footer"> Our suburban Chicago refrigeration heating and air conditioning repair service provides professional service throughout <a href="/orlandpark.html">Orland Park</a> | <a href="/oaklawn.html">Oak Lawn</a> | <a href="/tinleypark.html">Tinley Park</a> | <a href="/oakforest.html">Oak Forest</a> | <a href="/frankfort.html">Frankfort, IL</a> | <a href="newlenox.html">New Lenox</a> and <a href="/ourservicearea.html">The Suburbs</a>. Read our<a href="https://plus.google.com/108215910665703095824/about?gl=us&hl=en" target="_new"> Reviews on Google+ Local</a>, <a href="http://bit.ly/ND2dsc" target="_new">Yelp Reviews</a>, <a href="http://bit.ly/LDEY6c" target="_new">Insider Pages</a>, and <a href="http://bit.ly/MUC9eG">Chicago City Search  Reviews</a>, on-line. Come visit our office in <a href="/midlothian.html">Midlothian, IL.</a> <br>
                  <a href="alsip.html">Alsip Refrigeration and Ice Machines</a> <a href="burbank.html">Burbank Refrigeration and Ice Machines</a>  <a href="burrridge.html">Burr Ridge Refrigeration and Ice Machines</a> <a href="chicagoridge.html">Chicago Ridge Refrigeration and Ice Machines</a> <a href="countryside.html">Countryside Refrigeration and Ice Machines</a> <a href="crestwood.html">Crestwood Refrigeration and Ice Machines</a>  <a href="darien.html">Darien Refrigeration and Ice Machines</a> <a href="evergreenpark.html">Evergreen Park Refrigeration and Ice Machines</a> <a href="flossmoor.html">Flossmoor Refrigeration and Ice Machines</a> <a href="frankfort.html">Frankfort Refrigeration and Ice Machines</a>  <a href="hickoryhills.html">Hickory Hills Refrigeration and Ice Machines</a> <a href="hinsdale.html">Hinsdale Refrigeration and Ice Machines</a> <a href="homerglen.html">Homer Glen Refrigeration and Ice Machines</a> <a href="homerglen.html">Goodings Refrigeration and Ice Machines</a> <a href="hometown.html">Hometown Refrigeration and Ice Machines</a> <a href="homewood.html">Homewood Refrigeration and Ice Machines</a>  <a href="lagrange.html">La Grange Refrigeration and Ice Machines</a> <a href="lagrangepark.html">La Grange Park Refrigeration and Ice Machines</a> <a href="lemont.html">Lemont Refrigeration and Ice Machines</a> <a href="lockport.html">Lockport Refrigeration and Ice Machines</a> <a href="manhattan.html">Manhattan IL Refrigeration and Ice Machines</a> <a href="midlothian.html">Midlothian IL Refrigeration and Ice Machines</a> <a href="mokena.html">Mokena Refrigeration and Ice Machines</a> <a href="monee.html">Monee Refrigeration and Ice Machines</a> <a href="newlenox.html">New Lenox Refrigeration and Ice Machines</a> <a href="oakforest.html">Oak Forest Refrigeration and Ice Machines</a> <a href="oaklawn.html">Oak Lawn Refrigeration and Ice Machines</a> <a href="orlandhills.html">Orland Hills Refrigeration and Ice Machines</a> <a href="orlandpark.html">Orland Park Refrigeration and Ice Machines</a> <a href="palosheights.html">Palos Heights Refrigeration and Ice Machines</a> <a href="paloshills.html">Palos Hills Refrigeration and Ice Machines</a> <a href="palospark.html">Palos Park Refrigeration  T</a><a href="tinleypark.html">inley Park Refrigeration and Ice Machines</a> <a href="willowsprings.html">Willow Springs Refrigeration and Ice Machine </a> <a href="willowbrook.html">Willowbrook Refrigeration and Ice Machines</a> <a href="worth.html">Worth Refrigeration and Ice Machines</a></p>
                <p align="center" class="footer">2012&copy; Sub Zero Refrigeration - Last Day Updated -
                  <!-- #BeginDate format:Am1 -->February 18, 2013<!-- #EndDate -->
                  <a href="/sitemap.xml">Site Map</a>         | <a href="sub-zero-news.html">Sub Zero Refrigeration in the NEWS</a>       
                <p align="center" class="footer">Web-master Ted Wagner - Web designer Cherie White Cachampis</div></p></th>
        </table>
    <script type="text/javascript">
    var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"/SpryAssets/SpryMenuBarDownHover.gif", imgRight:"/SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </div>
      <!-- end .footer -->
    </div>
    <!-- end .container -->
    </body>
    <!-- InstanceEnd --></html>

  • Help with XHTML columns in IE6

    I'm having some problems with my columns in IE6. The math is
    all correct and it lays out perfectly fine in firefox as expected.
    For some reason IE6 seems to be doubling the numbers I assign as my
    margins. Can anyone give me a tip as to what's wrong here before I
    trash this whole idea and go with a old fashioned table.
    2 columns.
    15px left and right margins on the "left" column, 470px wide
    15px right margin on the "right"column, 455px wide

    Its an IE6 float/margin bug. If you add a margin in the same
    direction
    as the float IE6 will double it. Add display: inline; to the
    css styles,
    as below, to counter-act this problem.
    #left { margin: 0 15px; width: 470px; height: 100px; float:
    left;
    background: #f00; display: inline; }
    #right { margin: 0 15px 0 0; width: 455px; height: 100px;
    float: right;
    background: #666; display: inline; }
    quovadimus02 wrote:
    > I'm having some problems with my columns in IE6. The
    math is all correct and
    > it lays out perfectly fine in firefox as expected. For
    some reason IE6 seems
    > to be doubling the numbers I assign as my margins. Can
    anyone give me a tip as
    > to what's wrong here before I trash this whole idea and
    go with a old fashioned
    > table.
    >
    > 2 columns.
    > 15px left and right margins on the "left" column, 470px
    wide
    > 15px right margin on the "right"column, 455px wide
    >
    >
    >
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
    > "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    > <html xmlns="
    http://www.w3.org/1999/xhtml">
    > <head>
    > <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1" />
    > <title>Untitled Document</title>
    > <style type="text/css">
    > body { margin: 0; padding: 0; width: 970px; background:
    #e1e1e1; }
    > #wrap { padding: 10px 0; background: #fff; }
    > #left { margin: 0 15px; width: 470px; height: 100px;
    float: left; background:
    > #f00; }
    > #right { margin: 0 15px 0 0; width: 455px; height:
    100px; float: right;
    > background: #666; }
    > </style>
    > </head>
    > <body>
    > <div id="wrap">
    > <div id="right"></div>
    > <div id="left"></div>
    > <div style="clear: both;"></div>
    > </div>
    > </body>
    > </html>
    >

  • Links not working in Spry Accordian Menu

    When clicked the links in the left side accordian menu do not work. However, the child-links work great. Example: http://www.richartbuilders.com/remodel.php
    HEAD TAGS:
    <script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal2.css" rel="stylesheet" type="text/css" />
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
    <link href="content.css" rel="stylesheet" type="text/css" />
    HTML:
    <div id="navSide">
        <div id="sideWrapper">
          <div id="Accordion1" class="Accordion" tabindex="0">
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="../remodel.php">Remodel</a></div>
              <div class="AccordionPanelContent"></div>
             </div>
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="../windowsdoors.php">Windows &amp; Doors</a></div>
              <div class="AccordionPanelContent"></div>
              </div>
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="../weatherization.php">Weatherization</a></div>
              <div class="AccordionPanelContent"></div>
             </div>
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="#">Electrical...</a></div>
              <div class="AccordionPanelContent">
                <ul>
                  <li><a href="residential.php">Residential</a></li>
                  <li><a href="commercial.php">Commercial</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
    </div>
    <script type="text/javascript">
    var Accordion1 = new Spry.Widget.Accordion("Accordion1" ,{ useFixedPanelHeights:false, defaultPanel:0});
    </script>
    external CSS:
    @charset "UTF-8";
    /* SpryAccordion.css - version 0.5 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    /* This is the selector for the main Accordion container. For our default style,
    * we draw borders on the left, right, and bottom. The top border of the Accordion
    * will be rendered by the first AccordionPanelTab which never moves.
    * If you want to constrain the width of the Accordion widget, set a width on
    * the Accordion container. By default, our accordion expands horizontally to fill
    * up available space.
    * The name of the class ("Accordion") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style the
    * Accordion container.
    .Accordion {
        overflow: hidden;
        border: 1px solid #CCC;
        width: 145px;
    /* This is the selector for the AccordionPanel container which houses the
    * panel tab and a panel content area. It doesn't render visually, but we
    * make sure that it has zero margin and padding.
    * The name of the class ("AccordionPanel") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel container.
    .AccordionPanel {
        margin: 0px;
        padding: 0px;
    /* This is the selector for the AccordionPanelTab. This container houses
    * the title for the panel. This is also the container that the user clicks
    * on to open a specific panel.
    * The name of the class ("AccordionPanelTab") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel tab container.
    * NOTE:
    * This rule uses -moz-user-select and -khtml-user-select properties to prevent the
    * user from selecting the text in the AccordionPanelTab. These are proprietary browser
    * properties that only work in Mozilla based browsers (like FireFox) and KHTML based
    * browsers (like Safari), so they will not pass W3C validation. If you want your documents to
    * validate, and don't care if the user can select the text within an AccordionPanelTab,
    * you can safely remove those properties without affecting the functionality of the widget.
    .AccordionPanelTab {
        background-color: #F2F2F2;
        margin: 0px;
        padding: 12px;
        cursor: pointer;
        font-family: "Myriad Pro", Verdana, Geneva, sans-serif;
        font-size: 14px;
        color: #0071BC;
        border-bottom: 1px solid #CCC;
        /* [disabled]text-transform: uppercase; */
    .AccordionPanelTab a {
        text-decoration:none;
        color: #0071BC;
    /* This is the selector for a Panel's Content area. It's important to note that
    * you should never put any padding on the panel's content area if you plan to
    * use the Accordions panel animations. Placing a non-zero padding on the content
    * area can cause the accordion to abruptly grow in height while the panels animate.
    * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
    * Content container.
    * The name of the class ("AccordionPanelContent") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel content container.
    .AccordionPanelContent {
        overflow: auto;
        margin: 0px;
        padding: 0px;
    .AccordionPanelContent ul {
        list-style-type:none;
        margin:0;
        line-height: 22px;
        font-family:"Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size:14px;
    .AccordionPanelContent ul li {
        color:#666;
    .AccordionPanelContent ul li a {
        display:block;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        padding-left: 0px;
    .AccordionPanelContent ul li a:link, .AccordionPanelContent ul li a:visited {
        text-decoration:none;
        color:#0071BC;
    .AccordionPanelContent ul li a:hover, .AccordionPanelContent ul li a:active {
        color:#FF9900;
    .AccordionPanelTab a:link, .AccordionPanelTab a:visited {
        color:#0071BC;
    .AccordionPanelTabHover a:hover, .AccordionPanelTabHover a:active {
        color:#FF9900;
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open. The class "AccordionPanelOpen" is programatically added and removed
    * from panels as the user clicks on the tabs within the Accordion.
    .AccordionPanelOpen .AccordionPanelTab {
        background-color: #FFFFFF;
    /* This is an example of how to change the appearance of the panel tab as the
    * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
    * and removed from panel tab containers as the mouse enters and exits the tab container.
    .AccordionPanelTabHover {
    .AccordionPanelOpen .AccordionPanelTabHover {
        color: #555555;
    /* This is an example of how to change the appearance of all the panel tabs when the
    * Accordion has focus. The "AccordionFocused" class is programatically added and removed
    * whenever the Accordion gains or loses keyboard focus.
    .AccordionFocused .AccordionPanelTab {
        /* [disabled]background-color: #3399FF; */
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open when the Accordion has focus.
    .AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
        /* [disabled]background-color: #33CCFF; */
    /* Rules for Printing */
    @media print {
      .Accordion {
      overflow: visible !important;
      .AccordionPanelContent {
      display: block !important;
      overflow: visible !important;
      height: auto !important;

    When clicked the links in the left side accordian menu do not work. However, the child-links work great. Example: http://www.richartbuilders.com/remodel.php
    HEAD TAGS:
    <script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal2.css" rel="stylesheet" type="text/css" />
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
    <link href="content.css" rel="stylesheet" type="text/css" />
    HTML:
    <div id="navSide">
        <div id="sideWrapper">
          <div id="Accordion1" class="Accordion" tabindex="0">
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="../remodel.php">Remodel</a></div>
              <div class="AccordionPanelContent"></div>
             </div>
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="../windowsdoors.php">Windows &amp; Doors</a></div>
              <div class="AccordionPanelContent"></div>
              </div>
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="../weatherization.php">Weatherization</a></div>
              <div class="AccordionPanelContent"></div>
             </div>
            <div class="AccordionPanel">
              <div class="AccordionPanelTab"><a href="#">Electrical...</a></div>
              <div class="AccordionPanelContent">
                <ul>
                  <li><a href="residential.php">Residential</a></li>
                  <li><a href="commercial.php">Commercial</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
    </div>
    <script type="text/javascript">
    var Accordion1 = new Spry.Widget.Accordion("Accordion1" ,{ useFixedPanelHeights:false, defaultPanel:0});
    </script>
    external CSS:
    @charset "UTF-8";
    /* SpryAccordion.css - version 0.5 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    /* This is the selector for the main Accordion container. For our default style,
    * we draw borders on the left, right, and bottom. The top border of the Accordion
    * will be rendered by the first AccordionPanelTab which never moves.
    * If you want to constrain the width of the Accordion widget, set a width on
    * the Accordion container. By default, our accordion expands horizontally to fill
    * up available space.
    * The name of the class ("Accordion") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style the
    * Accordion container.
    .Accordion {
        overflow: hidden;
        border: 1px solid #CCC;
        width: 145px;
    /* This is the selector for the AccordionPanel container which houses the
    * panel tab and a panel content area. It doesn't render visually, but we
    * make sure that it has zero margin and padding.
    * The name of the class ("AccordionPanel") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel container.
    .AccordionPanel {
        margin: 0px;
        padding: 0px;
    /* This is the selector for the AccordionPanelTab. This container houses
    * the title for the panel. This is also the container that the user clicks
    * on to open a specific panel.
    * The name of the class ("AccordionPanelTab") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel tab container.
    * NOTE:
    * This rule uses -moz-user-select and -khtml-user-select properties to prevent the
    * user from selecting the text in the AccordionPanelTab. These are proprietary browser
    * properties that only work in Mozilla based browsers (like FireFox) and KHTML based
    * browsers (like Safari), so they will not pass W3C validation. If you want your documents to
    * validate, and don't care if the user can select the text within an AccordionPanelTab,
    * you can safely remove those properties without affecting the functionality of the widget.
    .AccordionPanelTab {
        background-color: #F2F2F2;
        margin: 0px;
        padding: 12px;
        cursor: pointer;
        font-family: "Myriad Pro", Verdana, Geneva, sans-serif;
        font-size: 14px;
        color: #0071BC;
        border-bottom: 1px solid #CCC;
        /* [disabled]text-transform: uppercase; */
    .AccordionPanelTab a {
        text-decoration:none;
        color: #0071BC;
    /* This is the selector for a Panel's Content area. It's important to note that
    * you should never put any padding on the panel's content area if you plan to
    * use the Accordions panel animations. Placing a non-zero padding on the content
    * area can cause the accordion to abruptly grow in height while the panels animate.
    * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
    * Content container.
    * The name of the class ("AccordionPanelContent") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel content container.
    .AccordionPanelContent {
        overflow: auto;
        margin: 0px;
        padding: 0px;
    .AccordionPanelContent ul {
        list-style-type:none;
        margin:0;
        line-height: 22px;
        font-family:"Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size:14px;
    .AccordionPanelContent ul li {
        color:#666;
    .AccordionPanelContent ul li a {
        display:block;
        padding-top: 5px;
        padding-right: 0px;
        padding-bottom: 5px;
        padding-left: 0px;
    .AccordionPanelContent ul li a:link, .AccordionPanelContent ul li a:visited {
        text-decoration:none;
        color:#0071BC;
    .AccordionPanelContent ul li a:hover, .AccordionPanelContent ul li a:active {
        color:#FF9900;
    .AccordionPanelTab a:link, .AccordionPanelTab a:visited {
        color:#0071BC;
    .AccordionPanelTabHover a:hover, .AccordionPanelTabHover a:active {
        color:#FF9900;
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open. The class "AccordionPanelOpen" is programatically added and removed
    * from panels as the user clicks on the tabs within the Accordion.
    .AccordionPanelOpen .AccordionPanelTab {
        background-color: #FFFFFF;
    /* This is an example of how to change the appearance of the panel tab as the
    * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
    * and removed from panel tab containers as the mouse enters and exits the tab container.
    .AccordionPanelTabHover {
    .AccordionPanelOpen .AccordionPanelTabHover {
        color: #555555;
    /* This is an example of how to change the appearance of all the panel tabs when the
    * Accordion has focus. The "AccordionFocused" class is programatically added and removed
    * whenever the Accordion gains or loses keyboard focus.
    .AccordionFocused .AccordionPanelTab {
        /* [disabled]background-color: #3399FF; */
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open when the Accordion has focus.
    .AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
        /* [disabled]background-color: #33CCFF; */
    /* Rules for Printing */
    @media print {
      .Accordion {
      overflow: visible !important;
      .AccordionPanelContent {
      display: block !important;
      overflow: visible !important;
      height: auto !important;

  • Unordered list not showing up as indented bullet points within Accordian

    http://www.foundationforyoutharts.org/test/Programs.html
    I have a page using the spry accordian, and about five different catagories of information. Some of the copy is in unordered lists (in martial arts catagories), but it shows up as as regular text. Any ideas on how to make it view as a typical unordered list with bullet points and indented?
    Thanks for taking time to look at this.

    Add a margin-left of 20px to your ul.
    Either added it in your stylesheet. or directly on the element:
    <ul style="margin-left:20px">

  • Css problem in spry gallery demo, ie "doubled margin" for thumbnails

    http://labs.adobe.com/technologies/spry/demos/gallery/
    View page in both Firefox and IE6. Note that in Internet
    Explorer (Windows), the margin on the left is double that of the
    same in Firefox. This is a well-documented IE CSS issue that occurs
    when a floated element also has margin set on the side to which it
    is floated, as in float:left; margin:5px;
    It's an issue when the margin is such that it causes wrapping
    within the thumbnails parent container... in IE browsers.
    Add display:inline to the #thumbnails div rule to correct the
    problem.
    Just FYI.
    Donna Casey

    Thanks Donna! The fix will appear in the next drop.
    --== Kin ==--

  • I want my spry horizontal accordian in explorer content table to be closed and also wont align left

    I've tried everything.  my accordian will stay closed when landing on the page in all browsers except explorer and also I can't get the tab text to align left no matter what I do.
    Here is the page http://www.lohud.com/legacy/advertising/mediakit/tjn_content_guide.html 
    Please help I've been at this for many many hours.
    Here is my code
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/Main.dwt" codeOutsideHTMLIsLocked="false" -->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>The Journal News Media Group</title>
    <!-- InstanceEndEditable -->
    <style type="text/css">
    body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    text-align: center;
    background-image: url(images/backdrop.png);
    background-repeat: no-repeat;
    background-position:top center;
    background-color: #77787B;
    .pageLable {
    font-family: arial;
    font-size: 18pt;
    color: #00adf0;
    line-height: 25pt;
    vertical-align: middle;
    padding-top: 10px;
    .pageLableTagline {
    font-family: arial;
    font-size: 18pt;
    color: #A7A9AC;
    .BlueText {
    color: #00adf0 !important;
    .descriptionFont {
    font-family: arial;
    font-size: 10pt;
    line-height: 14pt;
    .labelSub {
    font-family: arial;
    font-size: 14px;
    color: #00adf0;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    .content12 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    .fontNinePoint {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 9px;
    .white {
    color: #FFF !important;
    </style>
    <!-- InstanceBeginEditable name="head" -->
    <script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
    <!-- InstanceEndEditable -->
    <style type="text/css">
    a:link {
    text-decoration: none;
    a:visited {
    text-decoration: none;
    a:hover {
    text-decoration: underline;
    a:active {
    text-decoration: none;
    body,td,th {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    h1,h2,h3,h4,h5,h6 {
    font-family: Arial, Helvetica, sans-serif;
    h6 {
    font-size: 8px;
    color: #000;
    h4 {
    font-size: 12px;
    .fontsmall {
    font-size: 9pt;
    </style>
    <style type="text/css">
    </style>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body leftmargin="0">
    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td><table width="906" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td width="126" rowspan="3"><a href="index.html"><img src="images/Logo_Nav_Black.jpg" alt="The Journal News Media Group" width="126" height="132" border="0" longdesc="index.html" /></a></td>
              <td width="780" height="30" align="right" valign="top"><table width="657" border="0" align="right" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="61" height="32" align="right" valign="middle"> </td>
                  <td width="372" align="right" valign="middle"><a href="http://www.linkedin.com/groups/Journal-News-Media-Group-4828545?trk=myg_ugrp_ovr" target="_new"><img src="images/linkedin.png" alt="linkedin" width="16" height="16" border="0" /></a></td>
                  <td width="37" align="center" valign="middle"><a href="http://www.facebook.com/pages/The-Journals-News-Media-Group/124999397672489" target="_new"><img src="images/facebook.png" alt="facebook" width="8" height="16" border="0" /></a></td>
                  <td width="90" align="center" valign="middle" nowrap="nowrap" class="white" style="font-size:12px"><strong><a href="newsletter.html" class="white">newsletter</a></strong></td>
                  <td width="24" align="center" valign="middle" class="white" style="font-size:12px"><img src="images/dot.png" alt="" width="9" height="9" /></td>
                  <td width="90" align="center" valign="middle" nowrap="nowrap" class="white" style="font-size:12px"><strong>  <a href="contact.html" class="white">contact us  </a></strong></td>
                </tr>
              </table></td>
            </tr>
            <tr>
              <td align="right" valign="top"><table width="657" border="0" align="right" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="75" bgcolor="#000000"> </td>
                  <td width="369" bgcolor="#000000"><ul id="MenuBar1" class="MenuBarHorizontal">
                    <li class="MenuBarItemSubmenu"><a href="#">About</a>
                      <ul>
                        <li><a href="our_brand.html">Our Brand</a></li>
                        <li><a href="our_audience.html">Our Audience</a></li>
                        <li><a href="giving_back.html">Giving Back</a></li>
                        <li><a href="careers.html">Careers</a></li>
                        </ul>
                      </li>
                    <li><a href="digital.html" >Digital</a>                  </li>
                    <li><a href="#">Print</a>
                      <ul>
                        <li><a class="MenuBarItemSubmenu" href="#">Journal News</a>
                          <ul>
                            <li><a href="tjn_content_guide.html">Content Guide</a></li>
                            <li><a href="tjn_print_reach.html">Print Reach</a></li>
                            </ul>
                          </li>
                        <li><a href="special_sections.html">Special Sections</a></li>
                        <li><a href="creative_ad_units.html">Creative Ad Units</a></li>
                        <li><a href="zoning_guide.html">Zoning Guide</a></li>
                        </ul>
                      </li>
                    <li><a href="events.html">Events</a>
                      <ul>
                        <li><a href="golf_show.html">Golf Show</a></li>
                        <li><a href="theater_awards.html">Metropolitan High School Theater Awards</a></li>
                        <li><a href="rockland.html">Rockland Scholar Athlete</a></li>
                        <li><a href="ray_rice_day.html">Ray Rice Day</a></li>
                        <li><a href="cookie_swap.html">Cookie Swap</a></li>
                        <li><a href="give_grow.html">Give &amp; Grow</a></li>
                        </ul>
                      </li>
                    <li><a href="#"> Specs</a>
                      <ul>
                        <li><a href="print_specs.html">Print Specs</a></li>
                        <li><a href="digital_specs.html">Digital Specs</a></li>
                        <li><a href="deadlines.html">Deadlines</a></li>
                        <li><a href="terms_conditions.html">Terms &amp; Conditions</a></li>
                        </ul>
                      </li>
                  </ul></td>
    </tr>
                <tr> </tr>
              </table></td>
            </tr>
            <tr>
              <td height="70" align="right" valign="top"> </td>
            </tr>
          </table>
          <table width="906" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td height="40"> </td>
            </tr>
        </table></td>
      </tr>
    </table>
    <!-- InstanceBeginEditable name="MainTable" -->
    <table width="906" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td height="300" valign="top" bgcolor="#FFFFFF"><table width="906" border="0" align="center" cellpadding="10" cellspacing="0">
          <tr>
            <td height="57" align="left" valign="top" class="pageLable">Content Guide  <span class="pageLableTagline">lohud.com</span></td>
          </tr>
        </table> <div id="Accordion1" class="Accordion" tabindex="0">
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">News</div>
            <div class="AccordionPanelContent">
              <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content: </strong>The latest headlines, by county, updated continuously to keep readers informed of breaking news as it happens. Here is where they go to first for the latest on issues of particular importance to area residents: crime, politics, business, education, health and New York State news.<br />
                    <strong><br />
                    Advertiser Advantage:</strong> Benefit from prime positioning and high visibility on one of the most frequently<br />
                    visited pages on lohud.com.</td>
                  <td width="180" align="right"><img src="images/digital/contentguide/lh-news.jpg" alt="News" width="180" height="154" border="0" /></td>
                </tr>
              </table>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Tax Watch</div>
            <div class="AccordionPanelContent">
              <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="685" align="left" valign="top" class="descriptionFont"><strong>Content: </strong>Money and taxes. It’s a passion topic that many area residents have a keen interest in following. Our standing Tax Watch feature on LoHud.com keeps them in-the-know with watchdog columns on government accountability, blogs from local tax experts, timely articles and columns.<br />
                    <strong><br />
                    Advertiser Advantage:</strong> Ideal environment for financial, banks, real estate, and business.</td>
                  <td width="179" align="right"><img src="images/digital/contentguide/lh-taxwatch.jpg" alt="Tax Watch" width="179" height="155" border="0" /></td>
                </tr>
              </table>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Communities</div>
            <div class="AccordionPanelContent">
              <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content: </strong>Sixteen ultra-local homepages dedicated to the unique villages, towns and cities of Westchester County, with daily updates, photos and neighborhood conversations designed to involve <br />
                    and engage readers — and have them returning regularly for updates.<br />
                    <strong><br />
                    Advertiser Advantage: </strong>Ideal for smaller advertisers looking to reach their best potential customers<br />
                    within targeted geographic areas.</td>
                  <td width="181" align="right"><img src="images/digital/contentguide/lh-community.jpg" alt="Communities" width="179" height="158" border="0" /></td>
                </tr>
              </table>
            </div>
          </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Living Here</div>
            <div class="AccordionPanelContent">
              <table width="865" border="0" align="center" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="686" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> Awarded “First Place Winner/Niche Website” by the 2012 New York Associated Press! Offers an insider’s look at Lower Hudson Valley real estate for residents looking to buy, sell up, downsize or plan a renovation.<br />
                    <strong><br />
                    Advertiser Advantage:</strong> Ideal for real estate, financial, and home-related businesses. Provides a locally driven and highly targeted environment for your message.</td>
                  <td width="179" align="right"><img src="images/digital/contentguide/lh-livinghere.jpg" alt="News" width="179" height="155" border="0" /></td>
                </tr>
              </table>
            </div>
        </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Sports</div>
      <div class="AccordionPanelContent">
        <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> Comprehensive and updated frequently to keep fans up to date with the latest action from high school, college, major-league teams. Featuring game results, profiles of local athletes, perspective, commentary and blogs for reader interaction.<br />
              <strong><br />
              Advertiser Advantage:</strong> Action-packed environment for auto aftermarket, sporting goods, financial,<br />
              men’s interests, orthopedic and physical therapy businesses.</td>
            <td width="180" align="right"><img src="images/digital/contentguide/lh-sports.jpg" alt="Sports" width="180" height="158" border="0" /></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Blogs</div>
      <div class="AccordionPanelContent">
        <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="683" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> Can we talk? We sure can…and readers love to hear what our writers and editors have<br />
    to say. Our lively Blogs site is where they can turn to for conversation and opinion on all kinds of <br />
    subjects — community, lifestyle &amp; entertainment, news, opinion and sports, including our extremely popular Yankees blog.<br />
              <strong><br />
              Advertiser Advantage:</strong> Benefit from prime positioning and visibility on highly targeted pages that offer maximum impact and response.</td>
            <td width="181" align="right"><img src="images/digital/contentguide/lh-blogs.jpg" alt="News" width="181" height="157" border="0" /></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Multimedia</div>
      <div class="AccordionPanelContent">
        <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> A picture is worth a thousand words and this photo/video gallery keeps readers involved and engaged with compelling local photos from the week and informative feature videos on trending stories.<br />
              <strong><br />
              Advertiser Advantage:</strong> Ideal for retailers of all kinds, benefit from prime positioning and visibility on<br />
              highly targeted pages.</td>
            <td width="178" align="right"><img src="images/digital/contentguide/lh-multimedia.jpg" alt="Multimedia" width="178" height="157" border="0" /></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Life & Leisure</div>
      <div class="AccordionPanelContent">
        <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> The perfect complement to our daily “Life &amp; Style” print section, it’s where readers go to be inspired and entertained! Featuring complete local restaurant and food coverage, weddings/engagement announcements, home &amp; garden tips, movie &amp; TV reviews, music and more.<br />
              <strong><br />
              Advertiser Advantage:</strong> Ideal weekly environment for restaurants, entertainment and leisure-related<br />
              businesses.</td>
            <td width="180" align="right"><img src="images/digital/contentguide/lh-lifeleisure.jpg" alt="Life and Leisure" width="180" height="158" border="0" /></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Opinion</div>
      <div class="AccordionPanelContent">
        <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> Everybody’s got one — and this is where it counts. Our Opinion page on LoHud.com is just <br />
              that: opinions on the issues of the day, from our staff and from our readers, designed to inform, inspire and encourage interaction. Find editorials by our writers and editors, commentary, letters, editorial board surveys and more.<br />
              <strong><br />
              Advertiser Advantage:</strong> Benefit from prime positioning and visibility on highly targeted pages that offer maximum impact and response.</td>
            <td width="178" align="right"><img src="images/digital/contentguide/lh-opinion.jpg" alt="Opinion" width="178" height="156" border="0" /></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Obituaries</div>
      <div class="AccordionPanelContent">
        <table width="864" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="684" align="left" valign="top" class="descriptionFont"><strong>Content:</strong> Comprehensive and complete, with death notices, memorials, touching tributes and <br />
              convenient interactive features such as a search feature, free obituary alerts, one-click access to flowers and services, guest book signing and more.<br />
              <strong><br />
              Advertiser Advantages:</strong> Ideal environment for funeral homes, estate planners and florists.</td>
            <td width="178" align="right"><img src="images/digital/contentguide/lh-obits.jpg" alt="Obituaries" width="178" height="154" border="0" /></td>
          </tr>
        </table>
      </div>
    </div>
        </div>   
        <p> </p></td>
      </tr>
    </table>
    <script type="text/javascript">
    var Accordion1 = new Spry.Widget.Accordion("Accordion1",{ useFixedPanelHeights: false, defaultPanel: -1 });
    </script>
    <!-- InstanceEndEditable -->
    <table width="906" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td height="19" align="center" valign="middle" bgcolor="#77307d" class="white" style="font-size:12px"> <a href="contact.html"><img src="images/contactAnAdvert.png" alt="Contact an advertising expert" width="336" height="18" border="0" /></a></td>
        </tr>
      <tr>
        <td height="19" align="center" valign="middle" class="white" style="font-size:12px"><p><br />
        1133 Westchester Avenue, Suite N-110, White Plains, NY 10604   <img src="images/dot.png" width="9" height="9" alt="dot" />  P: 914-694-5500</p>
        <p> </p>
        <p><a href="http://www.gannett.com/" target="_new"><img src="images/Gannett.png" alt="Gannett" width="130" height="18" border="0" /></a><br />
          <br />
          Copyright © 2013<a href="http://www.lohud.com/" target="_new" class="white"> www.lohud.com</a>. All rights reserved.<br />
          Users of this site agree to the <a href="http://www.lohud.com/section/terms" target="_new" class="white">Terms of Service</a>, <a href="http://www.lohud.com/section/privacy" target="_new" class="white">Privacy Notice/Your California Privacy Rights</a>, and <a href="http://www.lohud.com/section/privacy#adchoices&gt;&lt;http://www.lohud.com/section/privacy #adchoices" target="_new" class="white">Ad Choices</a> <br />
        </p></td>
        </tr>
    </table>
    <p> </p>
    <table width="960" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>  </tr>
    </table>
    <p> </p>
    <p> </p>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    <!-- InstanceEnd --></html>

    It just wont align left ......This is my style sheet
    @charset "UTF-8";
    /* SpryAccordion.css - version 0.5 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    .Accordion {
    overflow: hidden;
    outline:none;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    text-align: left;
    .AccordionPanel {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    /* This is the selector for the AccordionPanelTab. This container houses
    * the title for the panel. This is also the container that the user clicks
    * on to open a specific panel.
    * The name of the class ("AccordionPanelTab") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel tab container.
    * NOTE:
    * This rule uses -moz-user-select and -khtml-user-select properties to prevent the
    * user from selecting the text in the AccordionPanelTab. These are proprietary browser
    * properties that only work in Mozilla based browsers (like FireFox) and KHTML based
    * browsers (like Safari), so they will not pass W3C validation. If you want your documents to
    * validate, and don't care if the user can select the text within an AccordionPanelTab,
    * you can safely remove those properties without affecting the functionality of the widget.
    .AccordionPanelTab {
    margin: 0px;
    padding: 2px;
    cursor: pointer;
    -moz-user-select: none;
    -khtml-user-select: none;
    text-align: left;
        padding-left: 10px;
    color: #000000;
    background-color: #c0dff5;
    border-bottom-width: 6px;
    border-bottom-style: solid;
    border-bottom-color: #FFF;
    text-indent: 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    /* This is the selector for a Panel's Content area. It's important to note that
    * you should never put any padding on the panel's content area if you plan to
    * use the Accordions panel animations. Placing a non-zero padding on the content
    * area can cause the accordion to abruptly grow in height while the panels animate.
    * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
    * Content container.
    * The name of the class ("AccordionPanelContent") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel content container.
    .AccordionPanelContent {
    overflow: auto;
    outline:none
    margin: 0px;
    text-align: justify;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    padding-left: 10px;
    padding-right: 10px;
    height: 200px;
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open. The class "AccordionPanelOpen" is programatically added and removed
    * from panels as the user clicks on the tabs within the Accordion.
    .AccordionPanelOpen .AccordionPanelTab {
    background-color: c0dff5;
    color: #666;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    /* This is an example of how to change the appearance of the panel tab as the
    * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
    * and removed from panel tab containers as the mouse enters and exits the tab container.
    .AccordionPanelTabHover {
    color: #999999;
    background-color: c0dff5;
    .AccordionPanelOpen .AccordionPanelTabHover {
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    /* This is an example of how to change the appearance of all the panel tabs when the
    * Accordion has focus. The "AccordionFocused" class is programatically added and removed
    * whenever the Accordion gains or loses keyboard focus.
    .AccordionFocused .AccordionPanelTab {
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    text-align: left;
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open when the Accordion has focus.
    .AccordionFocused {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    .AccordionPanelOpen
    .AccordionPanelTab {
    background-color: c0dff5;
    color: #666;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    /* Rules for Printing */
    @media print {
      .Accordion {
      overflow: visible !important;
      .AccordionPanelContent {
    display: block !important;
    overflow: visible !important;
    height: auto !important;
    font-size: 12pt;
    padding-left: 10px;
    padding-right: 10px;

  • How to apply different styles to multiple spry accordian panels?

    Hi all,
    I have a website that I'm building that has multiple spry accordian features on it.
    I am trying to apply different styles to each accordian. A problem arises when I try to place an accordian within another accordian.
    I have styled two different background images for two of the accordians for the styles (AccordionPanelTab, AccordionPanelTabHover and AccordionPanelOpen AccordionPanelTabHover) which work fine.
    When I try and place an accordian within another accordian the background image for this accordian for the styles (AccordionPanelTab and AccordionPanelOpen AccordionPanelTabHover) has the different style applyed that I stated in the accordion.css file, however the style (AccordionPanelTabHover) has the same style as the accordian it is within even though in the accordion.css file I stated a different background image.
    I hope all this makes sence below is my source and CSS Code.
    I appriciate any help that can be given to help resolve this issue I am running in too.
    Source Code
    <div id="content">
    <p><span class="first_header_word_packages">Welcome</span> <span class="header_word_packages">to our packages page</span></p>
    <p class="content_txt">Here you can build the website package that matches your business needs as well as being able to work out the cost of your site without having to worry about scary hidden costs at a later date.</p>
    <p class="content_txt"> We have two packages available for our customers;</p>
    <div id="Accordion1" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab"></div>
        <div class="AccordionPanelContent">
       <p>Text Goes Here</p>
        <div id="Accordion2" class="Accordion" tabindex="0">
          <div class="AccordionPanel">
        <div class="AccordionPanelTab"></div>
        <div class="AccordionPanelContent">
        <p>Text Goes Here</p>
        </div><!-- end #Accordion2 Content -->
      </div><!-- end #AccordionPanel -->
    </div><!-- end #Accordion2 -->
        </div><!-- end #Accordion1 Content -->
      </div><!-- end #AccordionPanel -->
    </div><!-- end #Accordion1 -->
    <div id="Accordion3" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab"></div>
        <div class="AccordionPanelContent">
             <p>Text Goes Here</p>
          <div id="Accordion4" class="Accordion" tabindex="0">
            <div class="AccordionPanel">
        <div class="AccordionPanelTab"></div>
        <div class="AccordionPanelContent">
         <p>Text Goes Here</p>
        </div><!-- end #Accordion4 Content -->
      </div><!-- end #AccordionPanel -->
    </div><!-- end #Accordion4 -->
        </div><!-- end #Accordion3 Content -->
      </div><!-- end #AccordionPanel -->
    </div><!-- end #Accordion3 -->
    </div><!-- end #content -->
    CSS
    @charset "UTF-8";
    /* SpryAccordion.css - version 0.5 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    /* This is the selector for the main Accordion container. For our default style,
    * we draw borders on the left, right, and bottom. The top border of the Accordion
    * will be rendered by the first AccordionPanelTab which never moves.
    * If you want to constrain the width of the Accordion widget, set a width on
    * the Accordion container. By default, our accordion expands horizontally to fill
    * up available space.
    * The name of the class ("Accordion") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style the
    * Accordion container.
    .Accordion {
              border-left: solid 1px gray;
              border-right: solid 1px black;
              border-bottom: solid 1px gray;
              overflow: hidden;
    /* This is the selector for the AccordionPanel container which houses the
    * panel tab and a panel content area. It doesn't render visually, but we
    * make sure that it has zero margin and padding.
    * The name of the class ("AccordionPanel") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel container.
    .AccordionPanel {
              margin: 0px;
              padding: 0px;
    /* This is the selector for the AccordionPanelTab. This container houses
    * the title for the panel. This is also the container that the user clicks
    * on to open a specific panel.
    * The name of the class ("AccordionPanelTab") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel tab container.
    * NOTE:
    * This rule uses -moz-user-select and -khtml-user-select properties to prevent the
    * user from selecting the text in the AccordionPanelTab. These are proprietary browser
    * properties that only work in Mozilla based browsers (like FireFox) and KHTML based
    * browsers (like Safari), so they will not pass W3C validation. If you want your documents to
    * validate, and don't care if the user can select the text within an AccordionPanelTab,
    * you can safely remove those properties without affecting the functionality of the widget.
    .AccordionPanelTab {
              background-color: #CCCCCC;
              border-top: solid 1px black;
              border-bottom: solid 1px gray;
              margin: 0px;
              padding: 2px;
              cursor: pointer;
              -moz-user-select: none;
              -khtml-user-select: none;
    /* This is the selector for a Panel's Content area. It's important to note that
    * you should never put any padding on the panel's content area if you plan to
    * use the Accordions panel animations. Placing a non-zero padding on the content
    * area can cause the accordion to abruptly grow in height while the panels animate.
    * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
    * Content container.
    * The name of the class ("AccordionPanelContent") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style an
    * accordion panel content container.
    .AccordionPanelContent {
              overflow: auto;
              margin: 0px;
              padding: 0px;
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open. The class "AccordionPanelOpen" is programatically added and removed
    * from panels as the user clicks on the tabs within the Accordion.
    .AccordionPanelOpen .AccordionPanelTab {
              background-color: #EEEEEE;
    /* This is an example of how to change the appearance of the panel tab as the
    * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
    * and removed from panel tab containers as the mouse enters and exits the tab container.
    .AccordionPanelTabHover {
              color: #555555;
    .AccordionPanelOpen .AccordionPanelTabHover {
              color: #555555;
    /* This is an example of how to change the appearance of all the panel tabs when the
    * Accordion has focus. The "AccordionFocused" class is programatically added and removed
    * whenever the Accordion gains or loses keyboard focus.
    .AccordionFocused .AccordionPanelTab {
              background-color: #3399FF;
    /* This is an example of how to change the appearance of the panel tab that is
    * currently open when the Accordion has focus.
    .AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
              background-color: #33CCFF;
    /* Rules for Printing */
    @media print {
      .Accordion {
      overflow: visible !important;
      .AccordionPanelContent {
      display: block !important;
      overflow: visible !important;
      height: auto !important;
    #Accordion1  .AccordionPanelTab {
    height:75px;
    width:285px;
    background:url(../images/package_spry_tab_bg1.png);}
    #Accordion1 .AccordionPanelTabHover,
    #Accordion1 .AccordionPanelOpen .AccordionPanelTabHover {
    background:url(../images/package_spry_tab_bg1_RO.png);}
    #Accordion2  .AccordionPanelTab {
    height:44px;
    width:469px;
    background:url(../images/packages_spry1.png);}
    #Accordion2 .AccordionPanelTabHover,
    #Accordion2 .AccordionPanelOpen .AccordionPanelTabHover {
    background:url(../images/packages_spry1_ro.png);}
    #Accordion3  .AccordionPanelTab {
    height:75px;
    width:285px;
    background:url(../images/package_spry_tab_bg2.png);}
    #Accordion3 .AccordionPanelTabHover,
    #Accordion3 .AccordionPanelOpen .AccordionPanelTabHover {
    background:url(../images/package_spry_tab_bg2_RO.png);}
    #Accordion4  .AccordionPanelTab {
    height:44px;
    width:469px;
    background:url(../images/packages_spry2.png);}
    #Accordion4 .AccordionPanelTabHover,
    #Accordion4 .AccordionPanelOpen .AccordionPanelTabHover {
    background:url(../images/packages_spry2_ro.png);}

    Okay guys,
    I figured it out, if anyone was having the same problem as me and looking on this thread for the answer, here it is.
    Firstly if you're wanting to seperatly style two or more Spry Accordions that are not within each other e.g.
    <div id="Accordion1" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab">Label 1</div>
        <div class="AccordionPanelContent">
       <p>Content Goes Here </p>
    </div><!-- end #Accordion1 Content -->
      </div><!-- end #Accordion1 .AccordionPanel -->
    </div><!-- end #Accordion1 -->
    <div id="Accordion2" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab">Label 1</div>
        <div class="AccordionPanelContent">
       <p>Content Goes Here </p>
    </div><!-- end #Accordion2 Content -->
      </div><!-- end #Accordion2 .AccordionPanel -->
    </div><!-- end #Accordion2 -->
    You don't have to do this, as long as you have seperate ID's for the divs (which dreamweaver automatically does anyway) you'll be fine.
    However if for some reason you want to put one accordion inside another like I did e.g.
    <div id="Accordion1" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab">Label 1</div>
        <div class="AccordionPanelContent">
       <p>Content Goes Here </p>
    <div id="Accordion2" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab">Label 1</div>
        <div class="AccordionPanelContent">
       <p>Content Goes Here </p>
    </div><!-- end #Accordion2 Content -->
      </div><!-- end #Accordion2 .AccordionPanel -->
    </div><!-- end #Accordion2 -->
    </div><!-- end #Accordion1 Content -->
      </div><!-- end #Accordion1 .AccordionPanel -->
    </div><!-- end #Accordion1 -->
    Too style Accordian 1 & 2 so their tabs both have different backgrounds and Hover background when the content panel is open and closed you have to style it in the CSS they following way;
    CSS
    #Accordion1  .AccordionPanelTab {
    height:75px;
    width:285px;
    background:url(../images/package_spry_tab_bg.png);}
    #Accordion1 .AccordionPanelTabHover,
    #Accordion1 .AccordionPanelOpen .AccordionPanelTabHover {
    height:75px;
    width:285px;
    background:url(../images/package_spry_tab_bg_RO.png);}
    #Accordion2  .AccordionPanelTab {
    height:44px;
    width:469px;
    background:url(../images/packages_spry.png);}
    #Accordion2 .AccordionPanelClosed .AccordionPanelTabHover,
    #Accordion2 .AccordionPanelOpen .AccordionPanelTabHover {
    height:44px;
    width:469px;
    background:url(../images/packages_spry_ro.png);}
    Normally when styling two seperate spry accordions you can just use the following code
    #Accordion1  .AccordionPanelTab {
    height:75px;
    width:285px;
    background:url(../images/package_spry_tab_bg.png);}
    #Accordion1 .AccordionPanelTabHover,
    #Accordion1 .AccordionPanelOpen .AccordionPanelTabHover {
    height:75px;
    width:285px;
    background:url(../images/package_spry_tab_bg_RO.png);}
    The only difference with styling a Spry accordion within another to ensure they have different hover backgrounds when the content panel is open and closed is ".AccordionPanelClosed".
    Hope this helped anyone who was having the same issue I was.

  • CSS layout and IE6 suddenly gone wrong

    Hi
    I have been working on a site, unfortunately I diont have a
    copy of IE6 but looked great in IE7 and FF, checked through
    development in IE6 when i had the opportunity, suddenly at the last
    hurdle it seems to have gone terribly wrong and I have no idea why
    I have been trouble shooting for some time now and I cant seem tio
    come up with an answer.
    So if anyone can help I would be very grateful. The url :
    http://www.blanc-wall.co.uk/sitefiles/index.htm
    The left hand div seems to be the source of all errors I dont
    know why, as is pretty much the same as the right hand div and that
    renders fine.
    Help!
    Many Thanks
    Andy

    andy_forbes wrote:
    > Hi
    > I have been working on a site, unfortunately I diont
    have a copy of IE6 but
    > looked great in IE7 and FF, checked through development
    in IE6 when i had the
    > opportunity, suddenly at the last hurdle it seems to
    have gone terribly wrong
    > and I have no idea why I have been trouble shooting for
    some time now and I
    > cant seem tio come up with an answer.
    > So if anyone can help I would be very grateful. The url
    >
    http://www.blanc-wall.co.uk/sitefiles/index.htm
    > The left hand div seems to be the source of all errors I
    dont know why, as is
    > pretty much the same as the right hand div and that
    renders fine.
    I can identify the issues but I don't know how to fix one of
    them. The
    way you have constructed the page isn't exactly the way I
    would go about
    doing it.
    Issue 1: The divLeft is inheriting the margin-left: 200px;
    from the
    divCenter css, which results in flinging it to the left in
    IE6. I don't
    know the solution to this one, someone else may well do as it
    seems to
    be an IE 6 bug of some kind.
    Issue 2: You can close up the space between the links by
    giving IE6 a
    conditional comment. The space bug on the 'a' tag in that
    browser is
    well documented.
    <!--[if IE 6]>
    <style>
    #divLeft a {height: 1em;}
    </style>
    <![endif]-->

Maybe you are looking for

  • Import users from BIAR file -- users not listed in import screen of Wizard

    Hi, we try to import users from a BO XI R2 SP4 running on Windows to our BO XI R2 SP4 running on Linux (both use Oracle database). When I try to import users with the Import Wizard, I can't see the list of users so at the end of the import  and show

  • How to stop SSID broadcasting

    Where do I find the option to stop SSID broadcasting in my Actiontec MI424WR Rev. F Router? The user guide is located here: http://onlinehelp.verizon.net/consumer/bin/pdf/ActiontecMI1424WRUserManual.pdf and it shows where that option is but the scree

  • To_char displays different results on sql client and server

    Hi, I am executing the below query on my database with 8.1.7.4 version: SQL> select to_char(to_date('20-OCT-07'),'D') from dual; The following result is displayed: T 7 When the same query is being run through sqlplus client(9.2.0.3) connecting to the

  • Error executing Webdynpro mail program

    Hi, I am using webdynpro code for implementing mail service. I have imported jaxrpc.jar as external jar file. I got this jar from axis.zip. While implementing the code, I get following exception. java.lang.Error: Unresolved compilation problems:     

  • J'ai besoin d'aide avec mon iPod touch?

    Bonjour, J'ai un iPod touch depuis 2 ans 1/2. Je suis canadienne et j'ai activé mon iPod au Québec. J'ai aussi un iTunes activé sur mon ordinateur au Canada. Maintenantm je suis en France pour une longue période et j'aimerais savoir comment obtenir m