/* =============================== */
/*      www.maxhamilton.com        */
/* =============================== */
/*  website by theo bonham carter  */
/*  theobonhamcarter-at-gmail.com  */
/* =============================== */

/* Layout */
/* ------ */

body {
background:#222 url(assets/grid.gif) top left repeat-y;
background:#222;
margin:0;
padding:0;
font-size:11px;
font-family: Helvetica, Arial;
}

#container {
width:980px;
margin:0;
padding:0;
}

#sitename {
border-bottom:1px solid #333;
margin:0;
padding:20px 0 20px 20px;
}

#navigation {
margin:0;
padding:0;
border:0px solid white;
width:320px;
float:left;
height:600px;
}

#content {
margin:20px 0 0 0;
padding:0;
width:620px;
float:left;
margin-left:20px;
height:600px;
}

.homepage #navigation {width:240px;}
.homepage #content {width:700px;}

.clear {clear:both;}


/* Typography */
/* ---------- */

a {color:#d29736; text-decoration:none; outline:none;}
a:hover {color:#ffcc33;}

p {margin:0 0 5px 0; padding:0; line-height:18px;}
ul {margin:0; padding:0; list-style-type:none;}
img {border:0;}
.small {font-size:10px;}


/* Nav 1 */
/* ===== */

.nav1 {
margin:14px 20px 0 20px;
padding:0;
float:left;
}
 
.nav1 ul li {
margin:0;
padding:4px 0;
width:60px;
}

.nav1 ul li a {
margin:0;
padding:0;
font-size:12px;
display:block;
}

.nav1 ul li.first a,
.nav2 ul li.first a {padding:0; margin:0;}

.nav1 ul li.active a,
.nav2 ul li.active a {color:#eee;}

.nav1 ul li a:hover,
.nav2 ul li a:hover {color:#ffcc33;}


/* Nav 2 */
/* ===== */

.nav2 {
margin:14px 0 0 0;
padding:0;
float:left;
}

.nav2 ul li {
margin:0;
padding:5px 0;
width:140px;
}

.nav2 ul li a {
margin:0;
padding:0;
font-size:11px;
display:block;
}


/* Blurb */
/* ----- */
/* about and contact pages */

.blurb {
margin:0 0 0 0;
padding:0;
width:300px;
color:#eee;
}

.blurb p {
margin:0 0 10px 0;
padding:0;
line-height:15px;
text-align:left;
}


/* Slideshows */
/* ---------- */

.slidewrapper {
clear:left;
margin:0px 0 0 0;
padding:0;
width:auto;
color:#ffffff;
border:0px solid red;
}

.pics {
width:620px;
height:571px;
border:0px solid red;
padding:0;
margin:0;
overflow:hidden;
}

.pics img {
height:auto;
width:auto;
padding:0px;
border:0px solid #ccc;
top:0;
left:0
}

/* Project Caption */
/* --------------- */

#info {
clear:both;
width:280px;
margin:178px 0 0 0;
padding:20px 20px 0 20px;
border-top:1px solid #333;
color:#bbb;
}

#info H3 {
margin:0 0 8px 0;
padding:0;
color:#eee;
font-size:12px;
}

#info P {
margin:0 0 10px 0;
padding:0;
line-height:15px;
text-align:left;
}

/* Slide controls */
/* -------------- */

.slidecontrols {
margin:20px 0 0 0;
padding:10px 0 0 0;
color:#444;
width:640px;
border-top:1px solid #333;
text-align:right;
}

.slidecontrols p {line-height:8px; font-size:8px;}
.slidecontrols p span {font-size:11px; margin-right:20px;}

/* controls */
.slidecontrols .controls {float:left;}
.slidecontrols .controls #prev, 
.slidecontrols .controls #next {padding:2px; margin:0;}
.slidecontrols .controls #prev {margin:0 5px 0 0;}


/* PAGE SPECIFICS */
/* -------------- */

/* Slideshow Dimensions */
/* set the following width and height
 to the maximum image size in the set */
 
body#photography.earthquake .pics {width:620px; height:571px;}
body#photography.dragon .pics {width:620px; height:571px;}
body#photography.skaters .pics {width:620px; height:571px;}
body#photography.china .pics {width:620px; height:571px;}
body#photography.snow .pics {width:620px; height:571px;}
body#photography.store .pics {width:620px; height:571px;}
body#photography.housing .pics {width:620px; height:571px;}
body#photography.housing .pics {width:620px; height:571px;}
body#photography.worldcup .pics {width:620px; height:571px;}
body#photography.olympic .pics {width:620px; height:571px;}
body#photography.homepage .pics {width:700px; height:561px;}



/* HOMEPAGE IMAGE MAP */
/* ------------------ */

#map-container, 
UL#map-buttons, 
#map-hover, 
#map-click {
width:660px;
height:521px;
}

.bg {
position:absolute;
top:0;
left:0;
}

#map-container {
position:relative;
background:url(assets/hometest-02.jpg)top left no-repeat;
}

UL#map-buttons{
background:none;
position:relative;
}

UL#map-buttons LI {
position:absolute;
overflow:hidden;
cursor:pointer;
}

#link_1 {
text-indent:-99999px;
width:233px;
height:286px;
left:0px;
top:0px;
background:green;
}

#link_1 A {
width:233px;
height:286px;
display:block;
background:lime;
}

#link_2 {
text-indent:-99999px;
width:195px;
height:149px;
left:253px;
top:0px;
background:red;
}

#link_2 A {
width:195px;
height:149px;
display:block;
background:pink;
}

#link_3 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid orange;
}

#link_4 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid red;
}

#link_5 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid orange;
}

#link_6 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid red;
}

#link_7 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid orange;
}

#link_8 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid red;
}

#link_9 {
width:20px;
height:20px;
left:0px;
top:0px;
border:0px solid orange;
}