/* --------------------------------------------------------------------------------------- KAB Consulting Client: Richmond Music Ltd. --------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------- THE LAYOUT - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ * { margin: 0; padding: 0; border: 0; } hr { display: none; } /* --------------------------------------------------------------------------------------- Classes - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .cl { clear: both; visibility: hidden; overflow: hidden; width: 1px; height: 1px; margin-bottom: -1px; font-size: 1px; line-height: 1px; } .ir , .ir a { position: relative; overflow: hidden; display: block; } .ir a , .ir span , .plus .ir { width: 100%; height: 44px; } .ir span { position: absolute; left: 0; top: 0; } .ir a span { cursor: pointer; } /* --------------------------------------------------------------------------------------- Layout - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #main { width: 900px; margin: 0 auto; padding: 0 40px; } #maincontent { width: 100%; } /* --------------------------------------------------------------------------------------- Header - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #header { overflow: hidden; width: 900px; height: 73px; } #logo { float: left; width: 277px; height: 60px; margin: 13px 0 0 23px; display: inline; } #menu { float: right; padding-right: 15px; max-width: 678px; line-height: 73px; } #menu li { position: relative; float: left; display: block; list-style: none; margin: 0 -1px; } #menu li a { display: block; max-height: 73px; padding: 0 15px; } #headlines { position: relative; width: 900px; height: 311px; margin: 0 -8px; padding: 0 8px; } #main #headlines h1 { float: left; width: 504px; height: 180px; margin: 90px 0 0 14px; display: inline; } h1 em { display: block; } #main #headlines h2 { float: right; width: 370px; height: 258px; margin: 53px 52px 0 0; display: inline; line-height: 258px; } #headlines p { clear: left; width: 420px; padding: 20px 0 0 15px; margin: 10px 0px 0px 0px; } /* --------------------------------------------------------------------------------------- middlemenu - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #middlemenu { padding: 25px 0; } #middlemenu li { float: left; display: block; list-style: none; width: 154px; padding: 0 35px; } #middlemenu li.last { border: none; } #middlemenu li h2 { width: 139px; height: 19px; margin: 3px 0 0 0px; line-height: 19px; } #middlemenu li p { clear: both; padding: 20px 0 4px; } #middlemenu a { text-decoration:none; } #middlemenu a:hover { text-decoration: underline; } /* --------------------------------------------------------------------------------------- Content - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .column , #content { margin-top: 26px; } .column { float: left; width: 174px; padding: 3px 25px 0; } #content { overflow: hidden; float: right; width: 404px; padding: 3px 20px 0px 25px; border: 1px solid #d6dee1; border-width: 0 1px; } .column .ir , #content .ir { width: 150px; height: 30px; margin-bottom: 8px; line-height: 30px; } /* --------------------------------------------------------------------------------------- PAGE NEWS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #sub #headlines { height: 208px; margin: 0 -20px; padding: 0 20px; } .novinky #main #headlines h1 { width: 166px; height: 32px; margin: 64px 0 0 26px; } #sub #headlines p { clear: left; width: 330px; padding: 15px 0 0 26px; } #sub #maincontent { padding-top: 8px; } #sub .column , #sub #content { margin-top: 0; } #sub #content { width: 614px; padding-right: 35px; border-right: 0;} #search , #submenu { margin: 0 -25px; } div[class] #search { position: relative; } #search { margin-top: -3px; padding: 10px 10px 15px 15px; } #search label, #search input { vertical-align: middle; } #search label { margin-right: 3px; line-height: 22px; } #search input { border: 1px solid #525658; } #search input#text { width: 100px; height: 16px; line-height: 16px; margin-right: 3px; padding: 3px 5px; } #search input.img { width: 22px; height: 22px; } #submenu { min-height: 226px; height: 226px; padding: 15px 12px; } div[class] #submenu { height: auto; } #submenu li { display: block; list-style: none; padding: 8px 18px; border-bottom: 1px solid #d2d5d5; } #submenu li.last { border: none; } #submenu li a { text-decoration: none; } #submenu ul { display: none; } #content-head { padding-bottom: 15px; } #sub #maincontent h2 , #sub #maincontent h3.ir , #sub #maincontent h4.ir { float: left; margin: 25px 0 5px; } #sub #maincontent h2.ir { width: auto; height: auto; } #content-head .out { float: right; margin-top: 20px; vertical-align: middle; line-height: 1.5; } #content-head .out a { margin: 0 5px; padding: 2px 0; } #sub .news-item h3 { margin: 0; padding: 0; line-height: 1; } #sub .news-item p , #sub .news-item h2 { padding-left: 20px; border-left: 1px solid #d2d5d5; } #sub #maincontent .news-item h2 { float: none; margin: 5px 0 0 100px; color: #000; } #sub .news-item p { padding-top: 8px; } /* --------------------------------------------------------------------------------------- SECONDARY PAGES - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .secondpage #main #headlines h1 { width: 178px; height: 32px; margin: 64px 0 0 26px; } .secondpage #maincontent .ir { width: 300px; } .secondpage #maincontent address { padding: 40px 0 32px; border-bottom: 1px solid #d0e1e5; } .secondpage #maincontent address img { float: right; margin-top: 15px; } .col { float: left; width: 262px; margin-top: 25px; padding-right: 45px; } .col h3 { margin-bottom: 10px; } .col-simple { float: none; width: auto; padding-right: 0; } .contact dl { padding: 26px 0 16px; border-bottom: 1px solid #d0e1e5; } .textarea { padding: 20px 0 10px; } .contact p.note { float: right; width: 175px; margin-top: 26px; } .contact dt { float: left; width: 80px; } .contact dd { margin-bottom: 10px; } .contact label { display: block; height: 27px; line-height: 27px; } .contact dd input , .contact dd textarea { width: 255px; height: 15px; padding: 5px; line-height: 15px; border: 1px solid #acbbbf; } .contact dd textarea { height: 165px; } .submit { line-height: 1; margin: 15px 0 0 80px; padding: 5px 9px; } div[class] .submit { padding: 10px 18px; } *:first-child+html .submit{ padding: 5px 9px; } /* --------------------------------------------------------------------------------------- Footer - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #footer { margin: 30px 0 0px; padding: 0 15px; border: 0px solid #fff; } #footer p { margin: 20px 0; } #footer .copy { float: left; width: 700px; text-align: left; } #footer .copy strong { margin-right: 8px; } #footer .copy a { margin-left: 8px; } #footer .web { float: right; } /* --------------------------------------------------------------------------------------- END OF LAYOUT - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ /* --------------------------------------------------------------------------------------- STYLES - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ body { text-align: center; font: 75%/1.5 sans-serif; color: #566d74; background: #fff url('../images/bg_gradient.jpg') top left repeat-x; } h2 { font-size: 150%; } h3 { font-size: 120%; } address { font-style: normal; } a:hover , a:focus { text-decoration: none; } /* --------------------------------------------------------------------------------------- Layout - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #main { text-align: left; background: url('../images/header_bg_home.jpg') left top no-repeat; } /* --------------------------------------------------------------------------------------- Header - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #header { background: #fff; } #logo a { font-size: 200%; color: #1b2022; } #logo span { background: url('../images/logo.jpg') left top no-repeat; } #menu li a { text-transform: uppercase; text-decoration: none; color: #45565a; background: url('../images/menu_a.gif') right center no-repeat; } #menu li.last a { background: none; } #menu li a:hover , #menu li a:focus , #menu li.active a { color: #fff; background: #82242a url('../images/menu_a_active.gif') right top repeat-x; } #main #headlines h1 { line-height: 1.2; text-transform: uppercase; font-size: 225%; font-weight: bold; color: #82242a; } h1 em { text-align: right; text-transform: none; font-weight: normal; font-style: normal; color: #57757b; } /* --------------------------------------------------------------------------------------- middlemenu - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #middlemenu { color: #cdcece; background-image:url(../images/darktop_gradientline.jpg); background-color: #1c2122; } #middlemenu li { } #middlemenu li a { text-transform: uppercase; color: #fff; } /* --------------------------------------------------------------------------------------- PAGE NEWS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .novinky #main , .portfolio #main, .sluzby #main { background: url('../images/headlines_sub.jpg') left top no-repeat; } .novinky #main #headlines h1 span { background: url('../images/novinky.png') top left no-repeat; } #sub #headlines p { color: #3e3e3e; } #sub #maincontent { background: #fff url('../images/maincontent.gif') top left repeat-x; } #search {color: #fff; background-color: #1c2122; } #search label { text-transform: uppercase; font-size: 90%; } #search input { color: #fff; background-color: #32393a; } #submenu { background: url('../images/column.png') right 1px no-repeat; } div[class] #submenu { background-position: right top; } #submenu li { background: url('../images/column_li.gif') 2px center no-repeat; font-weight: bold; color: #333333; } #submenu li a { text-decoration: none; color: #82242a; } #submenu li a:hover , #submenu li a:focus , #submenu li.active a { color: #669c1c; } #content-head { font-size: 120%; background: url('../images/h_sub.gif') left bottom repeat-x; } #content-head .out { font-size: 105%; color: #82242a; } #content-head .out a { text-transform: uppercase; font-size: 70%; color: #333; } #sub .news-item h3 { font-size: 150%; font-weight: normal; color: #82242a; background-color: #fff; } #sub .news-item p a { font-weight: bold; } #sub .news-item h2 { text-transform: uppercase; font-size: 100%; } #sub .news-item h2 span { text-transform: none; } /* --------------------------------------------------------------------------------------- VISUALS FOR EACH SUBPAGE - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .drum #main { background: url('../images/header_pagebg_drum.jpg') left top no-repeat; } .guitar #main { background: url('../images/header_pagebg_guitar.jpg') left top no-repeat; } .mic #main { background: url('../images/header_pagebg_mic.jpg') left top no-repeat; } .violin #main { background: url('../images/header_pagebg_violin.jpg') left top no-repeat; } .compass #main { background: url('../images/header_pagebg_compass.jpg') left top no-repeat; } .map #main { background: url('../images/header_pagebg_map.jpg') left top no-repeat; } .keys #main { background: url('../images/header_pagebg_keys.jpg') left top no-repeat; } .money #main { background: url('../images/header_pagebg_money.jpg') left top no-repeat; } .gift #main { background: url('../images/header_pagebg_gift.jpg') left top no-repeat; } .piano #main { background: url('../images/header_pagebg_piano.jpg') left top no-repeat; } .calendar #main { background: url('../images/header_pagebg_calendar.jpg') left top no-repeat; } .franchise #main { background: url('../images/header_pagebg_franchise.jpg') left top no-repeat; } .blank #main { background: url('../images/header_pagebg_blank.jpg') left top no-repeat; } /* --------------------------------------------------------------------------------------- PAGE CONTACT - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .secondpage #main #headlines h1 span { background: url('../images/kontakt.png') top left no-repeat; } .secondpage #maincontent address a { font-weight: bold; } .col h3 { font-weight: normal; } .contact label { font-weight: bold; } .contact dd input , .contact dd textarea { color: #000; background: #fff url('../images/input.gif') top left repeat-x; } .submit { color: #fff; background: #82242a url('../images/submit.gif') bottom left repeat-x; } /* --------------------------------------------------------------------------------------- Content - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #maincontent { color: #000; background-color: #fff; } #maincontent a { color: #82242a; background-color: #fff; } #content { line-height: 1.6; } h4, #sub h2 { font-size: 140%; color: #82242a; } /* --------------------------------------------------------------------------------------- Footer - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ #footer { background: #1c2122; text-align: center; } #footer .copy a { text-decoration: none; } #footer .copy a:hover , #footer .copy a:focus { text-decoration: underline; } #footer a { color: #fff; } /* --------------------------------------------------------------------------------------- Google Map Reader Styles - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .error { background: url(../images/error.png) no-repeat; padding: 2px 0 0 20px; list-style: none; } div.channeltitle { clear: both; border-top: #333 1px solid; font-weight: bold; font-size: 24px; padding-bottom: 2px; margin: 5px; padding-top: 2px; border-bottom: #333 1px solid; font-family: Georgia, serif, 'Times New Roman'; background-color: #f8f8f8; width: 100% } div.channeltitle a { color: black; text-decoration: none; } div.channeltitle a:hover { text-decoration: underline; } /* --------------------------------------------------------------------------------------- Image Float - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/ .leftimage { float: left; text-align: left; margin: 0 auto; width: 225px; padding-top: 28px; padding-bottom: 10px; } .rightofimage { float: right; margin: 0 auto; width: 350px; }