animation-name: myfirst;

/* Firefox: */
-moz-animation-name: myfirst;
-moz-animation-duration: 18s;
-moz-animation-timing-function:cubic-bezier(1, .13, .30, 1);
/* Safari and Chrome: */

-webkit-animation-name: myfirst;
-webkit-animation-duration: 18s;
-webkit-animation-timing-function:cubic-bezier(1, .13, .30, 1);
/* Opera: */
-o-animation-name: myfirst;
-o-animation-duration: 18s;
-o-animation-timing-function: cubic-bezier(1, .13, .30, 1);

animation-direction:normal;
-moz-animation-direction:normal; /* Firefox */
-webkit-animation-direction:normal; /* Safari and Chrome */
-o-animation-direction:normal; /* Opera */
*/


}

@keyframes myfirst
{
from {opacity: 1;}
to {opacity: 0;}


}

@-moz-keyframes myfirst /* Firefox */
{
from {opacity: 1;}
to {opacity: 0;}
}
@-webkit-keyframes myfirst /* Safari and Chrome */
{
from {opacity: 1;}
to {opacity: 0;}
}
@-o-keyframes myfirst /* Opera */
{
from {opacity: 1;}
to {opacity: 0;}
}


#HomeImage {
position:absolute;
z-index:0;
left:60px;
top: 30px;
width:550px;
height:685px;
background-image:url('http://lukeliberamoore.com/images/_GodChunk/12_LukeLiberaMoore-GodheadUplink-1.jpg');
background-size:110%;
background-position: center, center;
}

#homeCaption {
position: absolute;
bottom: -10px;
left: 10px;
color:white;
font-size: 12px;
}



body {
min-width:900px;
max-height:900px;
list-style:none;
font-family:Verdana, sans-serif;
font-weight:400;
color:silver;
  border-width: 0;
   padding: 0;
   margin: 0;
   font-size: 20px;


}






footer { 
position:fixed;
bottom:2px;
font-size:10px;
right:8px;
z-index:9999999;
color:#aaa;
text-shadow: 2px 2px white;
}



a {
text-decoration:none;
color:silver;


}
a:visited { 
    color:silver;
}

a.hover {
Color:#9999bb;
}


#nametext { 
width:155px;
height:50px;
position:absolute;
left:340px;
top:55px;
z-index:4;
color:silver;
font-size:16px;
line-height:16px;
padding:5px;
} 

#notesontime {
padding-top:40px;}

li {

width:550px;
height:20px;
z-index:9999; 
-webkit-transition:background-color 1s; 
font-size:14px;
margin:2px;
line-height:20px;
display:block;
color:silver;
display: inline;
} 





#sidebar { 
color:silver;
width:300px;
height:1000px;
position:fixed;
top:50px;
left:30px;


animation:name 1s;
-moz-animation:name 1s; /* Firefox */
-webkit-animation:name 1s; /* Safari and Chrome */
-o-animation:name 1s; /* Opera */
} 

#mail {
color:silver;
}
#mail:hover {
Color:#9999bb;
}



#close_button1,#close_button2,#close_button3 {
width:25px;
height:auto;
position:absolute;
bottom:2px;
left:2px; }



.thumbs {
position:relative;
margin:8px;
   padding:5px;
   transition: box-shadow 1s;
-moz-transition: box-shadow 1s; /* Firefox 4 */
-webkit-transition: box-shadow 1s; /* Safari and Chrome */
-o-transition: box-shadow 1s; /* Opera */
}

.bumper {
height:30px;
width:100%;
position:relative;
top: 1100px;
}

.thumbs:hover {
box-shadow: 10px 10px 10px silver;
}







#name {
position:fixed;
left:30px;
top:30px;
     width:5px;
     height:300px;
    word-wrap:break-word;
z-index:9999;


}
.projecttitle {
float:left;
font-weight:400;
font-size:38px;
text-align:center;
opacity:0;
position:relative;
width:100%;
height:100%;
transition: opacity 1s;
-moz-transition: opacity 1s; /* Firefox 4 */
-webkit-transition: opacity 1s; /* Safari and Chrome */
-o-transition: opacity 1s; /* Opera */
padding:0;
margin:0;
border:0;
color:silver;

}



a:hover {
Color:#9999bb;
}

.projecttitle:hover {
opacity:1;
}

h1 {
padding:0;
border:0;
margin:0;}

#contact {
position:absolute;
left:10%;
top:0;
  
z-index:9999;
color:silver;

}




/* HOME-------------*/



#homecenter {
position:absolute;
width:100%;
height:900px;
opacity:1;
}






#archivelist {
position:absolute;
width:750px;
height:320px;
color:none;
left:600px;
top:30px;

}

#homecenter ul li {
display:block;
font-size:22px;
color:silver;
}

#notice {
padding:6px;
font-size:10px;
}