html,body{
    height:100%;
    margin:0;
    padding:0;
		font-size: 12px;
	font-family: arial, helvetica, sans-serif;
	}




#contentdiv {
	position:absolute;
	top: 50%;
	left: 50%;
	width:799px;
	height:498px;
	margin-top: -249px; /*set to a negative number 1/2 of your height*/
	margin-left: -400px; /*set to a negative number 1/2 of your width*/
	border: 2px solid #000000;
	background-color: #d0d2d5;
	background-image: url(http://www.natalieagee.com/images/brickbackground.jpg);
     background-repeat: repeat-y;
}

#fullscreencontentdiv {
	position:absolute;
	top: 50%;
	left: 50%;
	width:799px;
	height:498px;
	margin-top: -249px; /*set to a negative number 1/2 of your height*/
	margin-left: -400px; /*set to a negative number 1/2 of your width*/
	border: 2px solid #000000;
	background-color: #d0d2d5;
	background-image: url(http://www.natalieagee.com/images/palebrickbg.jpg);
     background-repeat: repeat-y;
}



.slideshowwindow {
position:absolute;
	top: 42px;
	left: 71px;
	float: left;
	margin:0; padding:0;
	}


.window {
position:absolute;
	top: 42px;
	left: 71px;
	float: left;
	margin:0; padding:0;
	}


#info {
position:relative;
	top: 27px;
	left: 411px;
	float: left;
	width: 320px;
	height: 352px;
	overflow: auto;
	margin-left: 10px; margin-right: 10px; padding-right:20px; padding-left:20px;

		background:transparent url(http://www.natalieagee.com/images/1x1_transparentWhite.png) ;

	 font-size: 1.2em; color: #821611; font-family:arial;
scrollbar-arrow-color: #821611;
scrollbar-3dlight-color: #DCC2BE;
scrollbar-darkshadow-color: #BE7470;
scrollbar-face-color: #fff;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #d0d0d0;
scrollbar-track-color: #f4f4f0;
		}


#info a:link {text-decoration: underline; color: #7575FF}
#info a:Visited {text-decoration: underline; color: #A142FF}
#info a:hover {text-decoration: underline; color: #bb507c}
#info a:active{text-decoration: underline; color: #bb507c}

#thumbs a:link {text-decoration:none; color: #7575FF}
#thumbs a:Visited {text-decoration: none; color: #A142FF}
#thumbs a:hover {text-decoration: none; color: #bb507c}
#thumbs a:active{text-decoration: none; color: #bb507c}

#fullpage .projectthumbs a {text-decoration:none;}
#fullpage .projectthumbs a:link {text-decoration:none; color: #7575FF;}
#fullpage .projectthumbs a:Visited {text-decoration: none; color: #A142FF}
#fullpage .projectthumbs a:hover {text-decoration: none; color: #bb507c}
#fullpage .projectthumbs a:active{text-decoration: none; color: #bb507c}

#fullpage .projectthumbs .projectthumb{margin-bottom:10px;}


#fullpage {
position:absolute;
overflow: none;
	top: 46px;
	left: 78px;
	float: left;
	width: 683px;
	height: 342px;
	
	margin-left: 10px; padding-right:10px;
		background-color:transparent;

	 font-size: 1.2em; color: #821611; font-family:arial;
scrollbar-arrow-color: #821611;
scrollbar-3dlight-color: #DCC2BE;
scrollbar-darkshadow-color: #BE7470;
scrollbar-face-color: #fff;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #d0d0d0;
scrollbar-track-color: #f4f4f0;
		}

		#fullpage a:link {text-decoration: underline; color: #7575FF}
#fullpage a:Visited {text-decoration: underline; color: #A142FF}
#fullpage a:hover {text-decoration: underline; color: #bb507c}
#fullpage a:active{text-decoration: underline; color: #bb507c}


#testimonialscontainer {
 position:relative; 	width: 690px;
	height: 342px;
}
#fullpage #thumbs, #fullpage #projectthumbs {
 position:absolute;
 top:0;
 right:0;
 overflow: auto;
 	width: 100px;
	height: 335px;margin-top:5px;
	text-align: center;
		background:#F2F2F2;

	 font-size: 11px; color: #821611; font-family:arial;
scrollbar-arrow-color: #821611;
scrollbar-3dlight-color: #DCC2BE;
scrollbar-darkshadow-color: #BE7470;
scrollbar-face-color: #fff;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #d0d0d0;
scrollbar-track-color: #f4f4f0;
}

#iframe {
 position:absolute;
 top:0;
 left:0;
 width:200px; padding-top: 0px;
}




#fullpageiframe {
margin-left: 0px; 

		background:#F2F2F2;

	 font-size: 1.4em; color: #821611; font-family:arial;
scrollbar-arrow-color: #821611;
scrollbar-3dlight-color: #DCC2BE;
scrollbar-darkshadow-color: #BE7470;
scrollbar-face-color: #fff;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #d0d0d0;
scrollbar-track-color: #f4f4f0;
		}
#fullpageiframe img {padding-left:10px;padding-right:10px;}
#fullpageiframe div {height:500px;}


#popupfullpage {
position:relative;
	top: 15px;
text-align: left;
	width: 635px;
	
	margin:10px auto;padding-left: 20px;padding-right: 20px;padding-top:5px; padding-bottom: 5px;

		background:#F2F2F2;

	 font-size: 1.2em; color: #821611; font-family:arial;
scrollbar-arrow-color: #821611;
scrollbar-3dlight-color: #DCC2BE;
scrollbar-darkshadow-color: #BE7470;
scrollbar-face-color: #fff;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #d0d0d0;
scrollbar-track-color: #f4f4f0;
		}

#breadcrumb {float:right; font-size: .8em; color: black;}
#breadcrumb a {text-decoration:none;}
#breadcrumb a:hover {text-decoration:underline;}


h1 {font-size: 2.5em; color: #5a120d; font-family: serif; font-weight: 300; margin:0;padding:0;}
h3 {font-size: 1.8em; color: #5a120d; font-family: serif; font-weight: 300;
margin-top: 5px;margin-bottom: 3px;}


/*formatting for rollovers on splash page*/
.splashlinks 

{
position:absolute;
top:104px;	
left: 470px;
	}

.splashlinks img {border:0}

.splashlinks  a a:hover {
border:none;
}

.splashnatalie a:hover {
text-indent: -249px;
}


.splashnatalie a {
display: block;
width: 249px;
height: 45px;
overflow:hidden; 

}

.splashrubystreak 

{
position:relative;

left: -38px;
top: -8px;
	}

.splashrubystreak a:hover {
text-indent: -339px;
}

.splashrubystreak a {
display: block;
width: 339px;
height: 83px;
overflow:hidden; 
border:none;
}





#news

{
position:relative;
top:10px;	
left: 20px; margin:0;    padding:0;font-size: 1.2em;

	}

#news a:link {text-decoration: underline; color: #821611}
#news a:Visited {text-decoration: underline; color: #821611}
#news a:hover {text-decoration: underline; color: #bb507c}
#news a:active{text-decoration: underline; color: #bb507c}



/*formatting for rollover menu on rubystreak page*/

.menu
{
position:absolute;
top:40px;	
left: 0px; margin:0;    padding:0;
width:71px;
	}

	.menu  a a:hover {border:none;margin:0; padding:0;}

.menu ul {
margin: 0;
padding: 0;
list-style-type: none;}

.menu li {margin: 0; padding: 0;}

.menu li img {border:none; margin:0; padding:0;}


.menulinks li a {
display: block;
width: 71px;
height: 39px;
overflow:hidden;  margin:0;    padding:0;
}

.menulinks a:hover {
text-indent: -71px;
}

.menulinks a:hover {
text-indent: -71px;
}

.menulinks li a#current
{
text-indent: -142px;
}

.othersidelink li a {
display: block;
width: 71px;
height: 60px;
overflow:hidden;  margin:0;    padding:0;
}

.othersidelink a:hover {
text-indent: -71px;
}

#SLIDESTEXT {
position:absolute;top:13px;left:10px; width:295px;font-size: .8em;text-align: right;margin: 0px; padding: 2px;background-color: ; }

#framephotocredit
{
position:absolute;top:55px;left:87px; width:295px;font-size: .8em;text-align: left;margin: 0px; padding: 2px;z-index:3; color:gray }