/* Theme Name: SOFA Rooster Theme URI: http://sofarider.com/ Description: Plain Blog WordPress Theme. Version: 1.15rc Author: Dameer, sofarider.com Author URI: http://sofarider.com/ Tags: CMS, Blog */ /* -------------------------------------------------------------- ROOSTER STYLES Created: 28.07.2009. Modified: 03.09.2009. -------------------------------------------------------------- */ /* http://meyerweb.com/eric/tools/css/reset/ */ /* v1.0 | 20080212 */ 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, 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; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { font: 66%/1.5 "Trebuchet MS", Arial, Helvetica, sans-serif; color: #888; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0; } pre { font-family: "Courier New", Courier, monospace; font-size: 12px; margin: 0 20px 20px 20px; padding: 0 10px; background: #f0f0f0; line-height: 15px; overflow: auto; overflow-Y: hidden; width: 560px; } code { font-size: 1em; color: #666666; width: 560px; overflow: auto; margin: 0 20px 20px 20px; padding: 0 10px; background: #f0f0f0; } /* =defaults -------------------------------------------------------------- */ html { background: #222 url(images/htmlbg.png) repeat-x left bottom; } body { background: transparent url(images/bodybg.png) repeat-x 0 0; } h1, h2, h3, h4, h5, h6 { color: #363636; font-family: "Myriad Pro", Arial, Helvetica, sans-serif; } a { text-decoration: none; } a:link, a:visited, a:active { color: #222; } a:hover, a:focus { color: #888; } .more-link { text-transform: uppercase; } form { width: 100%; overflow: hidden; clear: both; } input, textarea, select { border: 1px solid #d7d7d7; background: #fff; } input, textarea, select, options, button, label, legend { font-family: Arial, Helvetice, sans-serif; } label { display: block; clear: both; } input { height: 20px; padding: 4px; float: left; display: inline; font-size: 1.1em; line-height: 1.27; color: #888; } textarea { padding: 10px; font-size: 1.1em; color: #888; } #entryform textarea { width: 555px; } /* =common -------------------------------------------------------------- */ /* =navigation -------------------------------------------------------------- */ .navigation { overflow: hidden; } .navigation li { text-transform: uppercase; float: left; display: inline; } .navigation li a:link, .navigation li a:visited, .navigation li a:active { color: #d7d7d7; } .navigation li a:hover, .navigation li a:focus, .navigation .current_page_item a:link, .navigation .current_page_item a:hover, .navigation .current_page_item a:visited, .navigation .current_page_item a:active, .navigation .current_page_item a:focus, .navigation .current-cat a:link, .navigation .current-cat a:hover, .navigation .current-cat a:visited, .navigation .current-cat a:active, .navigation .current-cat a:focus { color: #fff; } .navigation .current-cat { background: #111; } /* =panel -------------------------------------------------------------- */ .panel { width: 301px; margin: 0 0 0 9px; float: left; display: inline; position: relative; } .fetaured, .portfolio-item { width: 620px; } #sideBar .panel { margin: 0 0 21px 0; } #sideBar .panel-content .flick { padding: 20px 0 0 0; overflow: hidden; margin-bottom: 10px; } #sideBar .panel-content img.flickr { margin: 0 0 5px 10px; } #sideBar .panel-content ul { margin-top: 20px; margin-bottom: 20px; background-color:#eeeeee; } #sideBar .panel-content ul.ads { margin-top: 0; margin-bottom: 0; } #sideBar .panel-content, { background-color:#eeeeee;} .fetaured .panel-content, .portfolio-item .panel-content { overflow: hidden; } .fetaured .panel-content, .portfolio-item .panel-content { width: 620px; } .panel-content { width: 299px; border: 1px solid #d7d7d7; clear: both; background: #eeeeee; float: left; display: inline; } .panel-content img, .panel-content a img { margin: 2px 19px 0 0; border: 5px solid #d7d7d7; float: left; display: inline; } .fetaured .panel-content img, .fetaured .panel-content a img { margin-bottom: 20px; } .panel h1, .panel h2, .panel h2.smaller { line-height: 1.31; letter-spacing: -.04972em; padding: 13px 19px 2px 19px; } .panel h1, .panel h2 { font-size: 2.5em; } .panel h2.smaller { font-size: 1.9em; } .panel p { font-size: 1.1em; line-height: 2; padding: 13px 19px; overflow: hidden; } #slider p { font-size: 1.1em; line-height: 2; padding: 0; overflow: visible; } #slider h1, #slider h2 { padding: 13px 0 2px 0; } .panel .more-link { font-size: .909em; } .client-info, .external-link { display: block; font-size: 1.1em; line-height: 2; padding: 0; } .client-info span, .external-link { text-transform: uppercase; line-height: 1; } /* =panel label -------------------------------------------------------------- */ .label { padding-bottom: 10px; margin-left: 21px; margin-bottom: -11px; display: inline; float: left; font-size: 1.1em; line-height: 1; background: transparent url(images/label-light-spike.png) no-repeat 41px 100%; position: relative; } .label span { padding: 6px 20px; display: block; background: #d7d7d7; color: #888; white-space: nowrap; } .date { width: 60px; height: 60px; background: #aaa; position: absolute; left: -7px; top: 45px; } .date span { font-size: 1.2307em; display: block; } .date div { width: 60px; height: 47px; position: relative; left: -2px; top: -2px; overflow: hidden; background: #ee1c24; color: #fff; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; text-align: center; font-size: 1.3em; line-height: 1.1; padding-top: 13px; } .panel .comments { float: right; display: inline; font-size: 1.1em; line-height: 2; text-align: right; color: #888; } .panel .comments a { color: #888; } .panel .comments a span { font-weight: bold; color: #222; } .panel ol, .panel ul, .panel dl { padding: 0 20px 0 20px; } .panel ol, .panel ul { margin-left: 10px; } .panel ul ul, .panel ul ol, .panel ol ul, .panel ol ol { padding: 0; margin: 0 5px; } .panel ul li { padding-left: 12px; background: #fff url(images/content-bullet.png) no-repeat 0 .75em; font-size: 1.1em; } .panel li li { font-size: 100%; } .panel .tabs { float: right; display: inline; margin: 0 20px; position: relative; top: 1px; } .tabs span { float: left; display: inline; border: 1px solid #d7d7d7; background: #fff; font-size: 1.1em; margin-left: 1px; } .tabs .active { border-bottom: 1px solid #fff; } .tabs a { display: block; padding: 3px 10px 1px 10px; } /* =layout -------------------------------------------------------------- */ #wrap { width: 960px; margin: 0 auto; overflow: hidden; } #header { width: 960px; height: 91px; position: relative; overflow: hidden; } #branding { width: 180px; height: 41px; position: absolute; left: 10px; top: 16px; } #globalNav { position: absolute; right: -10px; bottom: 20px; } #main { width: 960px; padding: 0; position: relative; float: left; display: inline; z-index: 444; } #breadcrumbs { width: 600px; } #content { width: 640px; margin-left: 9px; float: left; display: inline; } #sideBar { width: 301px; margin-right: 9px; float: right; display: inline; position: relative; } #footer { width: 960px; height: 50px; float: left; display: inline; clear: both; padding: 25px 0 10px 0; position: relative; } /* =header -------------------------------------------------------------- */ #header { background: transparent url(images/topbg.png) no-repeat left bottom; } /* =branding -------------------------------------------------------------- */ #branding { /*background: transparent url(images/rooster-logo-it.gif) no-repeat 0 0;*/ } #branding a { width: 180px; height: 41px; display: block; /*overflow: hidden; text-indent: -9999em;*/ } /* =globalNav -------------------------------------------------------------- */ #globalNav li { font-weight: bold; font-size: 1.4em; letter-spacing: -.0667em; } #globalNav li a { display: block; padding: 5px 20px; } #globalNav .current_page_item { background: #111; } /* =main -------------------------------------------------------------- */ #main { background: #ececec url(images/mainbg.png) repeat-y 0 0; } .bbr-holder { position: relative; margin-bottom: 30px; } /* =breadcrumbs -------------------------------------------------------------- */ #breadcrumbs { color: #888; padding: 7px 0 0 30px; position: relative; z-index: 445; } #breadcrumbs a:link, #breadcrumbs a:visited, #breadcrumbs a:active { color: #222; } #breadcrumbs a:hover, #breadcrumbs a:focus { color: #888; } /* =globalRSS -------------------------------------------------------------- */ #globalRSS { width: 31px; height: 31px; float: right; display: inline; position: relative; right: 30px; top: -20px; margin-bottom: -30px; background: transparent url(images/rss-icon.png) no-repeat 0 0; overflow: hidden; z-index: 446; } #globalRSS a { width: 31px; height: 31px; display: block; text-indent: -9999em; } /* =banner -------------------------------------------------------------- */ #banner { width: 900px; margin: 28px 30px 10px 30px; } #banner a img, #banner object, #banner embed { width: 900px; /*border: 5px solid #d7d7d7;*/ } #banner object embed { border: none; } /* =homeHeader -------------------------------------------------------------- */ /* =promoted -------------------------------------------------------------- */ #promoted.panel { width: 622px; } #promoted .panel-content { width: 579px; } #promoted .panel-content h1 { padding-top: 0; } #promoted .panel-content { padding: 18px 20px 20px 20px; overflow: hidden; } .home #promoted .panel-content { border-color: #000; background: #111; } #promoted .label { background-image: url(images/label-light-spike.png); padding-bottom: 11px; } #promoted .panel-content img, #promoted .panel-content a img { border-color: #d7d7d7; } #promoted .panel-content h1, #promoted .panel-content h2 { color: #222; margin-bottom: 10px; } .home #promoted .label { background-image: url(images/label-dark-spike.png); } .home #promoted .panel-content img, .home #promoted .panel-content a img { border-color: #000; } .home #promoted .panel-content h1, .home #promoted .panel-content h2 { color: #fff; } #promoted .short-description { width: 600px; float: left; display: inline; padding: 0; margin-top: 19px; border-top: 1px solid #d7d7d7; clear: both; line-height: 1.5; } .home #promoted a:link, .home #promoted a:visited, .home #promoted a:active { color: #fff; } .home #promoted a:hover, .home #promoted a:focus { color: #888; } .promo-browser { position: absolute; right: 20px; top: 0; border: 1px solid #000; border-bottom-color: #111;; } .promo-browser a { width: 67px; font-size: 1em; text-transform: uppercase; text-align: center; display: inline; float: left; background: #111; padding: 4px 10px; } .promo-browser .next { } /* =intro -------------------------------------------------------------- */ #intro.panel { float: right; display: inline; } /* =content -------------------------------------------------------------- */ #content .panel { margin: 0 19px 21px 0; } #content .panel h2 { height: 73px; overflow: hidden; line-height: 1.3; padding: 15px 20px 14px 70px; border-bottom: 1px solid #d7d7d7; } .panel object, .panel embed { width: 250px; height: 185px; float: left; overflow: hidden; padding: 0; margin: 5px 10px 5px 0; border: 5px solid #d7d7d7; } .panel .narrow object, .panel .narrow embed { margin-right: 0; } #promoted.panel object, #promoted.panel embed { border: 5px solid #000; } .panel object embed { padding: 0; margin: 0; } .content-details .panel { width: 620px; } .content-details .panel-content { width: 620px; padding: 6px 0 0 0; } .content-details #main-content h2, .content-details #main-content h3, .content-details #main-content h4, .content-details #main-content h5, .content-details #main-content h6 { padding: 0 20px; margin: 0; font-size: 1.8em; font-weight: bold; border: none; height: auto; } .content-details #main-content p, .content-details #main-content ol, .content-details #main-content ul, .content-details #main-content dl { padding: 0 20px 18px 20px; } .content-details #main-content ol, .content-details #main-content ul { margin-left: 25px; } .content-details #main-content ol ol, .content-details #main-content ul ul, .content-details #main-content ol ul, .content-details #main-content ul ol { padding: 0; } .content-details #main-content li { font-size: 1.1em; } .content-details #main-content li li { font-size: 100%; } .content-details #main-content img { margin-bottom: 10px; } .content-details #main-content blockquote { background: #fff url(images/blockquote.png) no-repeat 0 .3em; margin: 3px 0 5px 20px; } .content-details #main-content blockquote p { font-size: 1.4em; line-height: 1.5714; font-style: italic; padding-left: 36px; } .content-details #main-content li { } .content-details #main-content object, .content-details #main-content embed { width: 570px; height: 410px; margin-right: 0; } /* =wputils -------------------------------------------------------------- */ #content .alignleft { float: left; display: inline; } #content .alignright { float: right; display: inline; margin-right: 0; margin-left: 19px; } #content .aligncenter { margin: 0 auto; display: inline; clear: both; float: none; } #content .wp-caption { margin: 2px 19px 0 20px; float: left; display: inline; border: 5px solid #d7d7d7; border-bottom: none; background: #d7d7d7; } #content .wp-caption img { border: none; margin: 0; } #content .wp-caption p { margin: 0; padding: 0; text-align: center; } #content .size-medium, #content .size-medium img { /*width: 240px;*/ margin: 2px 19px 5px 0; } .home #content .panel-content img.size-medium { margin-right: 0; } .home #content .fetaured img.size-medium, .home #content #promoted img.size-medium { margin-right: 19px; } /* =related articles & =results & =archive ---------------------------------------------------------- */ .search p, .archive p { padding: 0; } .search h3 { letter-spacing: -.04972em; } #related ul, #results ul, #archive ul { padding: 10px 20px 15px 10px; } #related ul li, #archive ul li { padding: 0 0 6px 0; margin-bottom: 5px; border-bottom: 1px solid #d7d7d7; background-image: none; } #results ul li { padding: 0 0 14px 0; margin-bottom: 12px; border-bottom: 1px solid #d7d7d7; background-image: none; } #related h3, #archive h3 { font-size: 1.8em; letter-spacing: -.03em; } #results h3 { font-size: 2.3em; margin-bottom: 11px; } #related .article-info { margin-bottom: -3px; } #results .article-info { margin-bottom: 1px; } #related .comments, #results .comments, #archive .comments { float: none; } #related .category-link, #results .category-link, #archive .category-link, #related .datum, #results .datum, #archive .datum { font-size: 1.1em; } #related .category-link, #results .category-link, #archive .category-link, #related .comments, #results .comments, #archive .comments { border-left: 1px solid #d7d7d7; padding-left: 5px; } /* =blog ---------------------------------------------------------- */ #content.blog .panel h1 { height: 73px; overflow: hidden; line-height: 1.5; padding: 5px 20px 14px 70px; margin-bottom: 10px; border-bottom: 1px solid #d7d7d7; } /* =article ---------------------------------------------------------- */ #article { clear: both; overflow: hidden; } #main-content .socialbookmarking h2.socdwnld, #main-content .documentList h2.socdwnld { padding: 0 0 20px 0; margin: 0; } #main-content .socialbookmarking img { padding: 0; margin: 0; float: none; border: none; } #main-content .socialbookmarking a { float: left; width: 18px; height: 18px; display: inline; margin :0 6px 10px 0; } /* =comments ---------------------------------------------------------- */ #comments { clear: both; width: 100%; } #main-content #comments .comment-list { margin: 10px 0; padding: 0; clear: both; float: left; display: inline; } #main-content #comments .comment { width: 620px; margin-bottom: 27px; padding: 0; background: none; float: left; display: inline; position: relative; } #comments .postedby { font-size: 1.6363em; line-height: 1; letter-spacing: -.035em; font-weight: bold; } #comments .gravatar img { margin: 0; border: none; } .gravatar { width: 60px; height: 60px; background: #aaa; position: absolute; left: -7px; top: 0; } .gravatar img { width: 60px; height: 60px; position: relative; left: -2px; top: -2px; overflow: hidden; margin: 0; } .postedby, .comment-text { padding: 0 20px 0 72px; } .comment-text { font-size: 97%; line-height: 1.5; margin-top: 2px; } #main-content #comments .comment-text * { padding: 0; } #main-content #comments .comment-text blockquote { margin-left: 0; padding-left: 36px; } #main-content #comments .comment-text blockquote p { font-size: 1.57em; } .byadmin a:link, .byadmin a:visited, .byadmin a:active { color: #ed1b23; } .byadmin a:hover, .byadmin focus { color: #888; } /* =commentform ------------------------------------------------------ */ #commentform { width: 530px; margin: 20px 0 20px 70px; padding: 18px 0; float: left; display: inline; border-top: 1px solid #d7d7d7; } #main-content #commentform p { padding: 0; } #commentform input { width: 240px; } /* =category ---------------------------------------------------------- */ /* =portfolio ---------------------------------------------------------- */ .portfolio-info { padding: 8px 0 20px 0; margin: 0 20px 18px 20px; border-bottom: 1px solid #d7d7d7; } .portfolio-info strong, .portfolio-info a { padding: 0; } #content .portfolio-item img { margin-left: 20px; margin-bottom: 3px; } .portfolio-item .client-info, .portfolio-item .external-link { float: left; display: inline; margin-right: 20px; } .portfolio-item .external-link { line-height: 2; } .portfolio-item h1 { margin-top: 6px; margin-bottom: 15px; } .portfolio-item .client-info { margin-bottom: 13px; } /* =pagination ---------------------------------------------------------- */ #pagination { width: 578px; background: #fff; border: 1px solid #d7d7d7; overflow: hidden; margin: 0 auto 10px auto; clear: both; position: relative; left: -10px; text-align: center; font-size: 1.4em; line-height: 2; font-weight: bold; } #pagination .pages { width: 580px; margin: 0 auto; float: left; display: inline; text-align: center; position: relative; } #pagination li, #pagination li.frot { padding: 0; display: inline; text-align: center; } #pagination li.frot { font-size: 0.75em; margin-right: 20px; } #pagination a { padding: 6px 9px; } #pagination .first-page, #pagination .previous-page { } #pagination .next-page, #pagination .last-page { } #pagination .current-page span { padding: 6px 9px; color: #fff; background: #ee1c24; } /* =contact & commentform ---------------------------------------------------------- */ #contact .panel-content { width: 620px; } #contact h1 { padding-bottom: 0; } #contact p { padding: 10px 20px; } #contactForm { width: 570px; padding: 10px 0; } #contactForm p, #commentform p { padding: 0 20px; margin-bottom: 3px; overflow: hidden; } #contactForm textarea { width: 524px; overflow: auto; } #commentform textarea { width: 505px; overflow: auto; } #contact .submitMe, #commentform .submitMe { margin: 10px 0; overflow: hidden; } #contact .submitMe input, #commentform .submitMe input { width: 218px; float: none; padding: 0; height: auto; border: none; } #contact .submitMe #contactSubmit, #commentform .submitMe #submit { width: 67px; height: 30px; border: 1px solid #d7d7d7; float: right; display: inline; font-size: 1.1em; text-transform: uppercase; text-align: center; background: #ececec url(images/form-btn.png) repeat-x 0 50%; border: none; color: #363636; } /* =doclist ---------------------------------------------------------- */ .documentList { width: 270px; margin: 0 20px 10px 20px; padding: 16px 0 0 0; float: right; display: inline; border-top: 1px solid #d7d7d7; } #main-content .documentList ul { margin: 0; padding: 0; } #main-content .documentList li { width: 100%; padding: 0; background: none; } .doclist a { display: block; text-decoration: none; padding-left: 24px; margin-bottom: 7px; background-color: transparent; background-repeat: no-repeat; background-position: 0 50%; background-image: url(images/icon_generic.gif); } .doclist a:link, .doclist a:visited, .doclist a:active { color: #222; } .doclist a:hover, .doclist a:focus { color: #888; } .doclist a[href$=".mov"], .doclist a[href$=".mpg"] { background-image: url(images/icon_mov.gif); } .doclist a[href$=".avi"], .doclist a[href$=".wmv"] { background-image: url(images/icon_film.gif); } .doclist a[href$=".wav"], .doclist a[href$=".mp3"] { background-image: url(images/icon_audio.gif); } .doclist a[href$=".txt"] { background-image: url(images/icon_txt.gif); } .doclist a[href$=".doc"], .doclist a[href$=".docx"], .doclist a[href$=".odf"] { background-image: url(images/icon_doc.gif); } .doclist a[href$=".xls"], .doclist a[href$=".xlsx"] { background-image: url(images/icon_xls.gif); } .doclist a[href$=".ppd"], .doclist a[href$=".ppt"] { background-image: url(images/icon_ppt.gif); } .doclist a[href$=".pdf"] { background-image: url(images/icon_pdf.gif); } .doclist a[href$=".zip"] { background-image: url(images/icon_zip.gif); } /* =socialbookmarking ---------------------------------------------------------- */ .socialbookmarking { width: 270px; margin: 0 20px 10px 20px; padding: 16px 0 10px 0; float: left; display: inline; border-top: 1px solid #d7d7d7; } .socialbookmarking ul li { background-image: none; } /* =sideBar -------------------------------------------------------------- */ /* =subnavigation ---------------------------------------------------------- */ .panel .subnavigation { padding: 6px 20px 20px 20px; margin: 0; } ul.subnavigation li { font-size: 1.6em; line-height: 1.5714; background: #eeeeee url(images/subnavigation-bullet.png) no-repeat 1px 14px; padding: 5px 0 7px 17px; border-bottom: 1px solid #d7d7d7; } .subnavigatiom .current a, .subnavigation .current_page_item a, .subnavigation .current-cat a { color: #888; } /* =twitter ---------------------------------------------------------- */ .twitter-feed h2 { margin-right: 20px; background: transparent url(images/twitter-birdie.png) no-repeat 100% 100%; } .twitter-feed ul { margin: 14px 0 18px 0; } .twitter-feed ul li { width: 100%; margin-bottom: 4px; padding: 0 0 4px 0; font-size: 1.1em; line-height: 2; border-bottom: 1px solid #d7d7d7; background-image: none; background-color:#eeeeee; } /* =social-media ---------------------------------------------------------- */ #sideBar .social-media img { border: none; margin-right: 13px; } .social-media ul { margin: 15px 0 18px 0; } .social-media ul li { width: 100%; margin-bottom: 8px; padding: 0 0 7px 0; overflow: hidden; border-bottom: 1px solid #d7d7d7; background-image: none; } .social-media li a { float: left; display: inline; } .social-media li strong { font-size: 1.7em; float: left; display: inline; line-height: 1; /*letter-spacing: -.04972em;*/ padding: 7px 19px 2px 0; } .social-media li span { float: left; display: inline; width: 150px; color: #888; } /* =searchform ---------------------------------------------------------- */ #searchform { width: 260px; padding: 20px; float: left; display: inline; } #s { width: 175px; } #searchsubmit { height: 30px; padding: 0 4px; font-size: 1.2em; text-transform: uppercase; text-align: center; display: inline; float: right; background: #ececec url(images/form-btn.png) repeat-x 0 50%; border: none; color: #363636; } /* =text widget ---------------------------------------------------------- */ /* =recent-work & =ads & =flickr ---------------------------------------------------------- */ .panel .recent-work, .panel .ads { float: left; padding: 20px 0 10px 0; margin: 0; display: inline; } #sideBar .recent-work img, #sideBar .ads img { width: 125px; height: 125px; margin: 0; } .recent-work a, .ads a { float: left; display: inline; } ul.recent-work li, ul.ads li { width: 135px; height: 135px; float: left; margin: 0 0 10px 10px; padding-left: 0; background-image: none; display: inline; } /* =footer -------------------------------------------------------------- */ #footer { background: transparent url( images/bottombg.png ) no-repeat 0 0; } /* =navigation -------------------------------------------------------------- */ #footer .navigation { margin-top: 8px; } #footer .navigation li { margin-right: 10px; font-size: 1.2em; line-height: 2; height: 25px; } #footer .navigation a { padding: 10px 10px 0; } /* =copyright -------------------------------------------------------------- */ .copyright { width: 50%; margin-left: 10px; clear: both; line-height: 1; } /* =logo -------------------------------------------------------------- */ .logo { width: 118px; height: 29px; position: absolute; right: 10px; top: 37px; } /* =slider you can write styles here -------------------------------------------------------------- */ /* HERE ARE CRUCIAL jQuery SLIDER SETTINGS */ .clear { clear: both; width: 90%; height: 16px; } #slider { width: 580px; height: 315px; overflow: hidden; } #slider div { width: 580px; overflow: hidden; /*padding-right: 40px;*/ }