/* @override http://www.chprms.com.clint.sandbox.dev.cyberwoven.local/css/screen.css */ /* --------------------------------------------- CHPRMS Screen Style Sheet author: Cyberwoven version: 2009.08 ----------------------------------------------- */ body { font:normal 12px/18px Arial, Helvetica, sans-serif; color:#666; margin:0; padding:0; background:#fff url(../images/bodybg.png) repeat-x center 40px; text-align:center;} a {color:#1db7f1; text-decoration:underline;} a:hover {text-decoration:none;} .content .leftcol a {font-family:Georgia, "Times New Roman"; text-decoration:none;} .content .leftcol a:hover {text-decoration:underline;} .content .leftcol ul, .content .leftcol ol {margin:2px 0 25px 0; padding:0; position:relative; color:#555;} .content .leftcol ol {margin-left:20px;} .content .leftcol ul ul, .content .leftcol ul ol, .content .leftcol ol ol, .content .leftcol ol ul {margin:2px 0 5px 20px; padding:0; font-size:11px;} .content .leftcol ul li, .content .leftcol ol li {padding:1px 0; margin-left:10px;} .content .leftcol ul li {list-style:none; padding-left:18px; background:url(../images/bullet-cross.gif) no-repeat left 7px;} .content .leftcol li ul li {padding-left:15px; background:url(../images/bullet-cross2.gif) no-repeat left 8px;} .content .leftcol li li {margin-left:0px;} .content .leftcol img {float:right; margin:10px; padding:10px; border:1px dotted #c6c6c6;} h2 {font:normal 32px/45px "Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif; margin:0; padding:0;} h3 {font:normal 28px/32px "Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif; margin:25px 0 5px 0; padding:0 0 1px 0; border:1px dotted #ccc; border-width:0 0 1px 0; color:#98a150;} h4 {font:normal 16px/20px "Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif; margin:15px 0 2px 0; padding:0; text-transform:uppercase; color:#333;} p {margin:0 0 15px 0; padding:0;} blockquote {margin:20px 30px; padding:20px 30px 20px 60px; background:#f7f7f7 url(../images/blockquotebg.gif) no-repeat 10px 10px; border:1px dotted #ccc; border-width:1px 0; font-size:14px; line-height:22px; font-style:italic; font-family:georgia, "times new roman", "times", serif;} fieldset {margin:0; padding:0; display:inline; border:none;} .textbox {border:1px solid #333; background:none; padding:2px 5px;} textarea {border:1px solid #333; background:none; padding:2px 5px;} /* Reusables ----------------------------------------------- */ .hidden {display:none;} .alt {display:none;} .clear {clear:both; display:block; overflow:hidden; width:0; height:0;} table.data {text-align:left;} table.data th {padding:2px 5px; border-bottom:1px solid #ccc; font-weight:bold; line-height:18px; text-align:left; color:#600;} table.data td {padding:2px 5px; line-height:16px; border-bottom:1px solid #ccc; } table.data tr.even td {background-color:#eee;} p.intro {font:normal 18px/24px "Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif; margin:5px 0 10px 0; padding:0; color:#333;} .floatleft {float:left;} .floatright {float:right;} .nofloat {float:none !important;} a.linkbutton {display:inline-block; clear:both; padding:3px 5px; font-weight:bold; background:#f7f7f7; color:#0696cd; border:1px dotted #ccc; margin:5px 0; text-decoration:none;} a.linkbutton:hover {text-decoration:none !important; background:#fff; border:1px solid #0696cd;} body.news .linkbutton {float:right;} #rss { position:absolute; top:10px; right:325px; background:url(../images/rss-icon.png) no-repeat top left; height:24px;padding-left:30px; line-height:24px; } /* Layout Blocks ----------------------------------------------- */ a.skiplink {display:block; position:absolute; top:0; left:0; font-size:1px; text-indent:-9999px;} .headerwrapper {background:url(../images/headerbg.jpg) no-repeat center 40px; min-width:960px;} .header {height:140px; width:960px; margin:0 auto; text-align:left; position:relative;} .header h1 {display:block; position:absolute; top:40px; left:0; margin:0 0 0 -8px; padding:0;} .header h1 a {display:block; width:300px; height:100px; background:url(../images/chprms-logo.jpg) no-repeat 0 0; font-size:1px; text-indent:-9999px; outline:none;} .header h1 a:hover {background-position:0 -101px;} .header h2 {font-size:15px; line-height:40px; margin:0; padding:0 0 0 20px;} .header h2 a {color:#555; text-decoration:none; outline:none;} .header h2 a:hover {color:#000;} #searchbox {display:none; position:absolute; top:0; right:0; width:245px; height:85px; text-align:left; background:url(../images/searchbox.png) no-repeat left bottom; z-index:150;} #searchbox label {display:none;} #searchbox .textbox {position:absolute; left:40px; bottom:54px; width:130px; padding:0; border:none; background:#fff;} #searchbox a#searchbutton {position:absolute; right:0; bottom:50px; width:65px; height:25px; background:none; border:none; outline:none; font-size:1px; text-indent:-9999px;} #searchbox a#closesearch {display:block; position:absolute; bottom:0; right:0; width:75px; height:30px; outline:none; font-size:1px; text-indent:-9999px;} ul.mainnav {display:block; position:absolute; top:103px; right:20px; margin:0; padding:0; list-style:none;} ul.mainnav li {display:inline; margin:0; padding:0;} ul.mainnav li a {display:block; outline:none; float:left; margin:0 0 0 10px; padding:0 0 0 9px; border-left:1px solid #fff; text-decoration:none; font-size:15px; line-height:15px; letter-spacing:1px; color:#fff; text-transform:uppercase;} ul.mainnav li a:hover, ul.mainnav li.active a, ul.mainnav li.active a:hover {text-decoration:none; color:#00aeef;} ul.mainnav li.first a {border:none;} ul.headernav {display:block; position:absolute; top:16px; right:20px; margin:0; padding:0; list-style:none;} ul.headernav li {display:inline; margin:0; padding:0;} ul.headernav li a {display:block; outline:none; float:left; margin:0 0 0 10px; padding:0 0 0 9px; text-decoration:none; line-height:12px; font-size:11px; color:#006489; border-left:1px solid #006489;} ul.headernav li a:hover {color:#006489; text-decoration:underline;} ul.headernav li.first a {border:none;} .contentwrapper {background:url(../images/contentwrapper-green.png) repeat-x; min-width:960px;} .pagetop {width:960px; height:240px; overflow:hidden; margin:0 auto; text-align:right; position:relative; background:url(../images/pagetopbg.png) no-repeat right top;} .pagetop img {position:absolute; top:0; left:0;} .pagetop h2 {display:block; position:absolute; margin:0; padding:35px 5px 2px 30px; top:157px; right:320px; background:#f7f7f7; color:#b5b5b5; font-size:30px; line-height:35px;} .content {width:960px; margin:0 auto; padding:0 0 20px 0; text-align:left; position:relative; background:url(../images/dots-vertical.gif) repeat-y 680px 0;} .content .leftcol {width:620px; margin:0 0 0 20px; float:left;} .content .rightcol {width:280px; float:right;} .content .rightcol h3 {display:block; margin:-38px 0 15px 70px; font-size:20px; line-height:24px; text-transform:uppercase; font-weight:normal; border:none;} .content .rightcol h3 a, .content .rightcol h3 a:hover {text-decoration:none; color:#0696cd; cursor:default;} ul.subnav {display:block; margin:0 0 15px 0; padding:0; list-style:none;} ul.subnav li {display:inline; margin:0; padding:0;} ul.subnav li a {display:block; padding:4px 5px 4px 70px; color:#0696cd; text-decoration:none; font-size:12px; line-height:18px;} ul.subnav li a:hover {text-decoration:underline;} ul.subnav li.active a {background:url(../images/subnav-active.png) no-repeat 50px 7px; font-weight:bold;} ul.subnav li ul {margin:0 0 5px 80px; padding:0; list-style:square inside none;} ul.subnav li ul li {display:list-item; margin:1px 0; padding:0; list-style:square inside none; color:#0696cd;} ul.subnav li ul li a, ul.subnav li.active ul li a {display:inline; margin:0; padding:0; font-weight:normal; background:none;} ul#social {display:block; margin:0; padding:0; list-style:none; border-top:1px dotted #ddd;} ul#social li {display:inline-block; margin:0; padding:0; border-bottom:1px dotted #ddd; background:url(../images/social-hover.jpg) no-repeat -9999px 0;} ul#social li:hover, ul#social li.hover {background-position:right top;} ul#social li a {display:block; width:210px; padding:12px 0 10px 70px; color:#222; font:normal 12px/12px Tahoma, Arial, Helvetica, sans-serif; text-decoration:none; text-transform:uppercase; background: url(../images/social-iconspirte_spring.jpg) no-repeat;} ul#social li a strong {display:block; text-transform:none; font:bold 24px/26px "Trebuchet MS", Arial, Helvetica, sans-serif;} ul#social li.facebook a {background-position:8px 0;} ul#social li.facebook a strong {color:#00aeef;} /*ul#social li.wallie a {background-position:8px -60px;} ul#social li.wallie a strong {color:#f5a406;}*/ ul#social li.conference a {background-position:8px -120px;} ul#social li.conference a strong {color:#fd7e49;} /*ul#social li.conference a {background-position:8px -120px;} ul#social li.conference a strong {color:#45bd41;}*/ ul#social li.google a {background-position:8px -180px;} ul#social li.google a strong {color:#067bc4;} #footerwrapper {clear:both; margin:0 0 20px 0; height:62px; background:#111213 url(../images/footerwrapperbg.png);} #footer {width:960px; height:62px; line-height:62px; margin:0 auto; color:#fff; text-align:right; font-size:11px;} a.cyberwoven {color:#fff; margin-right:20px; text-decoration:none;} a.cyberwoven:hover {text-decoration:none;} a.cyberwoven:hover span {color:#CB5201;} /* Homepage Specific ----------------------------------------------- */ body.home {background-image:url(../images/home-bodybg.gif);} body.home .content {background:none;} body.home .contentwrapper a {text-decoration:none;} body.home .contentwrapper a:hover {text-decoration:underline;} body.home .contentwrapper {background:url(../images/homeflash-MainFlash.jpg) no-repeat center top; min-width:960px;} #homeflash {height:410px;} #homeflash h2 {position:absolute; top:100px; left:400px; font-size:70px; line-height:75px; text-transform:uppercase; color:#422503; font-weight:bold;} #homeflash p {position:absolute; top:165px; left:400px; width:520px; font-size:30px; line-height:28px; color:#7e2b12;} #homeflash ul {position:absolute; top:270px; left:620px; margin:0; padding:0 0 0 10px; border-left:20px solid #7e2b12;} #homeflash ul li {margin:0; padding:2px 0 2px 5px;} #homeflash ul li a {font-size:20px; color:#7e2b12; background:none; margin:0; padding:0; text-transform:none;} .homeleft, .homeright {width:440px;} .homeleft {float:left; padding-left:20px;} .homeright {float:right; padding-right:20px;} body.home .contentwrapper ul {margin:3px 0 25px 0; padding:0; list-style:none;} body.home .contentwrapper li {margin:0; padding:0;} body.home .contentwrapper li a {background:url(../images/bullet-cross-home.gif) no-repeat left center; padding-left:12px; text-transform:uppercase;} body.home .welcome {background:url(../images/homewelcome.gif) no-repeat 20px 0; height:140px; margin:20px 0;} body.home .welcome h3 {display:none;} body.home .welcome p {font-size:17px; line-height:24px; margin:0; padding:0;} body.home .welcome p strong {color:#333;} body.home .welcome .homeleft p {padding-left:50px;} body.home .content .welcome ul {display:block; background:#eee; margin:10px 0 0 0; padding:10px 20px;} .homeevents h3, .homenews h3 {font-size:32px; line-height:60px; color:#333; background:url(../images/home-h3icons.gif) no-repeat; margin:0; border:none !important;} .homeevents h3 {padding:0 0 0 72px;} .homenews h3 {padding:0 0 0 46px; background-position:0 -60px;} body.home .content h4 {text-transform:none; color:#333; font-size:16px; margin:0; padding:0;} body.home .content h4 a {font-size:18px;} .homeevents p, .homenews p {line-height:14px;} ul#homesocial {display:block; margin:0; padding:0; height:99px; width:960px; list-style:none; background: url(../images/homesocial-fbspring.jpg) no-repeat; position:relative;} ul#homesocial li {display:block; margin:0; padding:0; float:left;} ul#homesocial li a {display:block; height: 99px; text-indent: -9999px; background: none;} ul#homesocial li.google a {width: 320px; position:absolute; left:0;} ul#homesocial li.facebook a {width: 220px; position:absolute; left:320px; } ul#homesocial li.wallie a {width: 260px; position:absolute; left:320px; } ul#homesocial li.conference a {width: 320px; position:absolute; left:640px;} /* Specialty Pages ----------------------------------------------- */ .contactbox {margin-left:60px;} .contactbox legend { text-indent:-9999px; } .contactbox label { float:left; width:200px; margin:14px 10px 2px 1px; display:block; clear:left; border-bottom:solid 1px orange; } .contactbox label.required { font-weight:bold; color:#000; } .contactbox label span.required { float:right; margin:-22px 0 0 0; color:#f15124; font-weight:normal; font-style:italic; font-family:georgia, "times new roman", "times", serif; } .contactbox label, .contactbox input { line-height:22px; } .contactbox input, .contactbox textarea {font-size:14px; padding:3px 2px 4px 2px; margin: 12px 0 1px 0; border:1px solid orange; } .contactbox input:focus, .contactbox textarea:focus { background:#ffefd1; } .contactbox input.textbox { width:365px; } .contactbox textarea {display:block; width:365px; height:120px; margin-bottom:20px; overflow:hidden; float:left;} .contactbox a.linkbutton {display:block; clear:both; margin:5px 0 0 210px; width:200px; text-align:center;} .contactbox .errorMessage { color:#a2aae0 !important; font-size:11px; } .contactbox .errorMessage.textarea {clear:both; display:block; padding:0 0 0 210px;} #boardprofiles img { margin-top:0; } #boardprofiles p.nophoto { margin:0 0 0 20px; } /* Forms ---------------------------- */ fieldset.searchform { padding-left:15px;} fieldset.searchform label { position:absolute; left:-9999px; } fieldset.searchform input { width:300px; } fieldset.searchform input[type="submit"] { margin:15px 0 10px 5px; padding:2px 22px 2px 34px; width:auto; background-position:left -5px; } div.formrow {display:block; padding:10px 0 0 0; clear:both;} div.formrow label {display:block; width:170px; text-align:right; float:left; margin:0 5px 0 0; padding:5px 8px 4px 12px; font-size:13px; color:#333; background:#f7f7f7; border-bottom:1px dotted #ccc;} div.formrow label.required {background:#f7f7f7 url(../images/required-stripe.gif) no-repeat 0 0; font-weight:bold;} div.formrow input.textbox {display:block; width:200px; border:1px solid #ccc; margin:0 10px 0 0; font-size:12px; line-height:20px; padding:5px 5px;} div.formrow textarea {display:block; width:350px; height:125px; border:1px solid #ccc; margin:0 10px 0 0;} div.formrow input.textbox:focus, div.formrow textarea:focus {border-color:#333;} div.formrow span {display:block; padding-left:195px; margin:0; clear:left; font-size:11px; color:#555; font-style:italic;} div.formrow span.error {display:inline; padding-left:0; font-style:normal;} div.formrow span.error div {display:block; padding-left:195px;} div.formrow select {margin:4px 0 0 0;} input.formsubmit {clear:left; margin:0 0 0 190px; display:block; float:left; font-size:14px; line-height:20px; background:#f7f7f7; color:#0696cd; border:1px dotted #ccc; padding:2px 25px;} input.formsubmit:hover {border:1px solid #0696cd;} div.formrow table {position:relative; left:-4px; margin:0; padding:0; text-align:left; border-spacing:0;} div.formrow table tr.even td {background:none;} div.formrow table tr td {padding:0 0 2px 0; line-height:14px; border:none; margin:0; overflow:hidden;} div.formrow table tr td label {display:inline; width:auto; text-align:left; float:none; margin:0; padding:0 0 0 5px; background:none; border:none; color:#333; font-size:12px;} .searchform div.formrow {height:75px; width:600px; padding-top:10px;} .searchform div.formrow .textbox {float:left; margin-right:5px;} .searchform div.formrow input.formsubmit {clear:none; float:left; margin:-1px 0 0 0; padding:4px 15px;} div.checkbox input {float:left; margin:0 6px 0 196px; clear:left;} div.checkbox label {float:left; background:none; color:#333; padding:0; margin:0; text-align:left; font-size:12px;} /* News & Calendar Sections ----------------------------------------------- */ .content .leftcol ul.pager {display:block; margin:0; padding:0; list-style:none;} .content .leftcol ul.pager li {display:inline; margin:0; padding:0 4px; background:none;} .content .leftcol ul.pager li strong {padding-right:15px; margin-right:6px; border-right:1px solid #ccc;} .categoryselector {border-bottom:1px dotted #ccc; padding:10px 0; margin:20px 0 10px 0;} .categoryselector label {font-size:15px; font-weight:normal; padding:0 5px 0 0;} table.categorycheckboxes {margin:0 0 10px 0;} table.categorycheckboxes td {width:110px;} table.categorycheckboxes label {font-size:12px; padding:0;} a.togglecalendar {float:right;} .newsblock {position:relative; clear:both;} .newsblock .event_date {position:absolute; top:0; left:0; width:90px; font-size:14px; line-height:35px; text-align:center; color:#888; background:#f7f7f7;} .newsblock h3 {padding-left:110px; font-size:20px;} .newsblock p.description {padding-left:110px;} .event_header {position:relative;} .event_header h3 {padding-right:130px;} .event_header .event_date {display:block; position:absolute; top:0; right:0; font-size:14px; line-height:35px; text-align:right; color:#888;} a.newsback {display:inline-block; float:right; clear:both; padding:3px 5px; font-weight:bold; background:#f7f7f7; color:#0696cd; border:1px dotted #ccc; margin:5px 0; text-decoration:none;} a.newsback:hover {text-decoration:none !important; background:#fff; border:1px solid #0696cd;} .calendarbox a {border-bottom:none !important;} .calendarbox {font-size:11px !important; width:620px;} .calendarbox .calendarheader {background:#aaa; color:#222; font-weight:bold;} .calendarbox .calendarheader td {text-align:center !important; font-size:14px; line-height:20px;} .calendarbox .nextprevmonth a {display:block; text-align:center;} .calendarbox .dayheaders {background:#ccc;} .calendarbox .normalday {background:#fff;} .calendarbox .othermonth {background:#eee;} .calendarbox .today {background:#edf3fa; color:#333;} .calendarbox ul {display:inline; background:none; padding:0 !important; margin:0 !important; list-style:none !important;} .calendarbox li {padding:0; margin:0; color:#004460; background:none;} .calendarbox li:first-child {background:none; padding-top:0;} .calendarbox ul li a {display:block; font-size:10px; line-height:11px; font-weight:normal; padding:2px; text-align:left; float:left; max-height:22px; overflow:hidden;} .calendarbox h5 {margin:0; padding:2px;} /* Photo Gallery ----------------------------------------------- */ ul#photogallery {display:block; margin:10px 0; padding:0; list-style:none;} ul#photogallery li {display:inline; margin:0; padding:0; background:none !important;} ul#photogallery li a, ul.photogallery li a:link {display:block; float:left; margin:0 10px 10px 0; width:111px; height:111px; padding:0; background:#ccc;} ul#photogallery li a:hover {text-decoration:none; background:#777;} ul#photogallery li a img {display:block; position:relative; border:none; margin:5px 0 0 5px; padding:0; float:none;} ul#photogallerylist {display:block; margin:10px 0; padding:0; list-style:none;} ul#photogallerylist li {display:block; min-height:65px; height:auto !important; height:65px; margin:0; padding:10px 0 5px 0; background:none !important; border-bottom:1px dotted #ccc; position:relative;} ul#photogallerylist li img {position:absolute; top:5px left:5px; width:50px; height:50px; margin:0; padding:0;} ul#photogallerylist li a img {border:2px solid #777;} ul#photogallerylist li a:hover img {border:2px solid #333;} ul#photogallerylist li strong {display:block; margin:0 0 5px 60px; font-size:18px;} ul#photogallerylist li p {display:block; margin:0px 0 0 60px;} #lightbox{position:absolute; top:0; left:0; width:100%; z-index:100; text-align:center; line-height:0; color:#333;} #lightbox a img{border:none;} #outerImageContainer{position:relative; background-color:#fff; width:250px; height:250px; margin:0 auto;} #imageContainer{padding: 10px;} #loading{position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0;} #hoverNav{position:absolute; top:0; left:0; height:100%; width:100%; z-index:10;} #imageContainer>#hoverNav{left:0;} #imageContainer img {float:none; margin:0; padding:0; border:none;} #hoverNav a{outline: none;} #prevLink, #nextLink{width:49%; height:100%; background:transparent url(../images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */ display:block;} #prevLink {left:0; float:left;} #nextLink {right:0; float:right;} #prevLink:hover, #prevLink:visited:hover {background:url(../images/lightbox/prev.gif) left 50% no-repeat; } #nextLink:hover, #nextLink:visited:hover {background:url(../images/lightbox/next.gif) right 50% no-repeat; } /*** START : next / previous text links ***/ #nextLinkText, #prevLinkText{color:#FF9834; font-weight:bold; text-decoration: none;} #nextLinkText{padding-left:20px;} #prevLinkText{padding-right: 20px;} /*** END : next / previous text links ***/ /*** START : added padding when navbar is on top ***/ .ontop #imageData {padding-top:5px;} /*** END : added padding when navbar is on top ***/ #imageDataContainer{font:10px Verdana, Helvetica, sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em;} #imageData{padding:0 10px;} #imageData #imageDetails{width: 70%; float:left; text-align:left; } #imageData #caption{font-weight:bold;} #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; } #imageData #helpDisplay {clear: left; float: left; display: block; } #overlay{position: absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#000; opacity:0.6; display:none;} .clearfix:after {content: "."; display:block; height:0; clear:both; visibility:hidden;} * html>body .clearfix {display:inline-block; width:100%;} * html .clearfix { /* Hides from IE-mac \*/ height: 1%; /* End hide from IE-mac */ }