

 
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;}
}





body {
max-width:6000px;
max-height:700px;
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;
}



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:#aaa;
font-size:16px;
line-height:16px;
padding:5px;
} 



li {

width:150px;
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:#aaa;
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 */
} 



#contact_info_container {
position:fixed;
left:40%;
top:10%;
text-align:center;
z-index:999999;
width:300px; 
height:450px;
background-color:#FFF;
border:1px solid gray;
display:none;
padding:10px 10px 10px 20px;
color:#aaa;
font-weight:100;
font-size:16px;
}




#white {
width:300px;
height:300px;
background-color:#FFF;
position:absolute;
right:0;
bottom:0;
z-index:9999999;
}

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



#wrapper{
   position: absolute;
   top:10px;
   left: 360px;
   width: 725px;
  height:auto;
overflow:auto;
   margin-bottom: 20px;
   background-color: white;
}

.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: 1200px;
}

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




.fill{
   float: left;
   max-height:100%;
   background-color:white;
	
}


#name {
position:absolute;
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:#DAF7A6;
  text-shadow:
   -1px 1px black;  
}


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


#contact:hover {
Color:#9999bb;
}

a:hover {
Color:#9999bb;
}

.projecttitle:hover {
opacity:1;
}





#contact {
position:absolute;
left:30px;
bottom:18%;
     width:5px;
     height:100px;
    word-wrap:break-word;
z-index:9999;
color:silver;

}



#context{

position:absolute;
bottom:0;
font-size:8px;
}


#underconstruction {

position:absolute;
left:45%;
top:120px;
width:270px;
text-align: center;
}



#notice {
position:absolute;
left:60%;
top:10px;
width:270px;
text-align: center;
}

a:hover {
color:#9999bb;
}

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



#underline {
position:relative;
width:500px;
height:400px;
	left:420px;
	top:350px;
	background-color:yellow;
	opacity:.4;
}




#archivelist {
position:relative;
width:700px;
height:200px;
top:20px;
left:430px;
}

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






#dumpster1{
position:absolute;
left:250px;
top:30px;
display:in-line;
width:500px;
height:750px;
background-image:url('http://lukeliberamoore.com/images/_Dumpster/TrashHoist_mid.jpg');
background-size:100%;

}

#dumpster3 {
position:absolute;
left:1000px;
top:30px;
display:in-line;
width:500px;
height:750px;

	background-image:url('http://lukeliberamoore.com/images/_Dumpster/pinkTotem_mid.jpg');
	background-size:100%;

}


#dumpster6 {
position:absolute;
left:1750px;
top:30px;
display:in-line;
width:500px;
height:750px;
	background-image:url('http://lukeliberamoore.com/images/_Dumpster/FleshyCage1_mid.jpg');
	background-size:100%;

}

	#dumpster5 {
position:absolute;
left:2500px;
top:30px;
display:in-line;
width:500px;
height:750px;
	background-image:url('http://lukeliberamoore.com/images/_Dumpster/ScaffoldRelic1_mid.jpg');
	background-size:100%;

}

#dumpster10 {
position:absolute;
left:3200px;
top:30px;
display:in-line;
width:520px;
height:750px;
	background-image:url('http://lukeliberamoore.com/images/_Dumpster/Offering2_mid.jpg');
	background-size:100%;

}

	#dumpster5a {
position:absolute;
left:4400px;
top:30px;
display:in-line;
width:500px;
height:750px;
	background-image:url('http://lukeliberamoore.com/images/_Dumpster/finalTotem_mid.jpg');
	background-size:100%;

}




#dumpster7 {
position:absolute;
left:5400px;
top:110px;
display:in-line;
width:800px;
	height:525px;
	background-image:url('http://lukeliberamoore.com/images/_Dumpster/dumpstershelter_mid.jpg');
	background-size:100%; 
	}
















#bumper1 {
position:absolute;
left:7000px;
bottom:50%;
width:20px;
padding:50px;
    word-wrap:break-word;
z-index:9999;


}