/* ------------------------------ common ------------------------------ */

body {
    font-family: "Arial, ËÎÌå";
    font-size:   9pt;
    margin:      0;
    padding:     0;
}

table {
    font-size: 100%;
	line-height:1.2;
}

a img {
    border: none;
}

a {
    text-decoration: none;
}

a:visited{
	text-decoration: none;
	color :          #FFF ;
}

a:active {
	text-decoration: none;
	color :          #CCC;
}

a:hover {
    color:           #FFF;
    text-decoration: underline;
}

#the-index {
    width:          800px;
    padding:        30px;
    text-align:     center;
    border-left:    0px;
    border-right:   0px;
}

#the-portfolio{
    width:          950px;
	height:         1431px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
 
}

#the-nature{
    width:          950px;
	height:         2200px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
 
}

#the-atm{
    width:          950px;
	height:         2732px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
 
}

#the-1bib{
    width:          950px;
	height:         3778px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-product{
    width:          950px;
	height:         1195px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-web{
    width:          950px;
	height:         1495px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-stb{
    width:          950px;
	height:         2150px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-poster{
    width:          950px;
	height:         2232px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-sign{
    width:          950px;
	height:         2203px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-photography{
    width:          950px;
	height:         3408px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;

}

#the-patent{
	width:          950px;
	height:         1226px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

#the-cartoon{
	width:          950px;
	height:         1442px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

#the-processing{
	width:          950px;
	height:         1223px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

#the-webtv{
	width:          950px;
	height:         3855px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

#the-graduation{
	width:          950px;
	height:         3091px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

#the-wayfinding{
	width:          950px;
	height:         1100px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

#the-book{
	width:          950px;
	height:         1307px;
    padding:        0px;
	border-right:   2px black solid;
	background:     url(../img/background.gif) repeat-y;
}

/* ------------------------------ header pane ------------------------------ */

#pattern-pane {
    height:     415px;
	width:      508px;
	position:   relative;
}

#box {
	height:     435px;
	width:      438px;
	right:      0px;
	margin-top: 20px;
    position:   absolute;
}

/* ------------------------------ content pane ------------------------------ */

#link-pane {
	position:   relative;
	top:        28px;
	height:     20px;
	width:      800px;
}

.portfolio {
	position:   absolute;
	top:        0px;
    left:       247px;
}	

.blog {
	position:   absolute;
	top:        0px;
    left:       387px;
}	

.flickr {
	position:   absolute;
	top:        0px;
    left:       483px;
}	

#main-layout {
 border: 3px solid green;
 clear: none; 
 position: relative; 
 top: 0;
}
#left-column {
	position:   relative; /* david */
	padding:    0px;
	width:      594px;
	font-family:white;
	vertical-align:  top;
}

#right-column {
	position:        right;
	width:           356px;
	vertical-align:  top;
}

#link2-pane {
	position:   absolute;
	height:     20px;
	top:        280px;
	
}

.homepage {
	position:   absolute;
	top:        0px;
    left:       80px;
}

.blog2 {
	position:   absolute;
	top:        0px;
    left:       270px;
}

.flickr2 {
	position:   absolute;
	top:        0px;
    left:       392px;
}

#text-pane{
	left:          80px;
	top:           320px;
	width:         440px;
	text-align:    left;
	font-family:   Arial;
	color:         white;
}

#text-pane2{
	position:      relative;
	left:          80px;
	top:           400px;
	width:         440px;
	text-align:    left;
	font-family:   Arial;
	color:         white;
}

.text{
	position:      relative;
	top:           100px;
}

.text2{
	position:      relative;
	top:           160px;
}

.text3{
	position:      relative;
	top:           0px;
}

.text-list{
	font-weight: bold;
	padding:     8px;
	font-size:   16px;
	color:       white;
}

.text2-list{
	Position:    relative;
	padding:     3px;
	left:        120px;
	font:        12px Arial;
}

.text3-list{
	Position:    relative;
	font:        14px Arial bold;
	left:        120px;
	padding:     5px;
}

.text-list4{
	font-weight: bold;
	font-size:   16px;
	color:       white;
}

#pattern2-pane {
    height:     415px;
	width:      508px;
	position:   relative;
}

.panel-column{
	background: url(../img/panel.gif);
    height:     539px;
	width:      222px;
	position:   relative;
	top:        500px;
	left:       60px;
}

.user-experience{
	position:   relative;
	top:        122px;
}

.new-media-art{
	position:   relative;
	top:        146px;
}

.sign-design{
	position:   relative;
	top:        170px;
}

.user-interface{
	position:   relative;
	top:        194px;
}

.website-design{
	position:   relative;
	top:        218px;
}

.product-design{
	position:   relative;
	top:        242px;
}

.poster-design{
	position:   relative;
	top:        268px;
}

#image-column{
	padding:    3px;
	position:   relative;
	left:       40px;
	top:        30px;
	    
}	

/* ------------------------------ footer pane ------------------------------ */

#footer-pane {
   	position:        relative;
	bottom:          -45px;
	font-family:     Arial,ËÎÌå;
	text-align:      center;
	padding:         2em;
	color:           black;
	text-decoration: none;
}

#footer2-pane {
	background:  url(../img/pattern3.gif)  top left no-repeat;
   	position:    relative;
	width:       594px;
	height:      327px;
	bottom:      -490px;
}

#footer3-pane{
	bottom:      -360px;
	width:       438px;
	float:       right;
	font-family: Arial,ËÎÌå;
	text-align:  center;
	color:       white;
   	position:    relative;

}