/*
Theme Name: Ecotone
Theme URI: http://wordpress.org/
Description: Ecotone Theme
Author: Il-Young Son
Version: 0.1
Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style
*/


/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}

body {
    line-height: 1;
}
h1, h2, h3, h4, h5, h6 {
    clear: both;
    font-weight: normal;
}
ol, ul {
    list-style: none;
}
blockquote {
    quotes: none;
}
blockquote:before, blockquote:after {
    content: '';
    content: none;
}
del {
    text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a img {
    border: none;
}

/* =Layout
-------------------------------------------------------------- */

html {
  height: 628px;
}

#container {
    margin: 0 0 0 0;
    width: 900px;
    height: 476px;
}

#position {
    margin: 0 0 0 0;
    height: 100%;
    width: 100%;
}

#content {
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
    height: 450px;
}

#col1,
#col2,
#col3,
#col4 {
    float: right;
    overflow: hidden;
    width:  218px;
}

#spacer {
    overflow: hidden;
    width: 10px;
}

#footer {
    clear: both;
    width: 100%;
}

#wrapper {
    position: relative;
    margin: 100px auto;
    width: 900px;
    height: 528px;
    overflow:hidden;
    display: block;
}

.hide {
    display: none;
}

#tagline_intro {
  width: 900px;
  height: 450px;
  /* border: 1px solid #999999; */
  opacity: 0;
  filter: alpha('opacity=0');
  cursor: pointer;
}

#tagline_intro img {
  width: 900px;
  height: 450px;
}
/* =Fonts
-------------------------------------------------------------- */
body {
    font-family: "Arial", sans-serif;
    font-size: 10px;
}



/*	display: table;*/
/*	background: #fff; */
/*	
	margin-top: 20px;
	padding: 0 20px;
*/



/* =Global Elements
-------------------------------------------------------------- */

/* Main global 'theme' and typographic styles */

body {
    background: #ffffff;
/*	height:100%;*/
}

hr {
    background-color: #e7e7e7;
    border: 0;
    clear: both;
    height: 1px;
    margin-bottom: 18px;
}

/* Text elements */
p {
    margin-bottom: 18px;
}
ul {
    list-style: square;
    margin: 0 0 18px 1.5em;
}
ol {
    list-style: decimal;
    margin: 0 0 18px 1.5em;
}
ol ol {
    list-style: upper-alpha;
}
ol ol ol {
    list-style: lower-roman;
}
ol ol ol ol {
    list-style: lower-alpha;
}
ul ul,
ol ol,
ul ol,
ol ul {
    margin-bottom: 0;
}
dl {
    margin: 0 0 24px 0;
}
dt {
    font-weight: bold;
}
dd {
    margin-bottom: 18px;
}
strong {
    font-weight: bold;
}
cite,
em,
i {
    font-style: italic;
}
big {
    font-size: 131.25%;
}
ins {
    background: #ffc;
    text-decoration: none;
}
blockquote {
    font-style: italic;
    padding: 0 3em;
}
blockquote cite,
blockquote em,
blockquote i {
    font-style: normal;
}
pre {
    background: #f7f7f7;
    color: #222;
    line-height: 18px;
    margin-bottom: 18px;
    padding: 1.5em;
}
abbr,
acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}
sup,
sub {
    height: 0;
    line-height: 1;
    position: relative;
    vertical-align: baseline;
}
sup {
    bottom: 1ex;
}
sub {
    top: .5ex;
}
input[type="text"],
textarea {
    background: #f9f9f9;
    border: 1px solid #ccc;
    box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
    padding: 2px;
}
a:link {
    text-decoration: none;
    color: #999999;
}
a:visited {
    text-decoration: none;
    color: #999999;
}
a:active,
a:hover {
    text-decoration: none;
    color:#262626;
}


/* Text meant only for screen readers */
.screen-reader-text {
    position: absolute;
    left: -9000px;
}


/* =Header
-------------------------------------------------------------- */

#header {
    position: relative;
    margin: 0 0 0 0;
    width: 100%;
    height: 52px;
/*	height: 100%;*/
}

#mainhead {
    margin: 0 0 0 0;
    width:100%;
    height: 24px;
    overflow: hidden;
}



#tagline {
    color: #262626;
/*    color: #999999;*/
    margin: 0 0 0 0px;
    font-size: 10px;
    display: inline-block;
    width: 228px;    
}

/* This is the custom header image */
#branding {
    display: inline-block;
    width:216px;
    height: 24px;
    margin: 0 9px 0 0;
}

img.logo {
/*    height: 24px;*/
    width: 216px;
}

/* =Menu
-------------------------------------------------------------- */
#menu {    
    position: absolute;
    top: 0px;
    right: 0px;
    display: inline-block;
    font-size: 10px;    
    color: #999999;
    margin: 13px 0 0 0;    
/*    width: 444px;*/
}

.curitem,
.item {
    display: inline;
    text-align: right;
    margin: 0 0 0 10px;
}

.curitem a{
    color:#262626;
}

.current {
    display: inline;
    text-align: right;
    margin: 0 0 0 10px;
    color: #262626;
}

.current a {
    cursor: text;
    color: #262626;
}
/*
.current a:link,
.current a:visited {
    color: #262626;
}
*/
#subhead {
    position: absolute;
    margin: 6px 0 12px 0px;
    padding-left: 10px;
    top: 24px;
/*    left: 445px;*/
    height: 10px;
/*    width: 100%;*/
/*    overflow: hidden;*/
    display:none;
}

#submenu {
    margin: 0; 
/*    overflow: hidden;*/
}

#submenuitem {
    text-transform: lowercase;
}

/* =Content
-------------------------------------------------------------- */
/* Slideshow Content */
#slideshow {
    float:left
    overflow:hidden;
    height: 448px;
    width: 898px;
    opacity:0;
    filter:alpha('opacity=0');
    border: 1px solid #999999;
}

.slideimg {
    width: 898px;
    height: 448px;
    /* opacity: 0; */
/*    filter:alpha(opacity=0);
*/
}

/* Slide info */
#slidetext {
    position:relative;
    left: 1px;
    margin: 0 0 0 0;
    height: 70px;
    width: 898px;
    overflow: hidden;
    position:relative;
    top: -70px;
    z-index: 999;
    background: #262626;
    opacity: 0;
    fliter:alpha(opacity=0);

}

#slidetextcontent {
    margin: 0 0 0 0;
    background: transparent;
    opacity: 1;
/*    background: #262626;
    opacity: 0;*/
    height: 100%;
    width: 100%;

}

#slidetitle {
    margin: 0 0 0 0;
    padding: 10px 0 8px 15px;
    font-family: "Arial Black", sans-sarif;
    font-size: 14px;
    color: #ffffff;
}

#slidedesc {
    margin:0 0 0 0;
    padding: 0 0 0 15px;
    font-family: "Arial", sans-sarif;
    font-size: 11px;
    color: #ffffff;
}

#slidelink {
    margin:0 0 0 0;
    padding: 4px 0 0 15px;
    font-family: "Arial", sans-sarif;
    font-size: 11px;
}
a.readmore  {
    text-decoration: underline;
    color: #ccff00;
}

/* Slide nav */
#nav {
    position: absolute;
    z-index: 1;
    bottom:0px;
    right: 0px;
/*    float: right;*/
    margin-top: 10px;
    height: 15px;
}

#navbutton{
    display: inline-block;
    margin: 0 0 0 5px;
/*    padding: 0 2px 0 3px;*/
    height: 11px;
    width:11px;
    overflow: hidden;
    border: 1px solid #999999;/*#262626;*/
/*    background: #999999;*/
    cursor: pointer;
}

#navbutton.activeSlide {
    background: #262626;
    border: 1px solid #262626;
}

#navbutton a {
    text-decoration: none;
}

#navtxt {
/*    visibility: hidden;*/
    font-size: 0px;
}


/* Profile content */
#profile_left_col {
    position:relative;
    width: 216px;
    height: 450px;
/*    float: left;*/
    margin: 0 12px 0 0;
    padding: 0 0 0 0;
    line-height: 1.4em;
}

#profile_left_border {
    position:relative;
    width: 11px;
    padding: 0 0 0 0;
    border-left-color: #999999;
    border-left-style: solid;
    border-left-width: 1px;    
    height:450px;
    left:2px;
}
#profile_left_content {
    position:relative;
    left:0;
    width: 204px;
    height: 100%;
    padding: 0 0 0 13px;
    text-align: justify;
}
#profile_title{
    position:relative;
    text-transform: uppercase;
    font-weight: bold;
    font-size:11px;
}

#profile_right_col {
    position:absolute;
    top:0px;
    left: 228px;
    height: 448px;
    width: 670px;
/*    float: right;*/
    overflow: hidden;
    margin: 0 0 0 0;
    border: 1px solid #999999;
}
#profile_right_col a {
  text-decoration: none;
}

#profile_right_col img {
    height:448px;
    width: 670px;
}

#pdf {
    position: absolute;
    z-index: 1;
    bottom: 0px;
    right: 0px;
    display: block;
/*    width:100%;*/
    text-align: right;
    font-size: 12px;
    margin-top:15px;
}
#profile_img {
    width:673px;
    height: 450px;
}

#person_left_col{
    height:448px;
    width: 216px;
    display: inline-block;
    margin-right: 10px;
    padding: 0;
    border: 1px solid #999999;
/*    float:left;*/
}

#person_left_col img{
    height: 448px;
    width:216px;
}

#person_mid_col {
    position: absolute;
    top: 0px;
    left:228px;
    width: 192px;
    height: 424px;
    display:inline-block;
    margin-right: 10px;
    border: 1px solid #999999;
    padding: 12px;
    line-height:13px;

}

#person_right_col {
    position:absolute;
    top: 0px;
    right: 0px;
    width: 418px;
    height:424px;
/*    float:left;*/
    border:1px solid #999999;
    padding: 12px;
    line-height: 13px;

}

#person_header{
    margin-bottom: 6px;
}
#person_name {
    font-weight: bold;
    font-size: 11px;
    text-transform: uppercase;
/*    margin-bottom:3px;*/
}

#person_role{
    font-size: 9px;
/*    font-weight: bold;*/
    color: #999999;
    text-transform: uppercase;
}

#person_desc {
    text-align: justify;
    margin-bottom: 3px;
    font-size: 10px;
    line-height: 1.25;
}
#person_phone {
    font-size: 9px;
    margin-bottom:3px;
}
#person_email {
  position: absolute;
  bottom: 12px;
  font-size: 10px;
}

#person_cv_accred,
#person_cv_edu,
#person_cv_exp {
    margin-bottom: 8px;
}
#person_cv_title {
    font-size:11px;
    font-weight:bold;
}
#person_cv_year {
    width: 46px;
    font-size:9px;
    font-weight: bold;
    float:left;
}

#person_cv_edu_title,
#person_cv_exp_title {
    font-size: 9px;
    font-weight:bold;
}

#person_cv_accred_entry,
#person_cv_edu_entry,
#person_cv_exp_entry {
    font-size: 9px;
}

#custom_scroll_content {
    position:relative;
    top:-450px;
    height: 450px;
    width:218px;
    overflow:auto;
}

.scrollgeneric {
    line-height: 1px;
    font-size: 1px;
    position: absolute;
    top: 0; left: 0;
}

.vscrollerbase {
    width: 1px;
    background-color: #999999;
    left: 2px !important;
}

.vscrollerbar {
    position:relative;
    left:-2px;
    width: 4px;
    background-color: #999999;
}

.people_all_img {
    width: 328px;
    height:448px;
/*    float: left;*/
    /* display: inline-block; */
    
}

.people_all_img:hover {
    cursor: pointer;
}

#people_left_col {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 204px;
    height: 450px;
/*    float: left;*/
    padding: 0 0 0 11px;
/*    line-height: 1.75em;*/
    line-height: 1.4em;
    border-left-color: #999999;
    border-left-style: solid;
    border-left-width: 1px;
    display: inline-block;
}

#people_mid_col{
    position: absolute;
    top: 0px;
    left: 216px;
    width: 328px;
    height: 448px;
    margin-left: 12px;
/*    opacity: 0;
    filter: alpha(opacity=0);*/
    border: 1px solid #999999;
    display:inline-block;
}

#people_right_col{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 328px;
    height: 448px;
    margin-left: 12px;
/*    opacity: 0;
    filter: alpha(opacity=0);*/
    border: 1px solid #999999;
    display: inline-block;
}

#person_link {
    color: #999999;
    text-transform: uppercase;
}

#links_container {
    position: relative;
    left:0px;
    width: 30000px;
    height: 100%;
}
#links_content {
position: relative;
width: 900px;
height: 100%;
/*
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #999999;
    padding-left: 15px;
    width: 884px;
    height: 450px;
    -moz-column-count: 4;
    -moz-column-gap: 10px;
    -moz-column-rule: 1px solid #999999;
    -webkit-column-count: 4;
    -webkit-column-gap: 10px;
    -webkit-column-rule: 1px solid #999999;
    column-count: 4;
    column-gap: 10px;
    column-rule: 1px solid #999999;
*/
    float: left;
    line-height:13px;
}

#links_col1{
    position:relative;
    border-left: 1px solid #999999;
    padding-left: 15px;
    width: 201px;
    height:100%;
    margin-right: 10px;
    float:left;
}

#links_col2{
    position:relative;
    border-left: 1px solid #999999;
    padding-left: 15px;
    width: 201px;
    height:100%;
    margin-right: 10px;
    float:left;
}

#links_col3{
    position:relative;
    border-left: 1px solid #999999;
    padding-left: 15px;
    width: 201px;
    height:100%;
    margin-right: 10px;
    float: left;
}

#links_col4{
    position:relative;
    border-left: 1px solid #999999;
    padding-left: 15px;
    width: 201px;
    height:100%;
    float: left;
}

#link_category {
    position:relative;
    margin-bottom: 10px;
}
#link_cat_title {
    position:relative;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: bold;
    color: #262626;
}
/* Contact content */
#contact_left_col {
/*    width: 173px;*/
    width: 204px;
    height: 450px;
/*    float: left;*/
    margin: 0 12px 0 0;
    padding: 0 0 0 11px;
    overflow: hidden;
    line-height: 1.4em;
    border-left-color: #999999;
    border-left-style: solid;
    border-left-width: 1px;    
}

#contact_right_col {
    position: absolute;
    top:0px;
    right: 0px;
    width: 670px;
    height: 448px;;
    border: 1px solid #999999;
/*    float: right;*/
    overflow: hidden;
    display:inline-block;
    margin: 0 0 0 0;
}

#contact_img {
    width:670px;
    height: 448px;
}

#contact_addr {
    font-family: "Arial", sans-serif;
    color: #262626;
    font-size: 10px;
}

#contact_phone {
    font-family: "Arial", sans-serif;
    color: #262626;
    font-size: 10px;
    margin: 2em 0 0 0;
}

.pf_head {
    margin: 0 1em 0 0;
}

#contact_email {
    font-family: "Arial", sans-serif;
    font-size: 10px;
    margin: 2em 0 0 0;
}

#contact_extra {
    font-family: "Arial", sans-serif;
    font-size: 10px;
    margin: 2em 0 0 0;
}


#work_default_img {
    width:898px;
    height:448px;
    border: 1px solid #999999;
}

/* =Footer
-------------------------------------------------------------- */

#footer {
    position:absolute;
    height: 15px;
    bottom: 0px;
    left: 0px;
    margin-top: 12px;
}

#copyright {
    position: relative;
    top: -2px;
    font-family: "Arial", sans-serif;
    font-size:10px;
/*    vertical-align: text-bottom;*/
    color: #999999;
    display: inline-block;
}

#icons {
    height: 15px;
    display: inline-block;
    margin-left: 8px;
}

#icons a {
    text-decorations: none;
}

#icons img.wordpress,
#icons img.linkedin,
#icons img.facebook {
    height:15px;
    width: 15px;
    display: inline-block;
}