/* Zero down margin and paddin on all elements */
* { margin: 0; padding: 0; }

body {
  font-family: "Helvetica", "Verdana", "Arial", sans-serif;
  font-size: 88%;
  color: #000;
  text-align: center;
  line-height: 1.5em;
  background-color:#fff;
}

h1, h2, h3{
  margin: 1em;
}

h1 {
  font-size: 1.5em;
  font-weight: bold;
  color: #333;
}

h2 {
  font-size: 1.3em;
  font-weight: bold;
  color: #333;
}

h3 {
  font-size: 1em;
  font-weight: bold;
  color: #333;
}

p {
  margin: 1em 1em;
}

li {
  font-size: 0.9em;
  font-weight: bold;
}

img { border: none; margin: 0;}



a { color: #000;}

/* The Core Technique
================================= */
#wrapper {
    width: 1010px; 
    margin: 0 auto;
	margin-top: 10px;    
}

#header {
    margin: 0;}

#navbar { 
    width: 700px;
    float: left;
}

#altContent {
	margin-bottom: 10px;
	min-height: 337px;
}

#altContent a{
	font-weight: bold;
}

#altContent p{
	color: #000000;
	margin: 100px 290px;
	padding: 20px;
	text-align: center;
	background: url(../media/images/bg.png);
}

#content { 
    width: 1010px;
    min-height: 400px;
}

#main_content { 
    width: 500px; 
    float: left;
	text-align: left;
}

#secondary_content { 
  width: 500px;
  float: right;
  text-align: left;
}

#col_1, #col_2, #col_3, #col_4{border-top-style: solid; border-top-color: #000;}

#col_1 {background-color: #bbb; float: left; width: 248px; text-align: left; color: #fff; }
#col_1 h2{color: #fff; background:url(../media/images/arrow_white.gif) no-repeat top right;}

#col_2 {float: right; width: 240px; text-align: left;}
#col_2 h3{background:url(../media/images/arrow_grey.gif) no-repeat top right;}
        
#col_3 {float: left; width: 248px;}
#col_3 h3{text-align: right;}
#col_3 img{width: 100px; height: 100px; border: thin; border-color: aaaaaa; border-style: dashed; float: right;}
        
#col_4 {float: right; width: 240px;}
#col_4 p{line-height: 1.25em;}
#col_4 h3{text-align: right;}
#col_4 table, tr, td { border-collapse: collapse; vertical-align: middle; text-align: left; font-size: 0.95em;}
#col_4 tr{border-bottom: thin; border-bottom-color: #999; border-bottom-style: dashed;}
#col_4 img{margin: 0.5em; border:1px solid #a9a9a9;}
.title {color: #333; font-weight: bold; font-size:0.9em;}
.underline { text-decoration: underline;}


#footer { 
  clear: both; 
}

/*-------------------- header -------------------------------*/
#header { height: 55px; background-color: #fff; background-image: url("../media/images/logo.gif");
    background-repeat: no-repeat; color: #fff;
}

/*-------------------- footer -------------------------------*/
#footer { font-size: 90%; letter-spacing: 1; color: #888;}

/*-------------------- navbar -------------------------------*/
#navbar { height: 35px;}
#navbar ul { /*padding: 1em;*/ list-style: none;}
#navbar ul li{ float: left;}
#navbar ul a { display: block; border-left: thin; border-left-style: solid; border-left-color: #666;
                padding: 0 1.2em; line-height: 2.1em; text-decoration: none; color: #666; font-weight: bold;
            }
#navbar ul a#current_page{ color: #fff; background-color: #666; }
#navbar ul li#home a{ border-left: none; }
#navbar ul a:hover{ color: #fff; background-color: #ddd; }

/*-------------------- navbar_footer -------------------------------*/
#navbar_footer { height: 25px;}
#navbar_footer p { margin: 0; line-height: 2em;}
#navbar_footer p a { border-left: thin; border-left-style: solid; border-left-color: #666;
                padding-left: 1em; padding-right: 0.5em; text-decoration: none; color: #888; font-weight: normal;
            }
#navbar_footer p a.current_page{ color: #000; }
#navbar_footer p a#home_footer { border-left: none; }
#navbar_footer p a:hover{ color: #000; }

/*-------------------- address -------------------------------*/
#address { border-top: #888 thin dotted; line-height: 2em; height: 40px;}

/*-------------------- projects -------------------------------*/

#intro { line-height: 1.5em;  margin-top: 40px;}

.photo {float: left; margin-right: 2em; margin-bottom: 1em; width: 220px;}
.photo p{margin-top: 12.5em; text-align:left; margin-left: 0.25em; margin-bottom: 0px;}
.photo img{background-color: #fff; border:1px solid #a9a9a9; padding:7px; float: left;}
.photo img.icon{border:0; padding-right:1px;}

.category {float: left; margin-left: 1em;}
.category h2{margin: 1em 0; text-align: left; border-bottom: #999999 thin dotted;}

.spacer {clear: both; height: 10px;}

/*-------------------- project details -------------------------------*/

#details_image img{background-color: #fff; border:1px solid #a9a9a9; padding:7px;}

#details_text h3{ color:#000000; margin: 4em 0 1em 0; border-bottom: #999999 thin dotted;}

#details_text { margin-top: 4em;}

#details_text p{color:#000000; margin: 1em 1em; text-align: justify;}

#details_text a.go_to_gallery{ font-weight:bold; text-decoration: underline; color:#666; margin-left:10px; background:url(../media/images/arrow_grey_small.gif) no-repeat top right; padding-right:15px; padding-bottom:10px;}

#details_text a.back_to_projects{ font-weight:bold; text-decoration: underline; color:#bbb; background:url(../media/images/arrow_grey_small_2.gif) no-repeat center left; padding-left:15px; padding-bottom:10px;}

/*-------------------- company -------------------------------*/

#company_contents {float: left;}
#company_contents p {text-align: left; margin-left: 1.5em; margin-right: 1.5em;}
#company_contents h3 {text-align: left;}
#company_contents img{float:left; border:1px solid #a9a9a9; padding:7px; margin: 0 2em 1em 1em; }

/*-------------------- contacts -------------------------------*/

#map_canvas {width: 400px; height: 400px; border: solid; margin: 1em; background-color: #fff; border:1px solid #a9a9a9; padding:7px;}
#map_text{}

/*-------------------- home -------------------------------*/

.studiogi {color: #000; font-weight: bold;}
