@import "comments.css";

#tabBar
{
    height: 15px;
    width:100%;
}

    #tabBar .tabItem
    {
        height:15px;
        width: 48px;
        background: url(../images/portfolio/tab_back.png) no-repeat left top;
        float:left;
        margin-right: 1px;
        text-align: center;
        font-size:10px;
        color:#afafaf;
        cursor: pointer;
        display: none;
    }

    #tabBar .selectedTab
    {
        background: url(../images/portfolio/tab_front.png) no-repeat left top;
        color:black;
        cursor: default;
    }

#images
{
    margin-left:2%;
    width: 351px;
}

    #images #imgHolder
    {
        border:1px solid #577d00;
        width:350px;
        height:200px;
        position: relative;

    }
        #images #imgHolder #fx_layer
        {
            position:absolute;
            width: 100%;
            height: 100%;
            background-color:white;
            z-index:22;
            display: none;
        }

        #images #imgHolder img.projPic
        {
            position: absolute;
            display:none;
            z-index: 10;
        }

    #images #imgHolder #loadHolder
    {
        border: 1px solid #A5EE00;
        height: 5px;
        width: 250px;
        position: absolute;
        top: 93px;
        left: 49px;
        overflow: hidden;
    }
    
        #images #imgHolder #loadHolder #progressBar
        {
            height: 5px;
            background-color:#A5EE00;
            position: absolute;
            width: 0px;
        }

#slideControl_wrap
{
    position: absolute;
    width: 70px;
    bottom: 13px;
    right: 10px;
    z-index:21;
    display: none;
}

    #slideControl_wrap #slideControl
    {
        height: 16px;
        border: 1px solid black;
        
    }
    
    #slideControl_wrap #slideControl .controlBtn
    {
        float: left;
        height: 16px !important;
        width: 34px;
        border: none;
        text-align: center;
        cursor: pointer;
    }


    #slideControl_wrap #slideControl .controlBtn.darkBackgroundF
    {
        cursor: default;
    }
    
#imageDesc_wrap
{
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: 250px;
    font-size: 10px;
    z-index:21;
    display: none;
}

    #imageDesc_wrap #imageDesc
    {
        padding-left: 10px;
        color: white;
    }


#projDetails_wrap
{
    float:right;
    width:50%;
    margin-top:15px;
}

    #projDetails_wrap #projDetails
    {
        height:192px;
    }
    
        #projDetails_wrap #projDetails h3
        {
            font-size: 14px;
            color:#a5ee00;
            font-weight:bold;
            margin-left:15px;
            padding-top:10px;
        }
        
        #projDetails_wrap #projDetails table
        {
            margin-left:25px;
        }
            #projDetails_wrap #projDetails table td
            {
                vertical-align: top;
                font-size: 12px;
                color: white;
            }
            
            #projDetails_wrap #projDetails table td.label
            {
                text-align:right;
                padding-right: 5px;
                color: #517400;
            }

#projDesc
{
    margin-top:22px;
    margin-bottom: 22px;
}

    #projDesc h1
    {
        font-size: 24px;
    }

    #projDesc p
    {
        margin-left:22px;
        font-size: 12px;
    }
    
    #projDesc ul, #projDesc ol
    {
        margin-left: 50px;
        margin-top: 10px;
    }

#projList_wrap
{
    height: 81px;
    width: 100%;
}

    #projList_wrap #leftArrow, #projList_wrap #rightArrow
    {
        width: 16px;
        height: 81px;
        position: absolute;
        top: 0px;
        cursor: pointer;
        z-index:100;
    }
    
    #projList_wrap #leftArrow
    {
        left:0px;
        background: url(../images/portfolio/arrow_left.png) no-repeat left top;
    }
    
    #projList_wrap #rightArrow
    {
        right: 0px;
        background: url(../images/portfolio/arrow_right.png) no-repeat left top;
    }

    #projList_wrap #projListContent
    {
        padding-left:22px;
    }

    #projList_wrap #projListContent a
    {
        margin-left: 10px;
    }

        #projList_wrap #projListContent a img
        {
            margin-bottom: -5px;
            border: 1px solid #517400;
        }

        #projList_wrap #projListContent a.active img
        {
            border: 1px solid white;
        }


.header
{
    text-align: center;
}

    .header span
    {
        width: 130px;
        height: 23px;
        display: block;
        margin: 0 auto;
        margin-bottom: -1px;
        z-index: 10;
        border-bottom: 1px solid #0C0C0C;
    }

    .header span#comm_header
    {
        background: url(../images/comm_header.png) no-repeat left top;
    }

    .header span#projList_header
    {
        background: url(../images/projList_header.png) no-repeat left top;
    }