/* get rid of default margins and padding */ * { padding: 0; margin: 0; } /* clearfix */ html .clearfix { height: 1%; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* the base styles */ body { padding: 0; margin: 0; font-size: 100.1%; color: #203365; font-family: verdana; } body.login_background { background: white url(/images/common/login_background.jpg) no-repeat 50% 0%; } body.background1 { background: white url(/images/public/master/body_background_01.jpg) no-repeat 50% 0%; } body.background2 { background: white url(/images/public/master/body_background_02.jpg) no-repeat 50% 0%; } body.background3 { background: white url(/images/public/master/body_background_03.jpg) no-repeat 50% 0%; } body.background4 { background: white url(/images/public/master/body_background_04.jpg) no-repeat 50% 0%; } body.background5 { background: white url(/images/public/master/body_background_05.jpg) no-repeat 50% 0%; } .hidden { visibility: hidden; overflow: hidden; } h1, h2, h3, h4, h5, h6 { overflow: hidden; } h2 { margin: 0 0 8px 0; } label { overflow: hidden; } pre { width: 701px; word-wrap: break-word; white-space: -moz-pre-wrap; border: 0px solid red; font-size: 8pt; color: #203365; font-family: verdana; padding:5px; } p { font-size: 0.75em; color: #203365; line-height: 1.4em; } p a { font-size: 110%; } a { font-size: 0.69em; color: #203365; } a.button { display: block; width: 100%; height: 100%; text-decoration: none; } a img { border: 0; } li { font-size: 0.75em; } li a { font-size: 100%; } input.searchField { border: 1px solid #7f9db9; width: 190px; height: 16px; font-size: 13px; color: #203365; } input.textField { border: 1px solid #7f9db9; } input.centeredButton { display: block; margin: 0 auto; } textarea { border: 1px solid #7f9db9; } select { border: 1px solid #7f9db9; } /* styles beginning with #document are specific to any strictly-content "article" type content */ body #content .wide { width: 100%; } #document { z-index: 300; float: left; padding:0; margin: 0 10px 0 0; position:relative; width:532px; } #document p { margin: 1.6em 0 1.6em 0; } #document p.confirmation { margin: 0.2em 0 0.2em 0; } #document .borderless td { border: 0 none; } #document .borderless { border: 0 none; } #document table.renewalTable { border: 0 none; background: none; } #document table.renewalTable table { border: 1px solid #baccd8; background: white; border-collapse: collapse; } #document table.renewalTable table td { border: 1px solid #baccd8; background: white; padding: 5px; } #document table { border: 1px solid #baccd8; background: white; border-collapse: collapse; font-size: 0.69em; } #document table td { border: 1px solid #baccd8; background: white; padding: 5px; } #document table label { font-size: 100%; } #document table.transparent { background: none; } #document table.transparent td { background: none; } #document table td p { font-size: 100%; } #document table table { font-size: 100%; } #document table table table { font-size: 100%; } #document table th { border-bottom: 1px solid #6b789a; background: #e6f2ed; padding: 7px 5px 7px 5px; } #document label { font-size: 0.69em; font-weight: bold; } #document ul { margin: 1em 0 1em 32px;} #document ul li { margin-bottom: 0.6em; line-height: 1.4em; } #document ol { margin: 1.5em 0 1.5em 32px; } #document ol li { margin-bottom: 0.6em; line-height: 1.4em; } #document hr { background-color: #3c4d79; color: #3c4d79; height: 1px; border: 0; } /* leave the "#"'s after float:none (unless their causing trouble). As for now, the "#" leaves out the display: inline-block; from view of Safari. If Safari sees this it will break sIFR. If it's not there, sIFR will break in IE6. */ #document div.box { border: 1px solid #baccd8; background: white; padding: 10px; } #document h1 { font-family: Tahoma, trebuchet; font-weight:normal; font-size: 1.38em; margin: 0 0 0.7em 0; text-transform: uppercase; float: none; display: inline-block; } #document h2 { font-family: Tahoma, trebuchet; font-weight:normal; font-size: 1.12em; margin: 0 0 0.6em 0; text-transform: uppercase; clear: left; float: none; display: inline-block; } #document h3 { font-size: 1em; margin: 0 0 0.5em 0; text-transform: uppercase; float: none; display: inline-block; } #document h4 { font-size: 0.88em; margin: 0 0 0.4em 0; text-transform: uppercase; float: none; display: inline-block; } #document h5 { margin: 0 0 0.45em 0; } #document h1 .sIFR-alternate, #document h2 .sIFR-alternate, #document h3 .sIFR-alternate, #document h4 .sIFR-alternate { display:none; } #document img { background: white; padding: 4px; border: 1px solid #cdcdcd; float: left; display: inline; margin: 8px 14px 8px 14px; } #document img.noMargin { margin: 0; } table td a { font-size: 100%; } table td label { margin: 3px 7px 3px 7px; } #document h2.planningFuture {background: url(/images/public/content/h2_planning.gif) no-repeat; width: 527px; height: 137px; margin: 0; border:0; text-indent:-3999px; } /* Years in innovativepolycypapers ------------------------------------ */ #year-links, .tab-links { background: url(/images/public/master/header.jpg) no-repeat; width: 532px; font-family: Arial; font-size: 16px; color: #fff; height:35px; } #year-links ul, .tab-links ul { margin: 0px; padding: 5px 0 0; display: inline; position: relative; } #year-links ul li, .tab-links ul li { height: 35px; line-height:35px !important; list-style: none; float:left; margin:0 !important; } #year-links ul li.line, .tab-links ul li.line { border-left: 1px solid #fff; padding:0; height:12px; position:relative; top:12px; left:-1px; overflow:hidden; } #year-links ul li a, .tab-links ul li a { display:block; height:100%; float:left; color: #fff; font-weight: bold; text-decoration: none; padding: 0 20px; } #year-links ul li.first-item a, .tab-links ul li.first-item a { background: url(/images/public/master/rounded_cornerb.jpg) 0 0 no-repeat #7581a1; color: #fff; } #year-links ul li.first-item a.active-tab, .tab-links ul li.first-item a.active-tab { background:#b4bcd5 url(/images/public/master/rounded_corner.jpg) 0 0 no-repeat; color: #7581a1; } #year-links .active-tab, .tab-links .active-tab { background-color:#b4bcd5; } #year-links a.active-tab, .tab-links a.active-tab { color: #7581a1; } /* Years in innovativepolycypapers End ------------------------------------ */ h2.slogan_small { background: url(/images/common/slogan_[small].png) no-repeat; width: 430px; height: 20px; margin: 7px auto; behavior: url(/js/iepngfix.htc); overflow: hidden; } #LoginInsterstitial { width: 420px; margin: 14px auto; } #LoginInsterstitial #LoginBox { margin: 14px auto; } #LoginInsterstitial #document { width: 420px; } #LoginInsterstitial input.textField { width: 200px; } #LoginInsterstitial div.logo { background: url(/images/common/logo.png) no-repeat; behavior: url(/js/iepngfix.htc); width: 255px; height: 97px; margin: 14px auto; } #LoginInsterstitial table { border: none; margin: 0 auto; } #LoginInsterstitial table td { border: none; } /* ---------------------------------------------------------------- */ /* rounded panels (numbers following classnames are widths in pixels */ .rounded212 .roundedTop { background: url(/images/common/div_rounded_top_212px.gif) no-repeat; width: 212px; height: 10px; overflow: hidden; } .rounded212 .roundedContent { background: url(/images/common/div_rounded_mid_212px.gif) repeat-y; width: 192px; padding: 0 10px 0 10px; height: auto; } .rounded212 .roundedBottom { background: url(/images/common/div_rounded_btm_212px.gif) no-repeat; width: 212px; height: 10px; overflow: hidden; } .rounded305 .roundedTop { background: url(/images/common/div_rounded_top_305px.gif) no-repeat; width: 305px; height: 10px; overflow: hidden; } .rounded305 .roundedContent { background: url(/images/common/div_rounded_mid_305px.gif) repeat-y; width: 281px; padding: 0 12px 0 12px; height: auto; } .rounded305 .roundedBottom { background: url(/images/common/div_rounded_btm_305px.gif) no-repeat; width: 305px; height: 10px; overflow: hidden; } .rounded419 .roundedTop { background: url(/images/common/div_rounded_top_419px.gif) no-repeat; width: 420px; height: 10px; overflow: hidden; } .rounded419 .roundedContent { background: url(/images/common/div_rounded_mid_419px.gif) repeat-y; width: 400px; padding: 0 12px 0 12px; height: auto; } .rounded419 .roundedBottom { background: url(/images/common/div_rounded_btm_419px.gif) no-repeat; width: 420px; height: 10px; overflow: hidden; } .rounded420 .roundedTop { background: url(/images/common/div_rounded_top_420px.gif) no-repeat; width: 470px; height: 10px; overflow: hidden; } .rounded420 .roundedContent { background: url(/images/common/div_rounded_mid_420px.gif) repeat-y; width: 470px; padding: 0 12px 0 12px; height: auto; } .rounded420 .roundedBottom { background: url(/images/common/div_rounded_btm_420px.gif) no-repeat; width: 470px; height: 10px; overflow: hidden; } .rounded532 .roundedTop { background: url(/images/common/div_rounded_top_532px.gif) no-repeat; width: 532px; height: 8px; overflow: hidden; } .rounded532 .roundedContent { background: url(/images/common/div_rounded_mid_532px.gif) repeat-y; width: 508px; padding: 4px 12px 4px 12px; height: auto; } .rounded532 .roundedBottom { background: url(/images/common/div_rounded_btm_532px.gif) no-repeat; width: 532px; height: 8px; overflow: hidden; } .rounded739 .roundedTop { background: url(/images/common/div_rounded_top_739px.gif) no-repeat; width: 739px; height: 8px; overflow: hidden; } .rounded739 .roundedContent { background: url(/images/common/div_rounded_mid_739px.gif) repeat-y; width: 715px; padding: 1px 12px 1px 12px; height: auto; } .rounded739 .roundedBottom { background: url(/images/common/div_rounded_btm_739px.gif) no-repeat; width: 739px; height: 8px; overflow: hidden; } div.contentBackground { width: 100%; height: 100%; } #2009callout { background: url(/images/common/2009_cip_oppi_conference.gif) no-repeat; height: 16px; } /* ---------------------------------------------------------------- */ /* These are standard sIFR styles... do not modify */ /* sIFR uses javascript to replace headers with flash movies of the same size which will automatically import the text and style the text with a nonstandard font */ /* .sIFR-flash { visibility: visible !important; margin: 0; } .sIFR-replaced { visibility: visible !important; } span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; }*/ /* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */ /*.sIFR-flash + div[adblocktab=true] { display: none !important; }*/ /* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */ /*.sIFR-hasFlash #document h1 { visibility: hidden; } .sIFR-hasFlash #document h2 { visibility: hidden; letter-spacing: -9px; } .sIFR-hasFlash #document h3 { visibility: hidden; letter-spacing: -6px; } .sIFR-hasFlash #document h4 { visibility: hidden; letter-spacing: -6px; }*/ /*.sIFR-hasFlash #document h4 { visibility: hidden; letter-spacing: -5px; font-size: 21px; }*/ /* .sIFR-hasFlash #document h5#pullquote { letter-spacing: -4px; visibility: hidden; font-size: 24px; }*/ /* ---------------------------------------------------------------- */ ul.customBullets { list-style-type: none; margin: 0; padding: 0; } ul.customBullets li { background: url(/images/common/li_arrow_bullet.gif) no-repeat top left; line-height: 1.2em; padding: 0px 0pt 0px 15px; margin: 1.0em 0pt 0pt; height: auto; } ul.customBullets li a { margin: 0; padding: 0; overflow: hidden; } ul.thumbnailList { list-style-type: none; margin: 12px 0 12px 0; } ul.thumbnailList li { display: inline; margin: 0 0 0 3px; } ul.thumbnailList li a { text-decoration: none; } ul.thumbnailList li img { padding: 4px; border: 1px solid #cdcdcd; } .powerpoint { background: url(/images/common/icon_powerpoint.gif) no-repeat top left; padding: 5px 0 5px 20px; } .pdf { background: url(/images/common/icon_pdf.gif) no-repeat top left; padding: 5px 0 5px 20px; } .word_doc { background: url(/images/common/icon_word.gif) no-repeat top left; padding: 5px 0 5px 20px; } .movie { background: url(/images/common/icon_movie.gif) no-repeat top left; padding: 5px 0 5px 20px; } /* ---------------------------------------------------------------- */ /* Labels, may likely be used on various forms */ label.lblFirstName { background: url(/images/common/lbl_first_name.gif) no-repeat; width: 56px; height: 9px; display: block; } label.lblLastName { background: url(/images/common/lbl_last_name.gif) no-repeat; width: 53px; height: 9px; display: block; } label.lblProvince { background: url(/images/common/lbl_province.gif) no-repeat; width: 48px; height: 9px; display: block; } label.lblCountry { background: url(/images/common/lbl_country.gif) no-repeat; width: 47px; height: 9px; display: block; } label.lblCity { background: url(/images/common/lbl_city.gif) no-repeat; width: 22px; height: 9px; display: block; } label.lblSelectSkills { background: url(/images/common/lbl_select_skills.gif) no-repeat; width: 68px; height: 9px; display: block; } /* Buttons */ div#btnMembershipRenewal2010 { background: url(/images/common/btn_membership_renewal.gif) no-repeat; width: 321px; height: 18px; margin: 10px 0 0 0; overflow: hidden; } div#btnMembershipRenewal2010 a { text-decoration: none; width: 100%; display: block; } div.btnReadNewsletter { background: url(/images/common/btn_read_newsletter.gif) no-repeat; width: 179px; height: 18px; margin: 10px 0 0 0; } div.btnReadMoreWork { background: url(/images/common/btn_read_more_work.gif) no-repeat; width: 184px; height: 18px; margin: 14px 0pt 0 207px; } div.btnSeeVolunteerWall { background: url(/images/common/btn_see_volunteer_wall.gif) no-repeat; width: 195px; height: 18px; margin: 6px 0 0 0; } div.btnReadMoreGeneral { background: url(/images/common/btn_read_more_general.gif) no-repeat; width: 202px; height: 18px; margin: 10px 0 0 0; } ul li ul li a { font-size: 8pt; } /* ??? (remove this, and the site could collapse.) */ #footer { margin: 0 auto; width: auto; clear: both; height: 100px; padding: 25px 0 0 0; } #footer #footerContent { width: auto; margin: 0 auto; } /* Progress Bar */ #document div.progressbar { background: white; margin: 6px; overflow: hidden; } #document div.progressbar img { border: none; margin: 0; padding: 0; float: none; } /* Styles made especially to deal with the old ASP apps */ #document #oldApp img { margin: 0; border: none; padding: 0; } #document #oldApp table.resultsTable tr { border-bottom: 1px solid #baccd8; } #document .pagerBorderless * { border: 0 none; } #document tr.headerimages th img { float: left; } #document tr.headerimages th a font { float: left; } div.sturdyBox { border: 1px solid #6b789a; background: #e6f2ed; padding: 7px 5px 7px 5px; width: 600px; } /* ---------------------------------------------------- */ /* Styles for Events Page*/ #symposiumLeft { margin: 0; border: none; padding: 0;} #symposiumLeft #headerImage { background: url(/images/common/symposiumTitle.gif) no-repeat; width: 242px; height: 84px; } #symposiumLeft #sponsor { background: url(/images/common/sponsor.gif) no-repeat; width: 201px; height: 14px; } #symposiumRight { background: url(/images/common/GreyTsunami.jpg) no-repeat; width: 180px; height: 222px; float: right; margin:-94px 41px 0px 0px } #symposiumRight #pdf{ background: url(/images/common/GreyTsunami.jpg) no-repeat; width: 180px; height: 222px; float: right; margin:-94px 41px 0px 0px } #symposiumContent { width: 500px; margin: 187px 0px 0px 0px; border: none; padding: 0;} #symposiumContent #premierSponsor{ background: url(/images/common/premierSponsor.gif) no-repeat; width: 118px; height: 8px; } #symposiumContent #logo{ background: url(/images/common/cmhcschl.gif) no-repeat; width: 122px; height: 53px; } #divDRP ul li { font-size:100%; } .provisionalList { font-size:100%; }