/*:::::::: Overall, global styles :::::::*/

html{

}

/*this is just here for the demo version.  In my final implementation, the overal styles are handled separately */
body{
	font-family:"Trebuchet MS", "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	color:#666666;
}


/* prefix EVERYTHING with #appTrack to distinguish from the rest of the application */

#appTrack{
	font:75%/100% "Trebuchet MS", "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	color:#666666;
	margin:10px 0;
	padding:0;
	/*min-width:1210px;*/
}

#appTrack h1, #appTrack h2, #appTrack h3, #appTrack ul, #appTrack li, #appTrack a, #appTrack p{
	margin:0;
	padding:0;
}

#appTrack p{
	margin:20px;
	text-align:justify;
}

#appTrack a{
	text-decoration:none;
	color:#3784B9;
}

#appTrack a:hover{
	color:#316589;
	text-decoration:underline;
}

#appTrack a img{
	border:0;
}

#appTrack br.clear{
	clear:both;
}

#appTrack input, #appTrack textarea, #appTrack select{
    font-family: "Trebuchet MS", "Lucida Grande", "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
	color:#666666;
}

#appTrack textarea{
    font-size:95%;
}


/*:::::::: Styles overall page layout :::::::*/
#appTrack #navigation{
    float:left;
    width:150px;
    margin-top:30px;
    margin-left:15px;
}

#appTrack #itemListHolder{
    background:#ffffff url(/appTrack/images/background.gif) bottom right no-repeat;
    border:5px solid #3784B9;
    padding:5px;
    float:left;
}


/*:::::::: Styles for the navigation :::::::*/

#appTrack #navigation ul{
    list-style-type:none;
}

    #appTrack #navigation ul li{
        padding-left:5px;
        margin-top:8px;
    }

    #appTrack #navigation ul #newItem{
        padding:10px 0 10px 0;
        font-weight:bold;
    }

    #appTrack #navigation ul #admin{
        padding:450px 0 10px 0;
        font-weight:bold;
    }


    #appTrack #navigation li.selected{
        background:#ffffff url(/appTrack/images/borderColor.gif) top left repeat-y;
    }

#appTrack #navigation .subNav{
    margin-left:15px;
    font-style:italic;
}

    #appTrack #navigation .subNav li{
        display:block;
        margin:0;
    }

    #appTrack #navigation .subNav li a{
        display:block;
    }

    #appTrack #navigation .subNav li.selected{
        background:#3784B9;
    }

        #appTrack #navigation .subNav li.selected a{
            color:#ffffff;
        }


/*:::::::: Styles for the user info :::::::*/

#appTrack .logonBox{
    margin-left:25px;
    font-weight:bold;
    width:890px;
    height:40px;
    color:#3784B9;
}

    #appTrack .logonBox form{

    }

        #appTrack .logonBox form input{
            width:80px;
            margin-left:5px;
        }

        #appTrack .logonBox form label{
            padding-left:30px;
        }



/*:::::::: Styles for the primary list body :::::::*/

#appTrack #listItems{
    list-style-type:none;
    background:transparent;
    padding:10px;
    height:500px;
    overflow:auto;
    width:800px;
}

    #appTrack #listItems li{
        margin-bottom:2px;
        cursor:pointer;
        clear:both;
    }


    #appTrack #listItems li:hover{
        background:#f7f7f7;
        color:#000000;
    }

        #appTrack #listItems .priority{
            display:block;
            float:left;
            width:70px;
        }

        #appTrack #listItems .userName{
            display:block;
            float:left;
            width:100px;
        }

        #appTrack #listItems .shortDescription{
            display:block;
            float:left;
            min-width:400px;
            max-width:400px;
        }

        #appTrack #listItems .createDate{
            display:block;
            float:left;
            width:80px;
        }

        #appTrack #listItems .status{
            width:0px;
        }

        #appTrack .titleRow{
            font-weight:bold;
        }


/*:::::::: Styles for the individual list items :::::::*/
#appTrack #statusPieces{
    margin-top:20px;
    padding-top:10px;
    width:250px;
    background:#ffffff url(/appTrack/images/borderColor.gif) top right repeat-y;
    float:left;
}

    #appTrack #statusPieces label{
        width:130px;
        float:left;
        display:block;
        text-align:right;
        padding:3px 12px 0 0;
    }

    #appTrack #statusPieces select{
        width:100px;
        margin:0 0 9px  0;
    }

#appTrack #commentPieces{
    margin-top:20px;
    margin-left:20px;
    max-width:500px;
    float:left;
}

    #appTrack #commentPieces textarea{
        width:500px;
        height:100px;
        scroll:auto;
    }

    #appTrack #commentPieces #comments p{
        margin:50px 0 0 0;
        border-left:1px solid #3784B9;
        padding-left:8px;
    }

    #appTrack #commentPieces #comments p:hover{
        background:#f7f7f7;
    }

        #appTrack #commentPieces #comments p span{
            float:right;
            margin:0;
            font-style:italic;
            font-size:.9em;
        }


/*:::::::: generic, standalone classes :::::::*/
#appTrack  .warning{
    color:#951A1A;
}

