/***** Company: KQED File: main.css - This contains all the main styles for the website. /* CSS Document */ ul, ol { list-style-type: none; } h1, h2, h3, h4, h5, h6, pre, code { font-size: 1em; } ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, x, input, div, span, img, dt, dd, dl { margin: 0px; padding: 0px; } /* * * Main Styles * * */ body#interior-2colr, body#interior-2col-r, body#interior-2col, body#interior2, body#interior, body#home { margin: 0px; font-family: Helvetica, Arial, sans-serif; text-align: center; color: #666; background:url(//a.s.kqed.net/templates/body-bg.png) repeat-x; } body#home { background:url(//a.s.kqed.net/templates/body-home-bg.gif) repeat-x; } /* first of perhaps many colors for use on pages with background colors */ /* These class are added to the body tag - these class rules must be made !important to work */ body.blue-bodybg { background-color:#364d72!important; } /* above rule added to file due to need to have different bg image for homepage and interior pages while faux min-width maintained in IE 6 */ div#page-size { width:1000px !important; margin-right:auto; margin-left:auto; position: relative; z-index: 1; } h1 { font: normal 300%; font-family: Helvetica, Arial, sans-serif; line-height: 51px; } h1.page-title { font-weight:bold; } p { font-size: 93%; line-height: 16px; } a:link, a:visited { color: #fff; text-decoration: none; outline: none; font-family: Helvetica, Arial, sans-serif;} a:hover { text-decoration: underline; font-family: Helvetica, Arial, sans-serif;} div.clearfix { clear: both !important; float: none !important; font-size: 0px !important; } /* counterpoint to print.css .do-not-print: apply this class for elements to ONLY be visible on paper */ .for-print-only { display: none !important; } /* apply this class for elements to ONLY be visible on the mobile site */ .for-mobile-only { display: none !important; } /* mask for modal dialog boxes */ .mask { background-color: #000; opacity: 0.60; filter: alpha(opacity = 60); } .section { margin-bottom: 1em; } /* BG to accommodate link "View the mobile version of this page" */ body#interior-2col-r.device-mobile, body#interior-2col.device-mobile, body#interior2.device-mobile, body#interior.device-mobile, body#home.device-mobile { background-image: url(//a.s.kqed.net/templates/body-bg-mobile2.png); } .link-mobileSite { display: none; padding: 4px 20px 0; height: 20px; font-size: 13px; font-weight: bold; text-align: left; } .link-mobileSite a { color: #666; } .link-mobileSite a:before { content: "\000BB\00A0"; /* Insert right angled-quote and a space */ } .device-mobile .link-mobileSite { display: block; } #footer .link-mobileSite { height: auto; margin-top: 8px; padding: 0; } #footer .link-mobileSite a { color: #fff; } /* * * Wrap Styles * * */ #navigation { background: #fff; padding: 15px 0 0 0; height: 25px; } #tcr-navigation { background-image: url(../../images/tcr-nav_bg.png); background-repeat:repeat-x; padding: 0 0 0 0; height: 109px; margin-bottom:0px; } #header { text-align: left; background: #3c3a33; overflow: hidden; height: 51px; } #secondary { background: #9d9c99; height: 24px; } #secondaryblank { background: #ffffff; height: 24px; position:absolute; top:91px; left: 0px; margin: 0; width:100%; height:25px; } #secondary-placeholder { height: 25px; clear:both; width:100%;} body div#header.container { clear: both; float: left; width: 100%; } #wrap-navigation { position: relative; margin: 0 auto; margin-bottom:0px; padding-bottom:0px;width: 960px;} /* glass changed from 945 to 960 as test */ #navigation ul { float: left; } #tcr-navigation ul {float:left; } #navigation ul li { float: left; padding: 0 1px 0 0; } #tcr-navigation ul li { float: left; padding: 0 1px 0 0; } /* ---- Facebook and Twitter links in top nav ---- */ #nav-social { float: right; margin-top: 2px; width: 126px; } #nav-social a, #nav-social label { float: right; } #nav-social a { margin-left: 4px; } #nav-social label { width: auto; /* to overrule helios.css on the events page. */ padding: 0; /* to overrule helios.css on the events page. */ margin-top: 3px; font: 11px Verdana, Helvetica, Arial, san-serif; } #navigation ul li a { display: block; font-size: 93%; font-weight: bold; line-height: 25px; background: url(//a.s.kqed.net/templates/navigation_bg.png) no-repeat scroll 100% 0; padding: 0 11px 0 0; } #tcr-navigation ul li a { display: block; font-size: 93%; font-weight: bold; line-height: 25px; background: url(../../images/tcr_nav_bg.png) no-repeat scroll 100% 0; padding: 0 13px 0 0; } #navigation ul li a span { display: block; background: url(//a.s.kqed.net/templates/navigation_bg.png) no-repeat scroll 0 0; padding: 0 0 0 10px; } #tcr-navigation ul li a span { display: block; background: url(../../images/tcr_nav_bg.png) no-repeat scroll 0 0; padding: 0 0 0 12px; } #navigation ul li a:hover { color: #fff; background: url(//a.s.kqed.net/templates/navigation_bg.png) no-repeat scroll 100% -26px; text-decoration: none; } #tcr-navigation ul li a:hover { color: #fff; background: url(../../images/tcr_nav_bg.png) no-repeat scroll 100% -26px; text-decoration: none; } #navigation ul li a:hover span { background: url(//a.s.kqed.net/templates/navigation_bg.png) no-repeat scroll 0 -26px; } #tcr-navigation ul li a:hover span { background: url(../../images/tcr_nav_bg.png) no-repeat scroll 0 -26px; } #navigation ul li.on a { color: #f7b918; background: url(//a.s.kqed.net/templates/navigation_bg.png) no-repeat scroll 100% -52px; } #tcr-navigation ul li.on a { color: #fff; background: url(../../images/tcr_nav_bg.png) no-repeat scroll 100% -52px; } #navigation ul li.on a span { background: url(//a.s.kqed.net/templates/navigation_bg.png) no-repeat scroll 0 -52px; } #tcr-navigation ul li.on a span { background: url(../../images/tcr_nav_bg.png) no-repeat scroll 0 -52px; } #wrap-header {no-repeat scroll 0 0; padding: 0 0 0 120px; width: 960px; height: 100%; } #tcr-wrap-header {background: url(../../images/tcr-wrap-header-bg.png) repeat-x scroll 0 0; padding: 0 0 0 120px; width: 960px; height: 100%; } #tcr-logo {height: 109px; float:left;position:relative;top:0px } .tcr-nav-list { float:left;margin-left:0px;position:relative;top:15px; } /* glass changed header-bg.gif to header-bg-final.gif as test */ #header h1 { float: left; color: #f7b918;} /*#header form#search-box { float: right; clear: none; padding: 17px 0 0 0; }*/ #header form#search-box { float: right; clear: none; padding: 17px 0 0 0; margin-right: 95px; } #wrap-masthead-sponsors { height:51px !important; } span.public-media { text-align:left; padding-top:12px; color:#f7b918; font-size:89%; float:left; margin-left:45px; } ul.masthead-sponsors { margin-left:155px; } ul.masthead-sponsors li { width:88px; float:left; margin-top:10px; } li.sponsoredby { width:145px !important; text-align:right; color:#B7B7B7; font-size:11px; vertical-align:bottom; } #wrap-secondary { margin: 0 auto; width: 945px; } #secondary ul { float: left; } #secondary ul li { float: left; padding-right: 1px; } #secondary ul li a { display: block; font-size: 85%; font-weight: bold; line-height:24px; padding: 0 14px; } #secondary ul li a:hover { color: #fff; background: #3c3a33; text-decoration: none; } #secondary ul li.on a { color: #f7b918; background: #3c3a33; } #secondary ul li.on a { color: #f7b918; background: #3c3a33; } #secondary ul li.blank { line-height:24px; padding: 0 14px; } form#search-box { float: right; clear:both; display:inline;} /* added 'display:inline' to fix 'Doubled float margin bug' in IE 6 */ form#search-box input.text { float: left; font-size: 93%; border: 0px; background: url(//a.s.kqed.net/templates/form_search-text_bg.png) no-repeat scroll 0 0; padding: 3px; margin: 0 10px 0 0; width: 122px; height: 12px; } /* changed margin-right from 5 to 1o pixels as required by KQED */ form#search-box input.text:focus, form#search-box input.text:hover { background: url(//a.s.kqed.net/templates/form_search-text_bg.png) no-repeat scroll 0 -19px; } /* @end */ /* @group HTML, Body */ /* @end */ /* @group Layout */ /* Head */ /* Body */ /* Footer */ /* @end */ /* @group Modules */ /* Content */ body#home div#content, body#interior div#content, body#interior2 div#content, body#interior-2col div#content, body#interior-2col-r div#content, body#interior-2colr div#content { width: 960px; /* changed from 962 to 960 052908 */ margin-left: auto; margin-right: auto; text-align: left; padding-top: 20px; } /* above rule added due to need for different spacing on home page and interior pages due to absence or presence of the secondary navigation element */ body#interior div#content div#masthead, body#interior-2col div#content div#masthead, body#interior-2col-r div#content div#masthead, body#interior-2colr div#content div#masthead { margin-bottom:16px; } /* Turn links to buttons */ .bu-round { display: inline-block; padding: 3px 6px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; text-align: center; text-decoration: none; line-height: 1.3em; color: #000; background-color: #ffae00; border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; box-shadow: 2px 2px 5px #888; -webkit-box-shadow: 2px 2px 5px #888; -moz-box-shadow: 2px 2px 5px #888; border: 2px solid #fff; cursor: pointer; } #content #main .bu-round:hover { text-decoration: none; } /* Highlights Box */ div#wrap-highlights { margin:0px; float: left; display: block; } div#highlights { background: url(//a.s.kqed.net/templates/home-feature-final.gif) no-repeat 0 0; width: 572px; height: 327px; padding: 1px 0; float: left; display: inline; } div.highlights-mod { width: 530px; margin: 15px 0 10px 23px; } div.highlights-mod h2 { color: #fff; font-size: 108%; font-weight: bold; text-transform: uppercase; margin-bottom: 10px; } div.highlights-mod h2 span { font-weight: normal; margin-left: 12px; padding-left: 12px; border-left: 1px solid #fff; text-transform: none; } div.highlights-mod-text { width: 265px; float: right; display: inline; } /* div.highlights-mod-text p { font-size:12.5px; } div.highlights-mod-text p.read-more a span.raquo { font-size:12.5px; } div.highlights-mod-text p.read-more { background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat; _background-position: 0px 3px; } div.highlights-mod-text p.read-more a { font-size:12.5px; padding-left:15px; padding-top:4px; } div.highlights-mod h3 { font-weight: bold; font-size: 138.25%; margin-bottom: 6px; line-height: 100%; margin-right:10px; } div.highlights-mod-text h3 { font-weight: bold; font-size: 17px; margin-bottom: 6px; line-height: 19px; margin-right:10px; } div.highlights-mod p { color: #fff; margin-bottom: 6px; line-height: 16px; } */ div.highlights-mod-text h3 { font-weight: bold; font-size: 16px; margin-bottom: 4px; line-height: 18px; margin-right:25px; } div.highlights-mod-text h4 { font-weight: bold; font-size: 11px; margin-bottom: 2px; line-height: 14px; text-transform: uppercase; color: #fff; } div.highlights-mod-text h5 { margin-bottom: 4px; font-weight: bold; font-size: 12px; line-height: 13px; color: #fff; } div.highlights-mod-text p { color: #fff; margin-bottom: 6px; font-size:12px; line-height: 14px; } div.highlights-mod a.image { margin: 0 15px 0 0; border: 1px solid #000; display: block; float: left; display: inline; } div.highlights-mod h3 a:link, div.highlights-mod h3 a:visited { color: #f7b918; text-decoration: none; } div.highlights-mod h3 a:hover { text-decoration: underline; } div.highlights-mod p.read-more { font-weight: bold; margin-bottom: 0px; } div.highlights-mod p.read-more a:link, div.highlights-mod p.read-more a:visited { color: #f7b918; text-decoration: none; } div.highlights-mod p.read-more a:hover { text-decoration:underline; } /* Highlights Menu */ div#highlights-menu { position:absolute; /* glass added this line as test - it sets this element in so that it is not moved by growth in bordering elements */ top:316px; /* glass added this line as test - it sets this element in so that it is not moved by growth in bordering elements */ margin-left:12px; display:block; width:550px; /* glass added this line as test - it helps Safari get the placement right */ } div#highlights-menu ul { width: 540px; /* glass changed from 530 to 540 as test */ /*float: left;*/ display:inline; } div#highlights-menu ul li { width: 128px; /* glass changed from 126 to 128 as test */ margin-right: 2px; margin-left: 2px; float: left; display: inline; } div#highlights-menu ul li img { border: 1px solid #000; } div#highlights-menu ul li a { padding: 8px 8px; display: block; line-height: 14px; font-size:93%; } div#highlights-menu ul li a span.title { padding-top: 4px; display: block; } div#highlights-menu a:link, div#highlights-menu a:visited { color: #fff; text-decoration: none; } div#highlights-menu ul li a:hover, div#highlights-menu ul li.active a { background-color: #6f6c68; } div#highlights-menu a#left-arrow { display: block; background: url(//a.s.kqed.net/templates/arrow-left.gif) no-repeat 0 0; width: 9px; height: 18px; margin-top: 55px; margin-right: 1px; float: left; display: inline; } div#highlights-menu a#right-arrow { display: block; background: url(//a.s.kqed.net/templates/arrow-right.gif) no-repeat 0 0; width: 9px; height: 18px; margin-top: 55px; margin-left: 1px; float: left; display: inline; } /* whatson-mod */ body#home div#whatson-mod, body#interior2 div#whatson-mod { width: 176px; height: 329px; margin-left: 10px; float: left; display: inline; /*jc*/ } body#home div#whatson-mod-wrap { border-left: 1px solid #3c3a33; border-bottom: 1px solid #3c3a33; background: url(//a.s.kqed.net/templates/whatson-mod-angle.gif) no-repeat top right; padding-top: 10px; height: 286px; } body#home div#whatson-mod-wrap { border-left: 1px solid #3c3a33; border-bottom: 1px solid #3c3a33; background: url(//a.s.kqed.net/templates/whatson-mod-angle.gif) no-repeat top right; padding-top: 10px; height: 286px; } body#interior div#whatson-mod-wrap, body#interior-2col div#whatson-mod-wrap, body#interior-2col-r div#whatson-mod-wrap, body#interior-2colr div#whatson-mod-wrap { padding-top: 10px; } body#interior2 #focus1 .module div#whatson-mod-wrap { padding-top: 10px; background:none; padding-top: 10px; height:auto; } div#whatson-mod ul.whatson-mod-tabs { width: 158px; height: 32px; } div#whatson-mod ul.whatson-mod-tabs li, div#whatson-mod ul.whatson-mod-tabs li a { display: block; text-align: center; height: 32px; line-height: 32px; float: left; display: inline; } div#whatson-mod ul.whatson-mod-tabs li a { background-color: #8e8d89; } div#whatson-mod ul.whatson-mod-tabs li#tab-tvr-tv a { width: 58px; margin-right: 1px; } div#whatson-mod ul.whatson-mod-tabs li#tab-tvr-radio a { width: 67px; padding-right: 32px; background: url(//a.s.kqed.net/templates/radio-tab-edge.gif) no-repeat bottom right #8e8d89; } div#whatson-mod ul.whatson-mod-tabs a:link, div#whatson-mod ul.whatson-mod-tabs a:visited { color: #fff; font-weight: bold; } div#whatson-mod ul.whatson-mod-tabs a:hover, div#whatson-mod ul.whatson-mod-tabs a.active { background-color: #3c3a33; text-decoration:none; } div#whatson-mod ul.whatson-mod-tabs li#tab-tvr-radio a:hover, div#whatson-mod ul.whatson-mod-tabs li#tab-tvr-radio a.active { background: url(//a.s.kqed.net/templates/radio-tab-edge.gif) no-repeat top right #3c3a33; text-decoration:none; } div#whatson-mod p.listen-live { width: 146px; height: 30px; background: url(//a.s.kqed.net/templates/listen-live.gif) no-repeat 0 0; } div#sidebar1 div.module p.listen-live, div#sidebar2 div.module p.listen-live { width: 146px; height: 30px; background: url(//a.s.kqed.net/templates/listen-live.gif) no-repeat 0 0; } div#whatson-mod p.listen-live a { display: block; width: 146px; height: 30px; text-indent: -9000px; } div#sidebar1 div.module p.listen-live a, div#sidebar2 div.module p.listen-live a { display: block; width: 146px; height: 30px; text-indent: -9000px; } body#home div#whatson-mod ul.show-times, body#interior2 div#whatson-mod ul.show-times { background-color: #eaeae9; padding: 6px 10px 1px 10px; margin-right: 1px; /*jc*/ } div#sidebar1 div.module ul.show-times, div#sidebar2 div.module ul.show-times { background-color: #eaeae9; padding: 6px 10px 1px 10px; margin-right: 0px; margin-bottom:0px; } div#whatson-mod ul.show-times span { display: block; } div#sidebar1 div.module ul.show-times span , div#sidebar2 div.module ul.show-times span { display: block; } div#whatson-mod ul.show-times span.time { color: #000; font-weight: bold; font-size: 93%; } div#sidebar1 div.module ul.show-times span.time, div#sidebar2 div.module ul.show-times span.time { color: #000; font-weight: bold; font-size: 93%; } div#whatson-mod ul.show-times span.title { font-size: 108%; } div#sidebar1 div.module ul.show-times span.title, div#sidebar2 div.module ul.show-times span.title { font-size: 108%; } div#whatson-mod ul.show-times span.subtitle { font-size: 93%; line-height: 15px; _padding-bottom: 12px; } div#sidebar1 div.module ul.show-times span.subtitle, div#sidebar2 div.module ul.show-times span.subtitle { font-size: 93%; } body#home div#whatson-mod ul.show-times li, body#interior2 div#whatson-mod ul.show-times li { margin-bottom: 7px; } div#whatson-mod ul.show-links { font-size: 85%; margin: 5px 10px; text-align: right; font-weight: bold; } div#sidebar1 div.module ul.show-links, div#sidebar2 div.module ul.show-links { font-size: 85%; margin: 5px 10px; text-align: right; font-weight: bold; } div#whatson-mod div.whatson-mod-content { padding: 0 10px 5px 10px; } div#sidebar1 div.module div.whatson-mod-content, div#sidebar2 div.module div.whatson-mod-content { padding: 0 10px 5px 10px; } div#whatson-mod div.whatson-mod-content p { font-size: 85%; line-height: 14px; color: #000; } div#sidebar1 div.module div.whatson-mod-content p, div#sidebar2 div.module div.whatson-mod-content p { font-size: 85%; line-height: 14px; color: #000; } div#whatson-mod a:link, div#whatson-mod a:visited { color: #114999; } div#sidebar1 div.module a:link, div#sidebar1 div.module a:visited, div#sidebar2 div.module a:link, div#sidebar2 div.module a:visited { color: #114999; } div#sidebar1 div.module ul.whatson, div#sidebar2 div.module ul.whatson { text-align:left; margin:0px 0px 0px 0px; background: #f5f5f5; padding-top:3px; padding-bottom:2px; background-color: #ffffff; } div#sidebar1 div.module ul.whatson li.whatson-more, div#sidebar2 div.module ul.whatson li.whatson-more { background-color: #ffffff; color: #3c3a33; font-size:85%; margin-top:0px; line-height:150%; margin-left:10px; } /* Home Above-the-Fold Right Rail */ #home-right-rail { float: right; position: relative; width: 192px; } /* KQED Member Spot */ #kqed-member-spot { /* margin-right: -10px; */ /* float: right; */ position: relative; } #kqed-member-spot a { font-size: 0; line-height: 0; } #kqed-member-spot div { position: absolute; bottom: 3px; left: 0; /* IE */ margin-left: 52px; } #kqed-member-spot p { margin: 0.2em 0 0.2em; color: #fff; } #home-right-rail #kqed-member-spot { margin-right: 0; margin-bottom: 10px; } /* Home PFS Module */ #home-mod-pfs { position: relative; margin-bottom: 10px; } #home-mod-pfs a { font-size: 0; line-height: 0; } /* Home Donate Module */ #home-mod-donate { position: relative; } #home-mod-donate a { font-size: 0; line-height: 0; } /* QED Up Signup Form */ #qedup-signup-mod { clear: right; float: right; width: 100%; background-color: #3c3a33; } #qedup-signup-mod form { margin: 4px; padding: 7px 0 4px 8px; border: 1px solid #8a8985; } #home #qedup-signup-mod form { min-height: 63px; } #qedup-signup-mod h3 { margin-right: 8px; margin-bottom: 0.2em; font-weight: bold; color: #f7b918; } #qedup-signup-mod h3 img { margin-left: 0.2em; } #qedup-signup-mod p { margin-right: 8px; margin-bottom: 0.6em; font-size: 12px; line-height: 15px; color: #fff; } #qedup-signup-mod #cons_email { float: left; width: 93px; color: #333; } *+html #qedup-signup-mod #cons_email { margin-left: -4px; margin-bottom: -8px; /* IE7 */ } #qedup-signup-mod #ACTION_SUBMIT_SURVEY_RESPONSE { float: left; margin-top: 1px; margin-left: 4px; } *+html #qedup-signup-mod #ACTION_SUBMIT_SURVEY_RESPONSE { margin-bottom: -8px; /* IE7 */ } /* show times module */ div.module ul.show-times { background-color: #eaeae9; padding: 6px 10px 1px 10px; margin-right: 1px; } div.module ul.show-times span { display: block; } div.module ul.show-times span.time { color: #000; font-weight: bold; font-size: 93%; } /* center-well-modules */ div.center-well-module-bordered { margin-bottom:20px; width:518px; clear:both; display:block; } div.center-well-module-unbordered { margin-bottom:20px; width:518px; clear:both; display:block; padding:1px; } div.center-well-module-unbordered2 { background: url(//a.s.kqed.net/templates/center-well-module-background.png) no-repeat 0; margin-bottom:20px; width:520px; clear:both; height:278px; display:block; } div.center-well-module-unbordered2-notched { background: url(//a.s.kqed.net/templates/center-well-module-background-notched.png) no-repeat 0; margin-bottom:20px; width:520px; clear:both; height:278px; display:block; } .innerbg { margin:4px!important; padding:4px!important; } .innerbg2 { display:none; } .white-bg { background:#ffffff!important; } .darkgrey-bg { background:#3c3a33!important; } .mediumgrey-bg { background:#6d6b66!important; } .blue-bg { background:#526168!important; } /*.purple-bg { background:#393653!important; } PUT BACK AFTER ELECTION */ .purple-bg { background:#1f2b4d!important; } .green-bg { background:#4f5d40!important; } .brown-bg { background-color:#5f4c39!important; } .ltblue-bg { background:#D3D7DC!important; } .lightgrey-border { border:1px solid #b2b2b0!important; } .white-bg div.center-well-module-content-left p, .white-bg div.center-well-module-content-right p, .white-bg div.center-well-module-content-left h4, .white-bg div.center-well-module-content-right h4, .white-bg div.center-well-module-content-left p, .white-bg div.center-well-module-content-right span.text, .white-bg div.center-well-module-content-left span.text, .twin-light-mod-left p, .twin-light-mod-left h5, .twin-light-mod-right p, .twin-light-mod-right h5 { color:#000000!important; } .ltblue-bg div.center-well-module-content-left p, .ltblue-bg div.center-well-module-content-right p, .ltblue-bg div.center-well-module-content-left h4, .ltblue-bg div.center-well-module-content-right h4, .ltblue-bg div.center-well-module-content-left p, .ltblue-bg div.center-well-module-content-right span.text, .ltblue-bg div.center-well-module-content-left span.text { color:#000000!important; } .darkgrey-bg div.center-well-module-content-right p, .mediumgrey-bg div.center-well-module-content-right p, .blue-bg div.center-well-module-content-right p, .purple-bg div.center-well-module-content-right p, .green-bg div.center-well-module-content-right p, .brown-bg div.center-well-module-content-right p, .darkgrey-bg div.center-well-module-content-left p, .mediumgrey-bg div.center-well-module-content-left p, .blue-bg div.center-well-module-content-left p, .purple-bg div.center-well-module-content-left p, .green-bg div.center-well-module-content-left p, .brown-bg div.center-well-module-content-left p, .darkgrey-bg div.center-well-module-content-right h4, .mediumgrey-bg div.center-well-module-content-right h4, .blue-bg div.center-well-module-content-right h4, .purple-bg div.center-well-module-content-right h4, .green-bg div.center-well-module-content-right h4, .brown-bg div.center-well-module-content-right h4, .darkgrey-bg div.center-well-module-content-left h4, .mediumgrey-bg div.center-well-module-content-left h4, .blue-bg div.center-well-module-content-left h4, .purple-bg div.center-well-module-content-left h4, .green-bg div.center-well-module-content-left h4, .brown-bg div.center-well-module-content-left h4, .darkgrey-bg div.center-well-module-content-right span.text, .mediumgrey-bg div.center-well-module-content-right span.text, .blue-bg div.center-well-module-content-right span.text, .purple-bg div.center-well-module-content-right span.text, .green-bg div.center-well-module-content-right span.text, .brown-bg div.center-well-module-content-right span.text, .darkgrey-bg div.center-well-module-content-left span.text, .mediumgrey-bg div.center-well-module-content-left span.text, .blue-bg div.center-well-module-content-left span.text, .purple-bg div.center-well-module-content-left span.text, .green-bg div.center-well-module-content-left span.text, .brown-bg div.center-well-module-content-left span.text, div.center-well-module-unbordered2 div.center-well-module-content-left p, div.center-well-module-unbordered2 div.center-well-module-content-left h4, div.center-well-module-unbordered2 div.center-well-module-content-left span.text, div.center-well-module-unbordered2 div.center-well-module-content-right p, div.center-well-module-unbordered2 div.center-well-module-content-right h4, div.center-well-module-unbordered2 div.center-well-module-content-right span.text, div.center-well-module-unbordered2-notched div.center-well-module-content-left p, div.center-well-module-unbordered2-notched div.center-well-module-content-left h4, div.center-well-module-unbordered2-notched div.center-well-module-content-left span.text, div.center-well-module-unbordered2-notched div.center-well-module-content-right p, div.center-well-module-unbordered2-notched div.center-well-module-content-right h4, div.center-well-module-unbordered2-notched div.center-well-module-content-right span.text, .twin-dark-mod-left p, .twin-dark-mod-right p, .twin-purple-mod-left p, .twin-purple-mod-right p, .twin-dark-mod-left h5, .twin-dark-mod-right h5, .twin-purple-mod-left h5, .twin-purple-mod-right h5 { color:#ffffff!important; } .darkgrey-bg div.center-well-module-content-left a, .darkgrey-bg div.module-img-left a, .darkgrey-bg div.center-well-module-content-right a, .darkgrey-bg div.module-img-right a, .mediumgrey-bg div.center-well-module-content-left a, .mediumgrey-bg div.module-img-left a, .mediumgrey-bg div.center-well-module-content-right a, .mediumgrey-bg div.module-img-right a, .brown-bg div.center-well-module-content-left a, .brown-bg div.module-img-left a, .brown-bg div.center-well-module-content-right a, .brown-bg div.module-img-right a, .green-bg div.center-well-module-content-left a, .green-bg div.module-img-left a, .green-bg div.center-well-module-content-right a, .green-bg div.module-img-right a, .blue-bg div.center-well-module-content-left a, .blue-bg div.module-img-left a, .blue-bg div.center-well-module-content-right a, .blue-bg div.module-img-right a, .purple-bg div.center-well-module-content-left a, .purple-bg div.module-img-left a, .purple-bg div.center-well-module-content-right a, .purple-bg div.module-img-right a div.center-well-module-unbordered2 div.center-well-module-content-left a, div.center-well-module-unbordered2 div.module-img-left a, div.center-well-module-unbordered2 div.center-well-module-content-right a, div.center-well-module-unbordered2 div.module-img-right a div.center-well-module-unbordered2-notched div.center-well-module-content-left a, div.center-well-module-unbordered2-notched div.module-img-left a, div.center-well-module-unbordered2-notched div.center-well-module-content-right a, div.center-well-module-unbordered2-notched div.module-img-right a { color: #f7b918!important; } div.center-well-module-unbordered2 .module-img-left img, div.center-well-module-unbordered2 .module-img-right img, div.center-well-module-unbordered2-notched .module-img-left img, div.center-well-module-unbordered2-notched .module-img-right img { border:none!important; margin-top:5px; margin-left:1px; } div.center-well-module-bordered .module-img-left img, div.center-well-module-bordered .module-img-right img, div.center-well-module-unbordered .module-img-left img, div.center-well-module-unbordered .module-img-right img { border:none!important; margin-top:0px; margin-bottom:0px; padding-bottom:0px; } .module-img-left { margin-right:15px; float:left; } .module-img-right { margin-left:15px; float:right; } .wrapped-img-left { position:relative; left:-15px; top:-10px; margin-right:0px; } .wrapped-img-right { position:relative; right:-15px; top:-10px; } .content-nowrap { overflow: hidden; /* allows firefox and safari to keep conent from wrapping under floated div */ } div.center-well-module-bordered h4, div.center-well-module-unbordered h4, div.center-well-module-unbordered2 h4, div.center-well-module-unbordered2-notched h4 { font-size: 14px; font-weight: bold; margin-bottom: 4px; margin-top:10px; } div.center-well-module-bordered p, div.center-well-module-unbordered p, div.center-well-module-unbordered2 p, div.center-well-module-unbordered2-notched p { font-size:13px!important; line-height:17px!important; padding-right:15px; } div.center-well-module-content-left { padding-left:15px; padding-right:15px; clear:none; float:none; /* changed to none here, and added left float to mainIE */ padding-bottom:0px!important; margin-bottom:0px!important; } div.center-well-module-content-right { padding-left:15px; padding-right:15px; clear:none; float:none; /* changed to none here, and added right float to mainIE to prevent div positioning abnormallities*/ padding-bottom:0px!important; margin-bottom:0px!important; } div.center-well-module-content-left ul, div.center-well-module-content-left ol, div.center-well-module-content-right ul, div.center-well-module-content-right ol { margin-top:5px; margin-bottom:10px; } div.center-well-module-content-left ul li.blue-arrow a:link, div.center-well-module-content-left ul li.blue-arrow a:visited, div.center-well-module-content-right ul li.blue-arrow a:link, div.center-well-module-content-right ul li.blue-arrow a:visited { padding: 0px 0px 0px 15px; background: url(//a.s.kqed.net/templates/blue-arrow-trans.gif) no-repeat 0 2px; margin-left:1px; display:block; } div.center-well-module-content-left ul li.yellow-arrow a:link, div.center-well-module-content-left ul li.yellow-arrow a:visited, div.center-well-module-content-right ul li.yellow-arrow a:link, div.center-well-module-content-right ul li.yellow-arrow a:visited { padding: 0px 0px 0px 15px; background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat 0 0px; margin-left:1px; display:block; } /* serve to Safari \*/ /* this permits the list links to have a visible bullet in Safari when on the right of an image - but this loses the "block" styling in the list so wrapping is not proper */ body:first-of-type div.center-well-module-content-right ul li.blue-arrow a:link, body:first-of-type div.center-well-module-content-right ul li.blue-arrow a:visited { display:inline; } /* end serve to Safari */ .white-bg div.module-img-right p.single-arrow a { display: inline; background: url(//a.s.kqed.net/templates/blue-arrow.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; text-align:right; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } .white-bg div.center-well-module-content-left p.listen-link a, .white-bg div.module-img-left p.listen-link a { display: inline; background: url(//a.s.kqed.net/templates/listen-link-blue.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; /*margin-left:10px;*/ margin-top:5px!important; margin-bottom:5px!important; } .white-bg div.center-well-module-content-right p.listen-link a, .white-bg div.module-img-right p.listen-link a { display: inline; background: url(//a.s.kqed.net/templates/listen-link-blue.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } .white-bg div.module-img-right p.listen-link a:hover { margin-right:10px!important; } .darkgrey-bg div.center-well-module-content-left p.listen-link a, .darkgrey-bg div.module-img-left p.listen-link a, .mediumgrey-bg div.center-well-module-content-left p.listen-link a, .mediumgrey-bg div.module-img-left p.listen-link a, .brown-bg div.center-well-module-content-left p.listen-link a, .brown-bg div.module-img-left p.listen-link a, .blue-bg div.center-well-module-content-left p.listen-link a, .blue-bg div.module-img-left p.listen-link a, .purple-bg div.center-well-module-content-left p.listen-link a, .purple-bg div.module-img-left p.listen-link a, .green-bg div.center-well-module-content-left p.listen-link a, .green-bg div.module-img-left p.listen-link a, div.center-well-module-unbordered2 div.module-img-left p.listen-link a, div.center-well-module-unbordered2 div.module-img-right p.listen-link a, .darkgrey-bg div.center-well-module-content-right p.listen-link a, .darkgrey-bg div.module-img-right p.listen-link a, .mediumgrey-bg div.center-well-module-content-right p.listen-link a, .mediumgrey-bg div.module-img-right p.listen-link a, .brown-bg div.center-well-module-content-right p.listen-link a, .brown-bg div.module-img-right p.listen-link a, .blue-bg div.center-well-module-content-right p.listen-link a, .blue-bg div.module-img-right p.listen-link a, .purple-bg div.center-well-module-content-right p.listen-link a, .purple-bg div.module-img-right p.listen-link a, .green-bg div.center-well-module-content-right p.listen-link a, .green-bg div.module-img-right p.listen-link a, div.center-well-module-unbordered2 div.module-img-right p.listen-link a, div.center-well-module-unbordered2 div.module-img-right p.listen-link a, div.center-well-module-unbordered2 div.center-well-module-content-left p.listen-link a, div.center-well-module-unbordered2 div.center-well-module-content-right p.listen-link a, div.center-well-module-unbordered2-notched div.module-img-left p.listen-link a, div.center-well-module-unbordered2-notched div.module-img-right p.listen-link a, div.center-well-module-unbordered2 div.center-well-module-content-left p.listen-link a, div.center-well-module-unbordered2-notched div.center-well-module-content-right p.listen-link a { display: inline; background: url(//a.s.kqed.net/templates/listen-link-yellow-trans.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; color: #f7b918!important; } .darkgrey-bg div.center-well-module-content-right p.listen-link a, .darkgrey-bg div.module-img-right p.listen-link a, .mediumgrey-bg div.center-well-module-content-right p.listen-link a, .mediumgrey-bg div.module-img-right p.listen-link a .brown-bg div.center-well-module-content-right p.listen-link a, .brown-bg div.module-img-right p.listen-link a, .blue-bg div.center-well-module-content-right p.listen-link a, .blue-bg div.module-img-right p.listen-link a, , .purple-bg div.center-well-module-content-right p.listen-link a, .purple-bg div.module-img-right p.listen-link a, .green-bg div.center-well-module-content-right p.listen-link a, .green-bg div.module-img-right p.listen-link a { display: inline; background: url(//a.s.kqed.net/templates/listen-link-yellow-trans.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; color: #f7b918!important; text-align:right; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } .darkgrey-bg div.module-img-right p.listen-link a:hover, .mediumgrey-bg div.module-img-right p.listen-link a:hover, .blue-bg div.module-img-right p.listen-link a:hover, .green-bg div.module-img-right p.listen-link a:hover, .brown-bg div.module-img-right p.listen-link a:hover, .purple-bg div.module-img-right p.listen-link a:hover { margin-right:10px!important; } div.module-img-left p.listen-link a { margin-left:10px; } div.module-img-right p.listen-link { text-align:right; margin-right:-10px!important; } /* begin watch link styles */ .white-bg div.center-well-module-content-left p.watch-link a, .white-bg div.module-img-left p.watch-link a { display: inline; background: url(//a.s.kqed.net/templates/watch-link-blue-trans.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; /*margin-left:10px;*/ margin-top:5px!important; margin-bottom:5px!important; } .white-bg div.center-well-module-content-right p.watch-link a, .white-bg div.module-img-right p.watch-link a { display: inline; background: url(//a.s.kqed.net/templates/watch-link-blue-trans.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } .darkgrey-bg div.center-well-module-content-left p.watch-link a, .darkgrey-bg div.module-img-left p.watch-link a, .mediumgrey-bg div.center-well-module-content-left p.watch-link a, .mediumgrey-bg div.module-img-left p.watch-link a, .brown-bg div.center-well-module-content-left p.watch-link a, .brown-bg div.module-img-left p.watch-link a, .blue-bg div.center-well-module-content-left p.watch-link a, .blue-bg div.module-img-left p.watch-link a, .purple-bg div.center-well-module-content-left p.watch-link a, .purple-bg div.module-img-left p.watch-link a, .green-bg div.center-well-module-content-left p.watch-link a, .green-bg div.module-img-left p.watch-link a, div.center-well-module-unbordered2 div.module-img-left p.watch-link a, div.center-well-module-unbordered2 div.module-img-right p.watch-link a, .darkgrey-bg div.center-well-module-content-right p.watch-link a, .darkgrey-bg div.module-img-right p.watch-link a, .mediumgrey-bg div.center-well-module-content-right p.watch-link a, .mediumgrey-bg div.module-img-right p.watch-link a, .brown-bg div.center-well-module-content-right p.watch-link a, .brown-bg div.module-img-right p.watch-link a, .blue-bg div.center-well-module-content-right p.watch-link a, .blue-bg div.module-img-right p.watch-link a, .purple-bg div.center-well-module-content-right p.watch-link a, .purple-bg div.module-img-right p.watch-link a, .green-bg div.center-well-module-content-right p.watch-link a, .green-bg div.module-img-right p.watch-link a, div.center-well-module-unbordered2 div.module-img-right p.watch-link a, div.center-well-module-unbordered2 div.module-img-right p.watch-link a, div.center-well-module-unbordered2 div.center-well-module-content-left p.watch-link a, div.center-well-module-unbordered2 div.center-well-module-content-right p.watch-link a, div.center-well-module-unbordered2-notched div.module-img-left p.watch-link a, div.center-well-module-unbordered2-notched div.module-img-right p.watch-link a, div.center-well-module-unbordered2 div.center-well-module-content-left p.watch-link a, div.center-well-module-unbordered2-notched div.center-well-module-content-right p.watch-link a { display: inline; background: url(//a.s.kqed.net/templates/watch-link-yellow-trans.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; color: #f7b918!important; } .darkgrey-bg div.center-well-module-content-right p.watch-link a, .darkgrey-bg div.module-img-right p.watch-link a, .brown-bg div.center-well-module-content-right p.watch-link a, .brown-bg div.module-img-right p.watch-link a, .blue-bg div.center-well-module-content-right p.watch-link a, .blue-bg div.module-img-right p.watch-link a { display: inline; background: url(//a.s.kqed.net/templates/watch-link-yellow-trans.gif) no-repeat 0; padding-left: 21px; font-size: 14px; font-weight: bold; color: #f7b918!important; text-align:right; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } div.module-img-left p.watch-link a { margin-left:10px; } div.module-img-right p.watch-link { text-align:right; margin-right:-10px!important; } /* end watch link styles */ .darkgrey-bg div.center-well-module-content-left p.single-arrow a, .darkgrey-bg div.module-img-left p.single-arrow a, .mediumgrey-bg div.center-well-module-content-left p.single-arrow a, .mediumgrey-bg div.module-img-left p.single-arrow a, .brown-bg div.center-well-module-content-left p.single-arrow a, .brown-bg div.module-img-left p.single-arrow a, .green-bg div.center-well-module-content-left p.single-arrow a, .green-bg div.module-img-left p.single-arrow a, .blue-bg div.center-well-module-content-left p.single-arrow a, .blue-bg div.module-img-left p.single-arrow a, .purple-bg div.center-well-module-content-left p.single-arrow a, .purple-bg div.module-img-left p.single-arrow a { display: inline; background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat 0 0px; padding-left: 21px; font-size: 14px; font-weight: bold; color: #f7b918!important; margin-top:5px!important; margin-bottom:5px!important; } .darkgrey-bg div.center-well-module-content-right p.single-arrow a, .darkgrey-bg div.module-img-right p.single-arrow a, .mediumgrey-bg div.center-well-module-content-right p.single-arrow a, .mediumgrey-bg div.module-img-right p.single-arrow a, .brown-bg div.center-well-module-content-right p.single-arrow a, .brown-bg div.module-img-right p.single-arrow a, .green-bg div.center-well-module-content-right p.single-arrow a, .green-bg div.module-img-right p.single-arrow a, .blue-bg div.center-well-module-content-right p.single-arrow a, .blue-bg div.module-img-right p.single-arrow a, .purple-bg div.center-well-module-content-right p.single-arrow a, .purple-bg div.module-img-right p.single-arrow a { display: inline; background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat 0 0px; padding-left: 21px; font-size: 14px; font-weight: bold; color: #f7b918!important; text-align:right; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } div.module-img-left p.single-arrow a { margin-left:10px; } div.module-img-right p.single-arrow { text-align:right; margin-right:-10px!important; } .white-bg div.center-well-module-content-left p.single-arrow a, .white-bg div.module-img-left p.single-arrow a { display: inline; background: url(//a.s.kqed.net/templates/blue-arrow-trans.gif) no-repeat 0 1px; padding-left: 21px; font-size: 14px; font-weight: bold; margin-top:5px!important; margin-bottom:5px!important; } .white-bg div.center-well-module-content-right p.single-arrow a, .white-bg div.module-img-right p.single-arrow a { display: inline; background: url(//a.s.kqed.net/templates/blue-arrow-trans.gif) no-repeat 0 1px; padding-left: 21px; font-size: 14px; font-weight: bold; text-align:right; margin-right:10px; margin-top:5px!important; margin-bottom:5px!important; } .white-bg div.module-img-left p.single-arrow a { margin-left:10px; } .white-bg div.module-img-right p.single-arrow { text-align:right; margin-right:-10px!important; } div.module-img-left p, div.module-img-right p { margin-top:3px!important; margin-bottom:3px!important; } /* Main */ body#home div#main { width: 440px; /* glass changed 430 to 440 as test */ float: left; display: inline; padding-bottom: 20px; } body#interior div#main div.innermain { background-color:#ffffff; /* width:480px; */ padding-left:19px; padding-right:19px; padding-top:20px; border:1px solid #3c3a33; } body#interior div#main div.innermain-noborder { background-color:#ffffff; } div.20pxpad { padding:20px; } body#interior-2col div#main { width: 740px; float: left; display: inline; margin-left: 10px; margin-right: 0px; } body#interior-2colr div#main { width: 740px; float: left; display: inline; margin-right: 10px; margin-left: 0px; } body#interior-2col-r div#main { width: 640px; float: left; display: inline; margin-right: 10px; margin-left: 0px; } body#interior2 div#main { width: 420px; float: left; display: inline; } body#interior div#main { width: 520px; /* glass changed from 512 to 520 as test */ _width: 520px !important; float: left; display: inline; margin-left: 10px; _padding-left: 5px; margin-right: 10px; /* glass added this line as test */ margin-bottom:20px!important; _padding-bottom:20px!important; } body#interior div#main p, div#out-of-nav p, body#interior-2col div#main p, body#interior-2col-r div#main p, body#interior-2colr div#main p { line-height: 17px; } body#interior div#main a:link, body#interior div#main a:visited, body#interior-2col div#main a:link, body#interior-2col div#main a:visited, body#interior-2col-r div#main a:link, body#interior-2col-r div#main a:visited, body#interior-2colr div#main a:link, body#interior-2colr div#main a:visited, div#out-of-nav a:link, div#out-of-nav a:visited { color: #114999; text-decoration: none; } body#interior div#main a:hover, body#interior-2col div#main a:hover, body#interior-2col-r div#main a:hover, body#interior-2colr div#main a:hover, div#out-of-nav a:hover { text-decoration: underline; margin-right: 0px; } body#interior div#main p.more-arts-features a:hover, body#interior-2col div#main p.more-arts-features a:hover, body#interior-2col-r div#main p.more-arts-features a:hover, body#interior-2colr div#main p.more-arts-features a:hover { text-decoration: underline; margin-right: 2px; } body#interior div#main p.feature-text, body#interior-2col div#main p.feature-text, body#interior-2col-r div#main p.feature-text, body#interior-2colr div#main p.feature-text { font-size: 16px; margin-bottom: 10px; line-height:19px; } div#out-of-nav { width: 520px; padding-left: 10px; padding-right: 10px; } div#pledge-catalog-header { width:720px; margin:0px; padding:10px 10px 10px 10px; background-color:#5f91b1; color:#ffffff; } div#pledge-catalog-header h3 a { color:#D0E2EE!important; } div#pledge-catalog-header h2 { color:#ffffff!important; font-size:22px !important; font-weight:bold !important; margin-bottom:10px !important; text-transform:none !important; } div#pledge-catalog-header p { color:#FFFFFF !important; font-size:14px !important; font-weight:bold; line-height:16px; } div#pledge-catalog-header p a { color:#F7B918 !important; } div#pledge-catalog-header div.larger-left-well { float:left; width:auto; padding-left:10px; padding-bottom:5px; position:relative; display:block; } div#pledge-catalog-header div.larger-left-well p { max-width:440px; } div#pledge-catalog-header div.smaller-right-well { float:right; width:auto; position:relative; display:block; } div#pledge-catalog-header div.smaller-right-well span.sub-text { color:#D0E2EE !important; font-size:12px !important; } div#pledge-catalog-header form#pledge-select2 { clear:left; float:none; margin-top:0px!important; padding-top:0px!important; position:relative; } div#pledge-catalog-header form#pledge-select2 .select { width:190px; border:1px #3c3a33 solid!important; position:relative; top:6px; } div#pledge-catalog-header form#pledge-select2 .go-button { padding-left:5px; position:relative; top:5px; border:none!important; } div.search-result-bar-top { width:740px; margin:0px; padding:0px; background-color:#386785; } div.search-result-bar-bottom { width:740px; margin:0px 0px 20px 0px; padding:0px; background-color:#386785; min-height:30px; clear:both; } div.search-result-bar-top div.larger-left-well, div.search-result-bar-bottom div.larger-left-well { float:left; width:465px; padding-left:10px; position:relative; } div.search-result-bar-top div.smaller-right-well, div.search-result-bar-bottom div.smaller-right-well { float:right; width:230px; position:relative; display:block; min-height:30px; } div.search-result-bar-top p.search-results, div.search-result-bar-bottom p.search-results { margin-top:6px; color:#FFFFFF!important; margin-left:10px; margin-bottom:6px!important; } div.search-result-bar-top p span.pagination, div.search-result-bar-bottom p span.pagination { margin-top:6px; float:left; color:#ffffff!important; text-align:left; word-spacing: +1px;} div.search-result-bar-top p span.prev-next, div.search-result-bar-bottom p span.prev-next { margin-top:6px; float:right; text-align:right; font-weight:bold; margin-right:20px; word-spacing:+1px; } div.search-result-bar-top p span.prev-next a:link, div.search-result-bar-top p span.prev-next a:visited, div.search-result-bar-bottom p span.prev-next a:link, div.search-result-bar-bottom p span.prev-next a:visited { text-decoration:none; color:#f7b918!important; } div.search-result-bar-top p span.prev-next a:hover, div.search-result-bar-bottom p span.prev-next a:hover { text-decoration:underline; color:#f7b918!important; } /* Google CSE Results */ #main .cse .gsc-control-cse, #main .gsc-control-cse { padding: 0; } #main .gsc-result .gs-title { height: auto; } .grow-together-bg { background:url(//a.s.kqed.net/templates/grow-together-pledge-module-bg.png); } div.pledge-cat-module-single { background-color:#ebecec; margin:0px; width:740px; display:block; position:relative; } div.pledge-cat-module-single h2 { margin:0px; width:695px; font-size:18px!important; font-weight:bold; padding-left:20px; padding-right:20px; padding-top:12px; min-height:38px; font-family:Helvetica,Arial,sans-serif; color:#6d6f71!important; text-transform:none!important; } div.pledge-cat-module-single h2 span.value { color:#3c3a33!important; } div.pledge-cat-content-wrap { margin:0px; padding:6px 0px 50px 0px; display:block; position:relative; } div.pledge-cat-content-wrap div.select-gift-well { width:120px; min-height:120px; float:left; clear:left; } div.pledge-cat-content-wrap div.select-gift-well input.select-gift-img { width:90px; margin-left:15px; border:none; padding-top:40px; } div.pledge-cat-content-wrap div.select-gift-well button { display: block; width: 90px; height: 25px; margin: 40px auto auto 15px; background: url(//a.s.kqed.net/button/select-gift-button-active-90x25.gif) no-repeat; text-indent: -1000em; cursor: pointer; border: 0; } div.pledge-cat-content-wrap div.gift-img-well img { border:1px solid #3c3a33; } div.pledge-cat-content-wrap div.gift-img-well span.larger-image-link a { color:#2a66d4!important; font-size:10px; margin-left:32px; } div.pledge-cat-content-wrap div.gift-text-well { float:right; clear:none; width:475px; } div.pledge-cat-content-wrap div.gift-text-well p { width:375px; } div.pledge-cat-content-wrap div.gift-text-well p a.plus-open, div.pledge-cat-content-wrap div.gift-text-well p a.plus-open:hover { color:#2a66d4!important; font-weight:bold; text-decoration:none!important; font-size:14px; } div.pledge-cat-content-wrap div.gift-text-well .gift-title { margin-bottom: 0.2em; font-size:14px; font-weight:bold; color:#6d6f71; } div.pledge-cat-content-wrap div.gift-text-well form { margin-top: 8px; } .cat-highlight { background-color:#e0e2e2!important; } div.pledge-cat-multi-outer-wrap { width:700px; margin:0px; padding:0px 20px; background-color:#F0F1F1; position:relative; display:block; clear:left; } div.pledge-cat-multi-outer-wrap h2 { background-color:#F0F1F1; margin:0px; width:700px; font-size:18px!important; font-weight:bold; padding-top:17px; height:35px; font-family:Helvetica,Arial,sans-serif; color:#6d6f71!important; text-transform:none!important; } div.pledge-cat-multi-outer-wrap h2 span.value { color:#3c3a33!important; } div.wrapping-div { border-right:1px solid #a8a9a1; border-left:1px solid #a8a9a1; border-bottom:1px solid #a8a9a1; position:relative; display:block; } div.continue-wrapping-div { border-bottom:1px solid #a8a9a1; position:relative; display:block; background: #e0e2e2 url(//a.s.kqed.net/templates/continue-wrap-bg.png); margin-top:0px!important;} div.continue-outer-wrap { margin-left:64px;;width:634px; } div.continue-button-wrap { width:150px;margin-left:auto;margin-right:auto;margin-top:10px;margin-bottom:12px; } div.continue-button-wrap button { display: inline-block; width: 186px; height: 30px; background: url(//a.s.kqed.net/button/continue-pledge-button-active-186x30.gif) no-repeat; text-indent: -1000em; cursor: pointer; border: 0; overflow: hidden; /* IE6, 7 */ _display: block; /* IE6 */ } *+html div.continue-button-wrap button { /* IE7 */ font-size: 0; line-height: 0; display: block; } div.pledge-cat-multi-module-wrap { width:700px; margin:0px; } div.select-gift-well-wrap { background-color:#bcc1c4; height:100%; width:64px; float:left; } div.gift-text-well-wrap { background-color:#ffffff; height:100%; width:470px; float:right; padding:5px 0px 20px 0px; position:relative; display:block; } div.gift-img-well-wrap { background-color:#ffffff; height:100%; width:145px; float:left; } div.pledge-cat-multi-module { margin:0px; width:700px; display:block; position:relative; background:url(//a.s.kqed.net/templates/grey-white-multi-module-bg.png); } div.pledge-cat-multi-module h2 { background-color:#E0E2E2; margin:0px!important; width:680px; font-size:14px; font-weight:bold; padding-left:20px; padding-top:9px; height:43px; font-family:Helvetica,Arial,sans-serif; color:#3c3a33; border-bottom:1px solid #a8a9a1; } div.pledge-cat-multi-module h2 span.instruction { color:#990000; font-size:12px; font-weight:normal; } div.gift-description-well div.gift-text-well select { margin-top:0px; } div.pledge-cat-multi-content-wrap { margin:0px; padding:0px; display:block; position:relative; } div.select-gift-well-wrap div.select-gift-well { width:64px; height:100%; min-height:120px; float:left; clear:none; } div.select-gift-well-wrap div.select-gift-well input.selectbox { width:14px; margin-top:58px; margin-left:25px; } div.gift-img-well-wrap div.gift-img-well { float:left; clear:none; padding:8px 0px 8px 16px; } div.gift-img-well-wrap div.gift-img-well img { border:1px solid #3c3a33; margin-bottom:0px; } div.gift-img-well-wrap div.gift-img-well span.larger-image-link a { color:#2a66d4!important; font-size:10px; margin-left:32px; margin-top:0px; clear:left;} div.gift-text-well-wrap div.gift-text-well { float:left; clear:none; width:450px; } div.gift-text-well-wrap div.gift-text-well select { margin-top:13px; } div.gift-text-well-wrap div.gift-text-well p { width:375px; margin-bottom: 6px;} div.gift-text-well-wrap div.gift-text-well p a.plus-open, div.gift-text-well-wrap div.gift-text-well p a.plus-open:hover { color:#2a66d4!important; font-weight:bold; text-decoration:none!important; font-size:14px; } div.gift-text-well-wrap div.gift-text-well .gift-title { margin-bottom: 0.2em; font-size:14px; font-weight:bold; color:#6d6f71; } div.gift-text-well-wrap div.gift-text-well form { margin-top: 8px; } div.form-instruction-box { background-color:#ebeded; } .continuingMembership div.form-instruction-box { padding: 16px 20px; } div.form-instruction-box-3col { width:520px; background-color:#ebeded; } div.form-instruction-box-micro { width:520px; background-color:#e4f6f6; } div.form-instruction-box-micro p { width:480px; float:left; font-weight:bolder; font-size:12px!important; color:#69685f!important; padding:20px 20px 20px 20px; background-color:#e4f6f6;} div.form-instruction-box div.larger-left-well { float:left; clear:left; margin:0px; padding: 20px; } div.form-instruction-box div.larger-left-well-groupon { width:540px; height:74px; float:left; clear:left; margin:0px; } div.form-instruction-box div.larger-left-well-extended { width:540px; height:94px; float:left; clear:left; margin:0px; } div.form-instruction-box div.larger-left-well p { color:#69685f!important; } div.form-instruction-box div.larger-left-well-groupon p { font-weight:bold; font-size:12px!important; color:#69685f!important; } div.form-instruction-box p { font-weight: bold; color:#69685f!important; } div.form-instruction-box div.smaller-right-well p {float:right; clear:none; margin:0px; padding:0px 0px 0px 0px; } div.form-instruction-box div.larger-left-well { clear:left; margin:0px; } div.form-instruction-box-3col p { font-weight:bold; font-size:12px!important; color:#69685f!important; } #content #main .hd-groupon { position: relative; padding: 12px 0 0 167px; height: 35px; } #content #main .hd-groupon + .form-intro { padding-top: 2em !important; } .hd-groupon img { position: absolute; top: 0; left: 7px; } .siteSeal { float: right; margin-left: 20px; } .siteSeal-rail { float: left; } /* -------------------------------------------------------------- FORMS --------------------------------------------------------------- */ /* Forms - General Styles */ form#pledge-form { margin: 0; } .form-intro { padding: 1em 20px 1.6em; background-color: #EBEDED; } .form-intro .error { font-weight: bold; color: #B40000; } fieldset { padding: 0 20px 20px; background-color: #ebeded; } div#content div#main fieldset h2 { margin: auto -20px 0.6em; padding: 6px 20px; background-color: #666; color: #fff; font-size: 16px; font-weight: bold; text-transform: none; } fieldset .divider { margin: 1.5em 0; border-top: 1px solid #999; } .form-item { margin-bottom: 1.2em; } fieldset .noLabel { margin-left: 8.8em; } fieldset label { float: left; width: 8em; margin: 0.2em 0.8em 0 0; color: #000; text-align: right; } fieldset label:after { content: "\0003A"; /* Insert colon */ } fieldset span.required { display: inline-block; width: 8px; height: 0.8em; text-indent: -1000em; text-align: left; background: url(//a.s.kqed.net/icon/red-asterisk.png) no-repeat; } *+html fieldset span.required { width: auto; text-indent: 0; background: none; height: 1em; /* IE7 */ } fieldset strong.required { color: #B40000; } .form-item input, .form-item select { float: left; } .form-item select { margin-top: 0; } .form-item input[type="text"], .form-item input[type="email"] { width: 200px; } #main .form-item .salutation { width: 50px; } #main .form-item .first-name { width: 70px; } #main .form-item .middle-initial { width: 30px; } #main .form-item .last-name { width: 100px; } #main .form-item .apartment { width: 70px; } #main .form-item .state { width: 50px; } #main .form-item .zip-code { width: 70px; } #main .form-item .phone1 { width: 40px; margin-right: 8px; } #main .form-item .phone2 { width: 40px; margin-right: 8px; } #main .form-item .phone3 { width: 55px; } #main .form-item .dob-mo { width: 60px; margin-right: 8px; } #main .form-item .dob-day { width: 60px; margin-right: 8px; } #main .form-item .dob-yr { width: 60px; } #main .form-item .ccNumber { width: 150px; } #main .form-item .cc-mo { width: 70px; margin-right: 8px; } #main .form-item .cc-yr { width: 80px; } fieldset .alert, fieldset .instructions { float: left; margin: 0.2em 0 0 0.8em; } fieldset .instructions { width: 150px; color: #666; } fieldset .alert { color: #b40000; } #content #main fieldset p { font-weight: bold; color: #666; } fieldset .info { margin-top: 1em; } .pledge-form-module .installment { margin-bottom: 15px; } /* Checkboxes and Radio boxes */ .form-item input[type="checkbox"], .form-item input[type="radio"] { margin-top: 2px; } *+html .form-item input[type="checkbox"], *+html .form-item input[type="radio"] { margin-top: -2px; /* IE7 */ } .form-item input[type="checkbox"] + label, .form-item input[type="radio"] + label { width: auto; margin: 0 1em 0.6em 0.5em; text-align: left; } fieldset .noLabel input[type="checkbox"] + label, fieldset .noLabel input[type="radio"] + label { width: 300px; } .form-item input[type="checkbox"] + label:after, .form-item input[type="radio"] + label:after { content: none; } .form-item input[type="checkbox"] + label + .instructions, .form-item input[type="radio"] + label + .instructions { float: left; margin: -0.4em 0 0 1.8em; font-size: 0.85em; } /* Multi-item */ .form-multiItem label { margin-top: 1.6em; } .form-multiItem .form-item { float: left; margin-right: 8px; } .form-multiItem .form-item label { display: block; float: none; width: auto; margin: 0 0 0.2em; text-align: left; color: #666; } .form-multiItem .form-item label:after { content: none; } .form-multiItem .form-item .required { display: none; } #main .form-multiItem .salutation { width: 50px; } #main .form-multiItem .first-name { width: 70px; } #main .form-multiItem .middle-initial { width: 30px; } #main .form-multiItem .last-name { width: 100px; } /* Submit module */ .mod-submit { padding-top: 0.8em; text-align: center; background-color: #666; } #interior-2col .mod-submit { padding-right: 135px; padding-left: 135px; } div#content div#main .mod-submit p { font-weight: bold; color: #fff; text-align: left; } div#content div#main .mod-submit button { display: inline-block; *display: block; /* IE6,7 */ height: 30px; border: 0; text-indent: -1000em; cursor: pointer; background-color: transparent; background-position: 0 0; background-repeat: no-repeat; } .mod-submit .go-button { width: 120px; background-image: url(//a.s.kqed.net/button/submit-info-button-active-120x30.gif); } .mod-submit .submitMyDonation-button { width: 156px; background-image: url(//a.s.kqed.net/button/submit-donate-button-156x30.gif); } .mod-submit .donateNow-button { width: 119px; background-image: url(//a.s.kqed.net/button/donatenow-button.gif); } .mod-submit .redeem-button { width: 140px; background-image: url(//a.s.kqed.net/button/redeem-pledge-button-active-140x30.gif); } /* Large textarea module */ .mod-description .form-mod-content { text-align: center; } .mod-description label { float: none; display: block; width: auto; margin: 0 0 1em; font-weight: bold; text-align: left; } /* -------------------------------------------------------------- DONATION FORMS --------------------------------------------------------------- */ /* Misc elements */ .link-addGift { font-weight: bold; } .link-addGift:after { content: "\00A0\000BB"; /* Insert a space and a right angled-quote */ } /* Blue color theme */ div#content div#main .donate-form fieldset h2 { background-color: #5F91B1; } div#content div#main .donate-form .mod-submit { background-color: #5F91B1; } /* Pop-up tip, suggesting Sustaining Membership */ #sustainerTip { float: left; width: 340px; margin-top: -1.6em; margin-left: 10px; padding: 15px 15px 8px; background-color: #fff; border: 1px solid #abcce1; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; } #content #main #sustainerTip p { margin-top: 0; margin-bottom: 0.6em; padding-left: 0; color: #000; } #sustainerTip a, #content #main #sustainerTip a:hover { font-weight: bold; } #sustainerTip span { margin: 0 0.5em; } #sustainerTip a:after { content: "\00A0\000BB"; /* Insert a space and a right angled-quote */ } /* -------------------------------------------------------------- FORMSTACK TEMPLATES --------------------------------------------------------------- */ .fsBody .fsForm { margin: 0 !important; border: none !important; } .fsBody .fsSectionHeader { padding: 0 20px !important; } .fsSection, .fsBody .fsForm .fsSectionHeader { background-color: #EBEDED !important; } .fsBody fieldset { background-color: transparent; } .fsBody .fsRowBody { padding: 10px 20px 20px !important; } .fsSectionText { padding-top: 10px !important; } body#interior div#main .fsForm h2 { margin: auto -20px 0; padding: 6px 20px; background-color: #666; color: #FFF; font-size: 16px; font-weight: bold; line-height: 19px; text-transform: none; } .fsForm fieldset label { /* Override "fieldset label" */ float: none; width: auto; margin: auto; text-align: left; } .fsForm fieldset label:after { content: ""; /* Removes the colon (":") from "fieldset label:after" */ } .fsForm .fsSubmit { margin-top: 0 !important; background-color: #666 !important; } .fsForm button, .fsSubmitButton { display: inline-block; padding: 3px 15px !important; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; text-align: center; text-decoration: none; line-height: 1.3em; color: #fff; background-color: #888; border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; box-shadow: 2px 2px 5px #000; -webkit-box-shadow: 2px 2px 5px #000; -moz-box-shadow: 2px 2px 5px #000; border: 2px solid #fff; cursor: pointer; } .fsSubmitButton { background-color: #ffae00; color: #000; } .fsLabelVertical .fsOptionLabel { margin-bottom: 0.5em !important; } .fsCounter { /* KINF-536: - These values are for 3-column layouts only. - Prevents character counter from appears way to the right of the textarea - The problem is, Formstack's JS adds inline styles that absolutely position the counter. Unfortunately, it calculates its distances relative to the document. But since #page-size has position:relative, it becomes the parent div for the counter instead. */ left: 0 !important; right: 380px !important; } /* -------------------------------------------------------------- Old CSS for forms - keep for now just in case (6/10/11 PC) --------------------------------------------------------------- */ div.pledge-form-module { width:740px; margin:0px; background-color:#EBEDED; } div.pledge-confirm-module { width:700px; margin-bottom: 20px; padding:20px; background-color:#EBEDED; } div#content div#main div.pledge-confirm-module h2 { margin-top: 12px; margin-bottom: 14px; padding-left: 20px; font-size: 19px; line-height: 1.2em; color: #666; font-weight: bold; text-transform: none; } div.pledge-form-module-3col { width:520px; margin:0px; background-color:#EcEcEc; } div.pledge-form-module-micro { width:520px; margin:0px; background-color:#e4f6f6; } div.pledge-form-module h2 { height:24px; padding-left:20px; background-color:#5f91b1; color:#ffffff!important; font-size:16px; font-weight:bold; padding-top:6px; } div.pledge-form-module-3col h2 { height:24px; padding-left:20px; background-color:#83827d; color:#ececec!important; font-size:16px!important; font-weight:bold; padding-top:6px; text-transform:none!important; } div.pledge-form-module p { padding-left:20px; /* margin-top:12px; */ color:#666666!important; } div.pledge-confirm-module p { padding-left:20px; margin:0px; color:#666666!important; } div.pledge-confirm-module form ol, div.pledge-confirm-module form ol li { list-style-type: decimal; margin-left: 40px; margin-bottom: 3px; } div.pledge-form-module p span.add-gift-button-text { position:relative; top:-10px; } div.pledge-form-module p span.add-gift-button { margin-left:20px; clear:none; } .pledge-info-bg { background-image:url(//a.s.kqed.net/templates/pledge-information-bg.png); } span.open-close { font-size:14px; font-weight:bold; } div.form-instruction-box div.smaller-right-well { width:172px; height:44px; float:right; clear:none; margin:0px; } form#pledge-form div.form-line-holder { clear:left;margin-bottom:15px;width:740px;position:relative;display:block;background-color:#EBEDED; } form#pledge-form div.form-line-holder-3col { clear:left;margin-bottom:15px;width:520px;position:relative;display:block;background-color:#EBEDED; } form#pledge-form div.form-line-holder-micro { clear:left;margin-bottom:15px;width:520px;position:relative;display:block;background-color:#e4f6f6; } form#pledge-form div.form-line-holder-3col { clear:left;margin-bottom:15px;width:520px;position:relative;display:block;background-color:#EBEDED; } form#pledge-form div.form-checkbox-holder-micro { clear:left;margin-bottom:2px;width:520px;position:relative;display:block;background-color:#e4f6f6; } form#pledge-form div.form-checkbox-holder-micro { clear:left;margin-bottom:2px;width:520px;position:relative;display:block;background-color:#e4f6f6; } div.form-item-alert-box { float:left;clear:none;line-height:20px;width:auto; margin-top:2px;} div.pledge-form-module-wrap { background-color:#EBEDED; float:left; width:540px; margin:0px; height:100%; padding-top:12px; } div.pledge-form-module-item-wrap { margin-bottom:10px;clear:left; } div.pledge-form-module-item {margin-top: 15px;} div.form-item-name { text-align:right;width:157px;float:left;padding-right:10px;margin-left:0px;padding-top:1px;line-height:20px;clear:left; } div.form-item-name-3col { text-align:right;width:108px;float:left;padding-right:10px;margin-left:0px;padding-top:1px;line-height:20px;clear:left; } div.dollar-sign { float:left;padding-top:3px;width:15px; } div.form-item-element{ text-align:left;width:auto;float:left;clear:none;color:#3c3a33;font-weight:normal; } div.form-item-element-365px { text-align:left;width:365px;float:left;clear:none;color:#3c3a33;font-weight:normal; } div.form-item-element-250px { text-align:left;width:250px;float:left;clear:none;color:#3c3a33;font-weight:normal; } div.form-item-element-220px { text-align:left;width:220px;float:left;clear:none;color:#3c3a33;font-weight:normal; } div.form-item-element-200px { text-align:left;width:200px;float:left;clear:none;color:#3c3a33;font-weight:normal; } div.form-item-element-180px { text-align:left;width:180px;float:left;clear:none;color:#3c3a33;font-weight:normal; } div.text-area-3col-wrap { width:518px; margin:0px;float:none;} .text-area-3col { width:300px;margin-left:auto!important;margin-right:auto!important;float:none;margin-bottom:20px;margin-top:10px; } input.input-field-hidden-50px { width:70px;background-color:#EBEDED;border:none;float:left;clear:none;margin-top:4px; font-weight:bold; } input.input-field-hidden-auto { width:auto;background-color:#EBEDED;border:none;float:left;clear:none;margin-top:4px; font-weight:bold; } input.input-field-hidden-150px { width:150px;background-color:#EBEDED;border:none;float:left;clear:none;margin-top:4px; font-weight:bold; } input.input-field-50px { width:70px;float:left;clear:none; } span.instructive-text { float:left;color:#989696;font-size:11px; margin: 2px 10px 0 8px;width:270px;font-weight:normal;line-height:1.3em; } span.label-monthly { float:left; margin-top: 2px; margin-right: 10px; line-height: 20px;} span.error-text { float:left;color:#B40000;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:255px;font-weight:normal;line-height:100%; } span.error-text-3col {color:#B40000;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:255px;font-weight:normal;line-height:19px; } span.red-text { color:#B40000;} span.soldout-text { float:left; color:#B40000; font-size:11px; padding-left:5px; padding-right:10px; clear:none; width:255px; font-weight:bold; line-height:100%; padding-top: 60px; } span.soldout-single-text { float:left; color:#B40000; font-size:11px; padding-left:30px; padding-right:5px; clear:none; width:255px; font-weight:bold; line-height:100%; padding-top: 45px; } span.instructive-text-small { float:left;color:#989696;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:155px;font-weight:normal;line-height:100%; } span.error-text-small { float:left;color:#B40000;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:125px;font-weight:normal;line-height:100%; } span.error-text-smaller { float:left;color:#B40000;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:125px;font-weight:normal;line-height:100%; } span.note-text-smaller { float:left;color:#FFFFFF;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:125px;font-weight:normal;line-height:100%; } span.instructive-text-smaller { float:left;color:#989696;font-size:11px;padding-left:8px;padding-right:10px;clear:none;width:155px;font-weight:normal;line-height:100%; } span.micro-text { font-size:11px;} span.input-text { padding-left:8px;float:left;clear:none;position:relative;top:-1px; } span.radio-text { padding-left:8px;position:relative;top:-1px; } /* .required-element { position:relative;top:4px; } */ div.name-label-wrap { width:350px;position:relative;top:0px;left:168px;display:block;color:#bfc1c2;clear:none; } div.name-label-wrap-3col { width:330px;position:relative;top:0px;left:118px;display:block;color:#bfc1c2;clear:none; } div.name-label-item-wrap { position:relative;display:block;float:left;clear:none;color:#A4A4A4!important;font-size:12px; } .for-100px-input { width:120px!important; } .for-70px-input { width:90px!important; } .for-50px-input { width:70px!important; } .for-30px-input { width:50px!important; } div.name-input-wrap { float:left;clear:none; } select.name-title { width:50px;float:left;margin-right:20px; } input.name-first { width:70px;float:left;margin-right:20px; } input.name-mi { width:30px;float:left;margin-right:20px; } input.name-last { width:100px;float:left;margin-right:20px; } input.name-last-3col { width:100px;float:left;margin-right:0px; } input.address { width:185px;float:left; } input.apartment { width:70px;float:left; } input.city { width:185px;float:left; } select.state { width:50px;float:left; } input.zip-code { width:70px;float:left; } input.email { width:185px;float:left; } input.member { float:left; } input.pledge-form-checkbox { float:left; margin-top: 1px; } input.phone1 { width:40px;float:left;clear:none;margin-right:10px; } input.phone2 { width:40px;float:left;clear:none;margin-right:10px; } input.phone3 { width:55px;float:left;clear:none;margin-right:10px; } label.radio-label { margin-right:10px } /* -------------------------------------------------------------- END of Old CSS for forms --------------------------------------------------------------- */ /* serve to Safari */ body:first-of-type span.radio-text { padding-left:8px;position:relative;top:0px; } div.form-element-divider { height:10px;width:300px;clear:both;position:relative;margin:0px;line-height:10px; } div.form-element-divider-required { height:6px;width:300px;clear:both;position:relative;margin:0px;line-height:6px; } div.membership-levels-box { background-color:#d6d7d1; float:right; width:177px; margin:0px; height:100%; padding:15px 5px 10px 15px; } div.membership-levels-box p { position:relative;left:-20px; } span.required-asterix { color:#B40000;font-size:20px;font-weight:bold;position:relative;top:3px;margin-left:20px; } span.required { color:#B40000;font-size:12px;font-weight:bold;margin-top:0px;margin-bottom:4px; } span.formerror { color:#B40000;font-size:12px;font-weight:bold;margin-top:0px;line-height:15px; } span.light-grey-form-text { color:#A4A4A4; position:relative;top:2px;font-size:12px; } span.directions { width:90%;float:left;margin-left:20px;font-size:12px;font-weight:bold;margin-top:0px;margin-bottom:8px; } div.place-hold-wrap-535px { margin-top:8px;width:535px;clear:left; } div.place-hold-wrap-auto { margin-top:8px;clear:left; } div.membership-levels-box ul { font-size:13px;line-height:20px; } div.membership-levels-box ul li { line-height:20px; } div.ff-space-fix { clear:both;height:1px;width:730px; } div.ff-space-fix-3col { clear:both;height:1px;width:500px; } div.ff-space-fix-sidebar { clear:both;height:1px;width:298px; } div.keep-content-in-div-fix { height:1px;width:95%;clear:both;position:relative;margin:0px;line-height:1px; } div.remove-gift-section { border-bottom:1px solid #a8a9a1;width:720px;padding:10px;clear:left;position:relative;display:block; } div.remove-gift-item-line { width:720px;line-height:13px;min-height:30px;font-size:13px;font-weight:bold;clear:left;position:relative;display:block; } div.remove-gift-item-desc { width:210px;margin-left:10px;margin-right:10px;float:left;padding-top:4px;padding-bottom:1px;position:relative;display:block; } div.remove-gift-item-button { width:106px;margin-left:42px;margin-right:10px;float:left;position:relative;display:block; } div.remove-gift-item-total { width:200px;margin-left:10px;margin-right:10px;float:left;padding-top:4px;padding-bottom:1px;position:relative;display:block; } div.remove-gift-section { border-bottom:1px solid #a8a9a1;width:720px;padding:10px;clear:left;position:relative;display:block; } div.remove-gift-item-line { width:720px;line-height:17px;min-height:30px;font-size:13px;font-weight:bold;clear:left;position:relative;display:block; } div.remove-gift-package-desc { width:240px;margin-left:10px;margin-right:10px;float:left;padding-top:4px;padding-bottom:1px;position:relative;display:block; } div.remove-gift-package-button { width:106px;margin-right:10px;float:left;position:relative;display:block; } div.remove-gift-package-total { width:200px;margin-left:10px;margin-right:10px;float:left;padding-top:4px;padding-bottom:1px;position:relative;display:block; } div.remove-gift-package-item-desc { width:230px;margin-left:17px;margin-right:10px;float:left;padding-top:4px;padding-bottom:1px;position:relative;display:block; } div.remove-gift-package-item-desc ul { margin-left:15px; } div.remove-gift-package-item-desc ul li { list-style-type:disc!important; font-weight:normal; } div.remove-gift-package-item-button { width:106px;padding-left:15px;margin-right:10px;float:left;position:relative;display:block; } div.add-gift-section { width:720px;padding:10px;clear:left } div.add-gift-line { width:720px;line-height:13px;height:30px;font-size:13px;font-weight:bold;clear:left } div.add-gift-text { width:110px;margin-left:10px;margin-right:10px;float:left;padding-top:5px;font-weight:bold; } div.add-gift-button { width:86px;margin-left:40px;margin-right:10px;float:left; } select.185px-select { width:185px;float:left;margin-top:5px; } /* PFS */ #pfs-instructions { float: right; width: 300px; margin: 0 0 10px 20px; padding: 12px 15px 16px; background-color: #fff; border: 1px solid #999; } div#content div#main #pfs-instructions h2 { margin-top: 4px; font-size: 16px; line-height: 1.2em; text-transform: none; } div#content div#main #pfs-instructions p { padding-left: 0; } #pfs-instructions ol { margin-left: 0; } #pfs-instructions li { margin-left: 1.6em; } #pfs-instructions .bu-roundButton { display: inline-block; width: 20em; padding: 3px 12px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; text-align: center; text-decoration: none; color: #000; background-color: #ffae00; border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; box-shadow: 2px 2px 5px #888; -webkit-box-shadow: 2px 2px 5px #888; -moz-box-shadow: 2px 2px 5px #888; border: 2px solid #fff; cursor: pointer; } /* Pop-up when user tries to remove PFS from their gift list */ #popup-remove-pfs { width: 250px; padding: 20px 20px 4px; font-size: 1.1em; color: #000; background-color: #ddd; } #fancybox-wrap #fancybox-outer #popup-remove-pfs h2 { margin-bottom: 0.6em; font-size: 1.1em; font-weight: bold; text-transform: uppercase; } #fancybox-wrap #fancybox-outer #popup-remove-pfs p { margin-bottom: 1em; } #fancybox-wrap #fancybox-outer #popup-remove-pfs a { display: inline-block; padding: 3px 24px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: bold; text-align: center; color: #000; background-color: #ffae00; border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; box-shadow: 2px 2px 5px #888; -webkit-box-shadow: 2px 2px 5px #888; -moz-box-shadow: 2px 2px 5px #888; border: 3px solid #fff; cursor: pointer; } #fancybox-wrap #fancybox-outer #popup-remove-pfs a.bu-remove { margin-left: 4px; padding: 3px 12px; background-color: #ababab; } /* -------------------------------------------------------------- Continuing Membership Form --------------------------------------------------------------- */ .continuingMembership div.form-instruction-box div.larger-left-well-extended { height: auto; } .continuingMembership div#main div.form-instruction-box div.larger-left-well-extended { width: 500px; padding: 16px 0 18px 20px; } .continuingMembership div#content div#main div.form-instruction-box p { margin-bottom: 1em; padding: 0; font-size: 13px !important; line-height: 17px !important; } .continuingMembership div.membership-levels-box { padding-top: 12px; } .continuingMembership div.membership-levels-box ul li { margin-bottom: 0.4em; line-height: 17px; } .continuingMembership div.pledge-form-module, .continuingMembership div.pledge-form-module-wrap, .continuingMembership div.pledge-form-module-item-wrap { position: relative; } .continuingMembership div.form-item-element { margin-top: 0.4em; } .continuingMembership #donationAmount .dollar-sign { padding-top: 0.5em; } .continuingMembership #donationAmount strong { margin-left: 0.4em; } .continuingMembership #donationAmount .LV_validation_message { position: absolute; left: 175px; top: 2.2em; } .continuingMembership div.siteSeal { position: absolute; top: 36px; right: 6px; width: 172px; height: 44px; } /* visit-program */ div.visit-program { /*background: url(//a.s.kqed.net/templates/visit-program-bg.gif) no-repeat;*/ background:#3c3a33; width:162px; float:right; padding:4px 4px 4px 4px!important; margin-left:10px; margin-bottom:8px; } div.visit-program ul.visit-program-interior { width:134px; padding:13px 13px 9px 13px; color:#f7b918!important; font-size:93%; border:1px solid #8a8985; } div.visit-program div.visit-program-interior ul li.yellow-arrow { background: url(//a.s.kqed.net/templates/yellow-arrow.gif) no-repeat 0px 1px; padding-left:15px; position:relative; margin-bottom:8px; } ul.visit-program-interior li.list-title { padding-bottom:10px; color:#fff; } div.visit-program div.visit-program-interior ul li.yellow-arrow a:link, div.visit-program div.visit-program-interior ul li.yellow-arrow a:visited { color: #f7b918!important; font-weight:bold; text-decoration: none; } div.visit-program div.visit-program-interior ul li.yellow-arrow a:link { color: #f7b918!important; text-decoration: underline; } /* join-discussion */ div.join-discussion { background:#63615c; width:170px; float:right; margin-left:10px; margin-bottom:8px; padding-top:11px; } div.join-discussion p { color:#fff!important; padding:0px 13px 0px 13px!important; margin-bottom:4px!important; line-height:14px!important; font-size:12px!important; } div.join-discussion ul { width:134px; padding:0px 13px 0px 13px!important; color:#f7b918!important; font-size:93%; } div.join-discussion div.join-discussion-interior ul li.yellow-arrow { background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat 0px 1px; padding-left:15px; position:relative; margin-bottom:11px; } ul.join-discussion-interior li.list-title { padding-bottom:4px; color:#fff; } div.join-discussion div.join-discussion-interior ul li.yellow-arrow a:link, div.join-discussion div.join-discussion-interior ul li.yellow-arrow a:visited { color: #f7b918!important; font-weight:bold; text-decoration: none; } div.join-discussion div.join-discussion-interior ul li.yellow-arrow a:link { color: #f7b918!important; text-decoration: underline; } /* featured-broadcast */ #featured-broadcast { border-bottom:1px #000000 solid; margin-bottom:20px; } #featured-broadcast h1.logo { margin-bottom:20px!important; } #featured-broadcast h1.logo a { margin:0px!important; } #featured-broadcast h3 { color:#000000; font-size:150%; margin-bottom:4px!important; } .featured-broadcast { border-bottom:1px #000000 solid; margin-bottom:20px; } .featured-broadcast h3 { color:#000000; font-size:150%; margin-bottom:4px!important; } .broadcast-content .icon-comments { padding-left: 18px; background: url(//a.s.kqed.net/icon/icons-comment.png) 0 1px no-repeat; } /* next broadcast */ #next-broadcast { } #channels-airdates { margin-bottom:20px; } #next-broadcast h3 { color:#000000; font-size:150%; } #channels-airdates h3 { color:#000000; font-size:150%; } #next-broadcast div.broadcast-details, #channels-airdates div.broadcast-details { margin-top:2px; margin-bottom:8px; } .broadcast-time { margin-bottom: 3px; font-size:93%; font-weight: bold; color:#000000; } span.broadcast-time { display: inline-block; width: 50%; margin-bottom: 0; } #next-broadcast div.broadcast-details span.broadcast-title, #channels-airdates div.broadcast-details span.broadcast-title { font-weight:bold; } #next-broadcast div.broadcast-content span.broadcast-title, #channels-airdates div.broadcast-content span.broadcast-title, .broadcast-content .broadcast-title { margin-right: 0.8em; font-weight:bold; color: #000000; } #next-broadcast div.broadcast-details span.broadcast-email-reminder, #channels-airdates div.broadcast-details span.broadcast-email-reminder { background: url(//a.s.kqed.net/templates/email-icon.gif) no-repeat 0px -1px; vertical-align:top; padding-bottom:0px; margin:0px 0px 0px 25px; padding-top:0px; } #next-broadcast div.broadcast-details span.broadcast-email-reminder a, #channels-airdates div.broadcast-details span.broadcast-email-reminder a { margin-left:25px; } body#interior div#main #next-broadcast h3, body#interior div#main #channels-airdates h3, body#interior-2col div#main #next-broadcast h3, body#interior-2col div#main #channels-airdates h3, body#interior-2col-r div#main #next-broadcast h3, body#interior-2col-r div#main #channels-airdates h3, body#interior-2colr div#main #next-broadcast h3, body#interior-2colr div#main #channels-airdates h3 { text-transform:none; font-size:130%; margin-bottom:1px!important; } /* tv-airdates */ #content #main #tv-airdates { color: #000; } #content #main #tv-airdates h3 { margin-bottom: 1em; font-size: 1.2em; font-weight: bold; color: #000; text-transform: none; letter-spacing: 0; word-spacing: 0; } #tv-airdates .broadcast-details { margin-bottom: 2em; } #content #tv-airdates .broadcast-time { width: auto; margin-bottom: 0.2em; font-size: inherit; font-weight: normal; } #tv-airdates h4 { margin-bottom: 0.4em; } #tv-airdates .episode-title { font-weight: bold; } #content #tv-airdates .episode-description { margin-bottom: 0.6em; } #tv-airdates .airdates h4 { margin-top: 1em; font-size: 11px; font-weight: bold; line-height: 1.2em; text-transform: uppercase; } #tv-airdates .airdates ul { width: 400px; border-bottom: 1px dotted #C3C3C1; } #tv-airdates .airdates li { position: relative; padding: 0.4em 0; border-top: 1px dotted #C3C3C1; overflow: hidden; } #tv-airdates .broadcast-email-reminder { position: absolute; top: 0.4em; right: 0; padding-left: 24px; background: url(//a.s.kqed.net/templates/email-icon.gif) no-repeat 0px -1px; } /* pagination */ div.pagination { position: relative; min-height: 1em; _height: 1em; /* IE6 */ margin-bottom: 20px; padding: 13px 150px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; text-align: center; overflow: hidden; } div.pagination .prev, div.pagination .next { position: absolute; top: 8px; _top: 7px; /* IE6 */ font-weight: bold; } div.pagination .prev { left: 0; } div.pagination .next { right: 0; } div.pagination a span { font-family: Georgia, Times, serif; font-size: 18px; font-weight: normal; } div.pagination .current label { font-size: 11px; text-transform: uppercase; } /* The Do List - Who are Cy and David? */ #about-cy-david { width: auto; } /* Share This */ .sharethis-container { float: right; width: 200px; text-align: right; } .bylineShareThis { margin-right: 200px; } p.sharethis { text-align: right; width:520px; } body#interior-2col div#main p.sharethis,body#interior-2colr div#main p.sharethis { text-align: right; width:740px; } body#interior-2col-r div#main p.sharethis { text-align: right; width:640px; } p.sharethis span.raquo { font-size:18px; } p.sharethis-left { text-align: left; } p.sharethis a:link, p.sharethis a:visited { background: url(//a.s.kqed.net/templates/sharethis.gif) no-repeat 0 50%; font-size: 108%; font-weight: bold; padding-left: 22px; padding-bottom: 2px; padding-top: 2px; padding-right:2px; } p.sharethis a:hover { padding-right:2px; margin-right:2px; } p.sharethis-left a:link, p.sharethis-left a:visited { background: url(//a.s.kqed.net/templates/sharethis.gif) no-repeat 0 50%; font-size: 108%; font-weight: bold; padding-left: 0px; padding-bottom: 2px; padding-top: 2px; } p.sharethis-innermain { text-align: right; width:480px; } p.sharethis-innermain span.raquo { font-size:18px; } p.sharethis-innermain a:link, p.sharethis-innermain a:visited { background: url(//a.s.kqed.net/templates/sharethis.gif) no-repeat 0 50%; font-size: 108%; font-weight: bold; padding-left: 22px; padding-bottom: 2px; padding-top: 2px; padding-right:2px; } p.sharethis-innermain a:hover { padding-right:2px; margin-right:2px; } p.sharethis-innermain-left a:link, p.sharethis-innermain-left a:visited { background: url(//a.s.kqed.net/templates/sharethis.gif) no-repeat 0 50%; font-size: 108%; font-weight: bold; padding-left: 0px; padding-bottom: 2px; padding-top: 2px; } /* =========================================== INSET BOX Used by Arts articles (8/2/11 PC) ==============================================*/ /* ---- Inset Wrap ---- */ .inset-wrap { float: left; width: 202px; margin: 0.2em 15px 0 0; padding-right: 15px; padding-bottom: 0.4em; border-right: 1px solid #c3c3c1; } .inset-wrap .addBorder { padding-top: 12px; border-top: 1px solid #c3c3c1; } /* ---- Inset Box - Photo ---- */ .inset-wrap .inset-photo { float: none; width: 100%; margin: 0.2em 15px 1em 0; } .inset-wrap .inset-photo .photo { display: block; margin-bottom: 4px; font-size: 0; line-height: 0; border: 1px solid #C4C3C1; } .inset-wrap .inset-photo img.photo { width: 200px; -ms-interpolation-mode: bicubic; /* IE7+ */ } /* ---- Inset Box - Info ---- */ #content #main .inset-wrap .inset-info h2 { margin-bottom: 1em; font-size: 13px; line-height: 17px; text-transform: none; } #content #main .inset-wrap .inset-info h4 { font-size: 11px; font-weight: bold; line-height: 1.2em; text-transform: uppercase; color: #000; } .inset-wrap .inset-info a[target="_blank"]:after { /* Add offsite graphic to external links */ content: "\00A0" url(//a.s.kqed.net/icon/new-indiv/icon-blue-offsite-12x12.png); } /* Embedded audio player */ #mainplayer { float: left; margin-bottom: 1.4em; } .downloadAudio { float: left; margin: 4px 0 0 6px; } a.downloadmp3 { clear: left; background-image:url(http://www.californiareport.org/images/arrow_down.gif); background-repeat:no-repeat; padding-left:15px; font-size: 11px; line-height: 14px; font-weight: normal; color:#1a3075; } /* Article media assets */ .media-asset { /* clear: both; */ margin-top: 16px; padding-bottom: 16px; border-bottom: 1px solid #c3c3c1; } /* Article resource links */ .resources { margin-top: 12px; padding-bottom: 10px; border-bottom: 1px solid #c3c3c1; } .resources .list-mod li { margin-bottom: 0.6em; font-weight: bold; } /* more articles */ body#interior div#main ul.more-articles, body#interior-2col div#main ul.more-articles, body#interior-2col-r div#main ul.more-articles, body#interior-2colr div#main ul.more-articles { background-color: #3c3a33; color: #fff; margin-bottom: 5px; } body#interior div#main ul.more-articles li, body#interior-2col div#main ul.more-articles li, body#interior-2col-r div#main ul.more-articles li, body#interior-2colr div#main ul.more-articles li { font-weight: bold; float: left; display: inline; border-right:1px solid #ffffff; background-color: #3c3a33; } body#interior div#main ul.more-articles li a, body#interior-2col div#main ul.more-articles li a, body#interior-2col-r div#main ul.more-articles li a, body#interior-2colr div#main ul.more-articles li a { padding: 2px 10px; display: block; background-color: #8a8985; /* margin-right: 1px;*/ float: left; display: inline; color: #fff; } body#interior div#main ul.more-articles li.active a, body#interior-2col div#main ul.more-articles li.active a, body#interior-2col-r div#main ul.more-articles li.active a, body#interior-2colr div#main ul.more-articles li.active a { background-color: transparent; } body#interior div#main ul.more-articles li a:link, body#interior div#main ul.more-articles li a:visited, body#interior-2col div#main ul.more-articles li a:link, body#interior-2col div#main ul.more-articles li a:visited, body#interior-2col-r div#main ul.more-articles li a:link, body#interior-2col-r div#main ul.more-articles li a:visited, body#interior-2colr div#main ul.more-articles li a:link, body#interior-2colr div#main ul.more-articles li a:visited { color: #fff; text-decoration: none; } body#interior div#main ul.more-articles li a:hover, body#interior-2col div#main ul.more-articles li a:hover, body#interior-2col-r div#main ul.more-articles li a:hover, body#interior-2colr div#main ul.more-articles li a:hover { color: #fff; background-color: transparent; } p.more-arts-features a:link, p.more-arts-features a:visited { font-size: 108%; font-weight: bold; padding-left: 22px; padding-bottom: 2px; padding-top: 2px; float:right; margin-top:10px; } p.more-arts-features a:link span.raquo, p.more-arts-features a:visited span.raquo { font-size:18.5px; margin-right:2px; } p.more-arts-features a:hover span.raquo { margin-right:0px; } /* articles-title-list */ body#interior div#main ul.articles-title-list, body#interior-2col div#main ul.articles-title-list, body#interior-2col-r div#main ul.articles-title-list, body#interior-2colr div#main ul.articles-title-list { margin-left: 10px; margin-bottom: 20px; } body#interior div#main ul.articles-title-list li, body#interior-2col div#main ul.articles-title-list li, body#interior-2col-r div#main ul.articles-title-list li, body#interior-2colr div#main ul.articles-title-list li { padding: 5px 0; } body#interior div#main ul.articles-title-list li a, body#interior-2col div#main ul.articles-title-list li a, body#interior-2col-r div#main ul.articles-title-list li a, body#interior-2colr div#main ul.articles-title-list li a { font-size: 108%; } body#interior div#main ul.articles-title-list li a:hover, body#interior-2col div#main ul.articles-title-list li a:hover, body#interior-2col-r div#main ul.articles-title-list li a:hover, body#interior-2colr div#main ul.articles-title-list li a:hover { font-size: 108%; text-decoration:underline; } body#interior div#main ul.articles-title-list li p, body#interior-2col div#main ul.articles-title-list li p, body#interior-2col-r div#main ul.articles-title-list li p, body#interior-2colr div#main ul.articles-title-list li p { font-size: 93%; color: #4d4d4d; } /* articles-list */ body#interior div#main div.topics, body#interior-2col div#main div.topics, body#interior-2col-r div#main div.topics, body#interior-2colr div#main div.topics { margin-bottom: 20px; } body#interior div#main h5.articles-head, body#interior-2col div#main h5.articles-head, body#interior-2col-r div#main h5.articles-head, body#interior-2colr div#main h5.articles-head { background-color: #3c3a33; color: #fff; padding: 2px 10px; font-weight: bold; margin-bottom: 5px; } body#interior div#main ul.articles-list, body#interior-2col div#main ul.articles-list, body#interior-2col-r div#main ul.articles-list, body#interior-2colr div#main ul.articles-list { margin-left: 10px; margin-bottom: 0px; margin-top:10px } body#interior div#main ul.articles-list li, body#interior-2col div#main ul.articles-list li, body#interior-2col-r div#main ul.articles-list li, body#interior-2colr div#main ul.articles-list li { padding: 0px 0px 0px 0px; } body#interior div#main ul.articles-list li p, body#interior-2col div#main ul.articles-list li p, body#interior-2col-r div#main ul.articles-list li p, body#interior-2colr div#main ul.articles-list li p { margin-bottom: 15px; } body#interior div#main ul.articles-list li a, body#interior-2col div#main ul.articles-list li a, body#interior-2col-r div#main ul.articles-list li a, body#interior-2colr div#main ul.articles-list li a { font-size: 108%; } body#interior div#main ul.articles-list li a:hover, body#interior-2col div#main ul.articles-list li a:hover, body#interior-2col-r div#main ul.articles-list li a:hover, body#interior-2colr div#main ul.articles-list li a:hover { font-size: 108%; text-decoration:underline; } body#interior div#main ul.articles-list li p, body#interior-2col div#main ul.articles-list li p, body#interior-2col-r div#main ul.articles-list li p, body#interior-2colr div#main ul.articles-list li p { font-size: 93%; color: #4d4d4d; } /* twin-dark-mod */ #wrap-twin-dark-mod-exterior { width:520px; display:block; padding:0px; position:relative; background:url(//a.s.kqed.net/templates/twin-dark-mod-bg.gif) repeat-y; /*margin-bottom:20px;*/ } #wrap-twin-dark-mod-exterior-trans { width:520px; display:block; padding:0px; position:relative; background:url(//a.s.kqed.net/templates/twin-dark-mod-bg-trans.png) repeat-y; /*margin-bottom:20px;*/ } #wrap-twin-dark-mod-interior { clear:both;position:relative; } div.twin-dark-mod-left { /*background-color: #3c3a33;*/ border: 1px solid #3c3a33; width: 248px; float: left; display: inline; margin-top:0px; } div.twin-dark-mod-right { /*background-color: #3c3a33;*/ border: 1px solid #3c3a33; width: 248px; float: right; display: inline; } div.twin-dark-mod-left h5, div.twin-dark-mod-right h5 { margin: 10px 10px 2px 15px; color: #fff; font-weight: bold; } div.twin-dark-mod-left ul, div.twin-dark-mod-right ul { margin: 0px 10px 8px 10px; } div.twin-dark-mod-left ul li, div.twin-dark-mod-right ul li { font-size:12px; } div.twin-dark-mod-left ul li a, div.twin-dark-mod-right ul li a { display: block; padding: 3px 0 1px 15px; background: url(//a.s.kqed.net/templates/yellow-arrow.gif) no-repeat 0 3px; margin-left:4px; width: 200px; } div.twin-dark-mod-left ul a:link, div.twin-dark-mod-left ul a:visited, div.twin-dark-mod-right ul a:link, div.twin-dark-mod-right ul a:visited { color: #f7b918!important; line-height:14px; } div.twin-dark-mod-left ul li a:hover, div.twin-dark-mod-right ul li a:hover { text-decoration:underline; } div.twin-dark-mod-left ul li.listen a, div.twin-dark-mod-right ul li.listen a { color: #f7b918!important; background: url(//a.s.kqed.net/templates/listen-link.gif) no-repeat 0 50%; padding-left: 20px; width: 200px; } div.twin-dark-mod-left ul li.listen a:hover, div.twin-dark-mod-right ul li.listen a:hover { background-position: 0 50%; text-decoration: underline; } div.twin-dark-mod-left ul li.watch-video a, div.twin-dark-mod-right ul li.watch-video a { color: #f7b918!important; background: url(//a.s.kqed.net/templates/icon-watch-video.gif) no-repeat 0 50%; padding-left: 20px; width: 200px; } div.twin-dark-mod-left ul li.watch-video a:hover, div.twin-dark-mod-right ul li.watch-video a:hover { background-position: 0 50%; } div.twin-dark-mod-left ul li.read-story a, div.twin-dark-mod-right ul li.read-story a { color: #f7b918!important; background: url(//a.s.kqed.net/templates/yellow-arrow.gif) no-repeat 3px; padding-left: 20px; width: 200px; } div.twin-dark-mod-left ul li.read-story a:hover, div.twin-dark-mod-right ul li.read-story a:hover { background-position: 3px 50%; } div.twin-dark-mod-left p, div.twin-dark-mod-right p { margin: 5px 15px 5px 15px !important; color: #ffffff; font-size: 100% !important; line-height:17px !important; } .side-content-img { border:1px solid #000000; } /* twin-light-mod */ #wrap-twin-light-mod-exterior { width:520px; /* glass changed from 512 to 520 as test */ display:block; padding:0px; position:relative; background:url(//a.s.kqed.net/templates/twin-light-mod-bg-final.png) repeat-y; } #wrap-twin-light-mod-interior { clear:both;position:relative; } div.twin-light-mod-bottom { height:1px!important; clear:both; margin:0px; padding:0px; background:url(//a.s.kqed.net/templates/twin-light-mod-bg-final.png) repeat-y; } div.twin-light-mod-bottom img { margin:0px; padding:0px; } div.twin-light-mod-left { border-left: 1px solid #3c3a33; border-top: 1px solid #3c3a33; width: 248px; float: left; display: inline; margin-top:0px; } div.twin-light-mod-right { border-right: 1px solid #3c3a33; border-top: 1px solid #3c3a33; width: 248px; float: right; display: inline; } div.twin-light-mod-left h5, div.twin-light-mod-right h5 { margin: 10px 10px 2px 15px; color: #fff; font-weight: bold; } div.twin-light-mod-left ul, div.twin-light-mod-right ul { margin: 0 10px 5px 10px; } div.twin-light-mod-left ul li, div.twin-light-mod-right ul li { font-size:12px; } div.twin-light-mod-left ul li a, div.twin-light-mod-right ul li a { display: block; padding: 3px 0 1px 15px; background: url(//a.s.kqed.net/templates/blue-arrow.gif) no-repeat 0 3px; margin-left:4px; width: 200px; } div.twin-light-mod-left ul a:link, div.twin-light-mod-left ul a:visited, div.twin-light-mod-right ul a:link, div.twin-light-mod-right ul a:visited { line-height:14px; } div.twin-light-mod-left ul li a:hover, div.twin-light-mod-right ul li a:hover { text-decoration:underline; } div.twin-light-mod-left ul li.listen a, div.twin-light-mod-right ul li.listen a { background: url(//a.s.kqed.net/templates/listen-link.gif) no-repeat 0 50%; padding-left: 20px; width: 200px; } div.twin-light-mod-left ul li.listen a:hover, div.twin-light-mod-right ul li.listen a:hover { background-position: 0 50%; text-decoration: underline; } div.twin-light-mod-left ul li.watch-video a, div.twin-light-mod-right ul li.watch-video a { background: url(//a.s.kqed.net/templates/icon-watch-video.gif) no-repeat 0 50%; padding-left: 20px; width: 200px; } div.twin-light-mod-left ul li.watch-video a:hover, div.twin-light-mod-right ul li.watch-video a:hover { background-position: 0 50%; } div.twin-light-mod-left ul li.read-story a, div.twin-light-mod-right ul li.read-story a { background: url(//a.s.kqed.net/templates/blue-arrow.gif) no-repeat 1px 4px; padding-left: 20px; width: 200px; } div.twin-light-mod-left ul li.read-story a:hover, div.twin-light-mod-right ul li.read-story a:hover { background-position: 1px 4px; } div.twin-light-mod-left p, div.twin-light-mod-right p { margin: 0 10px 5px 15px!important; color: #ffffff; font-size: 90%!important; line-height:13px !important; /* changed from 14to13 to address requested decrease in line-height 051508 */ } /* twin-purple-mod */ #wrap-twin-purple-mod-exterior { width:520px; /* glass changed from 512 to 520 as test */ display:block; padding:0px; position:relative; background:url(//a.s.kqed.net/templates/twin-purple-mod-bg.png) repeat-y; padding-top:1px; } #wrap-twin-purple-mod-interior { clear:both;position:relative; } div.twin-purple-mod-left { /*background-color: #3c3a33;*/ border-left: 1px solid #3c3a33; /* glass changed from border ot border-left to fix proplem with white version - will need to change graphic */ width: 248px; float: left; display: inline; margin-top:0px; } div.twin-purple-mod-right { /*background-color: #3c3a33;*/ border-right: 1px solid #3c3a33; /* glass changed from border ot border-righ to fix proplem with white version - will need to change graphic */ width: 248px; float: right; display: inline; } div.twin-purple-mod-left h5, div.twin-purple-mod-right h5 { margin: 10px 10px 2px 15px; color: #fff; font-weight: bold; } div.twin-purple-mod-left ul, div.twin-purple-mod-right ul { margin: 0 10px 5px 10px; } div.twin-purple-mod-left ul li, div.twin-purple-mod-right ul li { font-size:12px; } div.twin-purple-mod-left ul li a, div.twin-purple-mod-right ul li a { display: block; padding: 3px 0 1px 15px; background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat 0 3px; margin-left:4px; width: 200px; color: #f7b918!important; } div.twin-purple-mod-left ul a:link, div.twin-purple-mod-left ul a:visited, div.twin-purple-mod-right ul a:link, div.twin-purple-mod-right ul a:visited { line-height:14px; } div.twin-purple-mod-left ul li a:hover, div.twin-purple-mod-right ul li a:hover { text-decoration:underline; color: #f7b918!important; } div.twin-purple-mod-left ul li.listen a, div.twin-purple-mod-right ul li.listen a { background: url(//a.s.kqed.net/templates/listen-link.gif) no-repeat 0 50%; padding-left: 20px; width: 200px; } div.twin-purple-mod-left ul li.listen a:hover, div.twin-purple-mod-right ul li.listen a:hover { background-position: 0 50%; text-decoration: underline; color: #f7b918!important; } div.twin-purple-mod-left ul li.watch-video a, div.twin-purple-mod-right ul li.watch-video a { background: url(//a.s.kqed.net/templates/icon-watch-video.gif) no-repeat 0 50%; padding-left: 20px; width: 200px; } div.twin-purple-mod-left ul li.watch-video a:hover, div.twin-purple-mod-right ul li.watch-video a:hover { background-position: 0 50%; color: #f7b918!important; } div.twin-purple-mod-left ul li.read-story a, div.twin-purple-mod-right ul li.read-story a { background: url(//a.s.kqed.net/templates/yellow-arrow-trans.gif) no-repeat 3px 50%; padding-left: 20px; width: 200px; } div.twin-purple-mod-left ul li.read-story a:hover, div.twin-purple-mod-right ul li.read-story a:hover { background-position: 3px 50%; } div.twin-purple-mod-left p, div.twin-purple-mod-right p { margin: 0 10px 5px 15px!important; color: #ffffff; font-size: 90%!important; line-height:13px !important; /* changed from 14to13 to address requested decrease in line-height 051508 */ } /* features-list */ div.features-list { clear:both; margin-bottom:10px; min-height:100px; } div.features-list.large { margin-bottom: 2em; } div.features-list p { margin-bottom:10px; display:inline; } div.features-list h5 { margin: 5px 10px 6px 0px; font-weight: bold; color: #000; } div.features-list-pic-left a:link, div.features-list-pic-left a:visited, div.features-list-pic-left a:hover { margin-right:0px!important; padding:0px; float: left; } div.features-list-pic-left { margin: 0px 0px 10px 0px; float: left; display: inline; } div.features-list-pic-left img { border: 1px solid #0b0b0b; margin-right: 15px; } .more-features-list a:link span.raquo, .more-features-list a:visited span.raquo { font-size:18.5px; /*vertical-align:bottom;*/ margin-right:2px; } .more-features-list a:hover span.raquo { margin-right:0px; } .more-features-list a:link, .more-features-list a:visited { font-size: 108%; font-weight: bold; padding-left: 22px; padding-bottom: 2px; padding-top: 2px; float:right; margin-top:10px; } /* Entry List (2/7/13 PC) - Newer alternative to Features List. - For lists containing headline, desc and thumbnail. - Allows for aligning images left or right and wrapping desc text or not. - Less HTML markup and CSS. Optional classes to add to
- thumb-left = align thumbnail to the left side - thumb-right = align thumbnail to the right side - no-text-wrap = text won't wrap around the bottom of the thumbnail - thumb-large = displays 198px wide thumbnails (normally 98px) */ .entry-list { margin-bottom: 2em; } .entry { margin-bottom: 0.5em; } #page-size #main .entry-list h2 { margin-bottom: 1em; font-size: 1.2em; text-transform: none; } .entry .thumb img, .entry img.thumb { width: 98px; height: auto; border: 1px solid #999; } .entry-list.thumb-left .thumb, #content #main .entry-list.thumb-left .thumb:hover { float: left; margin: 0 10px 0.6em 0; } .entry-list.thumb-right .thumb, #content #main .entry-list.thumb-right .thumb:hover { float: right; margin: 0 0 0.6em 10px; } .thumb-large .entry { margin-bottom: 2em; } .thumb-large .entry .thumb img, .thumb-large .entry img.thumb { width: 198px; height: auto; } .thumb-square .entry .thumb { width: 148px; height: 148px; overflow: hidden; border: 1px solid #999; text-align: center; } .thumb-square .entry .thumb img, .thumb-square .entry img.thumb { width: auto; height: 148px; margin-left: -25%; border: 0; } #page-size #content .entry-list h4 { /* Same as h3.credit */ color: #000; font-size: 11px !important; margin-bottom: 5px; letter-spacing: +1px; word-spacing: +1px; font-weight: normal; text-transform: uppercase; } #page-size #content .entry-list h3 { margin-bottom: 0.2em; font-weight: bold; text-transform: none; letter-spacing: 0; word-spacing: 0; color: #000; } #page-size #content #main .entry-list h3 a { color: #114999; } #page-size #content #main .entry-list h3 a:after { content: none; } .entry-list.no-text-wrap h3, .entry-list.no-text-wrap p { margin-left: 110px; } .entry-list.thumb-large.no-text-wrap h3, .entry-list.thumb-large.no-text-wrap p { margin-left: 210px; } .entry-list .bulleted-list { overflow: hidden; /* Ensures bullet wraps properly. */ } /* Sidebar1 (200px wide) */ #page-size #sidebar1 .entry-list h2 { background-color: #3c3a33; color: #fff; font-size: 1em; font-weight: bold; margin-bottom: 0; padding: 3px 10px 3px 10px; vertical-align: bottom; } #page-size #sidebar1 .entry { padding: 5px 12px; } #page-size #sidebar1 .entry:nth-child(odd) { background-color: #f5f5f5; } #sidebar1 .entry .thumb img, #sidebar1 .entry img.thumb { width: 48px; height: auto; } body#interior div.article-feature { background-color: #3c3a33; border: 1px solid #3c3a33; margin-bottom: 20px!important; float:left; width:518px; padding:0px; display:block; } body#interior-2col div.article-feature, body#interior-2colr div.article-feature { background-color: #3c3a33; border: 1px solid #3c3a33; margin-bottom: 20px!important; float:left; width:738px; padding:0px; display:block; } body#interior-2col-r div.article-feature { background-color: #3c3a33; border: 1px solid #3c3a33; margin-bottom: 20px!important; float:left; width:638px; padding:0px; display:block; } body#interior div.article-feature-blue { background-color: #34343d; border: 1px solid #34343d; margin-bottom: 20px!important; float:left; width:518px; padding:0px; display:inline; } body#interior-2col div.article-feature-blue, body#interior-2colr div.article-feature-blue { background-color: #34343d; border: 1px solid #34343d; margin-bottom: 20px!important; float:left; width:738px; padding:0px; display:inline; } body#interior-2col-r div.article-feature-blue { background-color: #34343d; border: 1px solid #34343d; margin-bottom: 20px!important; float:left; width:638px; padding:0px; display:inline; } body#interior2 div.article-feature { background-color: #3c3a33; border: 1px solid #3c3a33; margin-bottom: 20px!important; float:left; width:418px; padding:0px; display:block; } body#interior2 div.article-feature-blue { background-color: #34343d; border: 1px solid #34343d; margin-bottom: 20px!important; float:left; width:418px; padding:0px; display:block; } div.article-feature div.article-feature-img, div.article-feature-blue div.article-feature-img { margin-right: 15px; float:left; } div.article-feature div.article-feature-content, div.article-feature-blue div.article-feature-content { float:none; clear:none; padding:0px!important; margin:0px!important; padding-left:15px!important; } div.article-feature div.article-feature-content h4, div.article-feature-blue div.article-feature-content h4 { color: #fff; font-size: 14px; font-weight: bold; margin-bottom: 6px; margin-top:8px; } div.article-feature div.article-feature-content p, div.article-feature-blue div.article-feature-content p { color: #fff!important; font-size:13px!important; line-height:17px!important; /* changed from 18 to 17 px on client request 051508 */ padding-right:18px; margin-bottom:5px!important; } div.article-feature div.article-feature-content p.listen-link, div.article-feature-blue div.article-feature-content p.listen-link { margin-bottom:0px!important; } /* to here */ div.article-feature div.article-feature-content p.listen-link a, div.article-feature-blue div.article-feature-content p.listen-link a { display: inline; background: url(//a.s.kqed.net/templates/listen-link.gif) no-repeat 0 50%; padding-left: 21px; font-weight: bold; padding-bottom:0px; } div.article-feature div.article-feature-content p.listen-link a:link, div.article-feature div.article-feature-content p.listen-link a:visited, div.article-feature-blue div.article-feature-content p.listen-link a:link, div.article-feature-blue div.article-feature-content p.listen-link a:visited { color: #f7b918!important; text-decoration: none; margin-bottom:0px!important; } div.article-feature-content p.listen-link a:hover { text-decoration: underline; } div.article-feature div.article-feature-content p.read-more a, div.article-feature-blue div.article-feature-content p.read-more a, div.article-feature div.article-feature-content p.read-more2 a, div.article-feature-blue div.article-feature-content p.read-more2 a { display: inline; background: url(//a.s.kqed.net/templates/yellow-arrow.gif) no-repeat 0 50%; padding-left: 15px; font-weight: bold; margin-bottom:0px!important; } div.article-feature div.article-feature-content p.read-more a:link, div.article-feature div.article-feature-content p.read-more a:visited, div.article-feature-blue div.article-feature-content p.read-more a:link, div.article-feature-blue div.article-feature-content p.read-more a:visited, div.article-feature div.article-feature-content p.read-more2 a:link, div.article-feature div.article-feature-content p.read-more2 a:visited, div.article-feature-blue div.article-feature-content p.read-more2 a:link, div.article-feature-blue div.article-feature-content p.read-more2 a:visited { color: #f7b918!important; text-decoration: none; margin-bottom:0px!important; } div.article-feature-content p.listen-link a:hover, div.article-feature-blue div.article-feature-content p.read-more a:hover, div.article-feature-content p.listen-link a:hover, div.article-feature-blue div.article-feature-content p.read-more2 a:hover { text-decoration: underline; margin-bottom:0px!important; } /* main-read-more */ body#interior div#main ul.main-read-more, body#interior-2col div#main ul.main-read-more, body#interior-2col-r div#main ul.main-read-more, body#interior-2colr div#main ul.main-read-more { margin: 0px 10px 5px 0px; } body#interior div#main ul.main-read-more li, body#interior-2col div#main ul.main-read-more li, body#interior-col-r div#main ul.main-read-more li, body#interior-colr div#main ul.main-read-more li { font-size: 108%; font-weight: bold; /* display:block; */ } body#interior div#main ul.main-read-more li a:link, body#interior div#main ul.main-read-more li a:visited, body#interior-2col div#main ul.main-read-more li a:link, body#interior-2col div#main ul.main-read-more li a:visited, body#interior-2col-r div#main ul.main-read-more li a:link, body#interior-2col-r div#main ul.main-read-more li a:visited, body#interior-2colr div#main ul.main-read-more li a:link, body#interior-2colr div#main ul.main-read-more li a:visited { /* display:block; */ padding: 0px 0px 0px 15px; background: url(//a.s.kqed.net/templates/blue-arrow.gif) no-repeat 0 2px; margin-left:0px; } /* serve to Safari */ body:first-of-type div#main div.ie-helper { display:block;clear:none;float:left;text-align:left; } /* interior page main div headings, text and links */ body#interior div#main h3, body#interior-2col div#main h3, body#interior-2col-r div#main h3, body#interior-2colr div#main h3 { font-size: 100%; color: #666; text-transform: uppercase; margin-bottom: 10px; letter-spacing: +2px; word-spacing:+2px; } body#interior #content div#main h3 a, body#interior-2col #content div#main h3 a, body#interior-2col-r #content div#main h3 a, body#interior-2colr #content div#main h3 a { color: #666; } body#interior #content div#main h3 a:after, body#interior-2col #content div#main h3 a:after, body#interior-2col-r #content div#main h3 a:after, body#interior-2colr #content div#main h3 a:after { content: "\00A0\000BB"; /* Insert a space and a right angled-quote */ } body#interior div#main h3.pledge, body#interior-2col div#main h3.pledge, body#interior-2col-r div#main h3.pledge, body#interior-2colr div#main h3.pledge { font-size: 14px; color: #666666; text-transform:none; margin-bottom: 10px; letter-spacing:normal; word-spacing:normal; line-height: 22px; } body#interior div#main h1, div#out-of-nav h1, body#interior-2col div#main h1, body#interior-2col-r div#main h1, body#interior-2colr div#main h1 { font-size: 182%; color: #000; line-height: 110%; margin-bottom: 10px; } body#interior div#main h2, body#interior-2col div#main h2, body#interior-2col-r div#main h2, body#interior-2colr div#main h2 { font-size: 93%; font-weight: bold; color: #000; margin-bottom: 5px; text-transform: uppercase; } body#interior div#main p, div#out-of-nav p, body#interior-2col div#main p, body#interior-2col-r div#main p, body#interior-2colr div#main p { color: #000; font-size: 100%; margin-bottom: 14px; } body#interior div#main p.byline, body#interior-2col div#main p.byline, body#interior-2col-r div#main p.byline, body#interior-2colr div#main p.byline { color: #000; font-size: 93%; margin-bottom: 20px; } body#interior div#main p.byline span, body#interior-2col div#main p.byline span, body#interior-2col-r div#main p.byline span, body#interior-2colr div#main p.byline span { padding: 0 5px; } body#interior div#main h3.credit, body#interior-2col div#main h3.credit, body#interior-2col-r div#main h3.credit, body#interior-2colr div#main h3.credit { color: #000; font-size: 11px !important; margin-bottom: 5px; letter-spacing: +1px; word-spacing: +1px; } body#interior div#main p.main-byline, body#interior-2col div#main p.main-byline, body#interior-2col-r div#main p.main-byline, body#interior-2colr div#main p.main-byline { color: #000; font-size: 11px !important; letter-spacing: +1px; word-spacing: +1px; margin-bottom:5px; } body#interior div#main h3.credit span, body#interior-2col div#main h3.credit span, body#interior-2col-r div#main h3.credit span, body#interior-2colr div#main h3.credit span { padding: 0 5px; } body#interior div#main div.feature-title, body#interior-2col div#main div.feature-title, body#interior-2col-r div#main div.feature-title, body#interior-2colr div#main div.feature-title { font-size: 20px; font-weight:bold; font-variant:normal; margin: 0px 0px 5px 0px; } body#interior div#main .article-pic-left, body#interior-2col div#main .article-pic-left, body#interior-2col-r div#main .article-pic-left, body#interior-2colr div#main .article-pic-left { margin: 0px 15px 10px 0px; float: left; display: inline; } body#interior div#main div.article-pic-lrg, body#interior-2col div#main div.article-pic-lrg, body#interior-2col-r div#main div.article-pic-lrg, body#interior-2colr div#main div.article-pic-lrg { margin: 0px 0px 10px 0px; float: left; display: inline; max-width: 100%; } body#interior div#main .article-pic-left a:hover, body#interior div#main .article-pic-left a, body#interior-2col div#main .article-pic-left a:hover, body#interior-2col div#main .article-pic-left a, body#interior-2col-r div#main .article-pic-left a:hover, body#interior-2col-r div#main .article-pic-left a, body#interior-2colr div#main .article-pic-left a:hover, body#interior-2colr div#main .article-pic-left a { margin: 0 0px 0px 0; float: left; display: inline; text-decoration:none; } body#interior div#main div.article-pic-lrg a:hover, body#interior div#main div.article-pic-lrg a, body#interior-2col div#main div.article-pic-lrg a:hover, body#interior-2col div#main div.article-pic-lrg a, body#interior-2col-r div#main div.article-pic-lrg a:hover, body#interior-2colr div#main div.article-pic-lrg a { margin: 0 0px 0px 0; float: left; display: inline; text-decoration:none; } body#interior div#main .article-pic-left img, body#interior-2col div#main .article-pic-left img, body#interior-2col-r div#main .article-pic-left img, body#interior-2colr div#main .article-pic-left img { border: 1px solid #0b0b0b; } body#interior div#main div.article-pix-right img, body#interior-2col div#main div.article-pix-right img, body#interior-2col-r div#main div.article-pix-right img, body#interior-2colr div#main div.article-pix-right img { border: 1px solid #0b0b0b; } body#interior div#main div.article-pic-lrg img, body#interior-2col div#main div.article-pic-lrg img, body#interior-2col-r div#main div.article-pic-lrg img, body#interior-2colr div#main div.article-pic-lrg img { border: 1px solid #0b0b0b; max-width: 100%; } body#interior div#main .article-pic-left p, body#interior-2col div#main .article-pic-left p, body#interior-2col-r div#main .article-pic-left p, body#interior-2colr div#main .article-pic-left p { font-size: 77%; color: #a2a2a2; margin-bottom:0px; font-size:9px; } body#interior div#main div.article-pic-lrg p, body#interior-2col div#main div.article-pic-lrg p, body#interior-2col-r div#main div.article-pic-lrg p, body#interior-2colr div#main div.article-pic-lrg p { font-size: 77%; color: #a2a2a2; margin-bottom:0px; font-size:9px; } body#interior div#main .article-pic-right, body#interior-2col div#main .article-pic-right, body#interior-2col-r div#main .article-pic-right, body#interior-2colr div#main .article-pic-right { margin: 0px 0 10px 15px; float: right; display: inline; } body#interior div#main .article-pic-right img, body#interior-2col div#main .article-pic-right img, body#interior-2col-r div#main .article-pic-right img, body#interior-2colr div#main .article-pic-right img { border: 1px solid #0b0b0b; } body#interior div#main div#featured-broadcast div.programs-right-wrap, body#interior-2col div#main div#featured-broadcast div.programs-right-wrap, body#interior-2col-r div#main div#featured-broadcast div.programs-right-wrap, body#interior-2colr div#main div#featured-broadcast div.programs-right-wrap /* 2col and 2colr width check */ { float:right; width:185px; padding-bottom:10px; background-color:#FFFFFF; position:relative; } body#interior div#main div#featured-broadcast .programs-right-wrap div.article-pic-right, body#interior-2col div#main div#featured-broadcast .programs-right-wrap div.article-pic-right, body#interior-2col-r div#main div#featured-broadcast .programs-right-wrap div.article-pic-right, body#interior-2colr div#main div#featured-broadcast .programs-right-wrap div.article-pic-right { margin: 0px 0px 10px 15px; float: right; display: inline; clear:right; } body#interior div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right a:hover, body#interior div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right a, body#interior-2col div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right a:hover, body#interior-2col div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right a, body#interior-2col-r div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right a, body#interior-2colr div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right a { margin: 0px 0px 0px 0px; float: right; display: inline; text-decoration:none; } body#interior div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right img, body#interior-2col div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right img, body#interior-2col-r div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right img, body#interior-2colr div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right img { width: 99%; /* accommodate border */ border: 1px solid #0b0b0b; margin-bottom:2px; } body#interior div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .img-name, body#interior-2col div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .img-name, body#interior-2col-r div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .img-name, body#interior-2colr div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .img-name /* 2col and 2colr width check */ { color:#5D5D5D; width:170px; line-height:10px; margin-bottom:3px; font-size:14px; font-weight:bold; text-align:right; float:right; } body#interior div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .photo-credit, body#interior-2col div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .photo-credit, body#interior-2col-r div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .photo-credit, body#interior-2colr div#main div#featured-broadcast div.programs-right-wrap div.article-pic-right .photo-credit /*2col and 2colr width check */ { color: #a2a2a2; width:170px; margin-bottom:0px; margin-top:0px; font-size:9px; text-align:right; float:right; } /* Radio Episodes */ body#interior div#main h2.hd-episode { margin: 20px 0 10px; font-size: 24px; font-weight: normal; line-height: 1.2em; text-transform: none; } .storyText { margin-top: 2em; padding-top: 1em; border-top: 1px solid #ccc; } body#interior div#main .storyText h3 { margin-bottom: 1em; font-size: 1.4em; font-weight: bold; color: black; text-transform: none; word-spacing: 0; letter-spacing: 0; } body#interior div#main .storyText h4 { margin-top: 1.4em; margin-bottom: 0.4em; font-size: 1.1em; font-weight: bold; color: #000; } body#interior div#main .storyText .section { margin-bottom: 2em; } body#interior div#main .storyText .speaker { font-style: italic; color: #666; } /* Transcripts */ #transcript { margin-bottom: -20px; /* Offsets the clearfix20 that precede comments */ padding: 6px 10px 5px; border-top: 1px solid #9c9c9c; border-bottom: 1px solid #9c9c9c; } #transcript .link-toggle { font-size: 15px; font-weight: bold; line-height: 1.2em; padding-left: 18px; background: url(//a.s.kqed.net/icon/blue-plus-minus.gif) 0 3px no-repeat; } #transcript .on { background-position: 0 -26px; } #transcript .text { display: none; padding: 1.5em 0 1em; } /* Pull Quotes - Usage: - Left-aligned: - Using