/* 
---------------------------------------------------------------------------------------------------------------------------------------------------
  Общее
---------------------------------------------------------------------------------------------------------------------------------------------------
*/

* { margin: 0; padding: 0; }
html { height: 100%; }
body { position: relative; color: #535353; font: 0.8em/1.3 "Trebuchet MS", Sans-Serif, Serif; background: #1A1B1C url(../img/body-bg.jpg) center top; height: 100%; }
body#mainpage { background: #000; min-height: 500px; }

.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }
.clear { display: block; clear: both; height: 1px; }
.off { display: none; }

h1, h2, h3, h4, h5, h6 { margin-bottom: 10px; line-height: 1; color: #313131; font-family: "Arial Narrow", Arial; font-weight: normal; }
h1 { font-size: 1.7em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.3em; }
h4, h5, h6 { font-size: 1.1em; font-style: italic;}

p { padding: 10px 0; }
p.arrow { padding-left: 15px; background: url(../img/arrow.gif) no-repeat 0 1.4em; }
p.arrow2 { padding-left: 15px; background: url(../img/arrow2.gif) no-repeat 0 1.4em; }
p.listing { font-size: 0.9em; }

a { color: #B38B4D; text-decoration: underline; }
a:hover { text-decoration: none; }
a img { border: 0; }

#center { position: relative; margin: 0 auto; background: #F8DCA2 url(../img/center-bg.jpg) 0 0; width: 904px; min-height: 100%; }
#mainpage #center { background: none; }

/*
---------------------------------------------------------------------------------------------------------------------------------------------------
  Шапка
---------------------------------------------------------------------------------------------------------------------------------------------------
*/

#header { position: relative; background: url(../img/center-top.jpg) no-repeat 0 0; min-height: 130px; }

#logo { display: block; position: relative; top: 0; left: 0; background: url(../img/logo.png) no-repeat 0 0; width: 261px; height: 113px; }
a#logo-wrapper { display: block; position: absolute; top: 50px; left: 65px; width: 134px; height: 48px; }

#navbar { position: absolute; top: 84px; left: 300px; height: 15px; overflow: hidden; }
#navbar li { position: relative; margin-right: 15px; }
#navbar li, #navbar li a, #navbar li strong { float: left; height: 17px; overflow: hidden; }
#navbar li span { position: absolute; top: 0; left: 0; background-repeat: no-repeat; height: 15px; }
#navbar li { list-style: none; font: 1.3em/11px Times; text-transform: lowercase; }
#navbar li a { color: #313131; text-decoration: none; }
#navbar li a:hover, #navbar li strong { color: #B38B4D; font-weight: normal; }
#navbar li a span { background-position: 0 -15px; cursor: pointer; }
#navbar li a:hover span, #navbar li strong span { background-position: 0 0; }
#navbar li#news, #navbar li#news a, #navbar li#news strong, #navbar li#news span { width: 73px; }
#navbar li#news span { background-image: url(../img/navbar-news.gif); }
#navbar li#history, #navbar li#history a, #navbar li#history strong, #navbar li#history span { width: 72px; }
#navbar li#history span { background-image: url(../img/navbar-history.gif); }
#navbar li#faces, #navbar li#faces a, #navbar li#faces strong, #navbar li#faces span { width: 45px; }
#navbar li#faces span { background-image: url(../img/navbar-faces.gif); }
#navbar li#music, #navbar li#music a, #navbar li#music strong, #navbar li#music span { width: 70px; }
#navbar li#music span { background-image: url(../img/navbar-music.gif); }
#navbar li#photo, #navbar li#photo a, #navbar li#photo strong, #navbar li#photo span { width: 45px; }
#navbar li#photo span { background-image: url(../img/navbar-photo.gif); }
#navbar li#gb, #navbar li#gb a, #navbar li#gb strong, #navbar li#gb span { width: 82px; }
#navbar li#gb span { background-image: url(../img/navbar-gb.gif); }
#navbar li#contacts, #navbar li#contacts a, #navbar li#contacts strong, #navbar li#contacts span { width: 88px; }
#navbar li#contacts span { background-image: url(../img/navbar-contacts.gif); }

#citata { position: absolute; top: 30px; right: 40px;color: #C09E6B; font-size: 0.85em; line-height: 1.2em; text-align: right; }

/*
---------------------------------------------------------------------------------------------------------------------------------------------------
  Контент
---------------------------------------------------------------------------------------------------------------------------------------------------
*/

#body { padding: 20px 0 100px 0; }

#content-wrapper { float: left; width: 100%; }
#content { margin: 0 50px 0 300px; }

#mainpage #pic { position: absolute; top: 50%; margin-top: -240px; height: 480px; width: 100%; }
#mainpage #pic img { display: block; margin: 0 auto; width: 640px; height: 480px; }
#mainpage #pic div { text-align: center; }
#mainpage #pic div a { color: #ccc; font: 1em/1 Tahoma; font-weight: bold; text-decoration: none; }
#mainpage #pic div a:hover { color: #fff; text-decoration: underline }

#content div.pages { margin-top: 10px; padding: 10px 0; color: #B38B4D; font-style: italic; }
#content div.pages span.selected { color: #515151; }
#content div.pages a, #content div.pages span.selected { margin-right: 2px; padding: 0 2px; }
#content div.pages a { text-decoration: none; background: #FFE6AE; }
#content div.pages span.selected, #content div.pages a:hover { background: #FDEECE; }

#content h2.bg { position: relative; margin-left: -20px; padding-left: 20px; line-height: 18px; background: url(../img/header-bg.gif) no-repeat 0 2px; height: 22px; overflow: hidden; }
#content h2.bg span { position: absolute; top: 0; left: 20px; height: 22px; }
#content h2.history { width: 93px; }
#content h2.history span { background: url(../img/header-history.gif) no-repeat 0 0; width: 93px; }
#content h2.news { width: 93px; }
#content h2.news span { background: url(../img/header-news.gif) no-repeat 0 0; width: 93px; }
#content h2.faces { width: 56px; }
#content h2.faces span { background: url(../img/header-faces.gif) no-repeat 0 0; width: 56px; }
#content h2.music { width: 88px; }
#content h2.music span { background: url(../img/header-music.gif) no-repeat 0 0; width: 88px; }
#content h2.photo { width: 56px; }
#content h2.photo span { background: url(../img/header-photo.gif) no-repeat 0 0; width: 56px; }
#content h2.gb { width: 104px; }
#content h2.gb span { background: url(../img/header-gb.gif) no-repeat 0 0; width: 104px; }
#content h2.contacts { width: 112px; }
#content h2.contacts span { background: url(../img/header-contacts.gif) no-repeat 0 0; width: 112px; }

#content div.news { padding: 10px 0 5px 0; }
#content div.news big.date { float: left; margin-left: -250px; padding-top: 5px; color: #313131; font-size: 1em; text-align: right; width: 200px; }
#content div.news p { padding: 5px 0 0 0; }
#content div.news p.arrow { padding-left: 15px; font-size: 0.9em; background-position: 0 0.9em; }

#content div.face { padding: 10px 0 30px 0; }
#content div.face strong.header { color: #313131; text-transform: uppercase; }
#content div.face div.image { float: left; position: relative; top: 3px; margin-left: -260px; background: url(../img/faces-photo-bg.jpg) no-repeat 0 0; width: 233px; height: 182px; }
#content div.face div.image img { margin: 9px 0 0 9px; width: 211px; height: 159px; }
#content div.face div.image span { position: absolute; top: 9px; left: 9px; background: url(../img/photo-layer.png) no-repeat 0 0; width: 211px; height: 159px; }

#content .gallery { margin: 3px 0 -2px 0; padding: 5px 0; }
#content .gallery .thumb { float: left; padding: 5px; margin: 3px; background: #FBEACE; border: 1px solid #E7CFAB; }
#content .gallery .thumb a { text-decoration: none; }
#content .gallery .thumb img { display: block; width: 120px; height: 90px; }

#content p.gb-msg { padding: 10px 0 15px 0; }
#content p.gb-msg i.header { display: block; padding: 3px 7px; color: #B38B4D; font-weight: bold; font-style: normal; background: #FBEACE; border-bottom: 1px solid #E7CFAB; }
#content p.gb-msg small.posted { float: right; padding-top: 4px; padding-right: 2px; color: #B38B4D; font-size: 0.9em; text-align: right; }
#content p.gb-msg span.text { display: block; padding: 7px 7px 0 7px; }
#content p.gb-msg span.answer { color: #B38B4D; font-size: 0.9em; font-weight: bold; font-style: italic; }

/* Sidebar */

#sidebar { float: left; margin-left: -100%; padding-top: 4px; padding-left: 50px; font-size: 0.9em; width: 200px; }
 
#sidebar h2.bg { position: relative; margin-left: -20px; padding-left: 20px; line-height: 16px; background: url(../img/header-bg.gif) no-repeat 0 2px; height: 18px; overflow: hidden; }
#sidebar h2.bg span { position: absolute; top: 0; left: 20px; height: 18px; }
#sidebar h2.lastnews { width: 172px; }
#sidebar h2.lastnews span { background: url(../img/header-lastnews.gif) no-repeat 0 0; width: 172px; }
#sidebar h2.randphoto { width: 142px; }
#sidebar h2.randphoto span { background: url(../img/header-randphoto.gif) no-repeat 0 0; width: 142px; }

#sidebar #lastnews { padding-bottom: 30px; }
#sidebar #lastnews a { color: #535353; text-decoration: none; }
#sidebar #lastnews a:hover { color: #B38B4D; text-decoration: underline; }
#sidebar #lastnews p strong.date { display: block; padding-bottom: 2px; color: #B38B4D; font-style: italic; }
#sidebar #lastnews p.arrow a { color: #B38B4D; text-decoration: underline; }
#sidebar #lastnews p.arrow a:hover { text-decoration: none; }

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

#footer { position: absolute; bottom: 0; left: 0; color: #B38B4D; font-size: 0.85em; font-family: Sans-Serif; background: url(../img/center-bottom.jpg) no-repeat left bottom; width: 100%; height: 60px; }
#footer small { font-size: 1em; }
#footer .info { margin: 0 50px; }
#footer p.copyright { text-align: right; }

#footer #liveinternet { position: absolute; bottom: 34px; left: 50px; width: 88px; height: 15px; }