/************************************ CSS file for webradionice.com (c) Webradionice.com 2010. ***********************************/ * { margin: 0; padding: 0; } html { background: #000 url(i/starfield.jpg) repeat 50% 0; } body { min-width: 980px; font: 12px/18px 'Lucida Grande', Verdana, sans-serif; color: #fff; background: url(i/planet.jpg) no-repeat 50% 0; } a img, fieldset { border: 0; } .input-image { outline: none; } a { color: #00addc; text-decoration: none; outline: none; } a:hover { color: #ff0; text-decoration: underline; } i, em, q, blockquote { font: normal 13px/18px Georgia, 'Times New Roman', Times, serif !important; } q:before, q:after { content: ""; } #sizer { width: 980px; min-height: 1000px; padding: 0 20px 100px; margin: 0 auto; } .show-grid { background: url(i/grid.png) repeat-y 40px 0; } #header { width: 980px; height: 60px; padding: 20px 0 0; text-align: left; text-transform: uppercase; background: url(i/header.png) no-repeat 0 20px; } #header a:hover { background: none; } #tagline { position: absolute; left: -9999px; top: -9999px; } #logo { float: left; width: 300px; } #logo a { display: block; width: 173px; height: 53px; text-indent: -9999px; overflow: hidden; } #logo a:hover { background: url(i/header.png) no-repeat 0 -60px; } #main-nav { float: right; width: 583px; } #main-nav li { float: left; display: inline; padding: 0 !important; margin: 0 !important; font-size: 12px; } #main-nav li.current { background: url(i/current-arrow.png) no-repeat 50% 100%; } #main-nav li a { display: block; height: 60px; color: blue; text-indent: -9999px; overflow: hidden; } #main-nav .current a, #main-nav li a:hover { background: url(i/header.png) no-repeat 0 -60px; } #home-link { width: 112px; } #speakers-link { width: 127px; } #schedule-link { width: 124px; } #info-link { width: 73px; } #register-link { width: 147px; } #home-link.current a, #home-link a:hover { background-position: -397px -60px !important; } #speakers-link.current a, #speakers-link a:hover { background-position: -509px -60px !important; } #schedule-link.current a, #schedule-link a:hover { background-position: -636px -60px !important; } #info-link.current a, #info-link a:hover { background-position: -760px -60px !important; } #register-link.current a, #register-link a:hover { background-position: -833px -60px !important; } /*** Footer ***/ #footer { clear: both; width: 620px; padding: 18px 180px; text-align: center; border-top: 1px solid rgb(53,53,53); border-top: 1px solid rgba(255,255,255,.2); } #footer p { font-size: 12px; margin-bottom: 18px; } #footer .pipe { color: #a3a3a3; } #siteby { } /*** Bottom ***/ #bottom-area { float: left; clear: both; width: 100%; padding: 48px 0; border-top: 1px solid rgb(53,53,53); border-top: 1px solid rgba(255,255,255,.2); } #bottom-area h2 { text-indent: -9999px; overflow: hidden; margin-bottom: 18px; } #newsletter { float: left; width: 265px; padding: 90px 0 0 100px; } #newsletter h2 { width: 300px; height: 24px; background: url(i/h2-obavjestajna.png) no-repeat; } #newsletter p { margin-bottom: 18px; } #newsletter form { } #newsletter fieldset { } #newsletter .field { float: left; width: 100%; padding: 8px 0 1.8em; background: url(i/input-text.png) no-repeat 50px 0; } #newsletter label { float: left; clear: both; width: 40px; padding: 3px 25px 0 0; font-size: 1em; text-transform: uppercase; text-align: right; color: #999; } #newsletter .input-text { float: left; width: 180px; height: 18px; font: bold 14px/16px Arial, Helvetica, sans-serif; color: #166b83; background: none; border: 0; outline: none; } #newsletter .button-holder { clear: both; padding: 10px 0 0; text-align: center; border-top: 1px solid #333; } #testimonials { float: left; width: 390px; padding-left: 135px; } #testimonials h2 { width: 170px; height: 62px; margin-left: -48px; background: url(i/h2-fan-corner.png); } #testimonials blockquote { font-style: normal; } #testimonials blockquote p { margin: 0 0 9px; font-size: 13px; } #testimonials blockquote cite { display: block; margin-bottom: 18px; font-style: normal; color: #7cddeb; } /*** Main content ***/ #content .intro { font: 18px/24px Arial, Helvetica, 'MS Sans-serif', sans-serif; margin-bottom: 18px; color: #00addc; } #content p { font-size: 12px; margin: 0 0 18px; } #content ul { margin: 0 0 18px; } #content li { font-size: 12px; } #content li * { font-size: 1em; } #content ul li { list-style: none; padding-left: 60px; background: url(i/bullet.png) no-repeat 40px 5px; } #content acronym, #content abbr, .pseudo-acronym { font-size: .75em !important; text-transform: uppercase; border: 0; } .main-content { float: left; width: 620px; padding: 36px 180px; } .main-content h1 { font: bold 64px/64px Arial, Helvetica, sans-serif; letter-spacing: -2px; margin: 12px 0 36px 0; color: #ff0; text-align: center; } .main-content h1 strong { color: #00addc; } /*** HOMEPAGE ***/ .homepage-main-content { float: left; width: 940px; padding: 0 20px; } .homepage-register-button { display: block; text-indent: -9999px; overflow: hidden; width: 249px; height: 79px; background: url(i/register-button.png) no-repeat 0 0; } #date-location { width: 980px; height: 41px; text-indent: -9999px; overflow: hidden; background: url(i/date-location-neu.png) no-repeat 50% 100%; } #homepage-seats { position: relative; width: 980px; height: 266px; background: url(i/seats.png) no-repeat 81px 50%; } #homepage-seats .homepage-register-button { position: absolute; right: 145px; bottom: -35px; } #total-seats { position: absolute; left: -9999px; top: -9999px; } #home-page .section { padding-bottom: 42px; } #home-page .section h2 { text-indent: -9999px; overflow: hidden; margin-bottom: 18px; background-repeat: no-repeat !important; background-position: 0 100% !important; padding-top: 18px; } #homepage-video { float: right; width: 460px; height: 260px; padding: 74px 0 72px !important; background: url(i/hp-ut-wire.png) no-repeat 235px 100%; } #ffwd { float: left; width: 400px; padding: 0 29px 0 0 !important; border-right: 1px solid #fff; } #ffwd h2 { width: 390px; height: 47px !important; background: url(i/h2-FFWD-neu.png); } #ffwd .intro { clear: both; } #pro-jquery { float: left; width: 400px; padding: 140px 31px 0 0; background: url(i/hp-projquery.png) no-repeat 155px 0; } #pro-jquery h2 { width: 387px; height: 58px; background: url(i/h2-jQuery-neu.png); } #usability-testiranje { float: left; width: 460px; padding-left: 59px; margin-left: -10px; background: url(i/ili.png) no-repeat 9px 40%; } #usability-testiranje h2 { width: 442px; height: 118px; background: url(i/h2-ut-neu.png); } #pro-jquery p, #usability-testiranje p { padding-left: 80px; } #hp-schedule-link { margin: 24px 0 0 !important; } #hp-schedule-link a { display: block; width: 168px; padding: 9px 20px; margin-left: 85px; text-indent: -9999px; overflow: hidden; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -khtml-border-radius: 50px; background-color: rgb(53,53,53); background-color: rgba(255,255,255,.2); background-image: url(i/schedule-link.png); background-repeat: no-repeat; background-position: 20px 50%; } #hp-schedule-link a:hover { background-color: #00addc; } #price-summary { float: left; clear: both; padding: 0 0 42px; } #price-summary .homepage-register-button { } /*** Schedule ***/ #raspored-page h1, #raspored-page caption { width: 100%; text-indent: -9999px; overflow: hidden; } #raspored-page table { width: 620px; margin-bottom: 72px; border-collapse: collapse; } #raspored-page th, #raspored-page td { vertical-align: top; font-size: 16px; line-height: 24px; padding: 12px 10px; } #raspored-page td h2, #raspored-page td .break { font: 18px/24px Arial, Helvetica, sans-serif !important; margin-bottom: 9px; color: #ff0; } #raspored-page td h2 a { color: #ff0; } #raspored-page td p { margin: 0 !important; } #raspored-page td .break { color: #fff; } #raspored-page th { width: 130px; font: 18px/24px Arial, Helvetica, sans-serif !important; text-align: right; color: #00addc; } #raspored-page tr:nth-child(odd) { background: rgb(53,53,53); background: rgba(255,255,255,.2); } #raspored-page .col-left, #raspored-page .col-right { float: left; width: 460px; } #raspored-page .col-left { margin-left: -160px; } #raspored-page .col-right { float: right; margin-right: -160px; } #raspored-page .col-left table, #raspored-page .col-right table { width: 460px; } #raspored-page caption { text-align: center; font: bold 18px/18px Arial, Helvetica, sans-serif; padding-bottom: 12px; color: #ff0; } #raspored-page caption strong { color: #00addc; } #raspored-page .col-left caption { height: 25px; background: url(i/h2-velika-radionica.png) no-repeat 50% 0; } #raspored-page .col-right caption { height: 25px; background: url(i/h2-mala-radionica.png) no-repeat 50% 0; } #prvi-dan-headline { height: 58px; background: url(i/h2-prvi-dan-neu.png) no-repeat 50% 0; } #drugi-dan-headline { height: 58px; background: url(i/h2-drugi-dan-neu.png) no-repeat 50% 0; } /*** Speakers ***/ #predavaci-page h1 { height: 58px; background: url(i/h2-predavaci.png) no-repeat 50% 0; margin-top: 7px; text-indent: -9999px; overflow: hidden; } .people-list { margin-bottom: 0; } .people-list li { float: left; clear: both; width: 540px; padding: 0 0 42px 80px !important; background: none !important; } .people-list dt { font: 24px/32px Arial, Helvetica, sans-serif !important; margin: 0 0 18px 0; color: #ff0; } .people-list dd.image { float: left; display: inline; width: 140px; height: 135px; margin: 0 20px 18px -80px; } /*** Info ***/ iframe { margin-bottom: 18px; } #large-map-link { width: 300px; padding-left: 320px; } #venue-address { width: 300px; text-align: right; } #organization-headline { height: 58px; background: url(i/h2-organizacija.png) no-repeat 50% 0; text-indent: -9999px; overflow: hidden; } #location-headline { clear: both; height: 58px; background: url(i/h2-lokacija.png) no-repeat 50% 0; text-indent: -9999px; overflow: hidden; } /*** Newsletter ***/ #newsletter-page .main-content { text-align: center; } /*** Prijavnica ***/ #registracija-page h1 { height: 123px; background: url(i/h2-prijavnica.png) no-repeat 50% 0; text-indent: -9999px; overflow: hidden; } .dot { padding: 0 5px; } #registration-notes li { margin-left: 20px; } #register-form { width: 620px; padding: 2.7em 0 0; border-top: 1px solid rgb(53,53,53); border-top: 1px solid rgba(255,255,255,.2); } #register-form .field { float: left; clear: both; width: 620px; padding: 0 0 1.8em; } #register-form label { float: left; width: 220px; padding: 3px 20px 0 0; font-weight: bold; text-align: right; } #register-form .label-check { display: inline; width: 380px; padding: 0; margin-left: 242px; text-align: left; } #register-form .label-check .input-check { float: left; margin: 3px 5px 0 0; } #register-form label small { font-weight: normal; display: block; clear: both; } #register-form .radio-group { float: left; width: 460px; padding: 3px 0 3px 160px; } #register-form .radio-group label { float: left; clear: both; width: 100%; padding: 0; margin-bottom: 9px; text-align: left; font: 16px/24px Arial, Helvetica, 'MS Sans-serif', sans-serif; color: #ff0; } #register-form .radio-group label strong { color: #00addc; } #register-form .radio-group label input { float: left; margin: 5px 5px 0 -25px; } #register-form .input-text, #register-form textarea { padding: 4px 2px 2px; font: bold 14px/1.5 'Lucida Grande', Verdana, sans-serif; outline: none; border: 1px solid #717171; border-color: #717171 #b4b4b4 #d9d9d9; color: #166b83; background: #fff url(i/input-shadow.gif) repeat-x 0 0; } #register-form .input-text { width: 214px; } #register-form textarea { width: 294px; height: 80px; } #register-form .inline-note { display: block; padding: 2px 10px 0 245px; font-size: .9em !important; } #register-form select { position: relative; bottom: -3px; padding: 0 0 0 3px; } #register-form option { padding: 1px 10px; } #register-form #promo { width: 134px; } #register-form .button-holder { float: left; width: 620px; padding: 1.8em 0 5.4em; text-align: center; border-top: 1px solid rgb(53,53,53); border-top: 1px solid rgba(255,255,255,.2); } .thankyou-message { color: #73be0e; padding: 0; text-align: center; } .thankyou-message p { font: 1.8em/1.33 Arial, Helvetica, 'MS Sans serif', sans-serif !important; } .error-message { font-weight: bold; font-size: 1.2em; color: #f00; } .error-message p { padding-left: 140px !important; } #register-form .inline-error { display: block; margin: 0 !important; padding: 5px 0 0 260px !important; font-weight: bold; color: #f00; background: url(i/error-arrow.png) no-repeat 245px 10px; } #register-form .error-field .input-text { border: 2px solid #f00 !important; position: relative; top: -1px; left: -1px; }