/* General Stuff - All of the colors and things are defined here. */

body {
 background:#fff url(images/background.jpg) top center no-repeat;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 font-size:75%;
 color:#000;
 margin:0 0 0 0;
 padding:0 0 0 0;
 text-align:center;
}

a:link {
 text-decoration:underline;
 color:#000;
}

a:visited{
 font-weight:bold;
 text-decoration:underline;
 color:#003300;
}

a:hover {
 font-weight:none;
 text-decoration:none;
 color:#00cc00;

}

a:active {
 text-decoration:none;
 color:#AD00AD;
}

body h1 {
 font-size:13pt;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 color:#00cc00;
 padding-left:5px;
 padding-bottom:15px;
}

body h2 {
 font-size:13pt;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 color:#000;
 padding-left:10px;
 padding-bottom:0;
 margin:10px 0;
}

body h3 {
 font-size:10pt;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 color:#003300;
}

img {
 border:0;
}

/* Placement Stuff - This is where all of the basic wrapper divs are defined. */

#container {
 width:1000px;
 height:610px;
 background:url(images/) top right no-repeat;
 margin-top:0;
 margin-bottom:0;
 margin-right:auto;
 margin-left:auto;
 padding:0 0 0 0;
 text-align:left;
}

#content {
 width:980px;
 height:367px;
 background:#fff url(images/content.jpg) top left no-repeat;
 margin:0 0 0 0;
 padding:0 10px 0 10px;
 float:left;
}

#header {
 top:0;
 height:109px;
 width:1000px;
 margin:0 0 0 0;
 padding:0 0 0 0;
 background:url(images/header.jpg) no-repeat center;
}

#footer {
 width:1000px;
 height:108px;
 background:url(images/footer.jpg) no-repeat center;
 font-size:90%;
 text-align:cener;
 margin:0 0 0 0;
 padding:0 0 0 0;
 float:left;
}

#nav {
 /*background:#ccc;*/
 width:1000px;
 height:26px;
 padding:0;
 margin:0;
}

#nav a {
 display:block;
 line-height:26px;
 color:black;
 text-decoration:none;
 font-weight:bold;
 float:left;
 padding:0 10px 0 10px;
 margin:0;
}

#nav a:hover {
 color:#fff;
 background:#000;
}

#home {

}

#resume {
 height:350px;
 overflow:auto;
 margin:10px 0 0 0;
}

/*Gallery*/

.playbox img {border:1px solid #000; margin:5px;}

.lightbox {width:100%; height:100%; display:none; position:fixed; left:0; top:0; z-index:1000; padding:0 0 0 0; font-family:arial, sans-serif;}
.lightbox .light {width:100%; height:100%; position:fixed; z-index:-1; top:0; left:0; background:#fff; opacity:0.5; filter: alpha(opacity=50);
 text-align:center;}
/* this is for IE6 . If you want to have the lightbox scroll with the page in ALL browsers then remove the * html */
/** html*/ .lightbox {position:absolute;}
/** html*/ .lightbox .light {position:absolute; height:5000px;}

.lightbox .box {width:1000px; /*background:#000; border:10px solid #fff; border-width:10px;*/ margin:0 auto; padding:10px 10px 20px 10px; position:relative; overflow:hidden;
/*-o-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);*/
}
.lightbox .box img {display:block; margin:0 auto; position:relative;}
.lightbox .box p {width:1000px; padding:20px 0; margin:0; color:#000; text-align:left; font-size:12px;}
.lightbox .functions {position:absolute; bottom:0; left:0; height:30px; width:1000px; /*background:#fff;*/ text-align:center;}
.lightbox .box a {color:#000; font-weight:bold; font-size:25px; text-decoration:none; text-align:center; font-family:"times new roman", serif; padding:0 20px;}
.lightbox .box a.closebox:hover {color:#f00;}
.lightbox .previous:hover,
.lightbox .next:hover {color:#080;}

.lightbox .box2 {width:500px; background:#444; border:10px solid #fff; margin:0 auto; padding:10px; position:relative;
-o-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-icab-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-khtml-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
.lightbox .box2 h3 {color:#fff; font-size:22px; padding:10px 0; margin:0;}
.lightbox .box2 p {width:500px; padding:5px 0; margin:0; color:#fff; text-align:left; font-size:12px; line-height:18px;}
.lightbox .box2 a {color:#fc0;}
.lightbox .box2 a:hover {color:#ff0; text-decoration:none;}
.lightbox .box2 a.closebox {display:block; width:25px; height:30px; background:#444; color:#fff; font-weight:bold; font-size:26px; text-decoration:none; text-align:center; position:absolute; right:-1px; bottom:-1px; border:1px solid #fff;}
.lightbox .box2 a.closebox:hover {color:#f00;}

@-webkit-keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% { 
		opacity:100;
	}
}

#p001:target {display:block;}
#p002:target {display:block;}
#p003:target {display:block;}
#p004:target {display:block;}
#p005:target {display:block;}

#p006:target {display:block;}
#p007:target {display:block;}
#p008:target {display:block;}
#p009:target {display:block;}
#p010:target {display:block;}

#p011:target {display:block;}
#p012:target {display:block;}
#p013:target {display:block;}
#p014:target {display:block;}
#p015:target {display:block;}

#p016:target {display:block;}
#p017:target {display:block;}
#p018:target {display:block;}
#p019:target {display:block;}
#p020:target {display:block;}

#p021:target {display:block;}
#p022:target {display:block;}
#p023:target {display:block;}
#p024:target {display:block;}
#p025:target {display:block;}

#p026:target {display:block;}
#p027:target {display:block;}
#p028:target {display:block;}
#p029:target {display:block;}
#p030:target {display:block;}

#p031:target {display:block;}
#p032:target {display:block;}
#p033:target {display:block;}
#p034:target {display:block;}
#p035:target {display:block;}

#p001:target .box img,
#p002:target .box img,
#p003:target .box img,
#p004:target .box img,
#p005:target .box img,
#p006:target .box img,
#p007:target .box img,
#p008:target .box img,
#p009:target .box img,
#p010:target .box img,
#p011:target .box img,
#p012:target .box img,
#p013:target .box img,
#p014:target .box img,
#p015:target .box img,
#p016:target .box img,
#p017:target .box img,
#p018:target .box img,
#p019:target .box img,
#p020:target .box img,
#p021:target .box img,
#p022:target .box img,
#p023:target .box img,
#p024:target .box img,
#p025:target .box img,
#p026:target .box img,
#p027:target .box img,
#p028:target .box img,
#p029:target .box img,
#p030:target .box img,
#p031:target .box img,
#p032:target .box img,
#p033:target .box img,
#p034:target .box img,
#p035:target .box img,
#p036:target .box img {
	-webkit-animation-name: fadeIn; 
	-webkit-animation-duration: 1.5s; 
}