/* Theme Name: Shannon Sewell Description: Shannon Sewell theme Author: Flosites Author URI: http://flosites.com Version: 1.0 */ @import 'css/reset.css'; @import 'css/scroll.css'; /* SITE CSS */ html { height:100%; background:white; } body { font-family:Arial; color:#707070; font-size:12px; } body .clear { clear:both; } body a { text-decoration:none; color:#92bcd1; } body a:hover { text-decoration:none; color:; } #wrapper { width:1000px; margin:0px auto; } /* HEADER */ #header { width:1000px; height:215px; background:url(i/header.png) center top no-repeat; display:block; position:relative; z-index:3; } /* logo */ #header a.logo { width:1000px; height:150px; display:block; position:absolute; left:0px; top:0px; } #header a.logo span { display:none; } /* menu */ #menu { width:460px; height:65px; display:block; position:absolute; left:40px; top:150px; z-index:3; } #menu li { float:left; height:65px; position:relative; z-index:3; } #menu li.selected { background:url(i/menu-selected-right.png) left center no-repeat; position:relative; margin-left:-5px; margin-right:-5px; z-index:3; } #menu li a { color:#707070; font-size:14px; line-height:65px; display:block; height:65px; padding-left:10px; padding-right:10px; z-index:3; } #menu li a:hover { color:#92bcd1; } #menu li.selected a { color:#92bcd1; background:url(i/menu-selected-left.png) right center no-repeat; padding-left:15px; padding-right:15px; position:relative; z-index:3; } /* submenu */ #menu li .submenu { margin-left:-5px; width:150px; display:none; position:absolute; left:0px; top:45px; zoom:1; background:url(i/submenu.png) top left no-repeat; z-index:4; } #menu li.selected .submenu { margin-left:0px; z-index:4; } *:first-child+html #menu li .submenu { top:45px; } /* ie7 */ #menu li.selected .submenu ul,#menu li .submenu ul { z-index:4; background:url(i/submenu-footer.png) bottom left no-repeat; margin-bottom:-10px; position:relative; padding-bottom:10px; padding-top:10px; z-index:4; } #menu li.selected .submenu ul li,#menu li .submenu ul li { width:117px; padding:0px; z-index:4; line-height:20px; background:none; margin:0px; height:20px; float:none; } #menu li.selected .submenu ul li a, #menu li .submenu ul li a { color:#707070; font-size:14px; display:inline; height:auto; line-height:14px; background:none; margin:0px; padding-left:15px; z-index:4; } #menu li.selected .submenu ul li a:hover, #menu li .submenu ul li a:hover { color:#92bcd1; } /* twitter */ #header .twitter { width:500px; height:65px; display:block; position:absolute; right:30px; top:150px; background:url(i/twitter.png) right top no-repeat; } #header .twitter p { font-size:12px; line-height:15px; width:250px; padding-right:85px; padding-left:165px; padding-top:25px; } #header .twitter p a { } /* CONTENT */ #content { width:900px; padding-left:50px; padding-right:50px; padding-top:45px; padding-bottom:30px; z-index:1; position:relative; } /* about */ #content h1 { color:#707070; text-transform:lowercase; font-size:29px; font-weight:normal; padding-bottom:40px; } #content .about-image { padding-right:25px; float:left; } #content .text { font-size:12px; color:#707070; line-height:1.2; padding-bottom:12px; float:left; width:710px; } /* contact */ #contact-form { width:900px; height:170px; display:block; position:relative; } #contact-form .your-comment { position:absolute; left:270px; top:0px; background:url(i/form-your-comment.png); width:110px; height:18px; } #contact-form .name { position:absolute; left:0px; top:22px; } #contact-form .email { position:absolute; left:0px; top:58px; } #contact-form .url { position:absolute; left:0px; top:93px; } #contact-form .name input, #contact-form .email input, #contact-form .url input { color:#6d6e71; font-size:15px; width:247px; height:24px; line-height:24px; background:url(i/form-input.png); border-spacing:0px; margin:0px; padding:0px; space:0px; border:0px; padding:3px; } #contact-form .message { position:absolute; left:270px; top:22px; } #contact-form .message textarea { color:#6d6e71; font-size:15px; width:528px; height:99px; line-height:24px; background:url(i/form-textarea.png); border-spacing:0px; margin:0px; padding:0px; space:0px; border:0px; padding:3px; overflow:hidden; font-family:Arial; } #contact-form .send { position:absolute; left:810px; top:50px; } #contact-form .send input {width:100px;height:37px;background: url(i/form-send.png) 0 0 no-repeat; border:0; cursor: pointer;} #contact-form p.hidden {display:none;} #content h1.contact {padding-bottom:0px;} /* post */ #content .post { margin-bottom:40px; position:relative; z-index:1; } /* title */ #content .post .title { position:relative; z-index:1; } #content .post .title .month1 { width:16px; height:80px; background:url(i/month.jpg) 0px 0px no-repeat; display:block; position:absolute; left:0px; top:-18px; z-index:1; } #content .post .title .month2 { width:16px; height:80px; background:url(i/month.jpg) -16px 0px no-repeat; display:block; position:absolute; left:0px; top:-20px; z-index:1; } #content .post .title .month3 { width:16px; height:80px; background:url(i/month.jpg) -32px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month4 { width:16px; height:80px; background:url(i/month.jpg) -48px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month5 { width:16px; height:80px; background:url(i/month.jpg) -64px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month6 { width:16px; height:80px; background:url(i/month.jpg) -80px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month7 { width:16px; height:80px; background:url(i/month.jpg) -96px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month8 { width:16px; height:80px; background:url(i/month.jpg) -112px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month9 { width:16px; height:80px; background:url(i/month.jpg) -128px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month10 { width:16px; height:80px; background:url(i/month.jpg) -144px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month11 { width:16px; height:80px; background:url(i/month.jpg) -160px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .month12 { width:16px; height:80px; background:url(i/month.jpg) -176px 0px no-repeat; display:block; position:absolute; left:0px; top:-25px; z-index:1; } #content .post .title .days01 { width:70px; height:80px; background:url(i/days.jpg) 0px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days02 { width:70px; height:80px; background:url(i/days.jpg) -70px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days03 { width:70px; height:80px; background:url(i/days.jpg) -140px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days04 { width:70px; height:80px; background:url(i/days.jpg) -210px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days05 { width:70px; height:80px; background:url(i/days.jpg) -280px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days06 { width:70px; height:80px; background:url(i/days.jpg) -350px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days07 { width:70px; height:80px; background:url(i/days.jpg) -420px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days08 { width:70px; height:80px; background:url(i/days.jpg) -490px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days09 { width:70px; height:80px; background:url(i/days.jpg) -560px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days10 { width:70px; height:80px; background:url(i/days.jpg) -630px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days11 { width:70px; height:80px; background:url(i/days.jpg) -700px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days12 { width:70px; height:80px; background:url(i/days.jpg) -770px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days13 { width:70px; height:80px; background:url(i/days.jpg) -840px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days14 { width:70px; height:80px; background:url(i/days.jpg) -910px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days15 { width:70px; height:80px; background:url(i/days.jpg) -980px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days16 { width:70px; height:80px; background:url(i/days.jpg) -1050px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days17 { width:70px; height:80px; background:url(i/days.jpg) -1120px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days18 { width:70px; height:80px; background:url(i/days.jpg) -1190px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days19 { width:70px; height:80px; background:url(i/days.jpg) -1260px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days20 { width:70px; height:80px; background:url(i/days.jpg) -1330px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days21 { width:70px; height:80px; background:url(i/days.jpg) -1400px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days22 { width:70px; height:80px; background:url(i/days.jpg) -1470px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days23 { width:70px; height:80px; background:url(i/days.jpg) -1540px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days24 { width:70px; height:80px; background:url(i/days.jpg) -1610px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days25 { width:70px; height:80px; background:url(i/days.jpg) -1680px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days26 { width:70px; height:80px; background:url(i/days.jpg) -1750px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days27 { width:70px; height:80px; background:url(i/days.jpg) -1820px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days28 { width:70px; height:80px; background:url(i/days.jpg) -1890px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days29 { width:70px; height:80px; background:url(i/days.jpg) -1960px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days30 { width:70px; height:80px; background:url(i/days.jpg) -2030px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title .days31 { width:70px; height:80px; background:url(i/days.jpg) -2100px 0px no-repeat; display:block; position:absolute; left:16px; top:-25px; z-index:1; } #content .post .title h1 { font-size:28px; color:#707070; font-weight:normal; padding-left:86px; z-index:1; } #content .post .title h1 a{ font-size:28px; color:#707070; } #content .post p { color:#6D6E71; font-size:12px; line-height:16px; padding-bottom:10px; } /* comments */ #content .post .block-comments { } /* add-comments */ #content .post .block-comments .add-comment { width:900px; height:150px; display:block; position:relative; margin-top:15px; } #content .post .block-comments .add-comment p { padding:0px; } #content .post .block-comments .add-comment .your-comment { position:absolute; left:270px; top:0px; background:url(i/form-your-comment.png) no-repeat; width:110px; height:18px; } #content .post .block-comments .add-comment .name { position:absolute; left:0px; top:22px; } #content .post .block-comments .add-comment .email { position:absolute; left:0px; top:58px; } #content .post .block-comments .add-comment .url { position:absolute; left:0px; top:93px; } #content .post .block-comments .add-comment .name input, #content .post .block-comments .add-comment .email input, #content .post .block-comments .add-comment .url input { color:#6d6e71; font-size:15px; width:247px; height:24px; line-height:24px; background:url(i/form-input.png); border-spacing:0px; margin:0px; padding:0px; space:0px; border:0px; padding:3px; } #content .post .block-comments .add-comment .message { position:absolute; left:270px; top:22px; } #content .post .block-comments .add-comment .message textarea { color:#6d6e71; font-size:15px; width:528px; height:99px; line-height:24px; background:url(i/form-textarea.png); border-spacing:0px; margin:0px; padding:0px; space:0px; border:0px; padding:3px; overflow:hidden; font-family:Arial; } #content .post .block-comments .add-comment .send { position:absolute; left:810px; top:50px; } /* links */ #content .post .block-comments ul.meta-links { } #content .post .block-comments ul.meta-links li { float:left; height:24px; line-height:24px; color:#808080; font-size:19px; } #content .post .block-comments ul.meta-links li.add { background:url(i/line.jpg) right no-repeat; padding-right:10px; } #content .post .block-comments ul.meta-links li.link { background:url(i/line.jpg) right no-repeat; padding-right:10px; padding-left:10px; } #content .post .block-comments ul.meta-links li.share { padding-left:10px; padding-right:25px; } #content .post .block-comments ul.meta-links li a{ color:#808080; font-size:19px;} #content .post .block-comments ul.meta-links li a:hover { color:#92BCD1 } #content .post .block-comments ul.meta-links li.social1 { width:24px; height:17px; padding-left:25px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social1 a { width:17px; height:17px; display:block; background:url(i/social.png) 0px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social2 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social2 a { width:17px; height:17px; display:block; background:url(i/social.png) -24px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social3 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social3 a { width:17px; height:17px; display:block; background:url(i/social.png) -48px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social4 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social4 a { width:17px; height:17px; display:block; background:url(i/social.png) -72px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social5 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social5 a { width:17px; height:17px; display:block; background:url(i/social.png) -96px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social6 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social6 a { width:17px; height:17px; display:block; background:url(i/social.png) -120px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social7 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social7 a { width:17px; height:17px; display:block; background:url(i/social.png) -144px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social8 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social8 a { width:17px; height:17px; display:block; background:url(i/social.png) -168px 0px no-repeat; } #content .post .block-comments ul.meta-links li.social9 { width:24px; height:17px; padding-right:7px; padding-top:4px; } #content .post .block-comments ul.meta-links li.social9 a { width:17px; height:17px; display:block; background:url(i/social.png) -192px 0px no-repeat; } /* comments */ #content .post .block-comments .clear { height:1px; font-size:1px; padding:0px; } #content .post .block-comments .comments { line-height:15px; width:895px; height:150px; overflow:auto; clear:both; margin-top:10px; } #content .post .block-comments .comments p { line-height:15px; padding:0px; padding-bottom:15px; color:#a3a3a3; } #content .post .block-comments .comments p a, #content .post .block-comments .comments p span { text-decoration:underline; text-transform:uppercase; color:#6d6e71; } /* SEARCH */ #search { width:1000px; height:50px; position:relative; display:block; } #search .input { width:206px; height:50px; text-align:center; position:absolute; left:393px; top:0px; } #search .input label { width:50px; height:50px; display:block; background:url(i/search-label.png); position:absolute; left:0px; top:0px; } #search .input label span { display:none; } #search .input input { width:145px; height:18px; line-height:18px; background:url(i/search-input.png); position:absolute; left:55px; top:17px; border-spacing:0px; margin:0px; padding:0px; space:0px; border:0px; padding:3px; } /* ARCHIVES */ #archives { width:1000px; position:relative; display:block; } #archives .line { width:1000px; height:50px; display:block; background:url(i/archives-line.png); } #archives .title { float:left; text-transform:uppercase; color:#a1a1a1; font-size:13px; padding-left:50px; width:190px; height:90px; } #archives .year { float:left; text-transform:uppercase; font-size:13px; } #archives .year a { color:#6d6e71; } #archives .year { color:#bfbfbf; } /* FOOTER */ #footer { width:1000px; position:relative; display:block; height:85px; color:#a7a8aa; } #footer .copyright { width:450px; position:absolute; left:50px; top:0px; } #footer .flosites { width:450px; position:absolute; right:50px; top:0px; text-align:right; } #wp_page_numbers { overflow:hidden; zoom:1; font-size:16px; text-transform: lowercase; text-align: center; } #wp_page_numbers a { color:#6d6e71; padding: 0 10px; } #wp_page_numbers a.prev-inactive, #wp_page_numbers a.next-inactive { color:#bfbfbf; cursor: default; }