@charset "utf-8";
/* CSS Document */

/* BODY - FIRST LEVEL */
body
{	font-family:"Droid Sans", Verdana, Arial, Helvetica, sans-serif; 
	margin: 0px; 
	padding: 0px;}

/* CONTAINER - SECOND LEVEL */
#container
{	width: 900px; 
	height:auto;
	/*aligns the page to the center horizontal (x)*/
	margin-left:auto;
	margin-right:auto;
	/*aligns the page to the center vertical (y)*/
	position: absolute;
	top: 10%;
	left: 50%;
	/*resets the offset (should be half the width and height) */
	margin-top:-50px;
	margin-left:-450px;
}

/* CONTENT - THIRD LEVEL */
#content
{	width:auto; 
	height:auto; 
	background-color:#FFFFFF;
	color:#000000; 
	font-size:12px; 
	vertical-align:top!important; 
	padding:30px; 
	text-align:left;
}

/* CONTENT - 4a - LEFT COLUMN */
#leftside
{	position: relative;
	width:25%; }

/* CONTENT - 4b - RIGHT COLUMN */
#rightside
{	position: relative;
	width:75%; }

/* %%% the footer %%% */
#footer {
	clear:both;
	margin-top:30px;}

/*--------------------TABLES----------------*/

#tdbox {
	border-left: 1px solid 	#DCDCDC; 
	border-right: 1px solid 	#DCDCDC;
	border-top: 1px solid 	#DCDCDC;
	border-bottom: 1px solid 	#DCDCDC;
}

#tdnobox {
	width: 60;
	/*border-top:none;
	border-bottom: none;*/
}

/*-------------------- FONT VARIATION ----------------*/
.smallfont {font-size:12px;}


/*--------------------HEADINGS----------------*/

h1{color:#FF6600; font-size:20px;font-family:"Droid Sans", Helvetica, Geneva, Calibri, Arial, sans-serif} 

h2{color:#005280; font-size:13px;} 

h3{color:#000000; font-size:12px;} 

h4{color:#EA7500;font-size:18px;font-family: "Droid Sans", Helvetica, sans-serif; font-weight:bold; margin-top:0; margin-bottom:0;}
 
/*--------------------PARAGRAPHS----------------*/

p {    padding:0px;
       color:#000;
       font-family: "Droid Sans";
       font-size:12px;
       text-decoration:none;
	   line-height:17px;}

p.cart {font-family:"Droid Sans";
font-size:18px;
line-height: 28px;
color:#609;
}
 
/*p a {  padding:0px;
       color:#000;
       font-family: Verdana;
       font-size:12px;
       text-decoration:none;
	   line-height:17px;
	   text-decoration:underline;
	   font-weight:bold;}*/

quick {line-height: -12px;}

p.spacer {padding:25px;}

/* --------------- STEPHEN FRENCH PHOTOGRAPHY HEADER ------------------ */

.stephen {
	text-shadow:#999 2px 2px 4px;
	/*font-family:"Arial Black", Gadget, sans-serif;*/
	font-family:"Londrina Solid";
	font-size:46px;
	color: #999;
}

.french {
	text-shadow:#999 2px 2px 4px;
	/*font-family:"Arial Black", Gadget, sans-serif;*/
	font-family:"Londrina Solid";
	font-size:46px;
	color: #000;
}

.photo {
	/*text-shadow:#999 2px 2px 4px;*/
	font-family:"Londrina Outline";
	font-effect: outline;
	font-size:46px;
	color: #000;
}

.menu {
	/*text-shadow:#999 2px 2px 4px;*/
	font-family:"Londrina Solid";
	/*font-effect: outline;*/
	font-size:20px;
	color: #000;
}

.menusub {
	font-family:"Droid Sans",Verdana,sans-serif;
	font-size:14px;
	font-weight:600;
	color: #000;
}

.menuchosen {
	color:#F9F;
}

.menu a:link {text-decoration:none;}
.menu a:hover {color:#F9F;}
.menu a:visited {text-decoration:none;}
.menusub a:link {text-decoration:none;}
.menusub a:hover {color:#F9F;}
.menusub a:visited {text-decoration:none;}
.menuchosen a:link {color:#F9F;}
.menuchosen a:hover {color:#F9F;}
.menuchosen a:visited {color:#F9F;}

/* --------------- HOVER OVER PHOTO SELECT ------------------ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}

.thumbnail2{
position: relative;
z-index: 1;
}

.thumbnail2:hover{
background-color: transparent;
z-index: 51;
}

.thumbnail2 span{ /*CSS for enlarged image*/
position: absolute;
background-color: black;
padding: 5px;
left: -1000px;
border: 1px gray;
visibility: hidden;
color: white;
text-decoration: none;
font-weight:bold;
}

.thumbnail2 span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 10px;
}

.thumbnail2:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}