﻿/* LOGO AND GLOBAL NAV HEADER */
div#header
{
    clear:both;
    width:966px;
    margin:0 10px;
}
/* NAVIGATION BAR */
div#nav
{
    clear:both;
    width:966px;
    margin:5px 12px 8px 10px;
}
/* SUB NAVIGATION BAR */
div#nav div.sub-nav
{
    clear:both;
    width:100%;
    margin:8px 0 0 0;
    padding:0;
}

/* STYLES FOR THE PROMO OUT CONTAINER */
div#front-end-content-container
{ 
    clear:both;
    padding:0 0 0 8px;
    width:982px;
}
/* STYLES FOR ALL CONTENT PROMO BOXES */
div.content-box div div
{
    padding:0 0 3px 0;
}

/* STYLES FOR THE SMALLEST PROMO THAT CONTAIN FLASH OR AN IMAGE*/
div.content-box-small-with-image
{
    float:left;
    width:162px;
}

div.content-box-medium-with-image
{
    float:left;
    width:324px;
}
/* STYLES FOR THE SMALLEST PROMOS (1/2 COLUMN WIDE) */
div.content-box-small
{
    width:162px;
    float:left;
    background-image:url('/images/promos/small-width-promo-middle-repeater-image.gif');
    background-repeat:repeat-y;
}
div.content-box-small div
{
    background-image:url('/images/promos/small-width-promo-top-image.gif');
    background-repeat:no-repeat;
    background-position:top right;
}
div.content-box-small div a
{
    background-image:url('/images/promos/small-width-promo-bottom-image.gif');
    background-repeat:no-repeat;
    background-position:bottom right;
    padding:10px 20px 17px 10px;
    min-height:100px;
    height:auto !important;
    height:100px;
    display:block;
    color:#000000;
    text-decoration:none;
}
div.content-box-small div a:hover
{
    color:#000000;
    text-decoration:underline;
}
div.content-box-small div a strong
{
    color:#00a651;
    text-decoration:none;
    line-height:1em;
}
div.content-box-small div a:hover strong
{
    color:#00a651;
     text-decoration:underline;
    line-height:1em;
}

/* STYLES FOR THE MEDIUM PROMOS (1 COLUMN WIDE) */
div.content-box-medium
{
    width:324px;
    float:left;
    background-image:url('/images/promos/medium-width-promo-middle-repeater-image.gif');
    background-repeat:repeat-y;
}
div.content-box-medium div
{
    background-image:url('/images/promos/medium-width-promo-top-image.gif');
    background-repeat:no-repeat;
    background-position:top;
}
div.content-box-medium div div
{
    background-image:url('/images/promos/medium-width-promo-bottom-image.gif');
    background-repeat:no-repeat;
    background-position:bottom;
    padding:10px 20px 17px 10px;
    min-height:98px;
    height:auto !important;
    height:98px;
}





/* STYLES FOR THE LARGE PROMOS (2 COLUMNS WIDE) */
div.content-box-large
{
    width:648px;
    float:left;
    background-position:left;
    background-image:url('/images/promos/large-width-promo-middle-repeater-image.gif');
    background-repeat:repeat-y;
}
div.content-box-large div
{
    background-image:url('/images/promos/large-width-promo-top-image.gif');
    background-repeat:no-repeat;
    background-position:top left;
}
div.content-box-large div div
{
    background-image:url('/images/promos/large-width-promo-bottom-image.gif');
    background-repeat:no-repeat;
    background-position:bottom left;
    padding:10px 20px 17px 10px;
    min-height:29px;
    height:auto !important;
    height:29px;
}

/* STYLES FOR THE EXTRA-LARGE PROMOS (FULL WIDTH) */
div.content-box-full-width
{
    width:970px;
    margin:0 0 0 2px;
    background-image:url('/images/promos/full-width-promo-repeater-image.gif');
    background-repeat:repeat-y;
}
div.content-box-full-width div
{
    background-image:url('/images/promos/full-width-promo-top-image.gif');
    background-repeat:no-repeat;
    background-position:top;
}
div.content-box-full-width div div
{
    background-image:url('/images/promos/full-width-promo-bottom-image.gif');
    background-repeat:no-repeat;
    background-position:bottom;
    padding:10px 20px 17px 10px;
    min-height:315px;
    height:auto !important;
    height:315px;
}



/* COLUMNS - THESE WILL DETERMINE THE LAYOUT */

/* ONE COLUMN LAYOUT */

div.one-column
{
    width:324px;
    float:left;
}

/* TWO COLUMN LAYOUT */
div.two-columns
{
    float:left;
    width:648px;
}

/* THREE COLUMNS - FULL WIDTH */
div.three-columns
{
    float:left;
    width:100%;
}


/* FLASH PROMO */
div.flashContainer
{
    float:left;
    width:324px;
}

div.flash-container-small
{
    float:left;
    width:162px;
}