html { //height: 100%; }
body { background-color: black; color: white; font-family: "Myriad pro", arial, verdana, sans-serif; //height: 100%; }
body { font-size: 0.8em; line-height: 1.3em; }

#layout_common { position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background-color: #000; min-width: 960px; min-height: 480px; }
#layout { position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;  width: 960px; height: 480px; margin: auto; }
#layout { //margin-left: expression((document.body.clientWidth)<960?'0px':((document.body.clientWidth - getElementById('layout').offsetWidth)/2)); //margin-top: expression((document.body.clientHeight)<480?'0px':((document.body.clientHeight - getElementById('layout').offsetHeight)/2))!important; }

/* DEBUG */

/*
#layout { overflow: hidden; }
#jpg { width: 1000px; height: 750px; position: absolute; top: -122px; left: -34px; opacity: 0.5; filter: alpha(opacity=50); z-index: 1000; }
body#index #jpg { background: transparent url('/jpg/denis-main2.jpg') no-repeat left top; }
body#author #jpg { background: transparent url('/jpg/denis-author.jpg') no-repeat left top; }
body#works #jpg { background: transparent url('/jpg/denis-works.jpg') no-repeat left top; }

/* END DEBUG */

.left, .right { width: 50%;}
a:link{ color: #5F8CA5;}
a:visited { color: #5F6288;}
a:active { color: #7ABCE1;}

#header { margin: 0 34px 0 42px; height: 82px; }
#header #logo { background: transparent url("/img/denismikhaylov.gif") no-repeat; width: 223px; height: 28px; }
#header #logo a { display: block; width: 100%; height: 100%; }
#header .menu { position: relative; margin-top: 16px;}
#header .home { position: absolute; left: -44px; top: 14px; }
#header .home a, #header .home b { display: block; width: 16px; height: 16px; }
#header .home a { background: transparent url("/img/home.gif") no-repeat;}
#header .home b { background: transparent url("/img/home_disabled.gif") no-repeat;}
#header .menu table { width: 100%; table-layout: fixed; }

#header .menu .button { width: 93px; height: 29px; background-position: left top; background-repeat: no-repeat; }
#header .menu li { float: left; }
#header .menu li a { display: block; width: 100%; height: 100%; position: absolute; z-index: 3;}
#header .menu li div { display: none; position: absolute; z-index: 1; top: -9px; left: 5px; background: transparent url("/img/over-menu.gif") no-repeat; width: 73px ; height: 47px;}
#header .menu li.over div { display: block; }
#header .menu .navigation.lang li div { display: none; position: absolute; z-index: 1; top: -9px; left: -9px; background: transparent url("/img/over-menu.gif") no-repeat; width: 73px ; height: 47px;}
#header .menu .navigation.lang li.over div { display: block; }

#button_author_ru { background-image: url('/img/button_author_ru.gif'); }
#button_author_ru.selected { background-image: url('/img/button_author_ru_selected.gif'); }
#button_projects_ru { background-image: url('/img/button_projects_ru.gif'); }
#button_projects_ru.selected { background-image: url('/img/button_projects_ru_selected.gif'); }
#button_works_ru { background-image: url('/img/button_works_ru.gif'); }
#button_works_ru.selected { background: url('/img/button_works_ru_selected.gif'); }

#button_author_en { background-image: url('/img/button_author_en.gif'); }
#button_author_en.selected { background-image: url('/img/button_author_en_selected.gif'); }
#button_projects_en { background-image: url('/img/button_projects_en.gif'); background-position: center top !important; }
#button_projects_en.selected { background-image: url('/img/button_projects_en_selected.gif'); }
#button_works_en { background-image: url('/img/button_works_en.gif'); background-position: right top !important; }
#button_works_en.selected { background: url('/img/button_works_en_selected.gif'); }


#header .lang .button { width: 55px; }
#button_rus { background-image: url('/img/button_ru.gif'); }
#button_rus.selected { background-image: url('/img/button_ru_selected.gif'); }
#button_eng { background-image: url('/img/button_en.gif'); }
#button_eng.selected { background: url('/img/button_en_selected.gif'); }
ul.lang { float: right; width: 110px; }


#body{  }
#body .layout { table-layout: fixed; }
h1 { font-size: 1.4em; font-weight: normal; }


#index .titles_container { padding: 46px 34px 0 0px; float: right; }
#index .titles_container div { padding: 0.1em 0.15em; float: right; clear: none; line-height: 0.9em; }

#author #body .layout .td_left .inner { padding: 52px 0 0 104px; }
#author #body .layout .td_right .inner { padding: 31px 164px 0 12px; }

#author .illustration { clear: left;}
#author .reflex { position: relative; overflow: hidden; margin-top: 3px; height: 78px; }
#author .reflex div { position: absolute; width: 100%; height: 100%; background: transparent url("/img/reflection-overlay.png") repeat-x;}
* html #author .reflex div { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/img/reflection-overlay.png',sizingMethod='scale'); }


.substrate { display: none; position: absolute; width: 100%; padding: 0px 5px; left: -5px; top: 0.15em; height: 1.2em; background-color: #21262d; }
.substrate { //padding: 5px 5px; //top: -5px; }

ul.navigation li.selected a {position: relative; color: white; text-decoration: none; cursor: default; }
li.selected .substrate { display: block; }
#body ul.navigation { font-size: 1.4em; }
#body ul.navigation.project { width: 433px; margin-left: 5px; }
#body ul.navigation.project li { }
ul.navigation li { position: relative; margin-bottom: 1.2em; }
ul.navigation li b, ul.navigation li a {font-size: 0.7em;}
ul.navigation li, ul.navigation li b{ line-height: 1em; }
ul.navigation li.selected b { position: relative; font-weight: normal; }

#subsections { position: absolute; left: 360px; top: 57px; width: auto; }
#subsections li {  }

.td_right table { }
.td_right .td_left { width: 30%; }
.td_right .td_right { width: 70%; }

#projects .td_right #projects_container { margin-top: 37px; height:319px; }
#projects .td_right #projects_container .scroll-pane { height:319px; }

#projects .td_right #projects_container #scroller { position: absolute; right: 0px; top: 0px; height: 319px; width: 10px; background: #333; cursor: pointer; }
#projects .td_right #projects_container #scroller #dragger { position: absolute; left: 0px; top: 0px; height: 20px; width: 100%; background: #777; }


#thumbs_container { position: relative; width: 350px; height: 250px; overflow: hidden; margin: 48px 0 0 111px; }
#projects #thumbs_container { margin-left: 0px; margin-top: 0px; width: auto; height: auto; }
#thumbs_container .navigator_arrows { right: 58px; bottom: -41px; }
#thumbs_container #frames { position: absolute; }
#thumbs_container #frames .frame { float: left; clear: none; width: 350px; height: 250px; padding-right: 10px; }
#projects #thumbs_container #frames .frame { float: left; clear: none; width: 300px; height: 250px; padding-right: 10px; }
#thumbs_container .thumb { float: left; clear: none; margin: 0px 2px 2px 0px; padding: 2px; cursor: pointer; }
#thumbs_container .thumb.hover {  background: white;}
#thumbs_container .thumb.selected {  background: white; cursor: default; }
#thumbs_container .thumb .over-box { top: 2px; left: 2px; }

.navigator_arrows { position: absolute; height: 49px; display: none; }
.navigator_arrows .arrows { position: absolute; background: transparent url("/img/arrows.gif") no-repeat; width: 102px; height: 17px;}
#right_arrow, #left_arrow {position: absolute; width: 17px; height: 17px; overflow: hidden; cursor: pointer; }
#right_arrow.disabled, #left_arrow.disabled { cursor: default; }
#right_arrow a, #left_arrow a {display: block; width: 17px; height: 17px; position: absolute; top: 0px; left: 0px;}
#right_arrow { top: 0px; left: 25px;}
#left_arrow { top: 0px; left: 0px;}
#left_arrow .arrows { top: 0px; left: -34px;}
#right_arrow .arrows { top: 0px; left: -51px;}
#left_arrow.over .arrows { left: -68px;}
#right_arrow.over .arrows { left: -85px;}
#left_arrow.disabled .arrows { left: 0px;}
#right_arrow.disabled .arrows { left: -17px;}

.thumb { position: relative; width: 50px; height: 50px; }
.thumb a { display: block; width: 50px; height: 50px; position: absolute; top:0px; left: 0px; }
.thumb .over-box { position: absolute; top: 0px; left: 0px; width: 50px; height: 50px;  background: transparent url('/img/over-box.png') no-repeat;}
* html .thumb .over-box { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/img/over-box.png',sizingMethod='crop'); }


.separator { clear: both; }

.corners { position: absolute; height: 16px; width: 16px;  background: transparent url("/img/month-selector.gif") no-repeat;}

.corner_tl,
.corner_tr,
.corner_bl,
.corner_br { position: absolute; overflow: hidden; width: 8px; height: 8px;}

.corner_tl { left: 0px; top: 0px;}
.corner_tr { right: 0px; top: 0px;}
.corner_bl { left: 0px; bottom: 0px; //bottom: -1px; }
.corner_br { right: 0px; bottom: 0px; //bottom: -1px; }

.corner_tl .corners { top: 0px; left: 0px;}
.corner_tr .corners { top: 0px; left: -8px;}
.corner_bl .corners { top: -8px; left: 0px;}
.corner_br .corners { top: -8px; left: -8px;}



#image_container { margin: 50px 0 0 20px; }
#image_container .image { position: relative; margin: 30px; }
#image_container .text { position: absolute; bottom: 34px; left: 380px; width: 200px; }
#image_container .fullsize { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; display: none; z-index: 9999; }
#image_container .fullsize .under { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; opacity: 0.5; background: black; }
#image_container .fullsize .over { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; }
#image_container .fullsize img { }
#image_container .backlight_t, .backlight_b { height: 17px; position: absolute; }
#image_container .backlight_l, .backlight_r { width: 17px; position: absolute; }
.backlight_t { top: -30px; }
.backlight_b { bottom: -30px; }
.backlight_l { top: 0px; left:-30px; }
.backlight_r { top: 0px; right: -30px; }

#footer { position: absolute; bottom: 0px; left: 0px; width: 100%; }
#footer div { position: absolute; }
#footer .email{ bottom: 0px; right: 28px; }
#footer .email .img { left: -20px; top: 3px; width: 16px; height: 16px; background: transparent url("/img/mail.gif") no-repeat;}
#footer .copy { font-size: 10px; line-height: 1.2em; bottom: -35px; left: 28px; width: 500px; color: #999; }
#footer .copy div { position: static; }
#footer .copy .title span { /*color: #5F8CA5; border-bottom: #5F8CA5 1px dashed; cursor: pointer;*/ }
#footer .copy .text { /*display: none;*/ }