/* main styles for index page, use multiples of 8 for all measurements */

body {
	background: #ffff00 url(../images/chocolate.png) repeat fixed;
	width: 1024px; height: 1024px; margin: 0px; padding: 0px;
    font: 18px/27px 'LiberationMonoRegular', arial, sans-serif;
	font-size: 12px; line-height: 1.5em;
	color: #fff;
    }
    
h1 {
    /* mainTitle */ 
    font-size: 1.6em; line-height: 1.2em;	
    color: #F7D358; 
 /*   color: #DC381F; */
    }
    
    h2 {
    /* byline */ 
        font-size: 1.1em; line-height: 1.5em;	  
        color: #fff;  
        margin: -8px 0px 0px 0px;
        }

        h3 {
        /* about */ 
            font-size: 1em; line-height: 1.5em;   
            color: #F7D358;  
            }

            h4 {
            /* time machines */ 
                font-size: 1.1em; line-height: 1.5em;   
                color: #DC381F;  
                margin-bottom: 24px;
                }

.h2yellow {
    color: #F7D358;  
    }

img {
    border: none;
    }
    
p {
    font-size: 1em; line-height: 1.5em;
    color: #fff;
    padding: 6px 0px;
    }
    
a {
    text-decoration: underline;
    color: #fff;
    }
    
    a:hover {
        background-color: #2E2E2E;
        color: #ffff00;
        }

#wrapper {
    margin: 78px 0px 0px 64px;  
    width: 5000px; height: 1024px;
    }

#mainTitle {
    position: absolute; 
    width: 320px;
    margin: 0px;
    text-transform: uppercase;
    }

#about {
    position: absolute;
    width: 320px; 
    margin: 120px 0px 160px 0px;
    }

#index {
    position: fixed;
    width: 180px;
    margin: 120px 24px 160px 600px;
    z-index: 1000;
    }

/* index of machines */

ul.columnIndex {
    list-style: none;
    text-align: left;
    line-height: 2.8em;
    border: 1px solid #7F5217;
    background-color: #2E2E2E;
    padding: 10px 36px;
    }

ul.columnIndex a {
    color: #fff;
    text-decoration: none;
    }

ul.columnIndex a:hover {
    color: #F7D358;
    font-size: 1.2em;

    }


#machines {
    position: absolute;
    margin: 0px 0px 0px 2000px;
    width: 20000px;
    }

/*--Column Styles--*/
ul.columnMachines {
    list-style: none;
    }
    
ul.columnMachines li {
	float: left; 
	display: inline-block;
    width: 420px;
    height: 420px;
    padding: 0px 480px;
    } 

ul.columnMachines img {
    width: 410px;
    } 

ul.columnMachines a, a:hover {
    text-decoration: none;
    color: #DC381F;  
    }

    
.imagecredit {
    font-size: .9em; line-height: 1.4em;
    color: #fff;
    padding: 24px 0px;
    }