/*-----------------------------------
Spiller farmer main CSS stylesheet 
-------------------------------------*/

/************************ CSS RESET ***/
@import url("reset.css");

/************************ GLOBAL STYLING ***/
body 		           { font:62.5%/1 "Arial",sans-serif; color:#686868; }
a:link, a:visited  { color:#004577; }
a:hover            { text-decoration:none; }
a:active           { outline:0; }

/************************ Reusable ***/
.more       { padding-right:16px; text-transform:uppercase; text-decoration:none; color:#829bb4 !important; line-height:1.5; background:url(../images/icn-arrow-02.png) no-repeat 100% 50%; }
.more:hover { text-decoration:underline; }
.date       { position:absolute; right:10px; top:7px; font-size:1.1em; }

.off-left   { position:absolute; left:-9999px; top:-9999px; }

.nav-supp         { position:absolute; }
.nav-supp li      { float:left; }
.nav-supp a       { margin:0 8px; line-height:1.4; text-decoration:none; }
.nav-supp a:hover { text-decoration:underline; }

/************************ CONTAINER ***/
#container { width:972px; margin:0 auto; }

/************************ HEADER ***/
#header     { position:relative; min-height:223px; padding-top:32px; background-repeat:no-repeat; background-position:0 100%; }
.hr #header { background-image:url(../images/bg-header-hr.jpg); }
.en #header { background-image:url(../images/bg-header-en.jpg); }

#branding-logo     { position:absolute; left:15px; top:58px; }
#branding-logo img { vertical-align:top; }

#nav-main { position:absolute; right:0; top:32px; float:left; }
#nav-main li { float:left; }
#nav-main a  { display:block; width:115px; height:111px; overflow:hidden; text-indent:-9999px; background-repeat:no-repeat; }
.hr #nav-main a  { background-image:url(../images/bg-nav-main-hr.jpg); }
.en #nav-main a  { background-image:url(../images/bg-nav-main-en.jpg); }

#nav-main #home-link a        { background-position:0 0; }
#nav-main #home-link a:hover,
#nav-main #home-link.active a { background-position:0 -111px; }

#nav-main #about-link a         { background-position:-115px 0; }
#nav-main #about-link a:hover,
#nav-main #about-link.active a  { background-position:-115px -111px; }

#nav-main #services-link a         { background-position:-230px 0; }
#nav-main #services-link a:hover,
#nav-main #services-link.active a  { background-position:-230px -111px; }

#nav-main #projects-link a         { background-position:-345px 0; }
#nav-main #projects-link a:hover,
#nav-main #projects-link.active a  { background-position:-345px -111px; }

#nav-main #news-link a         { background-position:-460px 0; }
#nav-main #news-link a:hover,
#nav-main #news-link.active a  { background-position:-460px -111px; }

#nav-main #contact-link a         { background-position:-575px 0; }
#nav-main #contact-link a:hover,
#nav-main #contact-link.active a  { background-position:-575px -111px; }

#header .nav-supp         { right:50px; top:7px;  }
#header .nav-supp li      { background:url(../images/bg-nav-supp-sep.png) no-repeat 0 50%; }
#header .nav-supp .first  { background:none; }
#header .nav-supp a       { font-size:1.2em; color:#4b82bb;  }

#nav-lang         { position:absolute; right:0; top:7px; float:left; }
#nav-lang li      { float:left; padding:3px; opacity:.59; }
#nav-lang .active { background:url(../images/bg-nav-lang.png) no-repeat 0 0; opacity:1; }
#nav-lang img     { vertical-align:top; }

#search-input         { position:absolute; right:4px; bottom:37px; }
#search-input strong  { position:absolute; left:-9999px; top:-9999px; }
#search-input input   { vertical-align:top; width:130px; height:15px; margin-top:3px; color:#686868; padding:4px 0 0 4px; background:url(../images/bg-search-input.png) no-repeat 0 0; }
#search-input button  { width:24px; height:27px; overflow:hidden; text-indent:-9999px; cursor:pointer; background:url(../images/bg-search-input.png) no-repeat 100% 0; }

/************************ CONTENT ***/
#content       { margin:30px 0 45px; }
#content:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }

/************************ Main content ***/
#content-main    { position:relative; float:left; width:476px; margin-left:297px; display:inline; }

#content-main h1,
#content-main h2 { padding-right:70px; font-weight:bold; font-size:2.4em; line-height:1.2; color:#004577; }
#content-main h2 { font-size:1.8em; }

/************************ Editable content ***/
#content-main .text        { font-size:1.2em; line-height:1.4; }
#content-main .text h2     { font-size:1.667em; }
#content-main .text h3     { font-size:1.5em; }
#content-main .text h2,
#content-main .text h3     { font-weight:bold; }
#content-main .text p      { margin:20px 0; }
#content-main .text ol,
#content-main .text ul     { margin-left:35px; }
#content-main .text ol li  { list-style-type:decimal; }
#content-main .text ul li  { list-style-type:disc; }
#content-main .text strong { font-weight:bold; }
#content-main .text em     { font-style:italic; }

#content-main .text .alt-img-01 { margin:20px 0 0; }
#content-main .text-type-01 p   { font-weight:bold; }

#project-showcase,.news-listing               { border-bottom:1px solid #e5e5e5; }
#project-showcase li,.news-listing li            { position:relative; overflow:hidden; width:476px; padding:25px 0; border-top:1px solid #e5e5e5; }.news-listing li            { padding:15px 0; }
#project-showcase h2        { margin-bottom:15px; }.news-listing h2            { margin:20px 0; }.news-listing h3            { margin-bottom:15px; padding-right:70px; font-weight:bold; font-size:1.5em; line-height:1.2; color:#004577; }
#project-showcase h2 a,.news-listing h3 a          { text-decoration:none; }
#project-showcase h2 a:hover,.news-listing h3 a:hover    { text-decoration:underline; }
#project-showcase img       { float:left; margin:0 25px 15px 0; }
#project-showcase p,.news-listing p             { margin-bottom:20px; font-size:1.2em; line-height:1.4; }
#project-showcase .more,.news-listing .more         { position:absolute; right:5px; bottom:5px; }
#project-showcase .date     { top:29px; }

#pagination { float:left; width:100%; margin-top:20px; }
#pagination ul { float:left; position:relative; left:50%; }
#pagination li { float:left; position:relative; right:50%; margin-right:3px; }
#pagination li * { display:block; padding:7px 9px; font-weight:bold; font-size:1.3em; text-decoration:none; color:#829bb4; background-color:#004577; }
#pagination .active *,
#pagination li a:hover { color:#fff; background-color:#c03; }
#pagination .prev *,
#pagination .next * { width:7px; overflow:hidden; text-indent:-9999px; background:url(../images/bg-pagination.png) no-repeat 0 0; }
#pagination .next * { background-position:-25px 0; }

#project-details          { width:295px; float:left; font-size:1.2em; }
#project-details table    { width:295px; }
#project-details td       { padding:5px; }
#project-details strong   { font-weight:bold; }
#project-details .odd td  { background-color:#ecf0f6; }

#contact-persons      { float:left; width:174px; padding-top:15px; margin-left:7px; display:inline; background:url(../images/bg-contact-persons.png) no-repeat 0 0; }
#contact-persons h3   { margin-left:11px; font-weight:bold; font-size:1.3em; color:#004577; }
#contact-persons ul   { padding:0 0 20px 11px; font-weight:bold; font-size:1.2em; line-height:1.4; background:url(../images/bg-contact-persons.png) no-repeat -174px 100%; }
#contact-persons li   { margin:7px 0; }
#contact-persons ul a { font-weight:normal; font-size:.917em; }

#additional-info { clear:left; padding-top:20px; }
#additional-info h3 { font-weight:bold; font-size:1.3em; }
#additional-info .text p { margin:5px 0 20px; }

#img-gallery          { overflow:hidden; padding:7px 7px 50px; background:url(../images/bg-img-gallery.png) no-repeat 0 0; }
#img-gallery div      { width:462px; height:323px; text-align:center; line-height:323px; }
#img-gallery .loading { background:url(../images/loading.gif) no-repeat 50% 50%; }
#img-gallery img  { vertical-align:middle; }
#img-gallery h3   { margin-bottom:7px; font-weight:bold; font-size:1.3em; line-height:1.3; color:#004577; }
#img-gallery ul   { margin-top:50px; padding-left:3px; float:left; }
#img-gallery li   { float:left; margin-right:10px; }
#img-gallery a    { position:relative; display:block; border:2px solid #999; margin:3px 0 3px 0; outline:none; }
#img-gallery .active a    { border:5px solid #999; margin:0 -3px 0 -3px; }
.js #img-gallery li           { margin-right:13px; }
.js #img-gallery .sans-margin { margin-right:0; }

#contact-form             { padding:0 0 15px; font-size:1.2em; background:url(../images/bg-contact-form.png) no-repeat 0 100%; }
#contact-form form        { overflow:hidden; padding:15px 23px 0; background:url(../images/bg-contact-form.png) no-repeat 0 0; }
#contact-form legend span { font-weight:bold; font-size:1.5em; color:#004577; }
#contact-form div         { margin:15px 0; }
#contact-form div:after   { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
#contact-form div         { *min-height:0; _height:1%; }
#contact-form label       { float:left; margin:5px 0; cursor:pointer; font-weight:bold; }
#contact-form input,
#contact-form textarea    { display:block; clear:left; padding:3px; border:1px solid #a9bec7; font-family:"Arial",sans-serif; font-size:1em; color:#686868; background:url(../images/bg-contact-form-fields.png) no-repeat; }
#contact-form input       { width:244px; }
#contact-form .alt input,
#contact-form textarea     { width:422px; overflow:auto; }
#contact-form button                   { float:right; width:98px; height:25px; overflow:visible; cursor:pointer; font-weight:bold; line-height:25px; text-transform:uppercase; color:#fff; background:url(../images/btn-type-01.png) no-repeat 0 0; }
#contact-form button::-moz-focus-inner { padding:0; border:none; }
#contact-form button:focus             { outline:1px dotted #000; }
#contact-form .error        { display:block; margin:5px 0; color:#f00; }
#contact-form #captcha      { position:relative; padding-left:178px; }
#contact-form #captcha img  { position:absolute; left:0; top:0; }
#contact-form #captcha span { display:block; }
#contact-form .hidden       { display:none; }
#appreciation { padding:10px 0 30px; font-size:1.2em; text-align:center; color:#499b20; }

#sitemap        { margin-top:20px; }
#sitemap li     { margin:10px 0; }
#sitemap li li  { margin-left:30px; }
#sitemap a      { padding-left:6px; background:url(../images/bg-dot-01.png) no-repeat 0 6px; }

/************************ Supplementary content #1 ***/
#content-supp-01      { float:left; width:262px; margin-left:-773px; display:inline; }
#content-supp-01 div  { margin-bottom:20px; }
#content-supp-01 h2   { padding:6px 0 6px 25px; font-size:2em; font-weight:bold; color:#04396c; background:#ecf0f6; }

#nav-section a { display:block; padding:5px 10px 6px 34px; border-top:2px solid #fff; font-size:1.2em; font-weight:bold; line-height:1.4; text-decoration:none; color:#fff; background-color:#004577; background-image:url(../images/bg-nav-section.png); background-repeat:no-repeat; } 
#nav-section a:hover,
#nav-section .active a { background-color:#437ab2; background-position:-262px 0; }

#downloads li         { position:relative; min-height:80px; padding-left:100px; overflow:hidden; border-bottom:1px solid #e5e5e5; }
#downloads dt a       { display:block; margin:15px 0; font-size:1.2em; font-weight:bold; line-height:1.4; text-decoration:none; background:url(../images/icn-arrow-01.png) no-repeat 95% 50%; }
#downloads dt a:hover { text-decoration:underline; }
#downloads dt span    { display:block; font-weight:normal; }
#downloads .file-size { float:right; }
#downloads .file-pic  { position:absolute; left:24px; top:6px; }

#content-supp-01 .banner     { display:block; margin-bottom:20px; }
#content-supp-01 .banner img { vertical-align:top; }

/************************ Supplementary content #2 ***/
#content-supp-02 { float:left; width:164px; margin-left:35px; display:inline; }

#content-supp-02 div        { margin-bottom:20px; background:url(../images/bg-content-supp-02.png) no-repeat -164px 100%; }
#content-supp-02 h2         { padding-left:15px; font-size:1.3em; font-weight:bold; line-height:36px; color:#004577; background:url(../images/bg-content-supp-02.png) no-repeat 0 0; }
#content-supp-02 h3         { padding:10px 15px 0; font-size:1.5em; line-height:1.2; font-weight:bold; color:#004577; }
#content-supp-02 p          { padding:10px 15px 10px; font-size:1.1em; line-height:1.5; }
#content-supp-02 p a        { color:#829bb4; text-decoration:none; }
#content-supp-02 p a:hover  { text-decoration:underline; }
#content-supp-02 p strong   { font-weight:bold; }

#content-supp-02 ul         { padding:5px 0 10px; }
#content-supp-02 ul a       { display:block; width:146px; height:96px; margin-left:-73px; position:relative; left:50%; color:#fff; text-decoration:none; }
#content-supp-02 ul a:hover { text-decoration:underline; }
#content-supp-02 ul img     { position:absolute; left:0; top:0; }
#content-supp-02 ul span    { position:absolute; left:0; bottom:0; z-index:1; width:136px; padding:4px 0 4px 10px; font-size:1.2em; background:rgb(0,0,0); background:rgba(0,0,0,.5); cursor:pointer; }

#content-supp-02 .alt       { padding-bottom:10px; }
#content-supp-02 .alt div   { margin-bottom:0; background-position:-164px 0; }
#content-supp-02 .alt .more { margin-left:15px; }

/************************ FOOTER ***/
#footer             { position:relative; left:3px; width:978px; min-height:217px; overflow:hidden; margin:0 auto; padding:19px 0 0; border-bottom:2px solid #e5e5e5; line-height:1.2; background:url(../images/bg-footer.png) no-repeat 0 0; }
#footer p           { position:absolute; left:0; bottom:19px; clear:left; line-height:1.4; }
#footer .nav-supp   { right:0; bottom:19px;  }
#footer .nav-supp a { text-transform:uppercase; font-size:1.1em; color:#829bb4;  }
#nav-sitemap            { width:978px; height:175px; overflow:hidden; }
#nav-sitemap li         { float:left; height:100%; padding-left:15px; margin-right:15px; border-left:1px solid #fff; vertical-align:top; }
#nav-sitemap .first     { border-left:none; }
#nav-sitemap .last      { float:right; display:inline; }
#nav-sitemap .alt-01    { width:240px; }
#nav-sitemap a          { display:block; color:#829bb4; text-decoration:none; vertical-align:top; }
#nav-sitemap a:hover    { text-decoration:underline; }
#nav-sitemap .active a  { color:#b6c4d3; }
#nav-sitemap h3 a       { font-size:1.1em; text-transform:uppercase; font-weight:normal; }
#nav-sitemap li ul      { margin-top:16px; }
#nav-sitemap li li      { float:left; clear:left; height:auto; padding:3px 0; border-left:none; }
#nav-sitemap li li a    { padding-left:6px; background:url(../images/bg-dot-01.png) no-repeat 0 6px; }

#sign { position:absolute; left:0; bottom:4px; text-decoration: none; color: black; }
#sign:hover,
#sign span  { color: red; }