/* * Tabun * created: 2006-07-06 * modified: 2006-07-13 */ /* * ALGEMEEN */ html { position: relative; height: 100%; margin-bottom: 1px; } body { position: relative; margin: 0; padding: 0; border: 0; height: 100%; color: #f1ece1; font-family: verdana, sans-serif; font-size: 10pt; background-color: #6c8594; } img { border: 0; } ul { margin: 5px 0 10px 15px; padding: 0; } li { margin: 2px 0 2px 0; } .spacer { position: relative; clear: both; font-size: 1px; line-height: 1px; } a { color: #fff; font-weight: normal; text-decoration: underline; background-color: transparent; } a:hover { color: #a1dbff; text-decoration: none; } span.p { position: relative; display: block; margin: 6px 0 3px 0; } .justify { text-align: justify; line-height: 1.7em; line-height: 1.7em; } /* * GENERAL LAYOUT */ div#lay_center { position: relative; margin: 0 auto 0 auto; width: 894px; min-height: 100%; height: expression("1200px"); background-image: url(img/bg_center_2.jpg); background-repeat: repeat-y; background-color: #374f60; } div#lay_name { z-index: 1; position: absolute; left: 874px; top: 220px; width: 20px; height: 100px; background-image: url(img/bg_name_2.jpg); background-repeat: no-repeat; } div#lay_top_a { position: relative; margin-left: 50px; width: 794px; height: 91px; background-image: url(img/bg_top.jpg); background-repeat: repeat-x; background-color: #5b93b9; } div#lay_menu { position: relative; margin: 3px 0 3px 50px; width: 794px; height: 35px; background-image: url(img/bg_menu.jpg); background-repeat: repeat-x; background-color: #627584; } div#lay_top_b, div#lay_top_c { position: relative; margin: 0 0 10px 50px; width: 794px; height: 10px; font-size: 2pt; background-color: #5b93b9; } div#lay_bottom_a, div#lay_bottom_c { position: relative; margin: 50px 0 0 50px; width: 794px; height: 10px; font-size: 2pt; background-color: #5b93b9; } div#lay_bottom_b { position: relative; margin: 3px 0 3px 50px; width: 794px; height: 35px; background-image: url(img/bg_menu.jpg); background-repeat: repeat-x; background-color: #627584; } div#lay_bottom_c { margin-top: 0; } div#lay_bottom_b .credits { font-size: 8pt; text-align: center; padding-top: 10px; color: #95C8EB; } div#lay_bottom_b .left { float: left; padding-left: 80px; } div#lay_bottom_b .right { float: right; padding-right: 80px; } div#lay_bottom_b a { text-decoration: none; color: #F0ECE1; } div#lay_bottom_b a:hover { color: #A2D9FF; } /* * MENU */ div#lay_menu a { display: block; } div.menu_mark_a, div.menu_mark_b { position: absolute; top: 5px; left: 20px; width: 20px; height: 25px; background-image: url(img/bg_mark_a.jpg); background-repeat: no-repeat; } div.menu_mark_b { left: 754px; background-image: url(img/bg_mark_b.jpg); } div.menu_row { position: relative; margin: 0 60px 0 67px; } div.menu_item { float: left; margin-top: 1px; width: 94px; text-align: center; font-size: 8pt; line-height: 33px; } div.menu_item a.menu_item { letter-spacing: 1px; font-weight: bold; text-decoration: none; color: #f1ece1; } div.menu_item a.menu_item:hover { font-weight: bold; color: #fff; background-color: #738c9f; background-image: url(img/menu_select_5.gif); background-repeat: no-repeat; background-position: 0px 0px; } /* * CENTRAL */ div.lay_content { position: relative; margin: 0 54px 30px 54px; padding-bottom: 20px; background-color: #597286; background-image: url(img/bg_content_hoek_b.gif); background-repeat: no-repeat; background-position: right bottom; } div.subtitle { position: relative; padding: 0; border-bottom: 2px solid #374f60; line-height: 24px; color: #f1ece1; background-color: #4d697a; background-image: url(img/bg_title.jpg); background-repeat: repeat-x; } div.subtitle .title { position: relative; float: left; color: #fff; padding-left: 30px; letter-spacing: 2px; font-weight: normal; background-image: url(img/bg_content_hoek_a.gif); background-repeat: no-repeat; } div.subtitle .date { position: relative; float: right; width: 240px; font-weight: normal; font-style: italic; text-align: center; } div.content { position: relative; margin: 15px 70px 0 60px; padding: 0 20px 0 20px; border-left: 1px solid #f0ece1; line-height: 1.5em; } div.subsubtitle { position: relative; padding: 0; margin-bottom: 10px; border-bottom: 1px solid #f0ece1; line-height: 1.3em; color: #f1ece1; } div.subsubtitle .title { position: relative; font-weight: bold; } div.subsubtitle .note { position: relative; margin-left: 40px; font-style: italic; font-size: 8pt; } div.content_row { position: relative; clear: both; margin-bottom: 5px; line-height: 1.4em; } div.link_url { position: relative; margin-left: 10px; } div.link_desc { position: relative; margin-left: 50px; font-size: 8pt; } div.content_message { position: relative; margin: 5px 25px 25px 5px; } div.title_tabun, div.title_news, div.title_3d, div.title_2d, div.title_tutorials, div.title_downloads, div.title_links, div.title_contact { position: relative; margin: 0 54px 0 54px; padding: 0 20px 0 15px; line-height: 40px; letter-spacing: 2px; background-color: #374f60; } div.title_tabun div.image, div.title_news div.image, div.title_3d div.image, div.title_2d div.image, div.title_tutorials div.image, div.title_downloads div.image, div.title_links div.image, div.title_contact div.image { height: 20px; z-index: 1; top: 8px; left: 15px; position: absolute; background-repeat: no-repeat; } div.title_tabun { width: 89px; } div.title_news { width: 69px; } div.title_3d { width: 129px; } div.title_2d { width: 129px; } div.title_tutorials { width: 165px; } div.title_downloads { width: 165px; } div.title_links { width: 88px; } div.title_contact { width: 127px; } div.title_tabun div.image { width: 89px; background-image: url(img/t_tabun.jpg); } div.title_news div.image { width: 69px; background-image: url(img/t_news.jpg); } div.title_3d div.image { width: 129px; background-image: url(img/t_3d.jpg); } div.title_2d div.image { width: 129px; background-image: url(img/t_2d.jpg); } div.title_tutorials div.image { width: 165px; background-image: url(img/t_tutorials.jpg); } div.title_downloads div.image { width: 165px; background-image: url(img/t_downloads.jpg); } div.title_links div.image { width: 88px; background-image: url(img/t_links.jpg); } div.title_contact div.image { width: 127px; background-image: url(img/t_contact.jpg); } div.contact_image { position: absolute; left: 450px; } div.contact_image img { border: 1px solid #f0ece1; } div.lay_back { position: relative; margin: 4px 0 0 740px; } div.table_header { position: relative; float: left; width: 150px; font-weight: bold; } div.table_cel { position: relative; float: left; font-size: 9pt; line-height: 1.6em; } /* * ETALAGE */ div#etalage { z-index: 2; position: relative; margin: 0; padding: 0; top: 10px; left: 115px; width: 670px; height: 228px; } div.etalage_cel { position: absolute; margin: 0; padding: 0; width: 100px; height: 100px; border: 0; background-color: #456378; } div.etalage_col1 { left: 0px; } div.etalage_col2 { left: 112px; } div.etalage_col3 { left: 224px; } div.etalage_col4 { left: 336px; } div.etalage_col5 { left: 448px; } div.etalage_col6 { left: 560px; } div.etalage_rij1 { top: 0px; } div.etalage_rij2 { top: 112px; } div.etalage_rij3 { top: 224px; } div.etalage_image { position: relative; } div.etalage_image div.uit img.etalage_image { border: 1px solid #374f60; filter: alpha(opacity=85); -moz-opacity: .85; opacity: .85; } div.etalage_image div.aan img.etalage_image { border: 1px solid #f1ece1; } div#etalage a { display: block; } div.etalage_image_overlay { position: absolute; display: none; z-index: 6; margin: 0; padding: 0; top: 1px; left: 1px; width: 100px; height: 100px; border: 0; background-image: url(img/bg_etalage_overlay.gif); background-repeat: no-repeat; } div.etalage_image div.uit div.etalage_image_overlay { display: block; z-index: 1; } div.etalage_image div.aan div.etalage_image_overlay { display: none; z-index: 1; } /* tooltip in de etalage */ div.etalage_tooltip { position: absolute; display: none; padding: 5px 15px 8px 15px; top: 90px; left: 50px; color: #f0ece1; border: 1px solid #f0ece1; width: 185px; background-color: #384f5f; filter: alpha(opacity=90); -moz-opacity: .9; opacity: .9; -moz-border-radius: 5px; border-radius: 5px; } div.etalage_image div.aan div.etalage_tooltip { display: block; } div.etalage_tooltip span.categorie { font-style: italic; } /* * VIEW IMAGES/WORK */ div.sum_blok { position: relative; } div.sum_header { position: relative; float: left; clear: left; width: 120px; font-style: italic; } div.sum_info { position: relative; float: left; } div.art_icon { position: relative; float: right; margin-top: -70px; padding: 0 0 15px 15px; width: 100px; height: 100px; } div.art_icon img { border: 1px solid #f0ece1; } div.image_display { margin: 0 0 0 80px; padding: 0; } div.image_display .title { margin: 0 0 0 5px; padding: 0; } div.image_display .title .left { float: left; letter-spacing: 2px; line-height: 1.6em; } div.image_display .title .right { float: right; font-size: 8pt; } div.image_display img.display { border: 1px solid black; } /* art list = 2d/3d page */ div.artlist_blok { position: relative; margin: 0; padding: 0; width: 660px; } div.artlist_blok_inner { position: relative; float: left; padding: 10px 0 0 10px; width: 460px; } div.artlist_cel { position: relative; float: left; margin: 5px; border: 2px solid #506879; background-color: #374f60; } div.artlist_icon { position: relative; width: 100px; height: 100px; margin: 2px 4px 4px 2px; } div.artlist_icon img { border: 1px solid #f0ece1; } div.artlist_name { position: relative; font-weight: bold; } div.artlist_description { position: relative; padding: 2px 0 0 8px; } div.icon_room_empty { position: relative; float: right; width: 140px; height: 15px; } input.button_pop { font-size: 8pt; color: #f0ece1; border: 1px solid #f0ece1; padding: 1px 7px 1px 7px; background-color: #4d697a; background-image: url(img/bg_title.jpg); background-repeat: repeat-x; } /* Tooltip */ div.artlist_tooltip { z-index: 10; display: none; position: absolute; margin: 0; padding: 3px; padding: 5px 15px 8px 15px; top: 90px; left: 50px; color: #f0ece1; border: 1px solid #f0ece1; width: 270px; background-color: #384f5f; filter:alpha(opacity=92); -moz-opacity:.92; opacity:.92; -moz-border-radius: 5px; border-radius: 5px; } div.artlist_tooltip span.name { position: relative; font-size: 9pt; font-weight: bold; letter-spacing: 1px; } div.artlist_tooltip span.desc { position: relative; font-size: 8pt; } div.artlist_cel div.uit div.artlist_tooltip { display: none; } div.artlist_cel div.aan div.artlist_tooltip { display: block; } /* * TABELLEN */ table { position: relative; border: 0; } td { position: relative; padding: 2px; vertical-align: top; line-height: 1.3em; }