/**
 * Project list view
 */
ol.project-list {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
    ol.project-list li.project-node {
        border-bottom: 1px solid #d1d1d1;
        padding: 23px 23px 23px 0px;
        margin-bottom: 23px;
        position: relative;
        background: url(../images/modal-bg.jpg) 0px 50% repeat-x;
    }
        
        ol.project-list li.project-node img {
            margin: 0px;
            padding: 0px;
        }
        
        ol.project-list li.project-node div.image-wrapper {
            float: left;
            padding-left: 23px;
            margin-right: 23px;
            padding-right: 24px;
            background: url(../images/project-split.gif) no-repeat 100% -35px;
            min-height: 220px;
            height: auto !important;
            /height: 220px;
           
        }
           ol.project-list li.project-node div.image-wrapper div.image-highlight {
               clear:both;
           }
               ol.project-list li.project-node div.image-wrapper div.image-highlight img {
                   /* border is not applied while working with reflection */
               }
           ol.project-list li.project-node div.image-wrapper ol.image-list {
               list-style: none;
               margin: 0px;
               padding: 0px;
               height: 23px;
               margin-bottom: 5px;
           }
           ol.project-list li.project-node div.image-wrapper ol.image-list li {
               float: left;
               margin: 0 2px 0 0;
               padding: 0px;
               background: #d1d1d1;
               height: 23px;
               overflow: hidden;
               border: 1px solid #d1d1d1;
           }
               ol.project-list li.project-node div.image-wrapper ol.image-list li div {
                   display: table-cell;
                   vertical-align: middle;
                   text-align: center;
                   height: 21px;
               }
           ol.project-list li.project-node div.image-wrapper ol.image-list img {
               /*border: 1px solid #d1d1d1;*/
               margin-left: auto;
               margin-right: auto;
               display: block;
           }
        ol.project-list li.project-node h3 {
        }
        ol.project-list li.project-node div.project-intro_text {
        }
        ol.project-list li.project-node a.btn-readmore {
            margin: 0;
            padding-top: 5px;
            display: inline-block;
        }
        ol.project-list li.project-node canvas {
            margin-top: 1px;
        }
        ol.project-list li.project-node .details {
             margin-left: 240px; /* change this value to match the width of the featured image and the margin on either side of it */
        }

    ol.project-list h3 {
        color: #000;
        font-size: 16px;
    }
    
    ol.project-list h3.category-title {
        font-size: 12px;
        margin:  0 0 0px 0;
        padding: 0px;
        color: #000;
    }
    
    ol.project-list .meta {
        padding-bottom: 10px;
    }
        ol.project-list .meta span.date {
             color: #62afe4;
             font-size: 9px;
             font-weight: bold;
             margin-top: 3px;
             background: url(../images/icon-bullet.gif) no-repeat 0% 50%;
             padding-left: 19px;
         }
    
/**
 * Project view
 */
#project-feature {
}
    #project-feature h1 {
        font-size: 16px;
        padding-bottom: 10px;
        margin-bottom: 10px;
        letter-spacing: auto;
        border-bottom: 1px solid #dedede;           
    }
    #project-feature h3 {
        font-size: 12px;
        margin: 0px;
        padding: 0px;
        color: #000;
    }

#reference {
    float: left;
}

#reference a {
    color: #62afe4;
    font-size: 9px;
    font-weight: bold;
    display: block;
    margin-top: 3px;
    background: url(../images/icon-bullet.gif) no-repeat 0% 50%;
    padding-left: 21px;
}

#meta {
    float: right;
}

#meta span.date {
    color: #62afe4;
    font-size: 9px;
    font-weight: bold;
    display: block;
    margin-top: 3px;
    text-align: right;
    display: inline-block;
    background: url(../images/icon-bullet.gif) no-repeat 0% 50%;
    padding-left: 19px;
    white-space: nowrap;
}

#project-feature-content {
    margin-top: 10px;
}

    #project-feature div.image-wrapper {
        margin-top: 10px;
        margin-right: 20px;
        width: 350px;
        /*
        overflow: hidden;
        */
        float: left;
    }
    ol#image-list {
        clear: both;
        margin: 10px 0px;
        padding: 0px;
        width: 370px;
    }
        ol#image-list li {
            display: block;
            float:left;
            margin-right: 5px;
            margin-bottom: 3px;
            overflow: hidden;
            border: 1px solid #CECECE;
            background: #d1d1d1;
        }
            ol#image-list li div {
                display: table-cell;
                vertical-align: middle;
                text-align: center;
            }
                ol#image-list li img {
                    display: block;
                    cursor: pointer;
                    margin: 0 auto;
                }

#project-feature div.image-highlight {
    border: 1px solid #CECECE;
    background: #d1d1d1;
    overflow: hidden;
}
    #project-feature div.image-highlight div {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }
    ol.project-list .reflect-master {
        display: block;
        zoom: 1;
        margin-left: 1px;
    }
        ol.project-list .reflect-master img.reflected {
            border: 1px solid #CECECE !important;
            margin-left: -1px;
        }