/* Theme Name: Heather Forsyth Theme URI: http://www.heatherforsyth.com Description: Calgary Fish Creek Version: 1.0 Author: Heather Forsyth Author URI: http://www.heatherforsyth.com Tags: Calgary Fish Creek */ @charset "utf-8"; /* CSS Document */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } /* UNIVERSAL STYLES */ a:focus { border:none; text-decoration:none; outline:none; } .clear { clear:both; } body { font-family:Georgia, Geneva, "Times New Roman", Times, serif; margin:0; padding:0; background:url(images/background-mountain.jpg) top fixed; } #site { width:900px; margin:0px auto 0px auto; position:relative; left:1px; } #header { width:900px; height:215px; } #topbar { width:900px; height:35px; background:#005696; } #district { float:left; margin:5px 0px 0px 20px; } #district h1 { font-size:16px; color:#FFFFFF; font-weight:normal; } #office { float:right; margin:5px 20px 0px 0px; } #office h1 { font-size:16px; color:#FFFFFF; font-weight:normal; } #banner { width:900px; height:145px; background:url(images/banner-bg-forsyth.jpg) top no-repeat #e9f3fd; } #name { float:left; margin:20px 0px 0px 20px; } #picture { float:right; margin:1px 0px 0px 0px; } #menu { width:900px; height:35px; background:#5d9732; z-index:100; position:relative; } #menu h2 { font-size:16px; color:#FFFFFF; font-weight:normal; margin:5px 20px 0px 0px; } #menu h2 a { color:#FFFFFF; text-decoration:none; } #menu h2 a:hover { color:#005696; } /*#menu { width:900px; height:35px; background:#5d9732; z-index:100; position:relative; } #menu ul { list-style:none; list-style-type:none; margin:0px 0px 0px 20px; } #menu ul li ul { list-style:none; list-style-type:none; /*margin:0px 0px 0px 20px;*//*margin:0px; }*/ /*#menu ul li { display:inline; } #menu h2 { font-size:16px; color:#FFFFFF; font-weight:normal; margin:5px 20px 0px 0px; } #menu h2 a { color:#FFFFFF; text-decoration:none; } #menu h2 a:hover { color:#005696; }*/ #sidebar { width:300px; padding:20px; background:#e9f3fd; float:left; } .widget { margin:0px 0px 20px 0px; } .widget h3 { font-size:20px; text-transform:uppercase; color:#005696; margin:0px 0px 5px 0px; } .widget a.supporter { width:300px; height:165px; display:block; overflow:hidden; } .widget a.supporter:hover { text-indent:-300px; display:block; } .widget #youtube { width:298px; height:239px; border:1px solid #005696; } .widget .rollover { float:left; margin:0px 10px 0px 0px; } .widget .rollover a.facebook { width:48px; height:48px; display:block; overflow:hidden; } .widget .rollover a.facebook:hover { text-indent:-48px; display:block; } .widget .rollover a.youtube { width:48px; height:48px; display:block; overflow:hidden; } .widget .rollover a.youtube:hover { text-indent:-48px; display:block; } .widget .rollover a.twitter { width:48px; height:48px; display:block; overflow:hidden; } .widget .rollover a.twitter:hover { text-indent:-48px; display:block; } .widget .rollover a.flickr { width:48px; height:48px; display:block; overflow:hidden; } .widget .rollover a.flickr:hover { text-indent:-48px; display:block; } #footer { width:860px; padding:20px; background:#005696; position:relative; } #footer ul { list-style:none; list-style-type:none; } #footer ul li { display:inline; margin:0px 10px 0px 0px; font-size:13px; } #footer ul li a { color:#FFFFFF; text-decoration:none; } #footer ul li a:hover { text-decoration:underline; } #footer p { color:#FFFFFF; font-size:13px; margin:15px 0px 0px 0px; } /* HOMAPGE STYLES */ #content { width:900px; min-height:760px; /*760*/ background:url(images/content-sidebar-left.jpg) top repeat-y; } #maincol { width:560px; float:left; } #feature { width:870px; padding:15px; height:325px; /*position:absolute; top:215px; *margin:0px 0px 0px -20px; */overflow:hidden; background-color:#e9f3fd; } #feature .cover { width:610px; height:50px; padding:10px 20px 0px 20px; background-color:#5d9732; text-decoration:none; opacity: .7; filter: alpha(opacity=70); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; z-index:8; position:absolute; top:240px; } #feature .caption { width:610px; height:50px; padding:10px 20px 0px 20px; text-decoration:none; z-index:10; position:absolute; top:240px; } #feature .caption h2 { font-size:18px; color:#ffffff; } #feature .caption h3 { font-size:11px; color:#ffffff; font-weight:lighter; margin:5px 0 0 0; } #feature .caption h2 a { color:#FFFFFF; text-decoration:none; } #feature .caption h2 a:hover { color:#dddddd; } #feature .image { width:700px; height:300px; z-index:5; overflow:hidden; } /*#feature .image img { max-height:300px; height:expression(this.height > 300 ? 300: true); max-width:900px; width:expression(this.width > 900 ? 900: true); }*/ #feature .thumbnail { z-index:97; position:relative; left:650px; top:-300px; margin:0px; } #feature a.thumbnail { text-decoration:none; } #feature .thumb-caption { position:absolute; z-index:55; top:-1px; *top:59px; left:3px; height:20px; width:200px; color:#ffffff; font-size:9px;} #feature .thumb-caption-bg { position:absolute; z-index:50; top:-5px; *top:55px; left:0px; height:20px; width:200px; background-color:#5d9732; opacity: .7; filter: alpha(opacity=70); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; } #feature .thumb-caption-bg-active { position:absolute; z-index:50; top:-5px; *top:55px; left:0px; height:20px; width:200px; background-color:#005696; opacity: .7; filter: alpha(opacity=70); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; } #feature .thumbnail img { margin:0; width:200px; height:75px; /*border:1px solid #5d9732; background:#999999;*/ } #feature .slider-wrap { width: 850px; height:300px; overflow:hidden; padding:10px; background:url(images/feature-bg.jpg) no-repeat #ffffff; } #feature .stripViewer { position: relative; overflow: hidden; width: 650px; height: 300px; } #feature .stripViewer .panelContainer { position: relative; left: 0; top: 0; background-color:#ffffff } #feature .stripViewer .panelContainer .panel { float: left; height: 100%; position: relative; width: 650px; } #feature .stripNavL, .stripNavR, .stripNav { display: none; } #website-greeting { width:520px; margin:20px 0px 20px 20px; /*position:relative; top:315px; background-color:#003333;*/ } #website-greeting h2 { font-size:23px; color:#005696; text-transform:uppercase; margin:0px 0px 10px 0px; } #website-greeting p { font-size:12px; color:#2a2a2a; line-height:20px; margin:0px 0px 15px 0px; } #priorities { width:540px; margin:20px 0px 20px 20px; /*position:relative; top:315px;*/ } #priorities h2 { font-size:23px; color:#005696; text-transform:uppercase; margin:0px 0px 10px 0px; } .priority { float:left; height:160px; margin:0px 20px 0px 0px; } .priority .cover { width:140px; height:41px; padding:10px; background:url(images/priority-title-cover.png) top repeat-y; z-index:10; position:relative; top:-60px; } .priority .cover h3 { font-size:16px; color:#FFFFFF; } .priority .cover h3 a { color:#FFFFFF; text-decoration:none; } .priority .cover h3 a:hover { color:#dddddd; } .priority .image { width:160px; height:380px; z-index:5; overflow:hidden; } .priority .image:hover { text-indent:-160px; display:block; } /* SUBPAGE STYLES */ #subpage { width:900px; background:url(images/content-sidebar-left.jpg) top repeat-y; } #subpage #maincol { width:520px; padding:20px; float:left; } #subpage #maincol p { font-size:14px; color:#2a2a2a; line-height:24px; margin:0px 0px 15px 0px; } #subpage #maincol a { color:#005696; text-decoration:none; border-bottom:dotted 1px #005696; } #subpage #maincol a:hover { color:#5d9732; border:none; } #subpage #maincol hr { border:none; padding:0px; margin:0px 0px 15px 0px; border-bottom:dotted 1px #005696; } #subpage #maincol h1 { font-size:26px; font-weight:normal; color:#005696; margin:0px 0px 15px 0px; } #subpage #maincol h1 a { color:#005696; text-decoration:none; } #subpage #maincol h1 a:hover { color:#5d9732; } #subpage #maincol h2 { font-size:23px; font-weight:normal; color:#005696; margin:0px 0px 15px 0px; } #subpage #maincol h2 a { color:#005696; text-decoration:none; } #subpage #maincol h2 a:hover { color:#5d9732; } #subpage #maincol h3 { font-size:20px; font-weight:normal; color:#005696; margin:0px 0px 15px 0px; } #subpage #maincol h3 a { color:#005696; text-decoration:none; } #subpage #maincol h3 a:hover { color:#5d9732; } #subpage #maincol h4 { font-size:17px; font-weight:normal; color:#005696; margin:0px 0px 15px 0px; } #subpage #maincol h4 a { color:#005696; text-decoration:none; } #subpage #maincol h4 a:hover { color:#5d9732; } #subpage #maincol h5 { font-size:14px; font-weight:normal; color:#005696; margin:0px 0px 15px 0px; } #subpage #maincol h5 a { color:#005696; text-decoration:none; } #subpage #maincol h5 a:hover { color:#5d9732; } #subpage #maincol ul { margin:0px 0px 15px 10px; color:#2a2a2a; font-size:14px; list-style-type:square; /*margin:0px 0px 15px 40px;*/} #subpage #maincol ul li { margin:0px 0px 7px 0px; } #subpage #maincol ul li ul { font-size:14px; margin:6px 0px 0px 40px; list-style-type:lower-alpha; } #subpage #maincol ul li ol { font-size:14px; margin:6px 0px 0px 40px; } #subpage #maincol ol { margin:0px 0px 15px 40px; color:#2a2a2a; font-size:14px; } #subpage #maincol ol li { margin:0px 0px 7px 0px; } #subpage #maincol ol li ul { font-size:14px; margin:6px 0px 0px 40px; list-style-type:lower-alpha; } #subpage #maincol ol li ol { font-size:14px; margin:6px 0px 0px 40px; list-style-type:lower-roman; } #subpage #maincol blockquote { font-size:13px; color:#2a2a2a; line-height:27px; margin:0px 40px 20px 30px; font-style:italic; border-left:5px solid #5d9732; padding:0px 0px 0px 10px; } #subpage #maincol small { font-size:12px; line-height:17px; color:#2a2a2a; } /* FORM STYLES */ #subpage #maincol form h6 { font-size:14px; color:#005696; font-weight:normal; margin:0px 0px 0px 0px; } #subpage #maincol form { margin:0px 0px 15px 0px; } #subpage #maincol form input.full { width:508px; height:20px; padding:5px; margin:0px 0px 10px 0px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; } #subpage #maincol form input.half-left { width:243px; height:20px; padding:5px; margin:0px 0px 10px 0px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; float:left; } #subpage #maincol form input.half-right { width:243px; height:20px; padding:5px; margin:0px 0px 10px 0px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; float:right; } #subpage #maincol form input.third-left { width:155px; height:20px; padding:5px; margin:0px 0px 10px 0px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; float:left; } #subpage #maincol form input.third-middle { width:155px; height:20px; padding:5px; margin:0px 0px 10px 9px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; float:left; } #subpage #maincol form input.third-right { width:155px; height:20px; padding:5px; margin:0px 0px 10px 9px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; float:left; } #subpage #maincol form textarea { width:508px; height:100px; padding:5px; margin:0px 0px 10px 0px; background:#f8f8f8; border:1px solid #005696; font-size:15px; color:#005696; font-family:Georgia, Geneva, "Times New Roman", Times, serif; } #subpage #maincol form .submit { width:90px; height:35px; display:block; overflow:hidden; background:url(images/submit-serif.jpg); background-repeat:no-repeat; z-index:10; float:left; margin:0px 0px 0px 166px; } #subpage #maincol form .submit:hover { display:block; background-position:-90px; } #subpage #maincol form .submit button { background:none; border:none; width:90px; height:35px; z-index:-10; } #subpage #maincol form .reset { width:90px; height:35px; display:block; overflow:hidden; background:url(images/reset-serif.jpg); background-repeat:no-repeat; z-index:10; float:left; margin:0px 0px 0px 10px; } #subpage #maincol form .reset:hover { display:block; background-position:-90px; } #subpage #maincol form .reset button { background:none; border:none; width:90px; height:35px; z-index:-10; }