/* |--------------------------------------------------------------- | GLOBAL STYLE |--------------------------------------------------------------- | | RESET all html element. | */ /* This should always stay the same. Level of importance: 1. */ * { margin: 0; padding: 0; } /* This should always stay the same. Level of importance: 2. */ h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,th { font-size: 1em; font-weight: normal; font-style: normal; } ul,ol,li { list-style: none; margin:0px; padding:0px; } fieldset,img { border: none; padding:0px; margin:0px; } div { clear:both; border:0px solid #0066FF; overflow:hidden; } a { color:#999966; text-decoration:none; } a:hover { text-decoration:underline; } /* This should always stay the same. Level of importance: 3. Change only when it is very needed, for instance, the font used in tag. */ p{ border: 0px solid #999999; padding:0px 0px 15px 0px; } html,body { overflow:visible; font-family:Arial, Helvetica, sans-serif; font-weight:normal; font-size:12px; color:#676764; background: #ffffff; } input { border:1px solid #808080; background:#ffffff; } h1 { font-size:14px; color:#90804d; clear:both; } h2 { font-family:Georgia, "Times New Roman", Times, serif; font-size:15px; color:#90804d; margin:0px 0px 10px 0px; clear:both; } h3 { font-size:14px; color:#90804d; margin:0px 0px 10px 0px; } h2 > span{ display:none; /*visibility:hidden;*/ } hr { border:0px; height: 1px; background: transparent url("brown.gif"); margin:0px 0px 20px 0px; } /* |--------------------------------------------------------------- | LOCAL STYLE |--------------------------------------------------------------- | | Change the style of the site from here according to the design. | */ /*Master Styles*/ #container { width:100%; text-align:left; } #header a > span, #footer a > span, #pagination a > span, #back-to-my-portfolio a > span, #blog a > span{ display:none; /*visibility:hidden;*/ } .row { border-bottom:1px solid #999966; clear:both; } .row div{ clear:none; } .caption { /*font-family:Georgia, "Times New Roman", Times, serif;*/ } .last-tag { display:none; } /**************************************/ /************ Shared Style ************/ /**************************************/ .align-center { width:1016px; margin:0em auto; overflow:hidden; } .left { float:left; } .right{ float:right; } .hint { color: #808080; } /**************************************/ /************** Main Style ************/ /**************************************/ /* main style */ /*title style*/ #tag h2{ height:15px; background-image: url(../images/local/title-behold-the-handy-tag-system.gif); background-repeat: no-repeat; background-position: 0px center; } #contact h2{ height:12px; background-image: url(../images/local/title-contact.gif); background-repeat: no-repeat; background-position: 0px center; } #twitter h2{ height:11px; background-image: url(../images/local/title-twitter.gif); background-repeat: no-repeat; background-position: 0px center; } #join-me h2{ height:16px; background-image: url(../images/local/title-come-join-me-on.gif); background-repeat: no-repeat; background-position: 0px center; } #introduction h2{ height:12px; background-image: url(../images/local/title-introduction.gif); background-repeat: no-repeat; background-position: 0px center; } #pdf_portfolio h2{ height:20px; width:98px; background-image: url(../images/local/title-pdf-porfolio.gif); background-repeat: no-repeat; background-position: 0px bottom; float:leftl } #archive-blog h2{ height:16px; background-image: url(../images/local/title-archived-posts.gif); background-repeat: no-repeat; background-position: 0px center; } #categories-blog h2{ height:16px; background-image: url(../images/local/title-categories.gif); background-repeat: no-repeat; background-position: 0px center; } #popular-blog h2{ height:16px; background-image: url(../images/local/title-popular-articles.gif); background-repeat: no-repeat; background-position: 0px center; } #privacy-policy h2{ height:16px; background-image: url(../images/local/title-privacy-policy.gif); background-repeat: no-repeat; background-position: 0px center; } #past-newsletters h2{ height:16px; background-image: url(../images/local/title-past-newsletters.gif); background-repeat: no-repeat; background-position: 0px center; } #tag-portfolio h2{ height:14px; background-image: url(../images/local/title-tags.gif); background-repeat: no-repeat; background-position: 0px center; } #images-look-closer-portfolio h2{ height:16px; background-image: url(../images/local/title-take-a-look-closer.gif); background-repeat: no-repeat; background-position: 0px center; } #images-development-portfolio h2{ height:16px; background-image: url(../images/local/title-development.gif); background-repeat: no-repeat; background-position: 0px center; } #title-companies-i-ve-worked-for { height:16px; background-image: url(../images/local/title-companies-i-have-worked-for.gif); background-repeat: no-repeat; background-position: 0px center; } #title-press-interviews-contributions { height:14px; background-image: url(../images/local/title-press-interviews-contributions.gif); background-repeat: no-repeat; background-position: 0px center; } #title-book-press-interviews-contributions { height:14px; background-image: url(../images/local/title-book-press-interviews-contributions.gif); background-repeat: no-repeat; background-position: 0px center; } #title-biography { height:16px; background-image: url(../images/local/title-biography.gif); background-repeat: no-repeat; background-position: 0px center; } #title-the-short-of-it { height:12px; background-image: url(../images/local/title-the-short-of-it.gif); background-repeat: no-repeat; background-position: 0px center; } #title-the-long-of-it { height:16px; background-image: url(../images/local/title-the-short-of-it.gif); background-repeat: no-repeat; background-position: 0px center; } /*header style*/ #menu-header{ height:58px; font-family:Georgia, "Times New Roman", Times, serif; font-size:17px; } #menu-header span { visibility:hidden; } #menu-header ul{ margin:30px 0px 0px 0px; } #menu-header li{ float:left; } #menu-header li > a{ float:left; height:29px; text-align:center; color:#ffffff; padding:4px 0px 0px 0px; margin:0px 6px 0px 0px; } #menu-header li > a:hover{ text-decoration:none; } #menu-header #menu-header-home > a{ background: transparent url("../images/local/btn-home.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-home > a:hover { /*background-position: 0px -30px;*/ } #menu-header #menu-header-home .current-header { background: transparent url("../images/local/btn-home-current.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-portfolio > a{ background: transparent url("../images/local/btn-portfolio.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-portfolio .current-header{ background: transparent url("../images/local/btn-portfolio-current.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-profile > a{ background: transparent url("../images/local/btn-profile.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-profile .current-header{ background: transparent url("../images/local/btn-profile-current.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-newsletter > a{ background: transparent url("../images/local/btn-newsletter.gif") no-repeat 0 0; width:101px; margin:0px 6px 0px 0px; } #menu-header #menu-header-newsletter .current-header{ background: transparent url("../images/local/btn-newsletter-current.gif") no-repeat 0 0; width:101px; margin:0px 6px 0px 0px; } #menu-header #menu-header-blog > a{ background: transparent url("../images/local/btn-blog.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-blog .current-header{ background: transparent url("../images/local/btn-blog-current.gif") no-repeat 0 0; width:91px; } #menu-header #menu-header-1hundred > a{ background: transparent url("../images/local/btn-1hundred.gif") no-repeat 0 0; width:99px; margin:0px 0px 0px 305px; } #menu-header #menu-header-shop > a{ background: transparent url("../images/local/btn-shop.gif") no-repeat 0 0; width:91px; margin:0px 0px 0px 6px; } #logo-tag { height:auto; overflow:visible !important; } #logo { height:160px; width:788px; float:left; margin:0px 0px 0px -5px; } #logo-tag #logo > a { width:420px; height:160px; background-color: transparent; background-image: url(../images/local/logo_ginger_monkey.gif); background-repeat: no-repeat; background-position: 0px center; float:left; border:0px solid #90804d; } #tag { width:214px; float:right; } .tag h2{ margin:10px 0px 0px 0px; } .tag p{ margin:3px 0px 5px 0px; padding:0px; height:auto; min-height:100px; overflow:hidden; border:0px solid #90804d; } .tag a{ font-size:11px; font-style:italic; color:#848380; } #tag form { border:0px solid #90804d; clear:both; /*margin:5px 0px 12px 0px; position:absolute; width:214px;*/ } #tag form #input { border:1px solid #90804d; width:172px; font-size:11px; padding:2px 2px 2px 2px; } #tag form #ok { background:#90804d; font-family:Georgia, "Times New Roman", Times, serif; font-size:12px; color:transparent; border:0px; padding:1px 4px 1px 4px; height:19px; width:32px; background-image: url(../images/local/btn-ok.gif); background-repeat: no-repeat; background-position: 0px center; } /*autocomplete style*/ .suggestionsBox { float:right; margin: 0px 34px 0px 0px; width: 180px; } .suggestionList { margin: 0px; padding: 0px; background-color: #212427; border: 1px solid #000; width: 176px; color: #fff; overflow:auto; } .suggestionList li { margin: 0px 0px 0px 0px; padding: 3px; cursor: pointer; float:none; } .suggestionList li:hover { background-color: #999966; } #who-me h2{ height:12px; background-image: url(../images/local/title-who-me.gif); background-repeat: no-repeat; background-position: 0px center; } /*body style*/ #body { margin-top:15px; padding:0px 0px 20px 0px; border-bottom:1px solid #999966; } #body div{ clear:none; } #main { width:788px; } #main div { /*clear:none; clear:both;*/ } /*slides style*/ #slides { margin:0px 0px 30px 0px; } #slides ul { /*max-height:356px; overflow:hidden; clear:both; */ } #slides li { border:1px solid #90804d; max-width:785px; max-height:356px; overflow:hidden; } #slides .caption { width:787px; margin:8px 0px 0px 0px; /*background-image: url(../images/local/bar-slide.gif); background-repeat:no-repeat; background-position:right 0px;*/ } #slides .caption h2{ background:#90804d; color:#ffffff; font-style:italic; float:left; padding:3px 6px 3px 6px; margin:0px 5px 0px 0px; font-size:13px; } #slides .caption p{ font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:13px; padding:3px 6px 3px 6px; margin:0px 5px 0px 0px; } /*slideshow style*/ .slide { /*height:622px; background-color:#000;*/ height:356px; overflow:hidden; clear:both; } .slide li { position:absolute; z-index:0; } .slide li.active { z-index:10; } .slide li.last-active { z-index:9; } /*smalls style*/ #smalls { height:auto; margin:0px 0px 0px 0px; } #smalls ul { width:800px; } #smalls li { float:left; margin:0px 8px 0px 0px; width:190px; height:240px; position:relative; border:0px solid #999966; } #smalls .btn-cover { z-index:9; position:absolute; } #smalls .btn-cover:hover { opacity:0.4; filter:alpha(opacity=40); } #smalls .btn-new { z-index:10; position:absolute; top:170px; } #smalls .caption { z-index:10; position:absolute; bottom:0px; width:190px; font-family:Arial, Helvetica, sans-serif; } #smalls .caption h2 { font-family:Arial, Helvetica, sans-serif; font-size:12px; float:left; border:0px solid #999966; margin:0px 0px 0px 0px; } #smalls .caption h3 { font-family:Arial, Helvetica, sans-serif; font-size:11px; float:right; right:0px; border:0px solid #999966; margin:0px 0px 0px 0px; } #smalls .caption p { clear:both; } /*pagination style*/ #pagination { margin:20px 0px 0px 0px; border:0px solid #999966; overflow:hidden; float:left; clear:both } #pagination li { float:left; } #pagination a{ padding:3px 0px 0px 0px; margin:0px 5px 0px 0px; color:#333333; font-size:14px; border:0px solid #999966; overflow:hidden; float:left; } #pagination #btn-next-set { width:70px; height:22px; color:#ffffff !important; text-align:center; font-size:16px; font-family:Georgia, "Times New Roman", Times, serif; padding:0px 0px 0px 0px; background-image: url(../images/local/btn-next-set.gif)!important; background-repeat:no-repeat; background-position:right top; float:left; margin:0px 10px 0px 0px; } #pagination #btn-back { width:70px; height:22px; color:#ffffff; text-align:center; font-size:16px; font-family:Georgia, "Times New Roman", Times, serif; background-image: url(../images/local/btn-back.gif); background-repeat:no-repeat; background-position:right top; float:left; margin:0px 0px 0px 10px; } #pagination .current-pagination { color:#999966; text-decoration:none; } /*portfolio.item style*/ #images-main-portfolio, #images-main-portfolio img{ width:624px; } #info-portfolio { width:150px; } #content-portfolio h2{ color:#666666 } #content-portfolio h2{ font-family:Arial, Helvetica, sans-serif; color:#333333; font-size:13px } #tag-portfolio p { min-height:inherit; padding:0px; margin:0px; } #back-to-my-portfolio { margin:20px 0px 0px 0px; } #back-to-my-portfolio a{ width:151px; height:22px; color:#ffffff; text-align:center; font-size:16px; font-family:Georgia, "Times New Roman", Times, serif; padding:4px 0px 0px 0px; background-image: url(../images/local/btn-back-to-my-portfolio.gif); background-repeat:no-repeat; background-position:right top; float:left; } #back-to-my-portfolio a:hover{ text-decoration:none; } #temp, #images-look-closer-portfolio, #images-development-portfolio { margin:0px 0px 20px 0px; border-bottom:0px solid #999966; } #images-look-closer-portfolio h2, #images-development-portfolio h2 { margin:0px 0px 15px 0px; padding:0px 0px 3px 0px; width:630px; border-bottom:1px solid #999966; } #images-main-portfolio li { float:left; margin:0px 10px 10px 0px; border-bottom:0px solid #999966; } #images-look-closer-portfolio li, #images-development-portfolio li { float:left; margin:0px 10px 10px 0px; border-bottom:0px solid #999966; max-height:310px; } /*content-newsletter style*/ #content-newsletter { width:464px; overflow:visible !important; } #sign-up { width:315px; } #sign-up form { clear:both; margin:0px 0px 20px 0px; border:0px solid #90804d; overflow:hidden; } #sign-up form #input { border:1px solid #90804d; width:220px; font-size:11px; padding:2px 2px 2px 2px; float:left; } #sign-up form #btn-sign-up { background:#90804d; font-family:Georgia, "Times New Roman", Times, serif; font-size:12px; color:transparent; border:0px; padding:1px 4px 1px 4px; float:right; height:19px; width:84px; background-image: url(../images/local/btn-sign-up.gif); background-repeat: no-repeat; background-position: 0px center; } #sign-up .respond-sign-up { clear:both; } #privacy-policy p { width:400px; } #privacy-policy h2, #past-newsletters h2 { margin:15px 0px 15px 0px; } #past-newsletters { border-bottom:0px solid #999966; } #past-newsletters li { float:none; } /*content-profile-left style*/ #content-profile-left { width:447px; } #content-profile-right { width:320px; } #company-I-worked-for{ margin:15px 0px 0px 0px; padding:0px 0px 10px 0px; } #company-I-worked-for p{ float:left; } #company-I-worked-for > ul{ float:right; } #company-I-worked-for > ul > ul{ float:left; } #company-I-worked-for > ul > ul:first-child{ margin:0px 40px 0px 0px; } #company-I-worked-for li, #press-interviews-contribution li{ float:none; } #press-interviews-contribution { margin:15px 0px 50px 0px; border-bottom:0px solid #999966; } #press-interviews-contribution div{ float:left !important; } /*blog style*/ #content-blog { margin:0px 0px 20px 0px; } #blogger-blog { border-bottom:0px solid #999966; margin:0px 0px 0px 0px; } #items-blog { width:590px; } .item-blog { margin:0px 0px 30px 0px; width:590px; } .item-blog img{ max-width:588px; } .head-item h1, .head-item h2, .head-item h3 { margin:0px; padding:0px; } .head-item h1 { font-family:Georgia, "Times New Roman", Times, serif; font-size:20px; } .head-item h2 { font-family:Arial, Helvetica, sans-serif; color:#333333; font-size:11px; } .head-item h3 { color:#999999; font-size:12px; } .body-item { margin:12px 0px 0px 0px; } .body-item p { padding:0px 0px 20px 0px; } .body-item img { border:1px solid #999966 !important; } .more-item { float:right; margin:-10px 0px 0px 0px; padding:0px 0px 8px 0px !important; } .more-item a{ width:84px; height:28px; color:#ffffff; text-align:center; font-size:16px; font-family:Georgia, "Times New Roman", Times, serif; padding:4px 0px 0px 0px; background-image: url(../images/local/btn-more.gif); background-repeat:no-repeat; background-position:right top; float:left; } .foot-item { border-top:1px solid #999966; border-bottom:1px solid #999966; padding:5px 0px 5px 0px; font-size:11px; } #menu-blog { width:185px; } #menu-blog h2 { margin-top:10px; } #menu-blog ul { margin-bottom:15px; } #menu-blog li { float:none; } #menu-blog a { color:#676764 !important; } #archive-blog { border-top:1px solid #999966; border-bottom:1px solid #999966; } #categories-blog { border-bottom:1px solid #999966; } #popular-blog { border-bottom:1px solid #999966; } #popular-blog li{ clear:both; border:0px solid #999966; overflow:hidden; } /*side style*/ #side { width:214px; } #side .item-side{ margin:0px 0px 0px 0px; padding:0px 0px 10px 0px; clear:both; border-top:1px solid #999966; } #side .item-side h2{ margin:10px 0px 10px 0px; } #side #join-me h2 { margin-bottom:5px; } #side #join-me ul { margin:0px 0px 0px 0px; border:0px solid #999966; overflow:hidden; } #side #join-me li{ float:left; } #side #join-me img { margin:0px 5px 0px 0px; } #side #introduction{ /*background-image: url(../images/local/bar-who-me.gif);*/ background-repeat:no-repeat; background-position:left top; } #side #pdf_portfolio { padding:0px; border-bottom:1px solid #999966; } #side #pdf_portfolio p{ width:100px; margin:12px 0px 0px 10px; padding:0px; float:right; border:0px solid #999966; text-align:right; } #side #pdf_portfolio p img{ margin:0px 5px -10px 0px; } #side #pdf_portfolio p a{ text-decoration:underline; color:#999; } /*footer style*/ #footer { margin-top:10px; margin-bottom:10px; font-size:10.2px; } #footer div{ clear:none; float:left; } #menu-copyright { width:490px; } #menu-footer li{ float:left; } #menu-footer a { color:#999966; font-size:12px; } #menu-footer a:hover { text-decoration:underline; } #copyright { width:100%; } #address { width:155px; } #credits { width:150px; } #footer #go-top { float:right; border:0px solid #ccc; } #footer #go-top a{ width:90px; height:28px; font-size:12px; padding:4px 0px 0px 0px; background-image: url(../images/local/btn-go-top.gif); background-repeat:no-repeat; background-position:left 8px; text-align:right; float:right; } #footer #go-top a:hover{ text-decoration:none; }