﻿#splash
{
    position: relative;
    width: 780px;
    height: 280px;    
    background-color: #666666;
    background: url(../img/splash_page_bg.png) no-repeat;
    color: White;
}
#splash .view
{
    position: relative;
    float: left;
    width: 490px;
    height: 280px;
}
#splash .view .thumbnail
{
    height: 237px;
    margin: 10px 0 0 10px;
}
#splash .view .arrow
{
    float: right;
    margin: 4px 0 0 0;    
}
#splash .view ol
{
	position: absolute;
	left: 10px;
	bottom: 4px;
    list-style: none;
}
#splash .view ol li
{
    float: left;
    margin-right: 7px;
}
#splash .view ol li a
{
    display: block;
    width: 24px;
    height: 24px;
    cursor: pointer;
}
#splash .view ol li a.button1
{
    background-image: url(../img/pn_1.png);
    background-position: left top;
}
#splash .view ol li a.button1:hover
{
    background-position: left bottom;
}
#splash .view ol li a.active
{
    background-position: left bottom !important;
}
#splash .view ol li a.button2
{
    background-image: url(../img/pn_2.png);
    background-position: left top;
}
#splash .view ol li a.button2:hover
{
    background-position: left bottom;
}
#splash .view ol li a.button3
{
    background-image: url(../img/pn_3.png);
    background-position: left top;
}
#splash .view ol li a.button3:hover
{
    background-position: left bottom;
}
#splash .view ol li a.button4
{
    background-image: url(../img/pn_4.png);
    background-position: left top;
}
#splash .view ol li a.button4:hover
{
    background-position: left bottom;
}
#splash .view ol li a span
{
    display: none;
}
#splash .details
{
    float: right;
    width: 250px;
    height: 240px;
    background: url(../img/projects_details_bg.png) no-repeat left top;
    padding: 20px;
}
#splash .details .button_container
{
    position: absolute;
    line-height: 26px;
    display: block;
    right: 20px;
    bottom: 15px;
}