/* 
Simon Moore's Portflio CSS
---------------------------
Author: Simon Moore 
Date of creation: 01/07/07 
---------------------------


/* General Styles */

body{
	background-color: #000000;
	background-image: url(../images/bckgrd.jpg);
	background-repeat: repeat-x;
	margin: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	color: #b1b1b1;
	text-decoration: none;
	padding: 0px;	
}
#toppicture{
	background-image: url(../images/mainpic.jpg);
	width: 500px;
}
img{
	border-style: none;
	margin: 0px auto;
	padding: 0px;
}

p{
	font-size: 1.2em;
	text-decoration: none;
	line-height: 1.5em;
	margin: 0px 0px 7px;
}
li{
	margin: 0px;
	line-height: 0px;
	list-style-type: none;
}
#textbox a {
	color: #8c3dee;
}
#textbox a:hover {
	text-decoration: none;		
}
ul {
	margin: 0px; padding:0px;
}
#container {
	margin: 0px auto;
	height: 3500px;
	width: 640px;
	background-repeat: no-repeat;
	padding: 0px;	
}
.innercontainer{
	padding: 0px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	height: auto;
	width: 500px;
}
/* Navigation */
.navbox {
	background-color: #000000;
	height: 71px;
	width: 500px;
	margin: 0px;
	clear: both;
	padding: 0px;
}
  .nav1 a {
	background-image: url(../images/aboutbut.jpg);
	background-repeat: no-repeat;
	display: block;
	height: 71px;
	width: 125px;
	float: left;
	
}
 .nav1 a:hover {
 	background-position: 0 -71px;


}
 .nav2 a {
	background-image: url(../images/printbut.jpg);
	background-repeat: no-repeat;
	display: block;
	height: 71px;
	width: 125px;
	float: left;
	
}
 .nav2 a:hover {
 	background-position: 0 -71px;


}
.nav3 a {
	background-image: url(../images/webbut.jpg);
	background-repeat: no-repeat;
	display: block;
	height: 71px;
	width: 125px;
	float: left;
}

 .nav3 a:hover {
 	background-position: 0 -71px;


}
.nav4 a {
	background-image: url(../images/idbut.jpg);
	background-repeat: no-repeat;
	display: block;
	height: 71px;
	width: 125px;
	float: left;
}

 .nav4 a:hover {
 	background-position: 0 -71px;


}

.blacked1 {
	background-image: url(../images/blkprinttab.jpg);
	background-repeat: no-repeat;
	height: 71px;
	width: 125px;
	float: left;
}
.blacked2 {
	background-image: url(../images/blkwebtab.jpg);
	background-repeat: no-repeat;
	height: 71px;
	width: 125px;
	float: left;
}
.blacked3 {
	background-image: url(../images/blkidtab.jpg);
	background-repeat: no-repeat;
	height: 71px;
	width: 125px;
	float: left;
}
.blacked4 {
	background-image: url(../images/blkabouttab.jpg);
	background-repeat: no-repeat;
	height: 71px;
	width: 125px;
	float: left;
}
/* Work Sections */
#about {
	background-image: url(../images/about.jpg);
	height: 600px;
	width: 500px;
	margin: 0px;
	background-repeat: no-repeat;
	float: left;
	padding: 0px;
}
#print {
	background-image: url(../images/print.jpg);
	height: 700px;
	width: 500px;
	margin: 0px;
	background-repeat: no-repeat;
	float: left;
	padding: 0px;
}
#identity {
	background-image: url(../images/identity.jpg);
	height: 620px;
	width: 500px;
	margin: 0px;
	background-repeat: no-repeat;
	float: left;
	padding: 0px;
}
#web {
	background-image: url(../images/web.jpg);
	height: 700px;
	width: 500px;
	margin: 0px 0px 30px;
	background-repeat: no-repeat;
	float: left;
	padding: 0px 0px 0px;
}
#textbox {
	height: 267px;
	width: 420px;
	margin-top: 160px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 40px;
	padding: 0px;
	
}
.anchor{
	background-color: #000000;
	clear: both;
	height: 50px;
	width: 500px;
}
	

/* The containing box for the gallery. */

#imagecontainer {
	position:relative;
	width:430px;
	height:252px;
	margin:460px auto 0;
	
}
#imagecontainer2 {
	position:relative;
	width:430px;
	height:252px;
	margin:460px auto 0;
	background-repeat: no-repeat;
	background-position: -420px;
}
#imagecontainer3 {
	position:relative;
	width:430px;
	height:252px;
	margin:460px auto 0;
	background-repeat: no-repeat;
	background-position: -420px;
}


/* Removing the list bullets and indentation */
#imagecontainer ul {
    padding:0; 
    margin:0; 
    list-style-type:none; 
    }
#imagecontainer2 ul {
padding:0; 
margin:0; 
list-style-type:none; 
}
#imagecontainer3 ul {
padding:0; 
margin:0; 
list-style-type:none; 
}


/* Remove the images and text from sight */
	
#imagecontainer a.gallery span {
    position:absolute; 
    width:1px; 
    height:1px; 
    top:-10000px; 
    left:-20px; 
    overflow:hidden; 
    background:#fff;
 }
 #imagecontainer2 a.gallery span {
    position:absolute; 
    width:1px; 
    height:1px; 
    top:-10000px; 
    left:-20px; 
    overflow:hidden; 
    background:#fff;
 }
 #imagecontainer3 a.gallery span {
    position:absolute; 
    width:1px; 
    height:1px; 
    top:-10000px; 
    left:-1px; 
    overflow:hidden; 
    background:#fff;
 }
 
 /* Adding the thumbnail images */
 
#imagecontainer a.gallery, .imagecontainer a.gallery:visited {
    display:block; 
    color:#000; 
    text-decoration:none; 
    border:2px solid #333333; 
    margin:1px 8.3px; 
    text-align:left; 
    cursor:default;
    }
	 
#imagecontainer2 a.gallery, .imagecontainer a.gallery:visited {
    display:block; 
    color:#000; 
    text-decoration:none; 
    border:2px solid #333333; 
    margin:1px 8.3px; 
    text-align:left; 
    cursor:default;
    }
#imagecontainer3 a.gallery, .imagecontainer a.gallery:visited {
    display:block; 
    color:#000; 
    text-decoration:none; 
    border:2px solid #333333; 
    margin:1px 8.3px; 
    text-align:left; 
    cursor:default;
    }
	
/* web gallery */
	
#imagecontainer a.slide1a {
    background:url(../images/print/maei1thumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer a.slide1b {
    background:url(../images/print/maei2thumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer a.slide1c {
    background:url(../images/print/maeithumb3.jpg); 
    height:51px; 
    width:51px;
    }
	#imagecontainer a.slide1d {
    background:url(../images/print/south1thumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer a.slide1e {
    background:url(../images/print/south2thumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer a.slide1f {
    background:url(../images/print/wilson1thumb.jpg); 
    height:51px; 
    width:51px;
    }

* html .imagecontainer a.slide1d {
    width:51px; 
    w\idth:51px;
    }

* html #imagecontainer a.slide1f {
    width:51px; 
    w\idth:51px;
    }

#imagecontainer2 a.slide2a {
    background:url(../images/web/bigbikethumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer2 a.slide2b {
    background:url(../images/web/canvasthumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer2 a.slide2c {
    background:url(../images/web/underdressedthumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer2 a.slide2d {
    background:url(../images/web/smartdeskthumb.jpg); 
    height:51px; 
    width:51px;
    }
* html #imagecontainer2 a.slide2d {
    width:51px; 
    w\idth:51px;
    }
#imagecontainer2 a.slide2e {
    background:url(../images/web/sssthumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer2 a.slide2f {
    background:url(../images/web/hughesthumb.jpg); 
    height:51px; 
    width:51px;
    }
* html #imagecontainer2 a.slide2f {
    width:51px; 
    w\idth:51px;
    }
#imagecontainer3 a.slide3a {
    background:url(../images/identity/ds24thumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer3 a.slide3b {
    background:url(../images/identity/pleuropeanthumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer3 a.slide3c {
    background:url(../images/identity/octthumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer3 a.slide3d {
    background:url(../images/identity/crashthumb.jpg); 
    height:51px; 
    width:51px;
    }
* html .imagecontainer3 a.slide3d {
    width:51px; 
    w\idth:51px;
    }
#imagecontainer3 a.slide3e {
    background:url(../images/identity/geothumb.jpg); 
    height:51px; 
    width:51px;
    }
#imagecontainer3 a.slide3f {
    background:url(../images/identity/wilsonthumb.jpg); 
    height:51px; 
    width:51px;
    }
* html #imagecontainer3 a.slide3f {
    width:51px; 
    w\idth:51px;
    }

/* set the size of the unordered list to neatly house the thumbnails */
#imagecontainer ul {
	width:430px;
	height:51px;
   }
 #imagecontainer2 ul {
	width:430px;
	height:51px;
   }
 #imagecontainer3 ul {
	width:430px;
	height:51px;
   }
#imagecontainer li {
    float:left;
    }
#imagecontainer2 li {
    float:left;
    }
#imagecontainer3 li {
    float:left;
    }
/* change the thumbnail border color */
#imagecontainer a.gallery:hover {
    border:2px solid #8c3dee; 
    }
#imagecontainer2 a.gallery:hover {
    border:2px solid #8c3dee; 
    }
#imagecontainer3 a.gallery:hover {
    border:2px solid #8c3dee; 
    }
/* styling the :hover span */
#imagecontainer a.gallery:hover span {
	position:absolute;
	width:430px;
	height:252px;
	top:-305px;
	left:0px;
	color:#000;
	background:#fff;
	border: 2px solid #333333;
    }
#imagecontainer2 a.gallery:hover span {
	position:absolute;
	width:430px;
	height:252px;
	top:-305px;
	left:0px;
	color:#000;
	background:#fff;
	border: 2px solid #333333;
    }
#imagecontainer3 a.gallery:hover span {
	position:absolute;
	width:430px;
	height:252px;
	top:-305px;
	left:0px;
	color:#000;
	background:#fff;
	border: 2px solid #333333;
    }
#footer{
	color: #666666;
	margin-top: 55px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif, "Arial Narrow", Tahoma;
	display: block;
}
#footer a{
	color: #8c3dee;
	}
#footer a:hover{
	text-decoration: none;	
	}