/* 
    Document   : home
    Created on : Oct 17, 2011, 5:25:22 PM
    Author     : christopher.avendano
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

#search INPUT#search_submit{
    border: 0;
}
/*
    updated sets of CSS  01-29-2013
 */
/* Left side green farm character */
div#forumCharacterContainerHome{
    width: 145px;
    height: 300px;
    float: left;
    display: block;
    margin: 70px auto 0 48px;    
}
div#forumCharacterContainerHome img{
    margin-top: 50px;
    height: 305px;
}

/* Right side container here */
div#homeRightContainer{
    width: 760px;
    float: left;
}
/*
 * The bubble dialogs will be placed here
 */
div#bubbleContainerHome{
    height: auto;
    width: 646px;
    clear: both;
    margin: 30px 0 25px 22px;
    float: left;
}
div#bubbleContainerHome div.top{
    height: 7px;
    background: url('../images/greenFarmGirl/bgBubbleHomeTop.png') center center no-repeat transparent;
}
div#bubbleContainerHome div.middle{
    background: url("../images/greenFarmGirl/bgBubbleHomeMid.png") center center repeat-y transparent;
    padding: 20px 0px;
    height: auto;
}
div#bubbleContainerHome div.middle p{
    font-size: 12px;
    margin: 0 20px !important;
}

div#bubbleContainerHome div.bottom{
    background: url("../images/greenFarmGirl/bgBubbleHomeBot.png") no-repeat center center transparent;
    height: 38px;
}

div#hottestIssuesContainer{
    width: 720px;
    height: auto;
    margin: 10px auto;
    clear: both;    
}

div#gameIssuesContainer{
    width: 690px;
    height: 590px;
    clear: both;
    float: left;
    margin: 10px 22px;
    
}
div#gameIssuesContainer div.overflow
{
    width: 690px;
    height: 560px;
    overflow: auto;
    overflow-x: hidden;
}
div#hottestIssuesContainer h2,
div#gameIssuesContainer h2,
div#mainHomeList h2{
    font-size: 12px;
    margin: 5px 0px;
}

/*
    main home list
 */
 
div#mainHomeList{
    height: auto;
    width: 695px;
    margin: auto;
    clear: both;
    float: left;
    margin: 10px 18px;
}


div#mainHomeList ul{
    width: inherit;    
    padding: 0;
    list-style: none;
    text-align: center;
    color: #E5E5E5;
    margin-left: -3px;
}
div#mainHomeList ul li{
    /*    float: left;*/
    height:67px;
    width: 224px;
    margin:0px 0px 5px;
    font-size: 12px;
    font-weight: bold;
    display: inline-block;

    background: url('../images/btnMain.png') no-repeat center center;
}
div#mainHomeList ul li:hover{
    cursor: pointer;
    /*    text-decoration: underline;*/
    background: url('../images/btnMain_active.png') no-repeat center center;
}
div#mainHomeList ul li a{
    height: 100%;
    width: 100%;
    display: table;
    color: inherit;
    font-size: 13px;
    opacity:0.8;
    filter:alpha(opacity=80); /* For IE8 and earlier */
}
div#mainHomeList ul li:hover a{
    opacity:1;
    color: #0096DB !important;
    filter:alpha(opacity=100); /* For IE8 and earlier */
}
div#mainHomeList ul li a span {

    display: table-cell;
    width:175px;
    height: 41px;
    vertical-align: middle;
    text-align: center;
    font-size: 14px;
    padding: 0px 10px 0px 52px;
}

div#mainHomeList ul li img{
    text-decoration: none;
    height:20px;
    margin-top: 5px;
}


div.bottomFiller{
    height: 55px;    
}

.homeNoticeTitle {
    font-weight: bold;
}
.homeNotice {
    font-size:12px;
    margin: 5px 0px !important;
    color: #ff0000;
}
.homeNoticeDescription {
    text-align: justify;
}