* { padding: 0; margin: 0; }

body {
 font-family: 'lucida grand', verdana, Arial, Helvetica, sans-serif;
 font-size: 62.5%;
 color: #ffffff;
 background-color: #093333;
 background-image: url(../images/bg_index.gif); 
 background-repeat: no-repeat;
 background-position:25% 0; 
 text-align: center;
}


#wrap { 
 margin: 0px auto;
 width: 650px;
 padding: 0px 5px 0px 5px;
 top:80px;
}

#chinese{
 width: 120px;
 height: 50px;
 float: right;
 margin: 0 10px 30px 0;
 }

#chinese img{
 border: 0;
 }

#header {
 color: #333;
 width: 650px;
 height: 160px;
 float: left;
 padding: 5px;
 margin: 0px;
}

/*top*/
h2{
 padding-top: 50px;
 color:#f8ed37;
 font-size: 1.5em;
 font-weight: lighter;
 }

#top {
 position: relative;
 width: 480px;
 margin-right:5px;
 float: left;
 font-size: 1.1em;
 line-height: 180%;
 color: #ffffff;
 text-align: left;
 background-image: url(../images/welcome.png);
 background-repeat: no-repeat;
 background-position: 0 0;
 }
 
/*navigation*/
#navi {
 position: relative;
 margin-top: 25px;
 width: 140px;
 float: left;
 padding: 5px 15px 0px 10px;
 }
 
#navi img{
 padding-left:15px;}

#navi ul li{
 margin: 5px;
 padding:0px;
 list-style-type: none;
 float: right;
 width: 120px;
 border: #f8ed37 1px solid;
 color:#ffffff;
 font-size: 1.12em;}
 
#navi ul li a{
 text-decoration: none;
 color:#ffffff;
 }
 
#navi ul li a:link, a:visited {
 text-decoration: none;
 color:#ffffff;
 }

#navi ul li a:hover {
 text-decoration: none;
 color: #f8ed37;
 }
 
/*column1*/
#col1{ 
 top:240px;
 margin: 25px 5px 5px 0px;
 padding: 5px;
 width: 450px;
 float: left;
 background-image: url(../images/bg_snap.jpg);
 background-repeat: no-repeat;
 text-align:left;
 }
 
#col1 table{
 margin-top: 40px; }

#col1 img{
 border: 0px;}

.snap_cap{
 color: yellow;

}

/*column 2*/
#col2 { 
 top:240px;
 margin: 25px 5px 5px 0px;
 padding: 5px;
 width: 150px;
 display: inline;
 float: right;
} 

#credit, #contact_me{
 width: 140px;
 text-align: left;
 color:#FDFDC4;
 font-size: 1.1em;
 line-height: 1.5em;
 padding-left:20px; 
 }
 
#credit a:link, a:visited {
 text-decoration: none;
 color:white;
 }
 
#credit a:hover {
 text-decoration: none;
 color:#99cc33;
 }
 
#credit img{
 padding:10px 0 10px 0;
 }

#contact_me{
 margin-top: 20px; 
 margin-bottom: 10px;
 }

#contact_me a img, h3 a img{
 border: 0;
 }
 
#contact_me a:hover, h3 a:hover img {
 border-bottom: yellow 1px solid; 
 }

/*footer*/
#footer { 
 background-image: url(../images/bg_link.gif);
 height: 320px;
 clear: both;
 color: #333;
 margin: 50px auto;
 padding-top: 15px;
}

#link_wrap{
 height:220px;
 background-color: #225455;
 background-image: url(../images/bg_link_wrap.jpg);
 background-repeat: no-repeat;
 background-position: bottom right;
 margin-bottom:20px;
}

#link_ttl{
 width: 740px;
 height: 50px;
 margin: 0px auto;
 background-image: url(../images/link_ttl.jpg);
 background-repeat: no-repeat;
 background-position: 0px 15px;
 }
 
#link_cap{
 color:#ffffff;
 text-align: left;
 font-size: 1.1em;
 padding: 18px 10px 0px 125px;
 }
 
#link{
 width: 740px;
 height:120px;
 margin: 10px auto;
 padding:5px 5px 5px 15px;
 border-top: #093333 solid 2px; 
 
}

h3{
 font-variant: small-caps;
 font-size: 1.4em;
 font-weight: bold;
 line-height: 1.8em;
 padding-left: 2px;
 color: #093333;
 }

/*link catagories block hover effect*/
#catagory{
 width:180px;
 float:left;
 text-align:left;
 color:#fff;
 }
 
#catagory ul li{
 margin:0;
 padding:0;
 border-top: #093333 dashed 1px; 
 list-style-position: inside;
 list-style-type:none;
 line-height: 2em;
 
 }
 
#catagory ul li img{
 margin: 1px 5px 0px 2px;
 padding: 0px;
 border: white 1px solid;
 }

#catagory li a{
 text-decoration:none;
 color:#ffffff;
 display: block;
 padding:3px;
}

*html #catagory li a{
 width:180px;}
 
#catagory li a:hover{
 background: #093333;
}
 
.copyright{
 color:black;
 font-weight:bold;
 }
 
#getfirefox{
 margin-top: 4em;
 float:right;
 padding: 2px;
}

#getfirefox img{
 padding-top: 2px;
 padding-left: 5px;}