/* === reset === */
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,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit;
font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;
}
/* remember to define focus styles! */
:focus { outline: 0; }
body { line-height: 1; color: black; background: white; }
ol, ul { list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
/* === /reset === */
/* === global === */
html, body { height: 100%; }
body { background: #211102 url(../images/bg.png) repeat-x; font: normal 100% Georgia, Arial, "MS Trebuchet", sans-serif; color: #666; }
/* common */
a { color: #f07b00; text-decoration: none; }
a:hover { color: #211102; text-decoration: underline; }
h1 a:hover { border: 0; }
h1 { font-size: 26px; margin: 0 0 1em 0; padding: 0; font-weight: bold; color: #211102; }
h2 { font-size: 18px; margin: 1.5em 0 1.5em 0; padding: 0; font-weight: bold; color: #574319; }
h3 { font-size: 14px; margin: 0 0 1em 0; padding: 0; font-weight: bold; color: #574319; }
h4 { font-size: 13px; margin: 0 0 1em 0; padding: 0; font-weight: bold; color: #211102; }
p { color: #574319; margin: 0 0 1em 0; padding: 0; font-size: 12px; line-height: 16px; }
p.small { font-size: 11px; }
p.error { color: #c00; }
strong { font-weight: bold; }
/* input elements */
input, select, textarea { border:1px solid #666666;
font-size:11px;
margin-bottom:5px;
padding:5px;
width:300px;}
input.btn { border: 1px solid #fff; background-color: #3e1516; color: #fff; font-weight: normal; }
button { border: 0; background-color: #3e1516; color: #fff; font-weight: normal; font-size: 12px; margin: 0; padding: 3px; font-family:georgia }
/* clearfix */
.fix { clear: both; height: 1px; line-height: 1px; margin: -1px 0 0; }
.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%; }
/* === /global === */
/* === header === */
#header { height: 520px; background: url(../images/bg_mid.jpg) repeat-x 0 220px; position: relative; }
#header .bg { width: 820px; height: 394px; margin: 0 auto; position: relative; top: 126px; background: url(../images/bg_photo.png) no-repeat scroll; }
#header .wrap { width: 820px; height: 126px; margin: 0 auto; position: relative; top: -394px; }
/* logo */
#header h1 { position: absolute; top: 30px; left: 55px; }
#header h1 a { display: block; background: url(../images/logo.png) no-repeat; width: 200px; height: 134px; text-indent: -9999em; }
/* slogan */
#header #slogan { position: absolute; top: 102px; right: 55px; background: url(../images/slogan.png) no-repeat; width: 322px; height: 15px; text-indent: -9999em; }
/* photo */
#header #photo { position: absolute; top: 219px; left: 52px; z-index: 999; }
/* welcome */
#header #welcome { position: absolute; top: 488px; left: 52px; color: #f7911e; font-size: 14px; font-style: italic; text-indent: 20px; background: #924e0f url(../images/bg_welcome.png) repeat-x; width: 720px; height: 32px; line-height: 32px; }
/* === /header === */
/* === navigation === */
#navigation { position: absolute; top: 188px; left: 55px; }
#navigation li { float: left; background: url(../images/navi_sep.png) no-repeat 100% 0; margin: 0 14px 0 0; padding-right: 30px; }
#navigation li.no { background: none; margin: 0; padding-right: 0; }
#navigation li a { color: #574319; font-size: 14px; font-weight: normal; text-decoration: none; }
#navigation li a:hover, #navigation li.on a { color: #f7911e; }
/* === /navigation === */
/* === wrap === */
#wrap { position: relative; min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -155px auto; }
/* === /wrap === */
/* === main === */
#main { background: url(../images/bg_animals.png) no-repeat 50% 31px; }
#main .wrap { overflow: hidden; position: relative; margin: 0 auto; width: 820px; min-height: 320px; background: url(../images/bg_content.png) repeat-y 22px 0; }
* html #main .wrap { position: static; width: 776px; overflow: hidden; }
#main .intro, #main .intro2 { background: #f8f3e7 url(../images/bg_intro.png) no-repeat left bottom; margin: 0 48px 0 52px; padding: 15px 20px; position: relative; /*min-height: 305px;*/ }
#main #teaser .intro { margin: 0 10px 0 10px; }
* html #main .intro { margin-left: 30px; margin-right: 20px; }
* html #main .intro2 { margin-left: 30px; margin-right: 25px; }
#main .intro h2, #main .intro2 h2 { margin: 0 250px 1.5em 0; font-size: 18px; line-height: 22px; }
#main .intro h2.bg, #main .intro2 h2.bg { font-weight: bold; font-size: 18px; }
#main .intro h2 strong,#main .intro2 h2 strong { color: #f7911e; font-weight: bold; }
#main .intro .article, #main .intro2 .article { position: relative; margin: 0 0 85px 0; }
#main .intro .article2, #main .intro2 .article2 { position: relative; margin: 0 0 350px 0; }
#main .intro .img, #main .intro2 .img { position: absolute; top: 40px; right: 20px; }
#main .intro .img2, #main .intro2 .img2 { position: absolute; top: 40px; right: 20px; }
#main .intro .img2 img , #main .intro2 .img2 img { margin-bottom: 15px;border:1px solid #5e3206;padding: 3px; }
* html #main .intro .img , * html #main .intro2 .img { right: 40px; }
* html #main .intro .img2 , * html #main .intro2 .img2 { right: 40px; }
#main .intro p { margin: 0 250px 0 0; }
#main .intro2 p { margin: 0 0 0 0; }
#main .intro2 p img{ padding: 0 5px; }
.contact { position: absolute; top: 20px; right: -220px; }
* html .contact { right: -180px; }
/* teaser */
#teaser { margin: 0 17px 0 23px; padding: 15px 20px; position: relative; }
* html #teaser { padding-left: 0; overflow: hidden; }
#teaser h2 { margin-left: 30px; margin-bottom: 15px; }
#teaser h3 { font-size: 12px; color: #211102; }
#teaser .teaser { background: url(../images/bg_teaser.png); width: 245px; height: 166px; float: left; position: relative; }
#teaser .teaser img { float: right; margin: 15px 8px 8px 8px; border: 3px solid #fff; }
#teaser .teaser h3 { margin: 14px 0 0 15px; }
* html #teaser .teaser h3 { width: 130px; overflow: hidden; font-size: 11px; }
* html #teaser .teaser h3 a { display: block; width: 130px; overflow: hidden; }
#teaser .teaser p { font-size: 11px; margin: 0 10px 0 15px; }
#teaser .teaser a.more { display: block; background: url(../images/btn_more.png); width: 62px; height: 23px; line-height: 23px; text-align: center; font-size: 11px; color: #fff; font-family: Arial; position: absolute; right: 10px; bottom: 14px; z-index: 99; }
/* === /main === */
/* === footer === */
#footer, .push { height: 155px; }
#footer { font-size: 11px; color: #3e1516; background: url(../images/bg_footer.png) repeat-x 50% 100%; }
#footer .logos { text-align: center; position: relative; margin: 0 auto; width: 820px; height: 70px; line-height: 70px; background: url(../images/bg_content.png) repeat-y 22px 0; }
* html #footer .logos { width: 776px; }
#footer .logos a { margin: 0 13px; }
#footer p { margin: 0 auto; padding-left: 70px; width: 750px; height: 35px; line-height: 35px; color: #7d4016; font-size: 11px; text-align: left; background: url(../images/bg_copy.png) no-repeat 43px 0; }
#footer p a { color: #7d4016; position: relative; z-index: 99; }
/* === /footer === */
* #header .bg, #main .wrap, .logos, #header h1 a{ behavior: url(/css/iepngfix.htc) }