/* ---------------------------- Lightbox CSS Elements --------------------------------- */

#lightbox {
/* One Option I thought about was setting the background color (currently white) to the same grey as used throughout the site */
// background-color:#8c8c8c;
	background-color: #eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
}
#lightboxDetails {
	font-size: 0.8em;
	padding-top: 0.4em;
}	
#lightboxCaption { float: left; }
#keyboardMsg { float: right; }
#closeButton{ top: 5px; right: 5px; }
#lightbox img { border: none; } 
#overlay img { border: none; }
#overlay { background-image: url(images/overlay.png); }

/* THIS WAS ON OPTION IS WAS THINKING..
This is will set the text background to the same grey used throughout the site 
& set the font color to an off-white...
#lightboxDetails { 
	background: #8c8c8c;
	color: #eee;
}
*/

* html #overlay {
	background-color: #000;
	back\ground-color: transparent;
	background-image: url(images/blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/overlay.png", sizingMethod="scale");
}
.img_box {
	position: relative;
	top: 0px;
	left: 3px;
}

/* -------------------------------------- primary elements ------------------------------------------------------------------------*/
.hide { display: none; }
html {
	overflow: hidden;
}
body {
    margin: 0;
    padding-top: 50px;
    text-align: center;	
    background: #FFF;
}
#wrapper {
	position: relative;
	text-align: center;
	left: 0px;
	top: 35px;
	margin: 0 auto 0 auto;
	width: 761px;	
	min-height: 490px;
}
#header {
}
#eye_movie {
	z-index: 9;
	position: absolute;
	left: -460px;
	bottom: -380px;
}
#smallest_logo {
	position: absolute;
	left: 24px;
	top: -30px;
	width: 162px;
	height: 49px;
	margin: 0;
	background-image: url(images/smallest_logo.gif);
	background-repeat: no-repeat;
}
#small_logo {
	position: absolute;
	left: 8px;
	top: -50px;
	width: 220px;
	height: 67px;
	margin: 0;
	background-image: url(images/small_logo.gif);
	background-repeat: no-repeat;
}
#big_logo {
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 425px;
	height: 130px;
	background-image: url(images/big_logo.gif);
}
#svcs_map {
	position: relative;
	left: -22px;
	bottom: -70px;
	width: 530px;
	height: 302px;
	background-image: url(images/svcs_map.jpg);
}
#container {
	position: relative;
	left: 0px;
	top: 0px;
	width: 761px;
	min-height: 470px;
}
span.hide { 
	display: none; 
}
div#intranet a {
	position: absolute;
	top: -80px;
	left: 710px;
	z-index: 9;
	width: 75px;
	height: 22px;
	background-image: url(images/intranet.gif);
	background-repeat: no-repeat;
}
div#intranet a:hover {
	background-image: url(images/intranetB.gif);
	background-repeat: no-repeat;
}
/* --------------------------------------left column------------------------------------------------------------------------*/
#left_column {
	position: relative;
	left: 0px;
	top: 0px;
	margin-bottom: -20px;
	width: 213px;
	min-height: 470px;
	background-image: url(images/left_gradient2.jpg);
	background-repeat: no-repeat;
    background-position: bottom;
}
#left_column1 {
	position: relative;
	left: 0px;
	top: 0px;
	margin-bottom: 0px;
	width: 213px;
	min-height: 470px;
	background-image: url(images/left_gradient.jpg);
	background-repeat: no-repeat;
    background-position: bottom;
}
#left_nav_box {
	position: relative;
	left: 0px;
	top: -5px;
	width: 213px;
	min-height: 470px;
}
#left_nav_top_corn {
	position: relative;
	left: 0px;
	top: 0px;
	width: 213px;
	height: 19px;
	background-image: url(images/left_nav_top_corn.jpg);
	background-repeat: no-repeat;
}
.blink {
	z-index: 4;
	position: absolute;
	top: 470px;
	left: 0px;
	width: 213px;
	font-family: Verdana;
	font-size: 10px;
	font-weight: bold;
	color: #fff;
}
.blink a:link, a:visited {
    text-decoration: none;
	color: #fff !important;
}
.blink a:hover, a:active {
    text-decoration: none;
    color: #000 !important;    
}
.blink a:visited {
    text-decoration: none;
	color: #fff !important;
}
.blink a:hover {
    text-decoration: none;
    color: #000 !important;    
}
/* --------------------------------------right column------------------------------------------------------------------------*/
#right_column {
	position: absolute;
	left: 268px;
	top: 20px;
	width: 523px;
	min-height: 470px;
	background-image: url(images/rt_bottom_corners.gif);
    background-repeat: no-repeat;
    background-position: bottom;
}
#rt_top_corners {
	position: relative;
	left: 0px;
	top: 0px;
	width: 523px;
	height: 16px;
	margin-top: -20px;
	background-image: url(images/rt_top_corners.gif);
	background-repeat: no-repeat;
    background-position: right;
}
#rt_content_box {
	position: relative;
	left: 0px;
	top: 0px;
	width: 523px;
	height: 460px;
	background-image: url(images/rt_content_slice.gif);
    background-repeat: repeat;
    background-position: right;
}
#rt_content_box_home {
	position: relative;
	left: 0px;
	top: -14px;
	width: 523px;
	height: 460px;
	background-image: url(images/rt_content_slice.gif);
    background-repeat: repeat;
    background-position: right;
}
/* -------------------------------------- misc. ------------------------------------------------------------------------*/
#left_nav_box_slice {
	position: relative;
	left: 0px;
	top: 0px;
	width: 213px;
	min-height: 8px;
	background-image: url(images/left_nav_box_slice.gif);
	background-repeat: repeat;
}
#vert_line {
	position: relative;
	text-align: center;
	left: 95px;
	bottom: 30px;
	width: 7px;
	height: 382px;
	margin: 0px auto 0 auto;
	background-image: url(images/dividing_line.gif);
}
/* -------------------------------------- primary navigation ------------------------------------------------------------------------*/
.nav {
	position: absolute;
	left: 33px;
	bottom: 40px;
	list-style: none;
	text-decoration: none;
	text-align: right;
	font-size: 18px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	line-height: 25px;
}
#nav_bar {
	z-index: 8;
    position: relative;
    top: -5px;
    left: 140px;
	width: 780px;
	height: 25px; 
    margin: 0;
    color: #FFF;
}
.hor_nav li { /* all list items */
    float: left;
    display: inline;
	position: relative;
	top: -2px;
	left: 0px;
	height: 23px;
	margin-left: 107px;
	font-size: 16px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
}
.hor_nav li ul { /* second-level lists */
	position: absolute;
	margin-top: 3px;
	margin-left: 0px;
	line-height: 21px;
	color: #ffffff;
}
.hor_nav a:link, a:visited {
    text-decoration: none;
    color: #8C8C8C !important;
}
.hor_nav a:hover, a:active {
    text-decoration: none;
    color: #000 !important;     
}
.drop li ul { /* second-level lists */
	margin-top: 3px;
	margin-left: -13px;
	line-height: 21px;
	color: #ffffff;
}
.drop li { /* all list items */
	position: relative;
	left: -20px;
	top: 0px;
	text-align: left;
	margin-top: 0px;
	margin-left: 20px;
	margin-right: 25px;
	padding-left: 10px;
	width: 300px;
	height: 25px;
	font-size: 13px;
	line-height: 25px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	background: url(images/drop.gif) no-repeat;
}
.drop1 li { /* all list items */
	position: relative;
	left: -20px;
	top: 0px;
	text-align: left;
	margin-top: 0px;
	margin-left: 20px;
	margin-right: 25px;
	padding-left: 10px;
	width: 200px;
	height: 25px;
	font-size: 14px;
	line-height: 25px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	background: url(images/drop.gif) no-repeat;
}
.drop2 li { /* all list items */
	position: relative;
	left: -20px;
	top: 0px;
	text-align: left;
	margin-top: 0px;
	margin-left: 20px;
	margin-right: 25px;
	padding-left: 10px;
	width: 300px;
	height: 25px;
	font-size: 14px;
	line-height: 25px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	background: url(images/drop2.gif) no-repeat;
}
ul { /* all lists */
	padding: 0;	
	margin: 0;
	list-style: none;
}
.nav_spacer {
	display: block;
	float: left;
	width: 60px;
	height: 13px;
	background: url('/images/nav_spacer.gif') 0 0 no-repeat;
}
li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
	top: auto;
	left: auto;
}

		/* ---------------- DROP DOWNS ------------ */

	#projRetailUL, #projCommUL, #projCorpUL, #projHospUL { 
		position: absolute;
		left: -195px;
	}
	#projRetailUL a, #projCommUL a, #projCorpUL a, #projHospUL a {
		padding-right: 20px;
	}
	#projCommUL { 
		left: -295px; 
	}
	#projRetailUL li, #projCorpUL li, #projHospUL li {
		position: relative;
		top: -28px;	
		left: -122px;	
		background: url(images/drop_sub.gif) right top no-repeat;
		text-align: right;
	}
	#projCommUL li { 
		position: relative;
		top: -28px;
		left: -22px;
		background: #fff url(images/drop_sub_long.gif) right top no-repeat; 
		text-align: right;	
		width: 300px;
	}
	
/* -------------------------left nav---------------------------------------------------*/

.left_nav a:link, a:visited {
    text-decoration: none;
    color: #8C8C8C !important;
}
.left_nav a:hover, a:active {
    text-decoration: none;
    color: #000 !important;    
}
.left_nav li { /* all list items */
	z-index: 2;
	position: relative;
	top: 35px;
	left: 20px;
	text-align: left;
	line-height: 30px;
	padding-bottom: 0px;
	font-size: 12px;
	font-family: Verdana, Ariel, sans-serif;
}
/* -------------------------left nav portfolio---------------------------------------------------*/
.left_nav_portfolio li {
	color: #b2b2b2;
	margin: 0px;
}
.left_nav_portfolio li { /* all list items */
	z-index: 2;
	position: relative;
	top: 39px;
	left: 45px;
	text-align: left;
	line-height: 16px;
	font-size: 12px;
	padding-bottom: 7px;
	font-family: Verdana, Ariel, sans-serif;
}
.left_nav_portfolio a:link {
    text-decoration: none;
	color: #b2b2b2 !important;
}
.left_nav_portfolio a:visited {
    text-decoration: none;
	color: #8C8C8C !important;
}
.left_nav_portfolio a:hover, a:active {
    text-decoration: none;
    color: #000 !important;    
}

li.project {
	position: relative;
	text-align: left;
	font-family: Verdana, Ariel, sans-serif;
	font-size: 12px;
	color: #000;
}
ul.numbers1 {
	position: absolute;
	left: 20px;
	top: 28px;
	text-align: left;
	line-height: 40px;
	font-size: 12px;
	font-family: Verdana, Ariel, sans-serif;
	color: #b2b2b2;
}
.numbers2 {
	position: absolute;
	left: 23px;
	top: 36px;
	text-align: left;
	line-height: 23px;
	font-size: 12px;
	font-family: Verdana, Ariel, sans-serif;
	color: #b2b2b2;
}
/* -------------------------left nav services---------------------------------------------------*/
.left_nav_services li {
	color: #b2b2b2;
	margin: 0px;
}
.left_nav_services li { /* all list items */
	z-index: 2;
	position: relative;
	top: 40px;
	left: 20px;
	text-align: left;
	line-height: 16px;
	font-size: 11px;
	padding-bottom: 7px;
	font-family: Verdana, Ariel, sans-serif;
}
.left_nav_services a:link {
    text-decoration: none;
	color: #b2b2b2 !important;
}
.left_nav_services a:visited {
    text-decoration: none;
	color: #8c8c8c !important;
}
.left_nav_services a:hover, a:active {
    text-decoration: none;
    color: #000 !important;    
}
.left_nav_services a:hover {
    text-decoration: none;
    color: #000 !important;    
}

/* -------------------------------------- content elements ------------------------------------------------------------------------*/
#content {
	position: relative;
	left: 270px;
	top: 50px;
	width: 600px;
	min-height: 500px;
}
p {
	position: relative;
	left: 7px;
	width: 258px;
	text-align: left;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 14px;
	color: #8F0000;
}
p2 {
	position: relative;
	left: -7px;
	text-align: center-justify;
	width: 278px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 14px;
	color: #00ADEF;
}
p3 {
	position: relative;
	left: -7px;
	top: 17px;
	text-align: center-justify;
	width: 278px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 14px;
	color:#FF7F00;
}
/* --------------------------------------- footer -------------------------------------------------
-------------------------------*/
#footer {
	position: relative;
	text-align: right;
	top: 25px;
	width: 765px;
	height: 20px;
	margin: 0;
	font-family: Verdana;
	font-size: 10px;
}

/* ---------------------------------------Sydney Ley Principal Designer ------------------------------------------------- */
#sydney {
	position: relative;
	left: -8px;
	top: 50px;
	width: 200px;
	height: 60px;	
}
.h2 {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 30px;
	width: 213px;
	text-align: left;
	font-family: verdana, ariel, sans-serif;
	font-size: 24px;
	color: #000;
	padding-left: 20px;
	margin: 0;
}
.h3 {
	position: absolute;
	left: -20px;
	top: 0px;
	height: 30px;
	width: 213px;
	text-align: left;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 21px;
	color: #000;
	padding-left: 40px;
	margin: 0;
}
.h4 {
	position: absolute;
	left: -17px;
	top: 2px;
	height: 30px;
	width: 213px;
	text-align: left;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 20px;
	color: #000;
	padding-left: 40px;
	margin: 0;
}
.h5 {
	position: absolute;
	left: -57px;
	top: 3px;
	height: 30px;
	width: 523px;
	text-align: left;
	font-family: verdana, ariel, sans-serif;
	font-size: 18px;
	color: #000;
	padding-left: 40px;
	margin: 0;
}
.h6 {
	position: absolute;
	left: -43px;
	top: 90px;
	height: 30px;
	width: 413px;
	text-align: left;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 15px;
	color: #000;
	padding-left: 65px;
	margin: 0;
}
#demo {
	position: relative;
	left: -19px;
	top: -20px;
	text-align: center;
	width: 503px;
	height: 460px;
	padding: 0;
	margin: 0 auto; 
	background-image: url(images/photo_demo.jpg);
	background-repeat: no-repeat;
    background-position: bottom;
}
#contact {
	position: absolute;
	left: 100px;
	top: 180px;
	height: 30px;
	width: 523px;
	text-align: left;
	font-family: verdana, ariel, sans-serif;
	font-size: 18px;
	color: #000;
	padding-left: 40px;
	margin: 0;
}
#contact a:link {
    text-decoration: none;
	color: #000 !important;
}
#contact a:visited {
    text-decoration: none;
	color: #000 !important;
}
#contact a:hover, a:active {
    text-decoration: none;
    color: #8C8C8C !important;    
}
#contact a:hover {
    text-decoration: none;
    color: #8C8C8C !important;    
}

.syd_quote {
	position: absolute;
	top: 40px;	
	left: -35px;
	width: 540px;
	text-align: center;
	font-family: Ariel, sans-serif;
	font-size: 14px;
	color: #999;
}
.bold_black {
	font-family: Ariel, sans-serif;
	font-size: 18px;
	color: #000;
}
.quote_indent {
	position: relative;
	left: 20px;
}
.quote_indent2 {
	position: relative;
	left: 40px;
}
#name {
	position: absolute;
	top: 280px;	
	left: 230px;
	height: 30px;
	width: 300px;
	text-align: left;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	font-size: 15px;
	color: #000;
}



/* ----------------------------------- Projects Pages ------------------------- */

div#project_container {
	position: absolute;
	left: -18px;
	margin: 0;
	padding: 0;
	padding: 180px 0 0 0;
	text-align: center;
	width: 650px;
}
div#project_container_home p, div#project_container p {
	text-align: justify;
	width: 500px;
}
div#project_container_home div img, div#project_container div img {
	display: inline;
	float: left;
}
div#project_container_home div a img, div#project_container div a img { 
	border: 0;
}
div#project_container_home {
	position: absolute;
	top: 125px;
	left: -19px;
	margin: 0;
	padding: 0;
	padding: 180px 0 0 0;
	text-align: center;
	width: 650px;
}

/* ----------------------------------- login ------------------------- */

div.nav_login {	
	position: absolute;
	top: -120px;
	left: 493px;
	z-index: 2;
	margin: 0;
	display: inline;
	padding: 0;
	text-align: center;
}
p.login {
	position: relative;
	display: inline;
	top: 40px;
	left: -133px;
	font-size: 11px;
	font-family: Trebuchet MS, Verdana, Ariel, sans-serif;
	color: #000;
}
div.nav_login form {
	z-index: 4;
	margin: 15px auto;
	padding: 0;
	width: 350px;
	text-align: center;	
}
div.nav_login input {
	z-index: 9;
	margin: 0 auto;
	display: inline;
	font-size: 9px;
	padding: 1px;
	text-align: center;
	border: 1px inset #000;
}
div.nav_login {
	z-index: 4;
	margin-left: 3px;
}
#login_submit {
	position: relative;
	z-index: 4;
	top: 7px;
	border: 0;
}

/* LOGIN PAGE SPECIFIC.... */

p.problem { 
	width: 400px; 
	margin-bottom: 40px; 
}