/* Theme Name: Ultimate 2008 Theme URI: http://ilmol.com Description: Versatile set width theme. Theme for WordPress 2.1. Made by ilmol. Version: 1.0 Beta Author: ilmol Author URI: http://ilmol.com/ Last Updated: 2008.03.01 This theme is designed developed by Sem Kim. This theme is made specifically for personal blog. Contact me to email: gotoilmol[at]hotmail.com 이 테마는 개인적인 용도로 제작되었습니다. */ /* Global ======================================== */ * {margin: 0; padding:0;} ul, li {list-style:none;} strong {font-weight:bold;} a, ins {text-decoration: none;} q:before,q:after {content:'';} table {border-collapse:collapse;border-spacing:0;} fieldset, img, abbr {border:0;} address,caption,cite,code,dfn,em,h1,h2,h3,h4,h5,h6,strong,th,var{font-style:normal;font-weight:normal;} hr {display:none;} html { overflow-x: auto; height:100%;text-align:center;} /* fixes MSIE scrollbar bug */ body {background: #fff url(images/bg-content.gif) repeat-y 50% 100px;} /* Custom Library ======================================== */ .left {float:left;} .right {float: right;} .center {text-align:center;} .displaynone {display:none;} .noshow {display:none;} .nobg {background: none;} .border1 {border: 1px solid;} .picL {float:left;margin-right: 5px;} .highlight {color: red;} .bold {font-weight:bold;} .ttag {display:none;} /* Accessibility Library */ #accessMenu {text-indent: -999em;height:0px;font-size:0em;line-height:0;} .accessOnly {text-indent: -999em;height:0px;font-size:0em;line-height:0;} /* Typography ======================================== */ body {font: 0.74em/1.6 "AppleGothic", "Malgun Gothic", "Gulim", "Arial", sans-serif;} a {color: black;} a:active, a:focus{outline:none;} strong {font-weight:bold;} .post-content ol li {margin-left: 15px;list-style-type: decimal;} .post-content .lowerRoman li {list-style-type: lower-roman;} .post-content .upperRoman li {list-style-type: upper-roman;} .post-title {font-size:1.6em;font-family: "AppleGothic", "Malgun Gothic", "Dotum", serif;font-weight:bold;} .post-content p {margin: 1em 0 1.5em 0;} .post-content h2 {margin: 1.7em 0 1em 0; background: url(images/post-posth2.gif) no-repeat 0 0px; padding-left: 37px;font-size: 1.4em;} .post-content h3 {margin: 1em 0 -0.5em 0;line-height: 1.3;background: url(images/post-h3.gif) no-repeat 0 0px; padding-left: 18px;font-size: 1.3em;font-weight:bold;} .post-content h4 {margin: 1em 0 -0.8em 0;padding-left: 13px; background:url(images/h4.gif) no-repeat 0 2px;font-weight:bold;} .post-content blockquote {background: #ededed;} .post-content a {background:#fff;color:#6d8012;text-decoration:underline;} .post-content a:hover {color:#000;} .post-content img {max-width: 500px;} .post-content .toobig {width: 500px;} .post-content .ttag a {color:black;} .post-content ul, .post-content ol {padding-left: 15px;padding-bottom: 12px;} .post-content ul li, .post-content ol li {padding-left: 5px;} .post-content ol li {list-style: decimal;} .post-content ul li {padding: 4px 0 7px 16px;background: url(images/star.gif) no-repeat 0 7px;} .content-rss {text-align:right;} .post-content blockquote {padding: 9px;} #comment-inputs h3 {font-size: 1em; font-weight:bold;} .comment-content a {color:#6d8012;text-decoration: underline;} .comment-content a:hover {background: #ddd;} #indexPage #content .post-title {margin-right: 15px;font-size: 1.2em;font-family: "Gulim", sans-serif;} #indexPage #content .post .post-content h2 {font-size:1.1em;} #indexPage #content .post-content a {} #indexPage #content .post-content h3 {font-size:1em;padding-top: 6px;} #indexPage #content .post-content h3 a {color:black;} #indexPage #content .post-content blockquote {padding: 3px;} #indexPage #content .post-content ul, #indexPage #content .post-content ol {padding-left: 5px;} .post .post-date {line-height: 1.6;} #top, #sub-top, #mid, #foot-top {text-align:left;} #foot-top-copyright, #foot-bottom {text-align: center;} /* Table */ /* smooth taste table styles written by Thomas Opp http://www.yaway.de */ table { border-collapse: collapse; border: 1px solid #38160C; font: normal 11px verdana, arial, helvetica, sans-serif; color: #F6ECF0; background: #641B35; } caption { text-align: left; font: normal 11px verdana, arial, helvetica, sans-serif; background: transparent; } td, th { border: 1px dashed #B85A7C; padding: .8em; color: #F6ECF0; } thead th, tfoot th { font: bold 11px verdana, arial, helvetica, sans-serif; border: 1px solid #A85070;; text-align: left; background: #38160C; color: #F6ECF0; padding-top:6px; } tbody td a { background: transparent; text-decoration: none; color: #F6ECF0; } tbody td a:hover { background: transparent; color: #FFFFFF; } tbody th a { font: normal 11px verdana, arial, helvetica, sans-serif; background: transparent; text-decoration: none; font-weight:normal; color: #F6ECF0; } tbody th a:hover { background: transparent; color: #FFFFFF; } tbody th, tbody td { vertical-align: top; text-align: left; } tfoot td { border: 1px solid #38160C; background: #38160C; padding-top:6px; } .odd { background: #7B2342; } tbody tr:hover { background: #51152A; } tbody tr:hover th, tbody tr.odd:hover th { background: #51152A; } /* WEBSLICE TRACKER ========================= */ .entry-title {display:none;} /* General Layout ======================================== */ #head-wrap, #top, #sub-top, #mid, #foot-top {width: 962px; margin: 0 auto;} #head {background: #fff url(images/bg-top.gif) no-repeat 50% bottom; height: 100px;} #head-wrap {position:relative;} h1 {background: url(images/logo.gif) no-repeat; width: 300px; height: 100px;text-indent: -4000px;position:absolute;top: 24px; left: 6px;} #chest {background: url(images/bg.gif) no-repeat 50% 0;height: 420px;} #top {height: 200px;position: relative;} #sub-top {background: url(images/header-shadow.gif) no-repeat; height: 21px;position: relative;} #mid {} #mid-wrap {float:left;background: url(images/bg-mid.gif) repeat-y;width: 952px;} #content {width: 582px;float:left;margin-left:32px;margin-right: 20px;} #side {float:right;width: 255px;margin-left:20px;margin-right: 15px;} #side h2 {text-align: center;font-size: 1.2em;font-weight: bold;font-family: "Arial", sans-serif;color:#7f1211;} .side-list {background: url(images/side-split.gif) no-repeat 50% bottom;padding-bottom: 20px;margin-bottom: 15px;padding-left: 5px;} .side-list ul li {padding: 4px 0 5px 16px;background: url(images/star.gif) no-repeat 0 7px;} .side-list-line ul li {padding: 4px 0 5px 16px;border-top: 1px solid #efefef;} .side-list-meta {padding-bottom:20px; margin-bottom: 10px;padding-left: 5px;} .side-list-meta h2 {display:none;} .side-list-meta ul li {background:none;padding: 4px 0 5px 16px;} .side-list-meta #feedburnercount {padding: 4px 0 5px 85px;background: url(images/meta/feedburner.gif) no-repeat 16px 0; height: 100px;} #content .post {margin-bottom: 20px;background: url(images/post-h2.gif) no-repeat 0 4px;} #content .post-title, #content .post-date {margin-left: 40px;} .sidenote {float:left; border: 1px solid #ddd; padding: 7px;margin:0 6px 5px 0;} #foot {} #foot-top {margin: 0 auto; clear:both; background: url(images/bg-footer-in.gif) repeat-y; height: 200px;position:relative;} #foot-bottom {background: #fff url(images/bg-footer.gif) no-repeat 50% 0; height: 97px;position:relative;} #foot-top-copyright {height: 180px; background: url(images/foot/lines.gif) no-repeat right 10px;} #foot-top-rss {position:absolute; left:15px; top: 30px;} #foot-top-top {position: absolute; left: 850px; top: 80px;} #foot-bottom {padding-top: 33px;} #foot-bottom-subb a {display:none;} #foot-top-copyright-content {padding-top: 110px;} /* Navigation (menu) ========================================*/ #accessMenu {} #pre-nav {position:absolute; top: 9px;left:0;text-align:right; width: 100%;font-size:0.8em;font-family: "Arial", sans-serif;letter-spacing: 0.1em;} #pre-nav a:hover {color:#388d00;} #pre-nav ul li {display:inline;padding:0 6px;border-right:1px solid #333;} #pre-nav ul .noborder{border:0;} #nav {background: url(images/nav/nav-gap.gif) repeat-x;width: 623px; height: 47px;position: absolute; top: 35px; left: 342px;} #nav a {display:block;height: 47px;text-indent: -999em;overflow:hidden;} #nav li {float:left; position: relative;z-index: 1;} #nav-topic a {background: url(images/nav/nav-topics.gif) no-repeat 0 0;width: 101px;margin-right: 2px;} #nav-topic a:hover {background-position: 0 -54px; width: 101px;} #nav-web101 a {background: url(images/nav/nav-web101.gif) no-repeat 0 0;width: 103px;margin-right: 2px;} #nav-web101 a:hover {background-position: 0 -54px; width: 103px;} #nav-css a {background: url(images/nav/nav-css.png) no-repeat 0 0;width: 103px;margin-right: 2px;} #nav-css a:hover {background-position: 0 -54px; width: 103px;} #nav-wordpress a {background: url(images/nav/nav-wordpress.png) no-repeat 0 0;width: 102px;margin-right: 2px;} #nav-wordpress a:hover {background-position: 0 -54px; width: 102px;} #nav-free a {background: url(images/nav/nav-free.gif) no-repeat 0 0;width: 103px;margin-right: 2px;} #nav-free a:hover {background-position: 0 -54px; width: 103px;} #nav-link a {background: url(images/nav/nav-links.gif) no-repeat 0 0;width: 101px;} #nav-link a:hover {background-position: 0 -54px; width: 101px;} /* Search ==========================================*/ #searchbar {text-align:center;margin-bottom:7px;} #searchbar label {display:none;} #searchbar input {border:3px #dcdcdc solid;} #searchbar #s {font-size:1.2em;width: 160px;height: 20px;padding-top: 2px;padding-left:2px;background:none;} #searchsubmit {font-size:1em;width: 46px; height: 29px;padding:3px;background:#dcdcdc;color:#a4a4a4;} #indexPage #searchbar {position:absolute; top: 270px; left: 600px;} #indexPage #searchbar #s {border:3px #6d8012 solid;font-size:1.2em;height: 20px;padding-top: 2px;padding-left:2px;width: 218px;background:none;} #indexPage #searchsubmit {border:3px #6d8012 solid;font-size:1em;width: 56px; height: 29px;padding:3px;background:#6d8012;color:#fdfdfd;} /* comment ================================================= */ #comment-wrap {margin-top: 20px;margin-bottom: 20px;background: url(images/comment/comment-shadow.gif) no-repeat 0 10px;padding-top: 8px;padding-left: 20px;} #comment-wrap h3 {margin-top: 10px; margin-bottom: 16px;margin-left: 40px; font-size:1.1em;color:#fff;font-weight:bold;} #trackback-rss {margin-bottom: 30px;} #comment-list {margin-left: 0px;} #comment-list li {position:relative;margin: 10px 0 33px 0px;background: url(images/comment/stamp.gif) no-repeat;padding-left:91px;padding-top: 4px;} #comment-list li ul li {margin:0;margin-left:40px;margin-bottom:5px;} #comment-list li ol li {margin:0;margin-left: 40px;margin-bottom:5px;} .gravatar-icon {position:absolute; left: 12px; top: 11px;} .comment-author {font-size:1.2em;} .comment-author a {font-weight:bold;} .comment-time {padding-bottom: 10px;font-size:1em;} .comment-content {line-height: 1.5;} .comment-content p {margin:1.2em 0} .comment-content img {max-width: 500px;} .comment-content blockquote {color:#333;padding-left:25px;background: url(images/blockquote1.gif) no-repeat;margin: 10px 0 10px 0;} .comment-content blockquote p {background-color: #efefef; padding: 3px;} #comment-inputs {list-style:none;margin-top: 40px;} #comment-inputs li h3 {margin-bottom: 14px;line-height:1.2;font-size:1.2em;} .comment-idinput {margin-bottom:5px;} .comment-idinput label {margin-bottom: 1px;} .comment-idinput input { width: 250px;height:21px; padding: 3px 0px 0 4px; margin-right: 10px; border:0; font-size:1.2em; background: transparent url(images/comment/comment-input.png) no-repeat top left; } #textareap {width: 449px;height: 225px;clear:both; background: url(images/comment/comment-textarea-new.gif) no-repeat; position:relative;margin-bottom:5px;} #textareap textarea {background:transparent; overflow:auto; border:0; font-size: 1.2em; width: 438px; height: 218px; position:absolute; top:4px; left:6px; } .comment-meta {margin-top: 12px;} /* =================================================== Index Page ===================================================*/ #indexPage #top {background: url(images/index/top-bg.gif) no-repeat; height: 315px; position: relative;} #indexPage #sub-top {background: url(images/index/sub-top-bg.jpg) no-repeat 0 0; height: 112px;position: relative;} #indexPage #st-webstandard {position: absolute; top: 8px; left: 216px;} #indexPage #st-webstandard a {float:left;width: 115px; height: 60px; text-indent: -999em;} #indexPage #st-css {position: absolute; top: 8px; left: 360px;} #indexPage #st-css a {float:left;width: 135px; height: 40px; text-indent: -999em;} #indexPage #st-wordpress {position: absolute; top: 15px; left: 545px;} #indexPage #st-wordpress a {float:left;width: 115px; height: 60px; text-indent: -999em;} #indexPage #st-html5 {position: absolute; top: 20px; left: 700px;} #indexPage #st-html5 a {float:left;width: 205px; height: 60px; text-indent: -999em;} #indexPage #mid-wrap {background: url(images/index/bg-mid.gif) repeat-y;padding-top: 0px;} #indexPage #content {width: 391px;float:left;margin-left: 24px;margin-right: 20px;} #indexPage #content .post .post-content {padding-top: 15px; background: url(images/index/post-head-split.gif) no-repeat 0 2px;} #indexPage #content .post .post-content img {display:none;} #indexPage #content .post .post-content .ttag {display:none;} #indexPage #content .post .post-content p {margin:0; padding:0;} #indexPage #content .post .img-note {display:none;} #indexPage .side-list {background: url(images/side-split.gif) no-repeat 50% bottom;padding-bottom: 20px;margin-bottom: 15px;padding-left: 5px;} #indexPage #side {float:right;width: 517px;margin:0;} #indexPage #side-l {float:left; width: 262px;margin-left: 20px; margin-right: 8px;} #indexPage #tracker {background: none;} #indexPage #side-r {float:right; width: 206px;margin-left: 4px;} #indexPage .side-r-list {background: url(images/index/side-split2.gif) no-repeat 50% bottom; padding-left: 7px;padding-bottom:20px;} #indexPage .side-r-list h2 {padding-bottom: 0px;border-bottom: 1px solid #efefef;margin-bottom: 7px;} #indexPage #side-r-me2day {margin-bottom: 18px;overflow:hidden;} #indexPage .side-webnews ul li {background:none;padding-left: 0;} .delPost {padding: 4px 0 5px 16px;background: url(images/star.gif) no-repeat 0 7px;} /* =================================================== Page Page ===================================================*/ #PagePage #top {height:170px; background: url(images/page/bg-top.gif) no-repeat;} #PagePage #sub-top {height: 30px; background: url(images/page/mid-shadow.gif) no-repeat;} #PagePage #mid-wrap {background: none;} #PagePage #side {float:left;border-right: 1px solid #ddd;padding-right: 25px;} #PagePage #content {float:left;margin-left: 15px;} #PagePage #content .post {background: url(images/post-h2-doc.gif) no-repeat 0 4px;} #PagePage #content .post h2 {padding-top: 8px;} #PagePage #content .post-title, #PagePage #content .post-date {margin-left: 60px;} /* =================================================== Article Page ===================================================*/ #ArticlePage #top {height: 153px; background: url(images/top-bg.gif) no-repeat;} #ArticlePage #content {width: 582px;float:left;margin-left:32px;margin-right: 20px;} #ArticlePage #side {float:right;width: 255px;margin-left:20px;margin-right: 15px;} #ArticlePage .permlink {padding-bottom: 12px;} #ArticlePage #top-content {position: absolute; top: 120px; left: 702px;} /* =================================================== CSS Page =================================================== */ #CSSPage #top {height:270px; background: url(images/css/bg-top.gif) no-repeat;} #CSSPage #sub-top {height: 60px; background: url(images/css/sub-top-bg.gif) no-repeat;} #CSSPage #mid-wrap {background: none;} #CSSPage #side {float:left;border-right: 1px solid #ddd;padding-right: 25px;} #CSSPage #content {float:left;margin-left: 15px;} #CSSPage #content .post {background: url(images/post-h2-doc.gif) no-repeat 0 4px;} #CSSPage #content .post h2 {padding-top: 8px;} #CSSPage #content .post-title, #CSSPage #content .post-date {margin-left: 60px;} #CSSPage #st-web {position: absolute; top: 8px; left: 250px;} #CSSPage #st-web a {float:left;width: 88px; height: 30px; text-indent: -999em;} #CSSPage #st-css {position: absolute; top: 8px; left: 390px;} #CSSPage #st-css a {float:left;width: 75px; height: 30px; text-indent: -999em;} #CSSPage #st-html {position: absolute; top: 8px; left: 510px;} #CSSPage #st-html a {float:left;width: 76px; height: 30px; text-indent: -999em;} #CSSPage #st-js {position: absolute; top: 8px; left: 630px;} #CSSPage #st-js a {float:left;width: 65px; height: 30px; text-indent: -999em;} /* =================================================== Links Page ===================================================*/ #LinksPage #top {height:153px; background: url(images/page/bg-top.gif) no-repeat;} #LinksPage #sub-top {height: 30px; background: url(images/page/mid-shadow.gif) no-repeat;} #LinksPage #mid-wrap {background: none;} #LinksPage #side {float:left;border-right: 1px solid #ddd;padding-right: 25px;} #LinksPage #content {float:left;margin-left: 15px;} #LinksPage #content .post {background: url(images/post-h2-doc.gif) no-repeat 0 4px;} #LinksPage #content .post h2 {padding-top: 8px;} #LinksPage #content .post-title, #LinksPage #content .post-date {margin-left: 60px;} /* =================================================== Wordpress Page ===================================================*/ #WordpressPage #top {height:235px; background: url(images/wordpress/bg-top.jpg) no-repeat;} #WordpressPage #sub-top {height: 30px; background: url(images/page/mid-shadow.gif) no-repeat;} #WordpressPage #mid-wrap {background: none;} #WordpressPage #side {float:left;border-right: 1px solid #ddd;padding-right: 25px;} #WordpressPage #content {float:left;margin-left: 15px;} #WordpressPage #content .post {background: url(images/post-h2-doc.gif) no-repeat 0 4px;} #WordpressPage #content .post h2 {padding-top: 8px;} #WordpressPage #content .post-title, #WordpressPage #content .post-date {margin-left: 60px;} /* =================================================== Contact Page =================================================== */ #ContactPage #top{height: 250px;background: url(images/contact/bg-top.jpg) no-repeat;} #ContactPage #sub-top {height: 30px; background: url(images/page/mid-shadow.gif) no-repeat 0 -1px;} #ContactPage #mid-wrap {background:none;} #ContactPage #content {float:left;margin-left: 15px;} #ContactPage #side {float:left;border-right: 1px solid #ddd;padding-right: 25px;} #ContactPage #content .post {background: url(images/post-h2-doc.gif) no-repeat 0 4px;} #ContactPage #content .post h2 {padding-top: 8px;} #ContactPage #content .post-title, #PagePage #content .post-date {margin-left: 60px;} /* =================================================== About Page ===================================================*/ #AboutPage #top {height:339px; background: url(http://farm4.static.flickr.com/3044/2352446769_f8cfb6c3dd_o.jpg) no-repeat;} #AboutPage #sub-top {height: 142px; background: url(http://farm4.static.flickr.com/3011/2353281964_ae661f93a1_o.jpg) no-repeat 0 bottom;position:relative;} #AboutPage #sub-top-movie {text-align:center;height:69px; width:100px; background: black;position:absolute; top: 18px; left: 120px;overflow:hidden;} #AboutPage #sub-top-title {position:absolute; top: 0px; left: 110px;font-size:0.9em;} #AboutPage #mid-wrap {background: url(images/about/bg-mid.gif) repeat-y;} #AboutPage #side {float:left;margin-top: 18px;padding-right: 15px;width: 440px;color: #739605;} #AboutPage #side .side-list {padding-left: 30px;} #AboutPage #content {float:right;margin: 8px 16px 0 15px;width: 390px;} #AboutPage #content .post {background:none;padding-right: 20px;color: #f34116;} #AboutPage #content .post h2 {padding-top: 8px;} #AboutPage #content .post-title, #AboutPage #content .post-date {margin-left: 60px;} #AboutPage #side .side-list h4 {text-align:center; color:#222; padding: 20px 0 10px;font-weight:bold;} #AboutPage #side .about-history {color: #222;padding: 3px 0 17px; text-align:center;} /* =================================================== Search Page ===================================================*/ #SearchPage #top {height: 153px; background: url(images/search/bg-top.gif) no-repeat;} #SearchPage #content {width: 582px;float:left;margin-left:32px;margin-right: 20px;} #SearchPage #side {float:right;width: 255px;margin-left:20px;margin-right: 15px;} #Notice {background: url(images/updating.gif) no-repeat 0 0;width: 90px; height: 54px; position:absolute; top:0; left: 200px;text-indent: -999em;} /* =================================================== Guest Page ===================================================*/ #GuestPage #top {height:170px; background: url(images/page/bg-top.gif) no-repeat;} #GuestPage #sub-top {height: 30px; background: url(images/page/mid-shadow.gif) no-repeat;} #GuestPage #mid-wrap {background: none;} #GuestPage #side {float:left;border-right: 1px solid #ddd;padding-right: 25px;} #GuestPage #content {float:left;margin-left: 15px;position:relative;} #GuestPage #content .post {background: url(images/post-h2-doc.gif) no-repeat 0 4px;} #GuestPage #content .post h2 {padding-top: 8px;} #GuestPage .gravatar-icon {position:absolute; left: 11px; top: 11px;} #GuestPage #content .post-title, #PagePage #content .post-date {margin-left: 60px;} #GuestPage #comment-inputs {list-style:none;margin-top: 2px;} #GuestPage #comment-list {margin-top: 15px;} #GuestPage #comment-list li {position:relative;margin: 10px 0 33px 0px;background: url(images/comment/guest-stamp.gif) no-repeat;padding-left:71px;padding-top: 4px;} #GuestPage .comment-content p {margin:1em 0;} #GuestPage #comment-wrap {margin-bottom: 20px;background: none;padding-left: 5px;} #GuestPage #comment-wrap h2 {margin-top: 10px; margin-bottom: 16px; font-size:1.1em;color:#000;font-weight:bold;} #GuestPage #textareap {width: 512px;height: 51px;clear:both; background: url(images/comment/comment-textarea-g.gif) no-repeat; position:relative;margin-bottom:5px;} #GuestPage #textareap textarea {background:transparent; overflow:auto; border:0; font-size: 1.2em; width: 502px; height: 44px; position:absolute; top:4px; left:6px; } /* =================================================== Guest Page ===================================================*/ #topic-column {-moz-column-count: 3; -moz-column-gap: 1em; -webkit-column-count: 3; -webkit-column-gap: 1em;}