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






body {
padding-top: 0px;
border-top:100px #FF3366 ;
background:url(../image/gridback.png);
background-repeat:repeat-x repeat-y;
z-index:-1;
background-attachment:fixed;
}

#wrapper {
background-image:url(../image/bluetransparency.png);
background-repeat:repeat-x repeat-y;
margin-left:auto;
margin-right:auto;
margin-top:0px;
padding-top:0px;
width: 1280px;
height: 700px;
z-index:-1;
}

a {
text-decoration:none;
color:#33CCCC;
}

a:hover {
text-decoration:none;
color:#FF0066;}


#title {
padding-bottom:70px;
padding-top:15px;
background-repeat:no-repeat;
background-position:inherit;
margin-left :15px;
width: 20px;
height: 70px;
z-index:-1;
}

#peopletab {
position:absolute;
margin-left:615px;
margin-top:40px;
}

#peopletabyellow {
position:absolute;
margin-left:615px;
margin-top:40px;
background-image:url(../image/yellowrollover.png);
}

#peopletab:hover {
background-image:url(../image/yellowrollover.png);
}


#peopletab:active {background-color:#00CCFF; }


#boutiquetab {
position:absolute;
margin-left:850px;
margin-top:40px;
}



#boutiquetab:hover {
background-image:url(../image/yellowrollover.png);
}

#boutiquetab:active {background-color:#00CCFF; }

#studiotab {
position:absolute;
margin-left:510px;
margin-top:70px;
}

#studiotab:hover {
background-image:url(../image/yellowrollover.png);
}

#studiotab:active {background-color:#00CCFF; }

#projecttab {
position:absolute;
margin-left: 720px;
margin-top:73px;
}

#projecttab:hover {
background-image:url(../image/yellowrollover.png);
}

#projecttab:active  {background-color:#00CCFF; }

#contacttab {
position:absolute;
margin-left: 1000px;
margin-top:70px;
}

#contacttab:hover{
background-image:url(../image/yellowrollover.png);
}

#contacttab:active  {background-color:#00CCFF; }

#iellogo {
height:100px;
width: 100x;
background-color:#FFFFFF;
float:right;
margin-top:520px;
}

#about {
font-size: 80%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
color:#4D505A;
background-color:#FFFFFF;
position:absolute;
margin-left: 310px;
width:800px;
height:400px;
padding:0px;
}



#footer{
margin-left:270px;
position:absolute;
margin-top:350px;
width:800px;
height:50px;
}

ul#footer-list {
list-style-type:none;
width:800px;
height:50px;
}

li.about {
margin-left:0px;

float:left }

a.hexa {
display:block;


width:208px;
height:50px;
background:url(../image/hexa_sprite.jpg) no-repeat bottom left;
}

a.hexa:hover {
background-position:top left;
}


a.cac {
display:block;
width:218px;
height:50px;
background:url(../image/CAC_sprite.jpg) no-repeat bottom left;
}

a.cac:hover {
background-position:top left;
}


a.sshrc {
display:block;
width:225px;
height:50px;
background:url(../image/sshrc_sprite.jpg) no-repeat bottom left;
}

a.sshrc:hover {
background-position:top left;
}


a.qc {
display:block;
width:149px;
height:50px;
background:url(../image/qc_sprite.jpg) no-repeat bottom left;
}

a.qc:hover {
background-position:top left;
}


#links{
font-size: 80%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
color:#4D505A;
background-color:#FBFFFC;
position:absolute;
margin-left: 310px;
margin-top: 100px;
width:600px;
height:auto;
padding:10px;
}

#aboutblurb{
padding-left:15px;
padding-top:10px;
}

#crab{
width:300px;
margin-left:300px;
}

#photowrap {
position:absolute;
background-color:#FFFFCC;
width:550px;
padding: 15px;
margin-left:300px;
}

#blurb {
background-color:#FFFFCC;
font-size: 70%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
padding-top:10px;
color:#666666;
}

#nav { 
border-top:#FF0033;
border-style: 1px dashed;
float:left;
margin-left: 50px;
background-color:#99FFFF;
}

ul#navigation { 
position:relative;
list-style-type : none;
width: 190px;
margin: 0 px ;
padding: 0 ;
}

#content {
margin-top: 0px;
margin-left:300px;


}

#content-boutique {
margin-top: 0px;
margin-left:300px;
width:640px;
}


#projectcontent {
margin-top: 0px;
margin-left:300px;
}

#bags {
margin-top:0px;
margin-left:300px;
}

#profile {
font-size: 0.75em;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
color:#666666;
background-color:#FFFFFF;
position:absolute;
margin-left: 340px;
width:600px;
height:auto;
padding:10px;
}


#profilepic {
float:left;
}

#bio{
margin-left:200px;
padding:0px;
text-transform:none;
line-height: 1.4em;
}

#back{
padding:10px;
margin-top:300px;
margin-top:auto;
float:right;
}

#back a {text-decoration: none;
}

#back:hover {text-decoration:underline;
}

ul#items-for-sale {
list-style-type : none;
width : 100px;
margin : 0em 0 0 0em;
padding : 0;
font-size: 75%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
color:#666666;
}

li.bag { position: relative ;
float :left;
width: 225px;
padding: 0 0em 1.5em 1em   ;
}
  
li.bag a {text-decoration: none;
color:#33FF33; }

li.bag {background-color:#F4FFEF;}
li.bag:hover { background:#FFFFFF; }

/* PEOPLE */

ul#peoplegrid {
display: block;
list-style-type : none;
width :700px;
height: 750px;
font-size: 0.85em;


}

li.people {
display: block;
float :left;
width: 180px;
padding: 10px 10px 5px 10px   ;
background-color:#F4FFEF;
}
  
li.people a {
text-decoration: none;
color:#33FF33; 

}


li.people h3 {
text-align: center;
text-transform: capitalize;
letter-spacing: .3em;
height:8px;
}

li.people:hover { background:#FFFFcc; }

/* PEOPLE END */

ul#boutique {
list-style-type : none;
width : 640px;
font-size: 75%;

color:#666666;
}
li.boutique { position: relative ;
float :left;
width: 200px;
padding: 0px 0 10px 10px  ;
}
  
li.boutique a {text-decoration: none;
color:#33FF33; 
padding: 15px 0 0 0px;}

li.boutique {background-color:#F4FFEF;}
li.boutique:hover { background:#FFFFFF; }

li.boutique h3 {
height:20px;
padding: 0 0 0 px;}


img { border: none; }


ul#projectprofile {
list-style-type : none;
width : 810px;
margin-left: 0px;
margin-top: 0px;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
background-color:#E3F5EC;
}

li.project { position: relative ;
float :left;
width: 250px;
padding-right:10px  ;
padding-bottom:5px;
padding-left:10px;
}

li.project a {text-decoration: none;
color:#33FF33; }

li.project {background-color:#E3F5EC;}
li.project:hover { background:#FFFFFF; }
 
 
ul#thumbnails {
list-style-type : none;
width : 550px;
margin : 0em 0 0 0em;
padding : 0px;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
color:#666666;
}

li.thumb { position: relative ;
float :left;
width: 100px;
padding:10px  ;
}

li.thumb a {text-decoration: none;
color:#33FF33; }

li.thumb {background-color:#F4FFEF;}
li.thumb:hover { background:#FFFFFF; }

img.gallery-vertical{
margin-left:40px;
padding: 1em;
}

img.gallery-horizontal{
padding: 1em; }


ul#current-people{ list-style-type : none;
width : 900px;
margin : 0em 0 0 0em;
padding : 0;
border-top : 7px solid#BAEFEC; 
font-size: 75%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
color: #666699;
}


h3 { color:#333333;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: normal ;
font-size: 80%;
letter-spacing:0.5em;
text-transform:lowercase; }

h2 { color:#333333;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: normal ;
font-size: 80%;
letter-spacing:0.3em;
text-transform:lowercase; }


li.nav {
list-style-type:circle;
list-style-image:url(../image/dotlist.png);
margin-left:20px;
padding: 2em 0 .1em 0px;
font-size: 70%;
text-transform: uppercase;
font-style: normal ;
font-family: Georgia, "Times New Roman", Times, serif;
border-bottom: 1px dotted #FF3399;
font-weight:bold ;
letter-spacing:0em;
color: #666699; 
color:#FF3399}


li.nav a  {
display:block;
font-size: 100%;
text-transform:lowercase;
font-style: normal ;
font-family:Georgia, "Times New Roman", Times, serif;
letter-spacing: 0.5em;
color:#333333;
text-decoration:none;
padding-left:10px;
}

li.nav:hover { 
background:#CCFFFF;
text-decoration:line-through;
}

H1 { 
padding: 0px 0 0 40px;
font-size:200%; 
font-family:Georgia,Times, serif; 
font-weight: bold;
font-style:italic; 
text-transform:lowercase; 
letter-spacing: .3em;
color: #383838;
}
 
.gallerycontainer{
border-left: 1px dashed #CCCCCC;
padding-left:-1000px;
float:left;
margin-left:20px;
margin-top: 20px;

/*Add a height attribute and set to largest image's height to prevent overlaying*/
}
.thumbnail img{
border: 1px solid white;
margin: 0 4px 3px 0;
padding:4px;
}



.thumbnail span{ /*CSS for enlarged image*/
position:absolute;
background-color:#FFFFFF;
padding:5px ;
left: -1000px;
border: 1px dashed #FF3399;
visibility:hidden;
font-size:90%;
color: grey;
text-decoration:none;
}

.thumbnail span img{ /*CSS for enlarged image*/
padding: 2px;
margin-right:
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility:visible;
position:absolute;
top: 190px;
left: 460px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

#video {
position:fixed;
margin-left:400px;
padding-right : 300px;
margin-top:0px;

}

#index {
margin-left:90px;
margin-top:50px;
}

#indextransparency {
background-image:url(../image/indextransparency.png);
background-repeat:repeat-x repeat-y;
margin-left:auto;
margin-right:auto;
width: 1150px;
height: auto;
z-index:-1;
}

#peoplehotspot {
position:absolute;
width:180px;
height:120px;
margin-left: 375px;
margin-top: 290px;
z-index:1;
}

#peoplehotspot:hover {
background-image:url(../image/peoplehotspothover.png);
background-repeat:no-repeat;
}

#ielhotspot {
position:absolute;
background-color:;
width:310px;
height:240px;
margin-left:430px;
margin-top:50px;
z-index:1;
}

#ielhotspot:hover {
background-image:url(../image/ielhover2.gif);
background-repeat:no-repeat;
}

#studiohotspot {
position:absolute;
background-color:;
width:210px;
height:120px;
margin-left:570px;
margin-top:330px;
z-index:1;
}

#studiohotspot:hover {
background-image:url(../image/studiohotspothover.png);
background-repeat:no-repeat;
}


#contacthotspot {
position:absolute;
background-color:;
width:210px;
height:120px;
margin-left:790px;
margin-top:330px;
z-index:1;
}

#contacthotspot:hover {
background-image:url(../image/contacthover.png);
background-repeat:no-repeat;
}


#boutiquehotspot {
position:absolute;
background-color:;
width:190px;
height:100px;
margin-left:700px;
margin-top:490px;
z-index:1;
}

#boutiquehotspot:hover {
background-image:url(../image/boutiquehotspothover.png);
background-repeat:no-repeat;
}

#projecthotspot {
position:absolute;
background-color:;
width:210px;
height:100px;
margin-left:340px;
margin-top:460px;
z-index:1;
}

#projecthotspot:hover {
background-image:url(../image/projecthotspothover.png);
background-repeat:no-repeat;
}

#studiomain {
position:absolute;
margin-left:330px;
}

#contactmain {
font-size:110%; 
font-family:Georgia,Times, serif; 
font-weight:normal;
text-transform:lowercase; 
letter-spacing: .2em;
line-height: 1.5em;
color: #383838;
position:absolute;
margin-left:400px;
margin-top:50px;
}



#arrowleft {
position:absolute;
margin-left:180px;
margin-top:100px; }

#arrowleft:hover {
background-image:url(../image/arrowbackwardhover.png);
background-repeat:no-repeat;
}

#arrowright {
position:absolute;
margin-left:930px;
margin-top:100px; }

#arrowright:hover {
background-image:url(../image/arrowforwardhover.png);
background-repeat:no-repeat;
}

#greysquare {
margin-left:900px;
margin-top:460px;
}

#backtothumb a {text-decoration: none;
}

#backtothumb:hover {text-decoration:underline;
}

#projectdescription {
margin-left:20px;
}

/*Group Project*/

ul#groupproject {
margin-left: 300px;
display: block;
list-style-type:none;
padding:5px;
width:580px;
height:175px;
background-color:#E3F5EC;
margin-top: 50px;

}

#groupproject li{
display: block;
clear: none;
float:left;
padding:20px;
}

#groupproject li:hover {
background-color:#FFFFFF;
}



#group {
margin-top: 70px;
margin-left:320px;
}


/*End Group Project*/















#projectprofile {
font-size: 75%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
color:#666666;
background-color:#F9FFF8;
position:absolute;
margin-left: 490px;
width:290px;
height:auto;
padding:20px;
}


#videoblurb {
padding:18px;
width:510px;
background-color:#FFFFCC;
font-size: 90%;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
letter-spacing: .2em;
padding-top:10px;
color:#666666;}