/* Iain Guilliard Photography CSS*/

body
{
   margin: 0;
   padding: 0;
   font-family: Verdana,Tahoma,Arial,sans-serif;
   background: #000;
   color: #fff;
}

a
{
   color: #ddd;
   font-weight: bold;
}

/*
Setting margin left and right to auto centers the DIV in the window. 
Many CSS properties that have four elements (left, top, right, bottom)
have a shorthand form that specifies top and bottom in the first element
and left and right in the second (as here)
*/
#container
{
   margin: 0 auto;
   width: 825px;
}

#header
{
   width: 500px;
   height: 50px;
   background: url("title.gif") no-repeat center center;
   margin: 10px auto;
   padding: 0;
}

#header h1
{
   display: none;
}

#nav
{
   margin: 0;
   padding: 0;
   font-size: 0.9em;
}

/*
The usual CSS way of doing a navigation bar. list-style: none simply turns off the bullets
that would normally be shown.
The hard-coded width is a dirty great hack.
*/
#nav ul
{	
   list-style: none;
   margin: 0 auto;
   padding: 0;
   font-size: 0.8em;
   width: 860px;
}	

/* Float: left makes the elements appear one after the other, rather that below each other */
#nav li
{
   float: left;
}

#nav li a
{
   display: block;
   width: 100px;
   height: 14px;
   padding: 5px;
   margin: 20px 5px;
   text-decoration: none;
   text-align: center;
   font-weight: normal;
   color: #fff;
   background: #000;
   border: 1px solid #505050;
}	

#nav li a:hover
{
   background: #404040;
}

#gallerynav
{
   width: 300px;
}

.main
{
   font-size: 0.8em;
   clear: both;
   text-align: center;
   
}

.center
{ 
text-align: center;
}

.center table
{ 
margin-left: auto;
margin-right: auto;
text-align: left;
}


#frontphoto
{
   padding: 10px;
   border: 1px solid #fff;
}

.gallery
{
   margin: 60px auto;
   width: 500px;
   border: 1px solid #404040;
   text-align: center;
}

.gallery tr
{
   height: 100px;
}

.photo_nav
{
   clear: both;
   width: 825px;
   margin: 10px 0;
   padding: 0;
}

.photo_nav a
{
   text-decoration: none;
   font-size: 0.9em;
   display: block;
   padding: 3px 8px;
   border: 1px solid #505050;
}

.photo_nav a:hover
{
   background-color: #404040;
}

a.prev_photo
{
   float: left;
   padding-left: 20px;
   background: url("prev.gif") no-repeat center left;
   text-align: left;
}

a.next_photo
{
   float: right;
   padding-right: 20px;
   background: url("next.gif") no-repeat center right;
   text-align: right;
}

a.link
{
   
   
   
   padding: 5px;
   margin: 5px;
   text-decoration: none;
   text-align: center;
   font-weight: normal;
   color: #fff;
   background: #000;
   border: 1px solid #505050;
}

a.link:hover
{
   background: #404040;
}
/* Width is not really necessary, but it means that the caption will wrap correctly
   if it gets too long for one line. */
.photo_nav p.caption
{
   width: 600px;
   margin: 0 auto;
   text-align: center;
   padding: 5px;
}

#contacts
{
   margin: 50px auto;
   width: 220px;
   padding: 10px;
   background: #303030;
   border: 1px solid #505050;
   line-height: 0.9em;
}

#prints
{
   margin: 50px auto;
   width: 450px;
   padding: 10px;
   background: #303030;
   border: 1px solid #505050;
   line-height: 0.9em;
}

#footer
{
   clear: both;
   margin: 15px 3px;
   text-align: right;
   font-size: 0.7em;
   color: #bbb;
}



#ecard
{
   
   font-size: 0.9em;
   margin: 10px auto;
   width: 600px;
   padding: 10px;
   line-height: 0.9em;
}

#ecard fieldset
{	
   
   margin: 10px auto;
   width: 500px;
   padding: 10px;
   background: #303030;
   border: 1px solid #505050;
   line-height: 0.9em;
}	

#ecard fieldset label
{
   
   width: 130px;
   height: 14px;
   padding: 5px;
   padding-right: 10px;
   margin: 3px;
   text-decoration: none;
   text-align: right;
   font-weight: normal;
   float: left;
   color: #fff;
   /*background: #000;
   border: 1px solid #505050;*/
}	





#ecard fieldset input#sendname,input#sendemail,input#recvname,input#recvemail
{
   display: block;
   width: 200px;
   height: 20px;
   padding: 5px;
   margin: 3px;
   float: left;
   color: #fff;
   background: #000;
   border: 1px solid #505050;
   text-decoration: none;
   font-weight: normal;
}	

#ecard input#submit
{
   margin: 10px auto;
   padding: 5px;
   display: block;
   color: #fff;
   background: #000;
   border: 3px double #505050;
}	

#ecard input#submit:hover
{
 background: #404040;
}

#ecard fieldset textarea
{
   display: block;
   width: 480px;
   height: 150px;
   margin: 3px;
   padding: 5px;
   float: left;
   color: #fff;
   background: #000;
   border: 1px solid #505050;
   text-decoration: none;
   font-weight: normal;
   font-family: Verdana,Tahoma,Arial,sans-serif;
   font-size: 1em;
}
	
#ecard fieldset br
{
   clear: left;
}
   
#ecard fieldset label:hover
{
   background: #404040;
}

#ecardmsg
{
   font-size: 0.9em;
   margin: 10px auto;
   width: 600px;
   padding: 10px;
   text-align: left;
}

#slideshow
{
width: 850px;
   height: 170px;
background: url("1.jpg") no-repeat center left;
}

 #mySlideshow
{
width: 850px !important;
height: 165px !important;
z-index:5;
	display: block;
	overflow:hidden;
	position: relative;
}

#mySlideshow img
{
	border: 0;
	margin: 0;
}