/******************************************************************************* Author: kodoGrafia kodografia.pl / skladacze.pl ******************************************************************************* 1. BASE 1.1 Reset 1.2 Helper classes 1.2.1 Hidden Accessible 1.2.2 Clearfix 1.2.3 Image replacement 1.3 Skip links 1.4 Default styles 2. COMMON 2.1 Container 2.2 Header 2.2.1 Advertising 2.2.2 Navigation 2.3 Sidebars 2.3.1 Projects 2.3.2 Gallery 2.3.3 Buttons 2.3.4 Newsletter 2.3.5 Partners 2.3.6 People 2.4 Content 2.5 Footer 2.5.1 Navigation 2.5.2 Info 2.6 Pagination 2.7 Box 2.8 Links 3. PAGES 3.1 Home 3.1.1 Newsroom 3.1.2 Contest *******************************************************************************/ /* 1. BASE -------------------------------------------------------------------------------- ==============================================================================*/ /* 1.1 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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* 1.2 Helper classes ------------------------------------------------------------------------------*/ /* 1.2.1 Hidden Accessible */ .clear { clear: both; } h3 { font-size: 15px; font-weight: bold; margin-bottom: 15px; } .hidden { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } /* 1.2.2 Clearfix */ .clearfix:after, #header:after { content: "."; display: block; visibility: hidden; clear: both; height: 0; } /* 1.2.3 Image replacement */ .ir, .site-name, #navigation ul:first-child li a, #navigation ul ~ ul li.rss a, #contest li a, a.associate, #newsletter-box input[type=submit], a.tell-a-friend, #newsroom a.archives { display: block; text-indent: -999em; overflow: hidden; text-transform: capitalize; background-repeat: no-repeat; text-align: left; } /* 1.3 Skip links ------------------------------------------------------------------------------*/ #skip-links { position:absolute; left:0; top:0; } #skip-links a { position:absolute; left: -99999px; top:0; } #skip-links a:focus, #skip-links a:active { position:relative; left:10px; top:18px; z-index:9999; padding: 8px 15px; text-decoration: none; outline:none; border: 1px dotted #fff; color: #fff; font-weight:bold; background: #999; } /* 1.4 Default styles ------------------------------------------------------------------------------*/ body { font: 11px/1.4 Verdana, Geneva, sans-serif; color: #5d5133; background: #fff url(../images/body_bg.jpg) top center repeat-x; } input, textarea, select { font-family: Verdana, Geneva, sans-serif; } textarea { overflow: auto; vertical-align: top; resize: vertical; } button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; } hr { display: none; } strong { font-weight: bold; } em { font-style: italic; } del { text-decoration: line-through; } th, td { vertical-align: top; } th { font-weight: normal; text-align: left; } address, cite, dfn { font-style: normal; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } a, a:visited { text-decoration: none; color: #fbb103; } a:hover, a:active, a:focus { text-decoration: underline; } h2 { clear:both; display:inline; float:left; text-transform:uppercase; white-space:nowrap; font-size:15px; padding-left:7px; line-height:32px;} /* 2. COMMON -------------------------------------------------------------------------------- ==============================================================================*/ /* 2.1 Container ------------------------------------------------------------------------------*/ .container { margin: 0 auto; width:1000px; } /* 2.2 Header ------------------------------------------------------------------------------*/ .site-name { display:inline; float:left; margin: 15px 0 0 15px; width:279px; height:99px; background: url(../images/logo.png); } /* 2.2.1 Advertising */ #advertising { display:inline; float:right; margin-top:16px; width:681px; height:112px; } /* 2.2.2 Navigation */ #navigation { clear:both; float:left; display:inline; width:1000px; margin:5px 0; } #navigation ul:first-child { float:right; height:21px; } #navigation ul:first-child li { display:inline;} #navigation ul:first-child li a { height:21px; background-repeat:no-repeat; } #navigation ul:first-child li a.lang-en { width:68px; background-image:url(../images/navigation_lang_en.png); } #navigation ul ~ ul { position:relative; right:-13px; clear:both; width:1000px; } #navigation ul ~ ul li, #navigation ul ~ ul li a { background-image:url(../images/navigation_sprite.png); position: relative;} #navigation ul ~ ul li { display:inline; float:left; background-position: 0 -37px; background-repeat:repeat-x;} #navigation ul ~ ul li a { font-style: italic; position:relative; left:-13px; z-index:2; display:inline-block; background-position: 0 0; background-repeat:no-repeat; height:37px; padding: 0 21px 0 30px; line-height:37px; text-align:center; color:#fff; text-transform:uppercase; font-size:13px; } /*#navigation ul ~ ul li:first-child a { padding-right:18px; }*/ #navigation ul ~ ul li:hover { background-position: 0 -111px; } #navigation ul ~ ul li a:hover { background-position: 0 -74px; text-decoration:none; } #navigation ul ~ ul li.rss { position:relative; left:-13px; width:64px; background-position: -43px -148px; } #navigation ul ~ ul li.rss:hover { background-position: -43px -148px; } #navigation ul ~ ul li.rss a { left:0; width:64px; position:static; padding:0; background: url(../images/ico_rss.png) center center no-repeat; } #navigation ul ~ ul li ul { z-index: 31; top: 36px; left: 0px; position: absolute; display: block; margin: 0; padding: 0; color: #ffffff; border: 1px solid #282828; width: 263px; z-index: 99999999999; } #navigation ul ~ ul li ul li a { background-image:url(../images/navigation_sprite.png); clear: both; width: 321px; margin-right: -10px; } /* 2.2.3 Navigation */ #navigation2 { width:200px; margin:5px 0; } #navigation2 ul ~ ul { position:relative; left:10px; clear:both; width:190px; } #navigation2 ul ~ ul li, #navigation2 ul ~ ul li a { background-image:url(../images/navigation_sprite.png); clear: both; width: 190px; } #navigation2 ul ~ ul li { display:inline; float:left; background-position: 0 -37px; background-repeat:repeat-x; } #navigation2 ul ~ ul li a { position:relative; left:-13px; z-index:2; display:inline-block; background-position: 0 0; background-repeat:no-repeat; height:37px; padding: 0 12px 0 16px; line-height:37px; text-align:center; color:#fff; text-transform:uppercase; font-size:15px; } #navigation2 ul ~ ul li:hover { background-position: 0 -111px; } #navigation2 ul ~ ul li a:hover { background-position: 0 -74px; text-decoration:none; } /* 2.2.4 Navigation */ #navigation_my { width:200px; margin:5px 0; } #navigation_my ul li{ background:url(../images/navigation/but_off_bg.png) no-repeat; background-position: 0px 37px; clear: both; width: 190px; min-height: 37px; } #navigation_my ul li div{ background:url(../images/navigation/but_off.png) no-repeat; width: 190px; min-height: 37px; } #navigation_my ul li:hover{background:url(../images/navigation/but_on_bg.png) no-repeat; background-position: 0px 37px; } #navigation_my ul li:hover div{ background:url(../images/navigation/but_on.png) no-repeat; width: 190px; min-height: 37px; } #navigation_my ul li{text-align: center;color: rgb(255, 255, 255);text-transform: uppercase;font-size: 13px;line-height: 37px;} #navigation2 ul ~ ul { position:relative; left:10px; clear:both; width:190px;} #navigation2 ul ~ ul li, #navigation2 ul ~ ul li a { background-image:url(../images/navigation_sprite.png); clear: both; width: 190px; } #navigation2 ul ~ ul li { display:inline; float:left; background-position: 0 -37px; background-repeat:repeat-x; } #navigation2 ul ~ ul li a { position:relative; left:-13px; z-index:2; display:inline-block; background-position: 0 0; background-repeat:no-repeat; height:37px; padding: 0 12px 0 16px; line-height:37px; text-align:center; color:#fff; text-transform:uppercase; font-size:15px; } #navigation2 ul ~ ul li:hover { background-position: 0 -111px; } #navigation2 ul ~ ul li a:hover { background-position: 0 -74px; text-decoration:none; } /* 2.3 Sidebars ------------------------------------------------------------------------------*/ #sidebar-left { float:left; display:inline; width:200px; } #sidebar-right { float:right; display:inline; width:200px; } #sidebar-left .box, #sidebar-right .box { width:178px; } /* 2.3.1 Projects */ #projects-box { float:left; width:200px; } #projects-box .pages ul.list ~ ul.list { display:none; } #projects-box ul.list > li { clear:both; display:inline; float:left; } #projects-box ul.list > li+li { margin-top:3px; } #projects-box .pagination { display:inline; float:right; margin-top:11px; } /* 2.3.2 Gallery */ #gallery-box { font-size:10px; } #gallery-box h3 { display:inline; float:left; color:#d79906; font-weight:bold; line-height:1em; } #gallery-box h3 ~ h3 { margin-top:2px; } #gallery-box a { float:left; width:100%; clear:both; color:#c1bdb3; } #gallery-box ul { display:inline; float:left; margin: 4px 0; } #gallery-box ul li { display:inline; float:left; border:1px solid #fbb103; width:85px; height:50px;} #gallery-box ul li+li { margin-left:4px; } #gallery-box ul li a { display:inline-block; } /* 2.3.3 Buttons */ a.associate { float:left; display:inline-block; margin-top:33px; width:200px; height:48px; background:url(../images/btn_associate.png) no-repeat; } a.tell-a-friend { float:left; display:inline-block; margin-top:5px; width:200px; height:48px; background:url(../images/btn_tell_a_friend.png) no-repeat; } /* 2.3.4 Newsletter */ #newsletter-box { float:left; display:inline; position:relative; margin-top:5px; width:200px; height:48px; background:url(../images/newsletter_bg.png) no-repeat; } #newsletter-box div { position:absolute; top:23px; left:13px; width:156px; padding:0 8px; height:19px; background:url(../images/form_small_input.png) no-repeat; } #newsletter-box div input { float:left; background:none; width:156px; border:0; font-size:10px; color:#b5afa3; height:17px; line-height:17px; } #newsletter-box input[type=submit] { position:absolute; top:5px; right:15px; border:0; width:51px; height:18px; background:url(../images/form_small_submit.png) no-repeat; } /* 2.3.5 Partners */ #partners-box { width:198px !important; padding:13px 0; text-align:center; background:#fff; } #partners-box p { font-size:14px; line-height:15px; width:100%; background:url(../images/partners_sep.jpg) top center no-repeat; } #partners-box a.more { position:relative; top:-2px; color:#b5afa3; font-size:10px; line-height:1em; } #partners-box img { margin-bottom:8px; } #partners-box img ~ img { margin-top:10px; } /* 2.3.6 People */ #people-box img { float:left; display:inline; margin: 0 7px 0px 0; border:1px solid #fbb103; } #people-box h3 { font-size:14px; line-height:1em; } #people-box a { display:inline; float:left; margin: 0 10px 5px 0; font-size:10px; } #people-box p { font-size:9px; color:#5d5133; line-height:10px; } #people-box li { clear:both; float:left; display:inline; width:180px; } #people-box li+li { margin-top:9px; padding-top:11px; background:url(../images/people_sep.jpg) top center no-repeat; } /* 2.4 Content ------------------------------------------------------------------------------*/ #content { display:inline; float:left; margin:0 10px; /*width:780px;*/ width:580px; } #content .box { width:558px; } /* 2.5 Footer ------------------------------------------------------------------------------*/ #footer { clear:both; display:inline; float:left; margin-top:44px; width:980px; padding:10px; border-top:1px solid #ffd467; } /* 2.5.1 Navigation */ #navigation-bottom { float:left; display:inline; margin-top:10px; } #navigation-bottom li { display:inline; float:left; margin-right:18px; } #navigation-bottom li a { text-transform:uppercase; font-size:16px; } #navigation-bottom li a:hover, #navigation-bottom li a:focus { text-decoration:none; } /* 2.5.2 Info */ #footer p { text-transform:uppercase; white-space:nowrap; font-size:9px; color:#d3ccba; display:inline; float:right; line-height:31px; } #footer p img { vertical-align:middle; margin:0 10px 7px 10px; } #footer p img ~ img { margin-bottom:10px; } *:first-child+html #footer p img { margin-bottom: 2px; } *:first-child+html #footer p img ~ img { margin-bottom:5px; } #footer p+p { clear:both; font-size:8px; } /* 2.6 Pagination ------------------------------------------------------------------------------*/ .pagination li { display:inline; float:left; } .pagination li a { display:inline-block; width:27px; height:20px; line-height:20px; text-align:center; background-image:url(../images/pagination_sprite.png); background-repeat:no-repeat; color:#fff; } .pagination li a:hover, .pagination li.activeSlide a { background-position: -27px 0; text-decoration:none; } .pagination li+li { position:relative; left:-1px; margin-right:-1px; } /* 2.7 Box ------------------------------------------------------------------------------*/ .box { clear:both; float:left; display:inline; border:1px solid #dcd5c4; padding:10px; } /* 2.8 Links ------------------------------------------------------------------------------*/ a.gray { color:#b5afa3; } /* 3. PAGES -------------------------------------------------------------------------------- ==============================================================================*/ /* 3.1 Home ------------------------------------------------------------------------------*/ /* 3.1.1 Newsroom */ #newsroom { position:relative; padding-bottom:20px; } #newsroom .slider { position:relative; height:182px; } #newsroom .slider > li { width:100%; height:162px; position:absolute; top:0; left:0; } #newsroom .slider > li ~ li { display:none; } #newsroom .slider .thumb { float:left; border:1px solid #fbb103; } #newsroom .slider .cnt { float:right; width:295px; } #newsroom .slider h3 { color:#d79906; font-size:12px; font-weight:bold; } #newsroom .slider p { line-height:normal; margin-top:5px; } #newsroom .slider p, #newsroom .slider .links { font-size:10px; } #newsroom .slider .links { position:absolute; bottom:0; right:0; height:16px; width:295px; border-top:1px solid #ddd6c6; } #newsroom .slider .links li { display:inline; } #newsroom .pagination { float:right; display:inline; position:relative; top:-20px; z-index:30; right:5px; margin-bottom:-20px; } #newsroom ul.list { float:right; display:inline; margin-top:8px; width:560px; overflow:hidden; } #newsroom ul.list li { display:inline; float:left; clear:both; width:550px; white-space: nowrap; line-height:20px; background:url(../images/blt_dot.png) center left no-repeat; padding-left:10px; } #newsroom .list a { font-size:12px; color:#6c6553; font-weight:bold; margin-right:5px; } #newsroom .list a:focus { text-decoration:none; } #newsroom .list p { width:540px; margin-left:3px; font-size:10px; text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } #newsroom a.archives { display:inline-block; position:relative; bottom:-38px; margin-top:-28px; float:right; width:71px; height:20px; background:url(../images/btn_archives.png) no-repeat; } /* 3.1.2 Contest */ #contest, #contest ul li a { background:url(../images/contest_sprite.png) no-repeat; } #contest { float:left; width:580px; height:116px; background-position: 0 -35px; } #contest ul { float:right; display:inline; margin:32px 22px 0 0; } #contest li { display:inline; float:left; clear:both; margin-bottom:3px; } #contest li a { display:inline-block; float:left; width:152px; height:27px; background-position: -5px -3px !important; } #contest li+li a { width:186px; background-position: -165px -3px !important }