/*
    ?????????????????????????????????????
    ?    Beer Caps CSS, Ïàâåë Êèðè÷åíêî    ?
    ?????????????????????????????????????
*/

@media all {

/* ????????? ÃËÎÁÀËÜÍÛÅ ÑÒÈËÈ ????????? */

/* Eric Meyer’s Global Reset (ìîäèôèöèðîâàí) */
html, body, div, p, pre, span, hr,
h1, h2, h3, h4, h5, h6,
abbr, acronym, address, big, cite,
code, del, dfn, em, ins, kbd, samp,
small, strong, sub, sup, var, q,
dl, dt, dd, ol, ul, li,
table, caption, tbody, tfoot, thead, tr, th, td,
fieldset, form, label, legend, #search input,
a, area, map, img, object {
    margin: 0; padding: 0;
    outline: 0; border: 0;
    background: transparent repeat scroll;
    vertical-align: baseline;
    text-align: left;
    text-indent: 0;
    text-decoration: none;
    letter-spacing: normal;
    line-height: 1.5;
    white-space: normal;
    word-spacing: normal;
    font-weight: inherit;
    font-style: inherit;
    font-family: inherit;
}



/* ????????? ÏÎÇÈÖÈÎÍÈÐÎÂÀÍÈÅ ????????? */

/* ??? ÏÎÇÈÖÈß ??? */

#logo, #menu, #menu a,
div, div:before, div:after { position: relative; }

#logo span { position: absolute; }


/* ??? ÑÌÅÙÅÍÈÅ ??? */

#header, #menu { top: 3px; }

#footer { bottom: 3px; }

#logo { top: 4px;  }

#menu a { top: 7px; }


/* ??? ÑËÎÈ ??? */

#logo .img  { z-index: 1; }

#header, #footer { z-index: 2; }

#menu { z-index: 3; }



/* ????????? ÔÎÐÌÀÒÈÐÎÂÀÍÈÅ ????????? */

/* ??? ÎÒÎÁÐÀÆÅÍÈÅ ??? */

#navs li { display: inline; }

#mainbar, #sidebar, #canvas, #descr,
#menu li, #pages li, #gallery li { display: inline-block; }

#logo, #logo span, #gallery img,
#comments .comment, #comments .answer,
html, body, div:before, div:after { display: block; }

#nav li.last:after { display: none; }


/* ??? ÏÅÐÅÏÎËÍÅÍÈÅ ??? */

html { overflow-y: scroll; }


/* ??? ØÈÐÈÍÀ È ÂÛÑÒÎÒÀ ??? */

html { width: 100%; height: 100%; }

body { width: 940px; }

#sidebar, #sidebar div:before, #sidebar div:after { width: 256px; }

#footer:before, #header:after,
#sidebar div:before, #sidebar div:after { height: 14px; }

#sidebar div { width: 255px; }

#content, #comment-post { width: 592px; }

#canvas { width: 192px; }

#descr { width: 358px; }

#search input { height: 20px; }

#search .text { width: 129px; }

#search .submit { width: 58px; }

#logo, #logo span { width: 151px; height: 113px; }

#logo .alt { margin-top: 24px; }

#menu li { width: 107px; height: 34px; }

#pages li.selected { width: 21px; height: 21px; }

#gallery li { width: 162px; }

#twitter_block, #twitter_block span { width: 151px; height: 113px; }

.beercap, .bottle { width: 132px; }

.beercap { height: 132px; }

.bottle { height: 250px; }

hr { height: 1px; }


/* ??? ÎÒÑÒÓÏÛ È ÏÎËß ??? */

body, #wrapper, #header, #footer, #gallery img { margin: 0 auto; }

#wrapper { padding: 8px 22px 16px 36px; }

#sidebar { margin-left: 24px; }

#sidebar div { margin: 18px 0; }

#sidebar #countries { margin-top: 0; }

#sidebar form, #sidebar ul  { margin: 0 23px; }

#sidebar h2  { margin: -3px 23px; }

#countries ul { padding-left: 11px; }

#search input { margin: 9px 0 0 0; }

#search .submit { margin-left: 9px; padding: 0 0 4px 3px; }

#comments .num { margin-right: 12px; }

#comments, #comment-post { margin: 6px 0; }

#comments .site, #comments .date { margin-left: 24px; }

#comments .comment, #comments .answer { margin-left: 3px; }

#comment-post .text { margin-bottom: 3px; }

#descr li, #countries li, #comments li { margin: 3px 0; }

#descr h1 { margin-bottom: 4px; }

#descr ul { margin-bottom: 11px; }

#canvas { margin-right: 12px; }

#logo { margin: 0 0 -27px 732px; padding: 0; }

#copy, #menu { margin-left: 36px; }

#menu li { margin-left: -1px; }

#menu li.first { margin-left: 0; }

#navs { margin-bottom: 19px; }

#pages { margin-top: 10px; }

#pages .selected { margin: 0 7px; }

#pages .next { margin-left: 9px; }

#gallery li { margin: 7px; padding: 7px; }

.flag { padding-left: 22px; }

.rss { margin-top:6px; padding:4px 0 0 44px; }

table, p, pre, ol, dl { margin-bottom: 5px; }

textarea, hr { margin: 5px 0; }

ol li, dt, dd { margin: 2px 0; }

dd { margin-left: 16px; }

.photo, .preview { padding: 6px; }

caption, tr, th, td { padding: 4px; }



/* ????????? ÃÅÍÅÐÈÐÓÅÌÎÅ ÑÎÄÅÐÆÈÌÎÅ ????????? */

/* ???? ÊÎÍÒÅÍÒ ???? */

div:before, div:after { content: ""; }

#nav li:after, .next:after { content: " ?"; }

#nav li.last:after { content: no-close-quote; }


/* ??? ÊÀÂÛ×ÊÈ ??? */

q { quotes: "«" "»"; }

q:before { content: "«"; }

q:after { content: "»"; }



/* ????????? ÒÅÊÑÒ ????????? */

/* ??? ÃÎÐÈÇÎÍÒÀËÜÍÎÅ ÂÛÐÀÂÍÈÂÀÍÈÅ ??? */

#logo .alt, #menu li, #pages li,
#canvas li, #gallery li, #sidebar h3,
#search .submit, caption { text-align: center; }

.sign { text-align: right; }


/* ??? ÂÅÐÒÈÊÀËÜÍÎÅ ÂÛÐÀÂÍÈÂÀÍÈÅ ??? */

#wrapper div, #gallery li { vertical-align: top; }

#logo .alt { vertical-align: middle; }

#search input { vertical-align: bottom; }

sub { vertical-align: sub; }

sup { vertical-align: super; }


/* ??? ÔÎÐÌÀÒÈÐÎÂÀÍÈÅ ÒÅÊÑÒÀ ??? */

#menu a, #navs a, #pages a, tr a { white-space: nowrap; }

code { white-space: pre-wrap; }


/* ??? ÄÅÊÎÐÈÐÎÂÀÍÈÅ ÒÅÊÑÒÀ ??? */

#gallery a, #menu a { text-decoration: none; }

a, #gallery .beer, #gallery .country,
#logo .alt { text-decoration: underline; }

del { text-decoration: line-through; }



/* ????????? ÑÏÈÑÊÈ ????????? */

/* ??? ÏÎÇÈÖÈß ÌÀÐÊÅÐÀ ÑÏÈÑÊÀ ??? */

dl, ol  { list-style-position: inside; }

ul  { list-style-position: outside; }


/* ??? ÑÒÈËÜ ÌÀÐÊÅÐÀ ÑÏÈÑÊÀ ??? */

ol { list-style-type: decimal; }

ul { list-style-type: none; }



/* ????????? ÒÀÁËÈÖÛ ????????? */

/* ??? ÐÀÇÄÅËÈÒÅËÈ ÒÀÁËÈÖ ??? */

table { border-collapse: collapse; }



/* ????????? ØÐÈÔÒÛ ????????? */

/* ??? ÃÀÐÍÈÒÓÐÛ ØÐÈÔÒÀ ??? */

body { font-family: "Myriad Pro", sans-serif; }

#gallery, #comments, form { font-family: "Tahoma", sans-serif; }


/* ??? ÑÒÈËÜ ØÐÈÔÒÀ ??? */

cite, dfn, em, var { font-style: italic; }


/* ??? ÒÎËÙÈÍÀ ØÐÈÔÒÀ ??? */

body  { font-weight: 500; }

strong  { font-weight: 700; }


/* ??? ÐÀÇÌÅÐ ØÐÈÔÒÀ ??? */

#comments .site, #comments .date,
#countries ul span { font-size: 9px; }

#search .submit, #gallery a.country { font-size: 12px; }

#comments, #comments h3,
#comment-post label { font-size: 13px; }

body { font-size: 14px; }

h3 { font-size: 15px; }

#menu li { font-size: 16px; }

#gallery .beer, h2 { font-size: 18px; }

#sidebar h2 { font-size: 21px; }

#logo .alt { font-size: 25px; }

h1, #countries h2 { font-size: 27px; }

}

@media screen, handheld, projection, tv {

/* ????????? ÖÂÅÒ ????????? */

body, #menu a, #pages a, #copy a { color: #000; }

#logo .alt, #pages .selected { color: #fff; }

#navs a, h1 { color: #0e7600; }

#countries a { color: #0077bc; }

#countries h2 { color: #9a4800; }

#search h2 { color: #060; }

#base h2 { color: #2e4e38; }

#twitter h2 { color: #478b81; }

#comments, #comment-post label { color: #666; }

#comments .date { color: #5f5f5f; }

a:link { color: #dd6700; }

a:visited { color: #646464; }

a:hover, a:focus,
#navs a:hover, #nav a:focus,
#menu a:hover, #menu a:focus,
#copy a:hover, #copy a:focus,
#pages a:hover, #pages a:focus,
#countries a:hover, #countries a:focus { color: #f00; }

a:active,
#navs a:active,
#menu a:active,
#copy a:active,
#pages a:active,
#countries a:active { color: #c60000; }



/* ????????? ÔÎÍ ????????? */

/* ??? ÏÎÇÈÖÈß ÔÎÍÀ ??? */

.icon { background-position: left; }

#logo .img, #search .submit { background-position: center; }

#header:after, #menu li { background-position: top; }

#footer:before, .beercaps #tab1, .about #tab2 { background-position: bottom; }

#sidebar div:before { background-position: left top; }

#sidebar div:after { background-position: left bottom; }

#sidebar div { background-position: right bottom; }


/* ??? ÏÅÐÈÎÄÈ×ÍÎÑÒÜ ÔÎÍÀ ??? */

.icon, #logo .img, #menu li, #search .submit,
#footer:before, #header:after, #sidebar div,
#sidebar div:before, #sidebar div:after { background-repeat: no-repeat; }


/* ??? ÖÂÅÒ ÔÎÍÀ ??? */

html { background-color: #a2c1a6; }

#wrapper, #search .text { background-color: #fff; }

#countries { background-color: #fff8ad; }

#search { background-color: #c8e583; }

#base { background-color: #aac7a5; }

#twitter { background-color: #b5d7d2; }

#pages .selected { background-color: #ffa800; }


/* ??? ÈÇÎÁÐÀÆÅÍÈß ÔÎÍÀ ??? */

html { background-image: url("/im/pattern.png"); }

#logo .img { background-image: url("/im/logo.png"); }

#footer:before, #header:after { background-image: url("/im/wrapper.png"); }

#countries, #countries:before, #countries:after { background-image: url("/im/countries.png"); }

#search, #search:before, #search:after { background-image: url("/im/search.png"); }

#base, #base:before, #base:after { background-image: url("/im/base.png"); }

#twitter, #twitter:before, #twitter:after { background-image: url("/im/twitter.png"); }

#menu li { background-image: url("/im/tab.png"); }

#search .submit { background-image: url("/im/submit.png"); }

.belgium { background-image: url("/im/belgium.png"); }

.rss { background-image: url("/im/rss.png"); }

/*.flag { background-image: url("/im/flag.png"); }*/

.belgium { background-image: url("/im/belgium.png"); }



/* ????????? ÐÀÌÊÈ ????????? */

/* ??? ÒÎËÙÈÍÀ ÐÀÌÎÊ ??? */

#search .text { border-width: 1px; }

#wrapper { border-width: 3px; }

#sidebar div { border-right-width: 1px; }

hr { border-bottom-width: 1px; }


/* ??? ÑÒÈËÜ ÐÀÌÎÊ ??? */

#wrapper, #sidebar div, #search .text,
hr { border-style: solid; }


/* ??? ÖÂÅÒ ÐÀÌÎÊ ??? */

#wrapper { border-color: #096721; }

#countries { border-color: #bcad4b; }

#search { border-color: #85a048; }

#search .text { border-color: #777 #c3c3c3 #ddd; }

#base { border-color: #69916d; }

#twitter { border-color: #6caea5; }

#sidebar #twitter_block { border-color: #6caea5; height: 100px; margin:0;}

hr { border-color: #808080; }



/* ????????? ÊÓÐÑÎÐ ????????? */

a, .submit { cursor: pointer; }

abbr, acronym  { cursor: help; }

}

@media print {

/* ????????? ÔÎÐÌÀÒÈÐÎÂÀÍÈÅ ????????? */

#footer, #header, #sidebar,
#nav, #pages, #comments .answer,
form { display: none; }

#mainbar { display: block; }

html { overflow: visible; }

body, #content { width: 100%; }

.icon { padding: 0; }



/* ????????? ÒÅÊÑÒ ????????? */

a, #gallery .beer, #gallery .country { text-decoration: none; }



/* ????????? ØÐÈÔÒÛ ????????? */

#content, #comments, #comment-post,
#comments .num, #comments .name,
#comments .site, #comments .date { font: 12pt "Times New Roman", serif; }



/* ????????? ÖÂÅÒ ????????? */

a, #comments { color: #000; }



/* ????????? ÐÀÌÊÈ ????????? */

hr { border-width: 0 0 1px 0; }

}


td {
	vertical-align: top;
}

#r a {position: absolute;display: block;left: 0;top: 0;height: 22px;}
#r a:hover {background: url(/photos/star2.jpg);}
