/* Theme Name: SuddenMischief Reboot Theme URI: http://www.suddenmischief.com/ Description: The default theme for the SuddenMischief Website. Version: 1.0 Author: Rob Wagner Author URI: http://suddenmischief.com/ Tags: blue, custom header, fixed width, two columns, widgets This theme was designed and built by Rob Wagner, whose design firm you will find at http://suddenmischief.com/ The CSS, XHTML and design is released under GPL: http://www.opensource.org/licenses/gpl-license.php */ @import "css/960.css"; /* ========== Reset (Based on YUI Reset) ==========*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; } ol,ul { list-style:none; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } q:before,q:after { content:''; } abbr,acronym { border:0; } /* ========== Fonts Normalization (Based on YUI Fonts) ========== */ body { font:13px/1.231 arial,helvetica,clean,sans-serif; /* for IE6/7 */ *font-size:small; /* for IE Quirks Mode */ *font:x-small; } /* Nudge down to get to 13px equivalent for these form elements */ select, input, button, textarea, button { font:99% arial,helvetica,clean,sans-serif; } /* To help tables remember to inherit */ table { font-size:inherit; font:100%; } /* * Bump up IE to get to 13px equivalent for these fixed-width elements */ pre, code, kbd, samp, tt { font-family:monospace; *font-size:108%; line-height:100%; } /* ========== Base (Based on YUI Base) ========== */ * { font-family: Georgia, "Times New Roman", Times, serif; } h1 { /*22px */ font-size:167%; } h2 { /*18px */ font-size:153.9%; } h3 { /*18px */ font-size:138.5%; } h4 { /*16px */ font-size:123.1%; } h5 { /*14px */ font-size:108%; } h1,h2,h3,h4,h5 { /* top & bottom margin based on font size */ margin:1em 0; } h1,h2,h3,h4,h5,h6,strong { font-weight:bold; } abbr,acronym { border-bottom:1px dotted #000; cursor:help; } em { font-style:italic; } blockquote,ul,ol,dl { margin:1em; } ol,ul,dl { margin-left:2em; } ol li { list-style: decimal outside; } ul li { list-style: disc outside; } dl dd { margin-left:1em; } th,td { border:1px solid #000; padding:.5em; } th { font-weight:bold; text-align:center; } caption { margin-bottom:.5em; text-align:center; } p,fieldset,table { margin-bottom:1em; } /* ========== Grid Overlay for Development/Testing ========== */ .container_12 {background: transparent url(img/12_col.gif) repeat-y;} /* ========== Main Theme Styles ========== */ body { background: transparent url(images/sudden_bg_tile.jpg) center top repeat-x;} #header { position: relative; background: transparent url(images/sudden_bg_header.jpg) left top no-repeat; height: 186px; margin-bottom: 20px;} #header H1 A { position: absolute; top: 10px; left: 10px; height: 105px; width: 400px; text-indent: -9999px;} #menu { position: absolute; bottom: 0px; left: 0px; width: 100%;} /* ========== Footer ========== */ #content_wrapper { background: transparent url(images/divider_v.gif) 637px top repeat-y; overflow: auto;} #content_wrapper DIV { } /* ========== Footer ========== */ #body_footer { background: transparent url(images/sudden_bg_tile.jpg) center top; margin-top: 20px;} #footer_wrapper { /*background: transparent url(images/sudden_bg_globe.jpg) right top no-repeat;*/ overflow: auto; color: #FFFFFF; } #footer_wrapper H3 {margin: 10px 0 20px 0;} #footer-left, #footer-middle, #footer-right {margin-bottom: 20px; } /*#footer-right { background: transparent url(images/sudden_bg_footer.jpg) left 10px no-repeat; color: #000000;} #footer-right H3 { position: absolute; visibility: hidden;}*/ /* ========== Homepage ==========*/ #feature { position: relative; background: transparent url(images/sudden_bg_homepage.gif) right top no-repeat; height: 280px; } #feature .blurb { padding: 40px 0 0 30px; width: 450px; height: 200px; overflow: hidden; font-size: 123.1%; } #feature H2 { color: #ab5226; margin-bottom: 10px; margin-top: 10px;} #slides { position: absolute; top: 39px; left: 521px; height: 181px; width: 309px; overflow: hidden; border: 0px solid red; } #slidesNext { position: absolute; top: 108px; right: 12px; height: 49px; width: 49px; cursor: pointer;} #callouts {} #callouts H3 { position: relative; background: transparent url(images/callout_header_red.gif) left top repeat-x; padding-left: 65px; height: 30px; color: #ffffff; font-size: 100%; line-height: 30px; } .jewelry { display: block; position: absolute; top: -8px; left: 10px; height: 45px; width: 45px; } #home_wplist .jewelry { background: transparent url(images/icons_home.gif) 0px 0px no-repeat; } #home_posts .jewelry { background: transparent url(images/icons_home.gif) -45px 0px no-repeat; } #home_categories .jewelry { background: transparent url(images/icons_home.gif) -90px 0px no-repeat; } .wplist_item {border: 1px dashed #999999; background: #EFEFEF url(images/sudden_bg_homepage.gif) -20px center no-repeat; height: 45px; margin-bottom: 10px; text-align: center; line-height: 45px; color: #999999;} /* ========== About ==========*/ #contact-form { background: transparent url(images/sudden_bg_tearstrip.jpg) right top no-repeat; height: 220px; margin-top: 20px; overflow: hidden; } #contact-form .inner {margin: 0px 20px 10px 20px; position: relative; } #contact-form H2 { color: #4E7177; margin-bottom: 10px; margin-top: 15px; } .f_name_label, .f_email_label, .f_message_label, .f_send INPUT {text-indent: -9999px; } .f_name INPUT, .f_email INPUT, .f_message TEXTAREA { font-size: 123.1%; padding: 5px; width: 100%; } .f_name {} .f_name_label { position: absolute; left: 0px; top: 50px; height: 35px; width: 110px; border: 0px solid red;} .f_name_label {background: transparent url(images/sudden_bg_contact_labels.gif) left top no-repeat;} .f_name_field { position: absolute; left: 120px; top: 50px; height: 35px; width: 260px; border: 0px solid red;} .f_email {} .f_email_label { position: absolute; left: 0; top: 105px; height: 35px; width: 110px; border: 0px solid red;} .f_email_label {background: transparent url(images/sudden_bg_contact_labels.gif) left -45px no-repeat;} .f_email_field { position: absolute; left: 120px; top: 105px; height: 35px; width: 260px; border: 0px solid red;} .f_message {} .f_message_label { position: absolute; left: 670px; top: 15px; height: 35px; width: 150px; border: 0px solid red; } .f_message_label {background: transparent url(images/sudden_bg_contact_labels.gif) right -75px no-repeat;} .f_message_field { position: absolute; left: 410px; top: 50px; height: 140px; width: 410px; border: 0px solid red; } .f_message_field TEXTAREA{ width: 100%; height: 130px;} .f_send { position: absolute; top: 90px; right: 0px; } .f_send INPUT { height: 100px; width: 57px; border: none; background: transparent url(images/sudden_bg_contact_button.gif) left top no-repeat; cursor: pointer; } H3.titlebar { position: relative; background: transparent url(images/callout_header_red.gif) left top repeat-x; padding-left: 10px; height: 30px; color: #ffffff; font-size: 100%; line-height: 30px; } H3.titlebar A, H3.titlebar A:link, H3.titlebar A:visited {color: #ffffff; } /* ========== Modifications to Base ==========*/ H1 {color: #2A3644; font-family: Georgia, "Times New Roman", Times, serif; } UL LI {list-style-image: url(img/list_bullet.png); } BLOCKQUOTE { color: #666666; font-style: italic;} TH {background-color: #b7d696; text-align: left; border: none;} TD {color: #666666; border-color: #666666; } A {color: #3399ff;} A:visited { color: #0066cc; } /* ========== Navigation ========== */ #nav { list-style: none; padding: 0; margin: 0; width: 470px; height: 63px; background: transparent; position: absolute; left: 10px; bottom: 0px; border: 0px solid red; overflow: hidden; } #nav a { display: block; text-indent: -9999px; position: absolute; outline: none; background: transparent url(images/sudden_bg_navsprite.jpg) 0 0 no-repeat; color: #000; text-decoration: none; font-weight: bold; line-height: 45px; border: 0px solid green; } #nav a.home { width: 81px; height: 63px; left: 0px; bottom: 0px; background-position: -12px -80px; } #nav a.home:hover { background-position: -12px 0px; } #nav a.about { width: 81px; height: 63px; left: 96px; bottom: 0px; background-position: -107px -80px; } #nav a.about:hover { background-position: -107px 0px; } #nav a.portfolio { width: 97px; height: 63px; left: 192px; bottom: 0px; background-position: -200px -80px; } #nav a.portfolio:hover { background-position: -200px 0px; } #nav a.blog { width: 99px; height: 63px; left: 304px; bottom: 0px; background-position: -309px -80px; } #nav a.blog:hover { background-position: -309px 0px; } #search { margin: 20px 0; } .search-box { width: 200px; height: 29px; font-size: 1.3em; line-height: 1.3em; padding: 2px; border: 1px solid #993300;} .search-button { border: none; text-indent: -9999px; width: 82px; height: 29px; background: transparent url(img/btn_search.gif) left top no-repeat; } /* ========== Tweet Box ========== */ #tweetboxtweets { height: 300px; background: transparent url(images/sudden_bg_quotebox.jpg) left top no-repeat; padding: 1px 20px 10px 20px; } /* #twitter_update_list { padding: 0 10px 10px 10px!important; margin: 0; } #twitter_update_list li { list-style: none; padding: 0.5em!important; margin: 0; } #twitter_update_list li a:link { color: #59770E; } .new-twitter-box-wrapper {position: relative; top: 15px;} .new-twitter-box {-moz-border-radius: 10px; -webkit-border-radius: 10px; background: #E4EFF4 url(images/bg_twitter.png) left top repeat-x; } .new-twitter-header {position: relative; top: -15px; left: 10px; margin-bottom: -15px; background: transparent url(images/header_twitter.gif) left top no-repeat; height: 25px; text-indent: -9999px;} */ /* ========== FlickerRss ========== */ A.flickrImg { display: block; float: left; margin: 0px 10px 10px 0; border: 1px solid white; } A.flickrImg:hover { border: 1px solid yellow; } /* ========== Post ========== */ .post { position: relative; margin-bottom: 3.5em; } .post H1 {margin: 0;} .post-title A, .post-title A:link, .post-title A:visited {color: #2A3644!important; text-decoration: none;} .post-title A:hover {text-decoration: underline;} .post-date{ position: relative; border: 0px solid black; color: #5a8a05; font-style: italic; } .entry { margin: 20px 0px; font-family: Arial, Helvetica, sans-serif;} .post-cat { clear: both; color: #5a8a05; } .post-cat A {color: #5a8a05; text-decoration: none; font-style: italic; } .post-cat A:hover {text-decoration: underline; } /* ========== Page/Post Navigation ========== */ .navigation { height: 40px; position: relative; } ..alignleft,.alignright {width: 40%; } .navigation .alignleft A { position: absolute; top: 0px; left: 0px; color: #5a8a05; font-size: 108%; height: 20px; background: transparent url(images/text_next_prev.gif) left -40px no-repeat; padding: 20px 0 0 20px; } .navigation .alignright A { position: absolute; top: 0px; right: 0px; color: #5a8a05; font-size: 108%; height: 20px; background: transparent url(images/text_next_prev.gif) right 0px no-repeat; padding: 20px 20px 0 0; }