/* -- makeUp stylesheet -- */ 

/* -- ELEMENT STYLES -- */
body
{ 
  font-family: verdana,  sans-serif;
  font-size: 11px;
  color: #333333;
 /* color: #656565; */
  background: white url(../images/backgrounds/background_canongate.jpg) no-repeat;
  
}

b
{ color: #666666; }

hr
{ border: 1px dashed #ff6600; }

img
{
 border: 0px;
}


/* -- LINKS STYLES -- */
a:link
{ color: #ff6600; }

a:visited
{ color: #ff6600; }

a:hover
{ color: #333333; }

a.selected
{ color: #333333; }



a.copy
{ color: #333333; }

a.copy:visited
{ color: #333333; }

a.copy:hover
{ color: #ff6600; }

a.projLink
{ 
 color: #333333; 
 text-decoration: none; 
}

a.projLink:visited
{
 color: #333333;
 text-decoration: none;
}

a.projLink:hover
{
 color: #ff00d2;
 text-decoration: none;
}

a.sectorLink
{
 color: #333333;
 text-decoration: none;
}

a.sectorLink:visited
{
 color: #333333;
 text-decoration: none;
}

a.sectorLink:hover
{
 color: #ff00d2;
 text-decoration: none;
}

a.projSelectedLink
{ 
 color: #ff00d2; 
 text-decoration: none;
}

a.projSelectedLink:visited
{ 
 color: #ff00d2; 
 text-decoration: none;
}

a.clientLogin
{
 color: #FFFFFF;
 text-decoration: none;
}

a.clientLogin:visited
{
 color: #FFFFFF;
 text-decoration: none;
}
  
a.window
{
 display: block;
 background:white url(../images/window.jpg) no-repeat;
 width:695px;
 height:272px;
}

a.window:Hover
{
 display: block;
 background:white url(../images/window_story.jpg) no-repeat;
 width:695px;
 height:272px;
}



/* -- greater than - to separate underline from link-- */
a.gt
{
  text-decoration: none;
  color: #ff6600;
}

a.gt:hover
{ color: #333333; }



/* -- BACKGROUND (background image) -- */
 #background
{ 
  position: absolute;
  top: 0px; 
  left: 10%;
  width: 1024px;
  height: 500px;
  z-index: 0;
}


/* -- WRAPPER (main container) -- */
#wrapper
{ 
  position: relative;
  top: 4%; 
  left: 15%;
  width: 725px;
  height: 560px;
  background-color: #ffffff;
  z-index: 2;
}

/* -- SPLASH CONTAINER -- */
#splashCol
{
  position: relative;
  width: 175px;
  top: 4%;
  left: 65%;
  height: 530px; 
  background-color: #ffffff;
  padding: 15px 15px 15px 15px;
}



/* -- HEADER 3 COLUMN CONTAINERS -- */
#head
{ height: 93px; }

.navigation
{
  position: relative;
  width: auto;
  top: 19px;
  height: 20px;
  margin: 0px 190px 0px 125px;
  background-color: white;
  padding: 0px 20px 0px 20px;
  z-index: 3;
}

#logo
{
  position: absolute;
  top: 15px;
  left: 15px;
  height: 22px;
  width: 110px;
  z-index: 2;
/* Here is the ugly brilliant hack to 
  protect ie5 from it's own stupidity */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 110px;
}
  /*"be nice to Opera 5". */
  body>#logo {width:110px;}


#clientlogin
{
  position: absolute;
  width: 169px;
  height: 14px;
  right: 15px;
  top: 24px;
  background-color: #ff5600;
  color: #ffffff;
  z-index: 1;
  padding: 1px 3px 0px 3px;
  text-transform: uppercase;
  font-size: 10px;
  /* Again, the ugly brilliant hack.*/
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 169px;
}
  /*"be nice to Opera 5". */  
  body>#clientlogin {width:169px;}



/* -- HIGHLIGHTS HEADING CONTAINERS -- */
#highlightsHead
{ height: 14px; }

#highlights
{
  margin-left: 535px;
  background-color: #ff00d2;
  color: #ffffff;
  width: 169px;
  height: 14px;
  padding: 1px 3px 0px 3px;
}

/* -- PROJECTS HEADING 3 COLUMN CONTAINERS -- */

.clientsHead
{
  position: relative;
  width: auto;
  height: 14px;
  margin: 0px 409px 0px 145px;
  padding: 1px 0px 0px 3px;
  z-index: 3;
  background-color: #ff00d2;
  color: #ffffff;
}

#sectorHead
{
  position: absolute;
  top: 93px;
  margin: 0px 0px 0px 15px;
  padding: 1px 0px 0px 3px;
  z-index: 2;
  width: 107px;
  height: 14px;
  background-color: #ff00d2;
  color: #ffffff;
  /* Here is the ugly brilliant hack to 
  protect ie5 from it's own stupidity  */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 107px;
}
   /* "be nice to Opera 5".   */
  body>#sectorHead {width:107px;}

  
#descriptionHead
{
  position: absolute;
  top: 93px;
  width: 366px;
  height: 15px;
  right: 14px;
  padding: 1px 0px 0px 3px;
  z-index: 1;
  background-color: #ff00d2;
  color: #ffffff;
  /* Again, the ugly brilliant hack. */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 366px; 
}
   /* "be nice to Opera 5".  */
  body>#descriptionHead {width:366px;}
 

/* CASE STUDIES HEADING */

.caseStudyHead
{
  position: relative;
  width: auto;
  height: 14px;
  margin: 0px 15px 0px 145px;
  padding: 1px 0px 0px 3px;
  z-index: 3;
  background-color: #ff00d2;
  color: #ffffff;
}

#sectorHead
{
  position: absolute;
  top: 93px;
  margin: 0px 0px 0px 15px;
  padding: 1px 0px 0px 3px;
  z-index: 2;
  width: 107px;
  height: 14px;
  background-color: #ff00d2;
  color: #ffffff;
  /* Here is the ugly brilliant hack to 
  protect ie5 from it's own stupidity */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 107px;
}
   /* "be nice to Opera 5".  */
  body>#sectorHead {width:107px;}
 
  
/* -- MAIN 3 COLUMN CONTAINERS -- */
.contentCol 
{
  position: relative; 
  width: auto;
  top: 5px;
  height: 430px;
  margin: 0px 190px 0px 125px;
  padding: 0px 20px 0px 20px;
  z-index: 3; 
}

#languagesCol
{
  position: absolute;
  top: 347px; 
  padding: 0px 0px 0px 15px;
  z-index: 2;
  width: 110px;
  /* Here is the ugly brilliant hack to 
  protect ie5 from it's own stupidity  */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 110px;
}
   /*"be nice to Opera 5".  */
  body>#languagesCol {width: 110px;}
 
  
#highlightsCol
{
  position: absolute;
  width: 175px;
  top: 115px;
  right: 15px; 
  z-index: 1;
  /* Again, the ugly brilliant hack.*/ 
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 175px;
}
  /* "be nice to Opera 5". */
  body>#highlightsCol {width: 175px;}
  
    

/* -- PROJECTS 3 COLUMN CONTAINERS -- */
.clientsCol
{
  position: relative;
  top: 16px;
  width: auto;
  height: 429px;
  margin: 0px 389px 0px 125px;
  padding: 0px 20px 0px 20px;
  z-index: 3;
}
 

#sectorCol
{
  position: absolute;
  top: 122px;
  padding: 0px 0px 0px 15px;
  z-index: 2;
  width: 110px;
  /* Here is the ugly brilliant hack to 
  protect ie5 from it's own stupidity */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 110px;
}
  /*"be nice to Opera 5".  */
  body>#sectorCol {width: 110px;}
 
  
#descriptionCol
{
  position: absolute;
  width: 369px;
  height: 437px;  
  top: 120px;
  right: 15px;
  z-index: 1;
  /* Again, the ugly brilliant hack.*/
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 369px;
  
}
  /*"be nice to Opera 5". */
  body>#descriptionCol {width: 369px;}
  
  
  
/*added for client list page - starts here */
  
#listCol1
{
float: left;
width: 180px;
padding-top: 4px;
}

#listCol2
{
padding-top: 4px;
}
  
/*added for client list page - finishes here */  

  
  
 

/* -- CONTACT CONTAINERS -- */
.mapCol
{
  position: relative;
  width: auto;
  top: 5px;
  height: 430px;
  margin: 0px 190px 0px 15px;
  padding: 0px 20px 0px 20px;
  z-index: 3;
}

#contactCol
{
  position: absolute;
  width: 175px;
  top: 115px;
  right: 15px; 
  z-index: 1;
  /* Again, the ugly brilliant hack. */
  voice-family: "\"}\"";
  voice-family: inherit;
  width: 175px;
  
}
  /*"be nice to Opera 5".  */
  body>#contactCol {width: 175px;}
 

/* -- WINDOW CONTAINER -- */
.windowCol
{
  width: auto;
  top: 5px;
  height: 430px;
  margin: 0px 15px 0px 15px;
}



	

/* -- FOOTERS -- */
#footer
{
 text-align: right;
 padding: 0px 10px 0px 10px;
 height: 15px;
}

#projectFoot
{
 position: absolute;
 bottom: 70px;
 right: 1px;
 width: 100%;
}
/* when 4 pics under project*/
#newprojectFoot
{
 position: absolute;
 top: 380px;
 bottom: 70px;
 right: 1px;
 width: 100%;
}

#projFootLink1
{
 float: left;
 width: 175px;
}

#projFootLink2
{
 float: right;
 width: 170px;
 padding-right: 5px;
}


/* -- ALL OTHER STYLES -- */

.heading 
{
  font-size: 12px;
  color: #666666;
  font-weight: bold;
}

/* added by IA */
.casestudyFont 
{
  font-size: 10px;
  color: #333333;
}

.left
{ 
  float: left; 
}

.leftUn
{ 
  float: left; 
  text-decoration: underline;
}

.right
{ float: right; }

.rightbrown
{ 
  float: right;
  color: #ff6600;
}

.language
{
  background-color: #ff5600;
  height: 14px;
  color: #ffffff;
  margin-top: 3px;
  padding: 1px 3px 0px 3px;
  font-size: 10px;
}

.nav
{ border: none; }

.projImgRight
{ 
 float: right; 
 padding-top: 10px;
 padding-bottom: 10px;
 display: block;
}

.projImgLeft
{ 
 float: left; 
 padding-top: 10px;
 padding-bottom: 10px;
 display: block;
}

.casestudyImg
{ 
 float: right;
 padding-left: 15px;   
}



.spacing
{
 padding: 3px 0px 3px 0px;
}

.linkCaseStudy
{
	position: absolute;
	top: 200px;
	left: 200px;
	width: 250px;
	height: 250px;
	z-index: 4;
}