/*----------------------------------------------------------------------------- Website Style Sheet version: 1.0 author: Bryan Miller email: bmiller@practisinc.com website: http://www.compassionandsupport.com/ -----------------------------------------------------------------------------*/ @media screen { /* =General -----------------------------------------------------------------------------*/ html { margin:0; padding:0; background:#d4ebff; } body { padding: 0; margin: 0; background: #3c81cf; font: 16px Arial, Helvetica, sans-serif; color:#355075; text-align: center; /* Centered design work around for IE 5.X and 6 in quirks mode. */ min-width: 940px; /* Centered design work around for Netscape 6. */ overflow: -moz-scrollbars-vertical; } /* Class for clearing floats */ .clear { clear:both; height:0px; overflow:hidden; margin:0; padding:0;} p { margin: 0.8em 0; } img {border:0;} h1, h2, h3, h4, h5 { margin: 0.4em 0; color:#333333; } h1 { font-size: 1.5em; color:#2171C7; } h2 { font-size: 1.3em; } h3 { font-size: 1.1em; } h4 { /* different color */ } h5 { /* different color */ } td { vertical-align: top; } tr.alt {background:#EFF8FF;} tr.alt td {background:#EFF8FF;} sub { vertical-align: baseline; font-size: 0.8em; position: relative; bottom: -0.4em; } sup { vertical-align: baseline; font-size: 0.8em; position: relative; top: -0.4em; } /* =Links -----------------------------------------------------------------------------*/ a:link, a:visited, a:hover { color:#2171C7; text-decoration:underline; } /* =Structure -----------------------------------------------------------------------------*/ #container { width: 940px; margin: 0 auto; text-align: left; /* Centered design work around for IE 5.X and 6 in quirks mode. */ } #content {} #footer { clear:both; background:#d4ebff; line-height:18px; color:#355075; padding:12px 0; } /* =Navigation -----------------------------------------------------------------------------*/ ul#nav_main { height:33px; margin:0; padding:0; list-style-type:none; overflow:hidden; } ul#nav_main li { height:33px; float:left; position:relative; overflow:hidden; } ul#nav_main li span { width:100%; height:100%; position:absolute; } ul#nav_main li a { display:block; cursor:pointer;} * html #nav_main a:hover { background:#ccccff; cursor:pointer;} /* This is an example of what needs to be done for each li in the main navigation unordered list. You can copy this block and just change out the class name, widths and background image names/locations. */ ul#nav_main li.about-us {width:93px;} ul#nav_main li.about-us a span,ul#nav_main li.about-us a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-about-us.gif) no-repeat; } ul#nav_main li.about-us a:hover span,body.about-us ul#nav_main li.about-us a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-about-us.gif) no-repeat 0 -33px; } ul#nav_main li.resource-directory {width:171px;} ul#nav_main li.resource-directory a span,ul#nav_main li.resource-directory a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-resource-directory.gif) no-repeat; } ul#nav_main li.resource-directory a:hover span,body.resource-directory ul#nav_main li.resource-directory a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-resource-directory.gif) no-repeat 0 -33px; } ul#nav_main li.contribute {width:115px;} ul#nav_main li.contribute a span,ul#nav_main li.contribute a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-contribute.gif) no-repeat; } ul#nav_main li.contribute a:hover span,body.contribute ul#nav_main li.contribute a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-contribute.gif) no-repeat 0 -33px; } ul#nav_main li.legislation {width:114px;} ul#nav_main li.legislation a span,ul#nav_main li.legislation a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-legislation.gif) no-repeat; } ul#nav_main li.legislation a:hover span,body.legislation ul#nav_main li.legislation a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-legislation.gif) no-repeat 0 -33px; } ul#nav_main li.research-references {width:195px;} ul#nav_main li.research-references a span,ul#nav_main li.research-references a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-research-references.gif) no-repeat; } ul#nav_main li.research-references a:hover span,body.research-references ul#nav_main li.research-references a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-research-references.gif) no-repeat 0 -33px; } ul#nav_main li.news-events {width:137px;} ul#nav_main li.news-events a span,ul#nav_main li.news-events a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-news-events.gif) no-repeat; } ul#nav_main li.news-events a:hover span,body.news-events ul#nav_main li.news-events a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-news-events.gif) no-repeat 0 -33px; } ul#nav_main li.excellus {width:115px;} ul#nav_main li.excellus a span,ul#nav_main li.excellus a:link span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-excellus.gif) no-repeat; } ul#nav_main li.excellus a:hover span,body.excellus ul#nav_main li.excellus a span {background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-excellus.gif) no-repeat 0 -33px; } #nav_sub { color:#fff; line-height:22px; height:24px; overflow:hidden; padding:0 10px; } #nav_sub a, #nav_sub a:visited { color:#fff; text-decoration:none; } #nav_sub a:hover { color:#fff; text-decoration:underline; } #nav_sub a.small {font-size:9px;} #nav_sub a.medium {font-size:11px;} #nav_sub a.large {font-size:14px;} #nav_sub #nav_sub_left { float:left; display:inline; } #nav_sub #search_utility { float:right; display:inline; } #nav_sub #search_utility form { margin:0; padding:0; } #nav_sub #search_utility form label { margin:0; padding:0; } #nav_sub #search_utility form input#search_query { margin:2px 0 0 5px; padding:0; width:125px; height:16px; border:1px solid #bcdaf8; } #nav_sub #search_utility form input#search_submit { margin:0; padding:0; background:transparent; border:0; color:#fff; cursor:pointer; font: 1em Arial, Helvetica, sans-serif; } #nav_supp { } #nav_supp a, #nav_supp a:visited { color:#355075; text-decoration:none; } #nav_supp a:hover { color:#355075; text-decoration:underline; } /* =Header -----------------------------------------------------------------------------*/ #branding { height:140px; overflow:hidden; } #branding h1 { width:265px; height:130px; margin:0; padding:0; position:relative; overflow:hidden; float:left; display:inline; } #branding h1 span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/logo.gif) no-repeat; } #three_column #branding h2 { width:315px; height:130px; margin:0; padding:0; position:relative; overflow:hidden; float:right; display:inline; } #three_column #branding h2.professionals span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-professionals.gif) no-repeat 0 0; } #three_column #branding h2.professionals a:hover span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-professionals.gif) no-repeat 0 -130px; } * html #three_column #branding h2.professionals a:hover { background:#ccccff; cursor:pointer;} #three_column #branding h2.patients-families span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-patients-families.gif) no-repeat 0 0; } #three_column #branding h2.patients-families a:hover span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-patients-families.gif) no-repeat 0 -130px; } * html #three_column #branding h2.patients-families a:hover { background:#ccccff; cursor:pointer;} #two_column #branding h2 { width:270px; height:120px; margin:0; padding:0; position:relative; overflow:hidden; float:right; display:inline; } #two_column #branding h2.professionals span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-professionals-2col.gif) no-repeat 0 0; } #two_column #branding h2.professionals a:hover span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-professionals-2col.gif) no-repeat 0 -120px; } * html #two_column #branding h2.professionals a:hover { background:#ccccff; cursor:pointer;} #two_column #branding h2.patients-families span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-patients-families-2col.gif) no-repeat 0 0; } #two_column #branding h2.patients-families a:hover span { width:100%; height:100%; position:absolute; cursor:pointer; background:url(http://www.compassionandsupport.org/images/site_design/buttons/btn-patients-families-2col.gif) no-repeat 0 -120px; } * html #two_column #branding h2.patients-families a:hover { background:#ccccff; cursor:pointer;} #two_column #branding img { float:right; display:inline; } #branding_sub { height:257px; overflow:hidden; background:url(http://www.compassionandsupport.org/images/site_design/branding-sub.jpg) no-repeat top right; position:relative; /* keep items with absolute positioning inside this container */ } #branding_sub #flash { height:257px; width:321px; overflow:hidden; float:left; display:inline; } #branding_sub #branding_sub_callouts { padding:0; margin:0; } #branding_sub #branding_sub_callouts ul { height:100px; margin:0; padding:145px 0 0 0; list-style-type:none; overflow:hidden; float:right; display:inline; } #branding_sub #branding_sub_callouts ul li { height:100px; float:left; display:inline; position:relative; overflow:hidden; margin:0 37px 0 29px; padding:0; } #branding_sub #branding_sub_callouts ul li span { width:100%; height:100%; position:absolute; margin:0; padding:0; } #branding_sub #branding_sub_callouts ul li a { display:block; cursor:pointer; } * html #branding_sub #branding_sub_callouts ul a:hover { background:#ccccff; cursor:pointer;} #branding_sub #branding_sub_callouts ul li.advance-care-planning {width:235px;} #branding_sub #branding_sub_callouts ul li.advance-care-planning a span,#branding_sub #branding_sub_callouts ul li.advance-care-planning a:link span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-advance-care-planning.gif) no-repeat; } #branding_sub #branding_sub_callouts ul li.advance-care-planning a:hover span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-advance-care-planning.gif) no-repeat 0 -100px; } #branding_sub #branding_sub_callouts ul li.take-action {width:235px;} #branding_sub #branding_sub_callouts ul li.take-action a span,#branding_sub #branding_sub_callouts ul li.take-action a:link span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-take-action.gif) no-repeat; } #branding_sub #branding_sub_callouts ul li.take-action a:hover span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-take-action.gif) no-repeat 0 -100px; } /* =Three Column -----------------------------------------------------------------------------*/ body#three_column { background:#3c81cf url(http://www.compassionandsupport.org/images/site_design/body-bg-3col.jpg) repeat-x; } #three_column #content { background: url(http://www.compassionandsupport.org/images/site_design/content-3col.gif) repeat-y top left; } #three_column #content #content_top { background: url(http://www.compassionandsupport.org/images/site_design/content-top-3col.gif) no-repeat top left; } #three_column #content #content_bottom { background: url(http://www.compassionandsupport.org/images/site_design/content-bottom-3col.gif) no-repeat bottom left; min-height:300px; height:auto !important; height:300px; padding-bottom:10px; } #three_column #content a, #three_column #content a:visited { color:#317acc; font-weight:bold; text-decoration:none; } #three_column #content a:hover { color:#317acc; font-weight:bold; text-decoration:underline; } #three_column #content strong { color:#317acc; font-weight:bold; } #three_column #content ul {list-style-type:none;} #three_column #content ul li { margin:0; padding:4px; } #three_column #content #content_callouts { height:110px; overflow:hidden; margin:0 0 0 3px; } #three_column #content #content_callouts ul { height:110px; margin:0; padding:0; list-style-type:none; overflow:hidden; } #three_column #content #content_callouts ul li { height:110px; float:left; position:relative; overflow:hidden; margin:0; padding:0; } #three_column #content #content_callouts ul li span { width:100%; height:100%; position:absolute; margin:0; padding:0; } #three_column #content #content_callouts ul li a { display:block; cursor:pointer;} * html #three_column #content #content_callouts ul a:hover { background:#ccccff; cursor:pointer;} #three_column #content #content_callouts ul li.play-molst-videos {width:235px;} #three_column #content #content_callouts ul li.play-molst-videos a span,#three_column #content #content_callouts ul li.play-molst-videos a:link span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-play-molst-videos.gif) no-repeat; } #three_column #content #content_callouts ul li.play-molst-videos a:hover span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-play-molst-videos.gif) no-repeat 0 -110px; } #three_column #content #content_callouts ul li.find-molst-trainer {width:230px;} #three_column #content #content_callouts ul li.find-molst-trainer a span,#three_column #content #content_callouts ul li.pfind-molst-trainer a:link span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-find-molst-trainer.gif) no-repeat; } #three_column #content #content_callouts ul li.find-molst-trainer a:hover span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-find-molst-trainer.gif) no-repeat 0 -110px; } #three_column #content #content_callouts ul li.molst-training-center {width:230px;} #three_column #content #content_callouts ul li.molst-training-center a span,#three_column #content #content_callouts ul li.pmolst-training-center a:link span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-molst-training-center.gif) no-repeat; } #three_column #content #content_callouts ul li.molst-training-center a:hover span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-molst-training-center.gif) no-repeat 0 -110px; } #three_column #content #content_callouts ul li.order-molst-forms {width:235px;} #three_column #content #content_callouts ul li.order-molst-forms a span,#three_column #content #content_callouts ul li.order-molst-forms a:link span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-order-molst-forms.gif) no-repeat; } #three_column #content #content_callouts ul li.order-molst-forms a:hover span {background:url(http://www.compassionandsupport.org/images/site_design/callouts/callout-order-molst-forms.gif) no-repeat 0 -110px; } #three_column #content_main { float:left; display:inline; width:280px; padding:0 12px 0 20px; overflow:hidden; } #three_column #content_main h1 { width:285px; height:20px; margin:0; padding:0; position:relative; overflow:hidden; } #three_column #content_main h1 span { width:100%; height:100%; position:absolute; background:url(http://www.compassionandsupport.org/images/site_design/txt-welcome.gif) no-repeat; } #three_column #content_main p {line-height:1.3em;} #three_column #content_main li {line-height:1.3em;} #three_column #content_sub { float:left; display:inline; width:273px; padding:0 20px; overflow:hidden; } #three_column #content_sub p {line-height:1.3em;} #three_column #content_sub li {line-height:1.3em;} #three_column #content_sub h1 { width:120px; height:20px; margin:0; padding:0; position:relative; overflow:hidden; } #three_column #content_sub h1 span { width:100%; height:100%; position:absolute; background:url(http://www.compassionandsupport.org/images/site_design/txt-featured-topics.gif) no-repeat; } #three_column #content_supp { float:left; display:inline; width:270px; padding:0 0 0 20px; overflow:hidden; } #three_column #content_supp p {line-height:1.3em;} #three_column #content_supp li {line-height:1.3em;} #three_column #content_supp h1 { width:130px; height:20px; margin:0; padding:0; position:relative; overflow:hidden; } #three_column #content_supp h1 span { width:100%; height:100%; position:absolute; background:url(http://www.compassionandsupport.org/images/site_design/txt-news-events.gif) no-repeat; } /* =Two Column -----------------------------------------------------------------------------*/ body#two_column { background:#3c81cf url(http://www.compassionandsupport.org/images/site_design/body-bg-2col.jpg) repeat-x; } #two_column #content { margin-top:15px; background: url(http://www.compassionandsupport.org/images/site_design/content-2col.gif) repeat-y top right; } #two_column #content #content_top { background: url(http://www.compassionandsupport.org/images/site_design/content-top-2col.gif) no-repeat top right; min-height:300px; height:auto !important; height:300px; padding-bottom:10px; } #two_column #content_main { float:right; display:inline; width:650px; padding:15px; overflow:hidden; line-height:1.3em; } #two_column #content_main p {line-height:1.3em;} #two_column #content_main li {line-height:1.3em;} #two_column #content_sub { width:215px; padding:0 0 0 10px; overflow:hidden; color:#fff; } #two_column #content_sub #in_this_section { border-bottom:1px solid #88b2e2; padding-bottom:20px; } #two_column #content_sub #in_this_section h2 { width:150px; height:20px; margin:0; padding:0; position:relative; overflow:hidden; } #two_column #content_sub #in_this_section h2 span { width:100%; height:100%; position:absolute; background:url(http://www.compassionandsupport.org/images/site_design/txt-in-this-section.gif) no-repeat; } #two_column #content_sub #in_this_section ul { list-style-type:square; color:#fff; margin:5px 0 0 17px; } #two_column #content_sub #in_this_section ul li { padding:2px 0; } #two_column #content_sub #in_this_section a, #two_column #content_sub #in_this_section a:visited { color:#fff; text-decoration:none; } #two_column #content_sub #in_this_section a:hover { color:#fff; text-decoration:underline; } #two_column #content_sub #callouts { width:215px; overflow:hidden; margin:10px 0; } .video-img { margin:0 0 20px 15px; } .getflashplayer {margin-top:15px;} /* =Footer -----------------------------------------------------------------------------*/ #site_info { } #site_info a, #site_info a:visited { color:#355075; text-decoration:none; } #site_info a:hover { color:#355075; text-decoration:underline; } /* =Forms -----------------------------------------------------------------------------*/ form { padding: 0.4em; margin: 0; } form em { color: #FF0000; } form p { clear: left; margin: 0; padding: 0; padding-top: 0.4em; } form p label { float: left; width: 25%; } fieldset { padding: 0.6em; padding-left: 0.7em; border:1px solid #ccc; } fieldset legend { padding: 0; margin-bottom: 0.2em; font-weight: bold; color: #000000; font-size: 1.1em; } input.txt { width: 200px; } textarea { width: 300px; height: 100px; } .formerror { border: 1px solid red; background-color : #FFCCCC; width: auto; padding: 0.4em; margin-bottom: 0.4em; } .formerror ul { padding-left: 1.7em; } blockquote { margin:0 20px; } /* =Lists -----------------------------------------------------------------------------*/ #two_column #content_main ul { list-style-type:disc; margin:0 0 0 40px; } #two_column #content_main ol { list-style-type:decimal; margin:0 0 0 40px; } #two_column #content_main li { margin:0; padding:2px 0;} /* =Misc -----------------------------------------------------------------------------*/ img.left { float:left; margin:0 10px 10px 0; } img.right { float:right; margin:0 0 10px 10px; } p.left {text-align:left;} p.right {text-align:right;} p.center {text-align:center;} .callout-box {background:#D7EBFF; border:1px solid #B4D2F4; padding:10px;} }