/**
    NOTES:

    - selector "#AboutHealthymagination .link-list ul li:last-child" uses
      Last Child which may not be fully compatible.

    - -moz-outline-style is used in the first selector to remove dotted lines
      from active links. Property could be removed if necessary.

    - there are blocks called tmpBlockName, and tmpSideBlock name that should be
      changed and named appropriately. They represent "From the blog" and "From
      Twitter" blocks.

    - the .box-button class uses "inline-block" display which may cause errors
      in IE and should be checked.

    - the .box-button uses an !important override for color which may cause
      specific hover colors to not take effect.

**/

.clear{
    clear:              both;
}

a,
* :focus,
a:active{
    outline:            none;
    -moz-outline-style: none;
}

.box-button {
    border:         1px solid #E1E5E8;
    width:          auto;
    padding:        3px 5px 3px 20px;
    text-transform: uppercase;
    font-size:      11px;
    margin-left:    20px;
    background:     white url('../images/arrow_r.png') 2px 3px no-repeat;
    color:          #999 !important;

    display:        inline-block;
    zoom:           1;
    *display:       inline;
}

.box-button:hover {
    background-position:    4px 3px;
    color:          null;
}

#content {
    background:     #FAFAFA !important;
    padding-bottom: 50px;
    overflow:       inherit !important;
    width:          auto;
    min-width:      960px;
}

#footer {
    height:         100px;
}


/** ======================================================
 ** ======================================================
 ** ======================================================  **/

#AboutHealthymagination{

}

#AboutHealthymagination .flash-main{
    height:         620px;
    width:          100%;
    background:     #3891CB;
    min-width:      960px;
}

#HeaderFlash{
    height:         620px;
    margin:         0 auto;
    background:     #3585ba url('../images/no-flash-bg.jpg') 50% 0 no-repeat;
}

#HeaderFlash h1{
    text-indent:    -9999px;
    width:          368px;
    height:         208px;
    background:     #3585ba url('../images/no-flash-hero.gif') 0 0 no-repeat;
    margin:         0 0 15px;
}

#HeaderFlash #container{
    width:          960px;
    margin:         0 auto;
    position:       relative;
    padding-top:    20px;
}

#HeaderFlash #container ol{
    width:          368px;
    float:          left;
    margin:         0 50px 0 0;
    list-style:     none;
}

#HeaderFlash #container li{
    border-top:     1px solid rgba(255, 255, 255, 0.2);
    padding:        1em 0 1.5em;
    color:          #d0e4f1;
}

#HeaderFlash #container h2{
    font-size:      11px;
    letter-spacing: 0.1em;
    color:          rgba(255, 255, 255, 0.5);
    margin:         0 0 0.75em;
    text-transform: uppercase;
}

#HeaderFlash #container li h3{
    margin:         0 0 0.25em;
}

#HeaderFlash #container li h3 a{
    font-size:      18px;
    color:          #fff;
}

#HeaderFlash #container li p{
    color:          #d0e4f1;
}

#HeaderFlash #container #warning{
    text-indent:    -9999px;
    width:          430px;
    height:         59px;
    background:     transparent url('../images/no-flash-warning.gif') 0 0 no-repeat;
    position:       absolute;
    top:            116px;
    left:           519px;
}

#warning #link-flash {
    width:          292px;
    height:         21px;
    position:       absolute;
    top:            19px;
    left:           143px;
}

#warning #link-js {
    width:          135px;
    height:         18px;
    position:       absolute;
    top:            42px;
    left:           29px;
}


/** ======================================================
 ** ======================================================
 ** ======================================================  **/

#AboutHealthymagination #LinkList{
    height:         188px;
    background:     #17374E;
    min-width:      960px;
    /** if the background is white, we can use a 2px top margin instead **/
    border-top:     2px solid white;
}

#AboutHealthymagination #LinkList ul{
    margin:         20px auto;
    width:          960px;
    padding:        0;
}

#AboutHealthymagination #LinkList ul li{
    margin:         0;
    padding:        0;
    list-style:     none;
    float:          left;
    margin-right:   20px;
}

#AboutHealthymagination #LinkList ul li:last-child{
    margin-right:   0;
}

#AboutHealthymagination #LinkList ul li img{
    clear:          both;
    display:        block;
    margin-bottom:  8px;
}

#AboutHealthymagination #LinkList ul li a{
    color:          white;
    font-size:      13px;
    font-weight:    bold;
}

#AboutHealthymagination #LinkList ul li span{
    display:        block;
    width:          172px;
    font-size:      11px;
    color:          #bac3ca;
}

/** ======================================================
 ** ======================================================
 ** ======================================================  **/

#AboutHealthymagination #TabBlocks {
    width:          960px;
    margin:         0 auto;
    clear:          both;
}

#AboutHealthymagination .sideLinkBlock {
    width:          280px;
    height:         auto;
    float:          left;
    margin:         20px 0 0 20px;
}

#AboutHealthymagination .sideLinkBlock ul li{
    margin:         0;
    padding:        0;
    list-style:     none;
    line-height:    18px;
}

#AboutHealthymagination .sideLinkBlock ul{
    padding:        0;
    list-style:     none;
    margin:         0 0 40px 0px;
}
#AboutHealthymagination .sideLinkBlock ul li a{
    color:          #97C1DF;
    font-size:      13px;
}

/** ======================================================
 ** ======================================================
 ** ======================================================  **/

#AboutHealthymagination .fromDataBlock {
    width:          320px;
    height:         auto;
    background:     #FAFAFA url('../images/tmpLines.gif') no-repeat;
    float:          left;
    margin-top:     -10px;
    position:       relative;
    min-height:     310px;
}

#AboutHealthymagination .fromDataBlock h3 {
    width:          auto;
    display:        block;
    height:         56px;   /** 60px - 4px border top **/
    padding-left:   18px;
    font-size:      18px;
    line-height:    55px;
    border-bottom:  1px solid #D9DEE2;
    border-left  :  1px solid #D9DEE2;
    background:     #FFF;
    position:       relative;
}

#AboutHealthymagination .fromDataBlock h3 .cufon-vml{
        margin: 21px 0 21px 0;
}

/** Firefox 2.0 hack **/
/*#AboutHealthymagination .fromDataBlock h3, x:-moz-any-link {
    line-height:    55px;
}

#AboutHealthymagination .fromDataBlock h3, x:-moz-any-link, x:default {
    line-height:    60px;
}*/

#AboutHealthymagination .fromDataBlock#FromTheBlog h3 {
    color:          #F56803;
    border-top:     4px solid #F56803;
}

#AboutHealthymagination .fromDataBlock#FromTheBlog a,
#AboutHealthymagination .fromDataBlock#FromTheBlog * a {
    color:          #F27C1D;
}

#AboutHealthymagination .fromDataBlock#FromTwitter {
    width:          321px;
}

#AboutHealthymagination .fromDataBlock#FromTwitter h3 {
    color:          #008DF1;
    border-top:     4px solid #008DF1;
    border-right:   1px solid #D9DEE2;
}


#AboutHealthymagination .fromDataBlock#FromTwitter a,
#AboutHealthymagination .fromDataBlock#FromTwitter * a {
    color:          #5989CF;
}

#AboutHealthymagination .fromDataBlock ul {
    margin:         15px 20px 20px 20px;
    padding:        0;
}

#AboutHealthymagination .fromDataBlock ul li {
    margin:         0 0 23px 0;
    padding:        0;
    list-style:     none;
}

#AboutHealthymagination .fromDataBlock ul li span {
    /** This is date **/
    display:        block;
    text-transform: uppercase;
    font-weight:    bold;
    color:          #BEBEBE;
    font-size:      10px;
    margin-bottom:  0.5em;
}

#AboutHealthymagination .fromDataBlock ul li h4 {
    font-size:      13px;
    margin-bottom:  0.25em;
}

#AboutHealthymagination .fromDataBlock ul li p {
    font-size:      11px;
    color:          #999;
    line-height:    1.6;
}

#AboutHealthymagination .fromDataBlock ul li p a{
    font-size:      11px;
}


/** ======================================================
 ** ======================================================
 ** ======================================================  **/
 
 
.home-footer{
    height:         auto;
    padding-bottom: 3em;
}
