/* --------------------------------------- GENERAL / RESETS ---------------------------------------*/ body, html { margin:0; padding:0; } body { background:#f5f5f5; font-family: Helvetica, Arial, sans-serif; font-size:13px; color:#4f5357; } #wrapper { margin:0px auto 0; width:960px; background:url(/images/new_design/top-menu.png) 100% 0% no-repeat; position:relative; } a { color:#000;} a:hover { color:#2689a3; } a.redlink { color:#FF0000;} a.link { color:#000; cursor:pointer;} a.link:hover { color:#2689a3;cursor:pointer; } h2 { margin:0em 0 1em 0; padding:0 0 0 0; font-size:20px; color:#006883; position:relative; } h2 small { position:absolute; top:4px; right:0; color:#848f91; } h2 small .horizontal-menu li { margin:0; padding:0;} h2 small a { color:#848f91; border-right:2px solid #848f91; padding:0 8px 0 8px;} h2 small a:hover { text-decoration:underline;} h2 small li.last a { border:none;} h3 { font-size:16px;} /* --------------------------------------- TOP : LOGO, SEARCH FORM ETC ---------------------------------------*/ #logo { display:block; float:left; } #top h2 { margin:10px 0 0 64px; float:left; display:none; width:450px; color:#333940; font-size:25px; border:none; } #top-color { height:250px; width:100%; z-index:-2; position:absolute; background:#3c4f5c;} #bg-bars {height:250px; width:100%; position:absolute; top:0; background:url(/images/new_design/top-bar-repeat.png) repeat-x 0% 33px; } #searchWrapper { position:absolute; right:20px; top:5px;} #searchWrapper p { margin:0; padding:0; } #search { margin:0; padding:0; } #search input { width:133px; height:20px; padding:1px 27px 0 8px; border:none; color:#333; font-size:13px; background:url(../images/new_design/search.jpg) no-repeat; } #search #searchSubmit { position:absolute; top:-4px; right:10px; background:transparent; height:20px; width:20px; cursor:pointer; } .rss { background:url(../images/rss-icon.jpg) no-repeat top right; height:16px; color:#666666; font-weight:bold; padding-right:25px; } .rss:hover { color:#666666; text-decoration:underline; } #logged-in { color:#fff; position:absolute; top:7px; right: 220px; } #logged-in img{ border:none; } #logged-in em { margin-right:10px;} #logged-in a { color:#fff;} #adminMenu {position:absolute; right:480px; top:7px; } #adminMenu a { color:#fff;} /* --------------------------------------- NAVIGATION: mainMenu ---------------------------------------*/ #mainMenu { margin:31px 0 55px 10px; padding-top:5px; width:942px; font-family:Verdana,sans-serif; text-transform:uppercase; position:relative; } #mainMenu table { margin:0px 0 0 14px; padding:0; height:27px; border-top:1px solid #fff; border-bottom: 1px solid #fff; border-collapse:collapse; text-align:center; width:928px; } #mainMenu td { border-right:1px solid #fff; padding:1px; margin-right:0; float:none; } #mainMenu td a { display:block; text-align:center; padding:6px 15px 6px 15px; color:#fff; font-size:11px; font-weight:bold; } #mainMenu td a:hover, #mainMenu td.active a { color:#333; background:url(/images/new_design/button-hover.jpg) repeat-x; } #mainMenu ul { margin:0px 0 0 14px; height:27px; border-top:1px solid #fff; border-bottom: 1px solid #fff; display:table; text-align:center; width:928px; } #mainMenu li { border-right:1px solid #fff; padding:1px; display:table-cell; float:none; margin-right:0; } #mainMenu li a {display:block; text-align:center; padding:6px 15px 6px 15px; color:#fff; font-size:11px; font-weight:bold; } #mainMenu li a.admin { color:#ff0000; font-size:12px; font-weight:500; } #mainMenu li:hover a, #mainMenu li.active a { color:#333; background:url(/images/new_design/button-hover.jpg) repeat-x; } ul#categories { padding:0px; font-size:11px; color:#b5b5b5; list-style:none; position:relative; z-index:500; border:none; margin:5px auto; height:auto;} ul#categories li { margin:0 1em 0 0; padding:0; display: inline; border:none; } #categories li a { color:#848e91; text-decoration:none; padding:5px; display:inline;} #categories a.selected { text-decoration:none; font-weight:bold; color:white;} ul#categories a:hover { text-decoration:underline; color:white; background:none;} ul#categories1 { padding:0px; font-size:11px; color:#b5b5b5; list-style:none; position:relative; z-index:500; border:none; margin:5px auto; height:auto;} ul#categories1 li { margin:0 1em 0 0; padding:0; display: inline; border:none; } #categories1 li a { color:#848e91; text-decoration:none; padding:5px; display:inline;} #categories1 a.selected { text-decoration:none; font-weight:bold; color:black;} ul#categories1 a:hover { text-decoration:underline; color:black; background:none;} /* --------------------------------------- NAVIGATION CLASSES: .horizontal-menu, .vertical-menu etc... ---------------------------------------*/ .horizontal-menu { margin:0; padding:0; color:white; } .horizontal-menu li, .horizontal-menu td { float:left; margin:0 1em 0 0; list-style:none;} .horizontal-menu li a , .horizontal-menu td a { display:block; text-decoration:none; color:white; } /* --------------------------------------- MAIN CONTENT ---------------------------------------*/ #mainContent { min-height:200px; width:906px; margin-left:19px; margin-top:25px; padding-left:20px; } #share-banner { width:931px; background:url(/images/group-banner-center.jpg) repeat-y; text-align:center; margin:0px 0 0 21px; float: left; } .share-banner-top { background:url(/images/group-banner-top.jpg) no-repeat; height:20px; width:931px; position:relative; z-index:400; margin:0 0 0 21px; } .share-banner-bottom { background:url(/images/group-banner-bottom.jpg) no-repeat; height:20px; width:931px; margin:0 0 0 21px; clear: both; } #mainContent #leftContentBottom { background:url(/images/main-large-rounded-bottom.jpg) no-repeat; width:932px; height:17px; margin-left:-17px; margin-top:-20px ; margin-bottom:20px; position:relative; z-index:500; } #mainContent #leftContentTop { background:url(/images/main-large-rounded-top.jpg) no-repeat; width:932px; height:17px; margin-left:-17px; position:relative; z-index:500; } #mainContent #leftContent { width:100%; padding:20px; background:#fff; margin-left:-17px; margin-top:-10px; float:none; border-left:1px solid #ccc; border-right:1px solid #ccc; max-width:890px; padding-bottom:17px;} #mainContent.narrow #leftContent { float:left;} #mainContent #leftContent .six { width:590px;} #mainContent.narrow #leftContent .six { width:600px;} #mainContent.narrow #leftContentTop { background-image:url(/images/main-small-rounded-top.jpg); width:632px; } #mainContent.narrow #leftContentBottom { background-image:url(/images/main-small-rounded-bottom.jpg); width:632px; } #mainContent.narrow #leftContent { float:none;} #mainContent.narrow .float-wrap { float:left; margin-top:0px;} #mainContent.narrow .wide-clear {display:none;} #mainContent.narrow #leftContent { width:590px; } #rightContent {width:200px; margin-left:13px; float:left; margin-top:-8px;} /* --------------------------------------- HOMEPAGE TRIPTIC ---------------------------------------*/ .homepage-triptic { min-width:200px; color:#4f5357;} .homepage-triptic h3 { font-size:22px; margin:0; padding:0;} .homepage-triptic p { margin:0 0 1em 0; font-size:13px; } .homepage-triptic img { display:block; margin:0 0 0 -10px; } /* --------------------------------------- FORM / LABEL STYLES ---------------------------------------*/ .overlay-label { position:relative; } .overlay-label label { margin:0; position:absolute; left:15px; top:-1px; color:#ccc; } .form-row input.hidden {display:none;} .counter label { text-indent:-1000em;} .form-row .counter input { border:none; background:#eee; padding:5px; width:150px; margin:-14px 0 0 0;} .form-row label, .form-row input, .form-row textarea { display:block; margin:0;} .form-row small { display:block;} /* --------------------------------------- NEWS / VOTES ---------------------------------------*/ .yes-link { display:inline-block; width:48px; height:20px; margin-top:5px;} .no-link { display:inline-block; width:48px; height:20px; margin-left:-15px;} .yes-link img, .no-link img { display:block; margin-top:7px;} .news-entry { border-top:1px dotted #ccc; } .news-entry.column { padding:15px 0 15px 15px;} .news-entry h3 { margin:0; } .news-info a { color:#000; text-decoration:underline; } .votes { color:#b5c9d2; text-align:left; } .votes.column { margin:-6px 0 0 0;} .votes h4 { margin:0 0 0 2px; padding:0; font-size:36px; text-decoration:underline} .votes h5 { margin:0 0 5px 0px; padding:0; font-size:20px; font-weight:normal; } .votes h5.small { font-size:16px; margin-left:-8px;} #leftContent h3 a { color:#000; font-size:13px; font-weight:bold;} #leftContent h3 a.button { color:#fff;} #leftContent h2 { color:#3d3c3c;} .vote-down, .vote-down-sel, .vote-up-sel, .vote-up { display:inline-block; text-indent:-1000em; width:33px; height:33px; cursor:pointer; } .vote-down { margin:0 0 0 -10px; background:url(../images/vote-down.jpg) no-repeat top left; } .vote-up { background:url(../images/vote-up.jpg) no-repeat top left; } .vote-down-sel { margin:0 0 0 -10px; background:url(../images/down-sel.gif) no-repeat top left; } .vote-up-sel { background:url(../images/up-sel.gif) no-repeat top left; } .vote-up_sel { border:1px solid #ccc;} a.comment-link { color:#000; display:inline-block; margin-left:10px; } .comment h3 { color:#76848a; font-size:20px;} /* --------------------------------------- UTILITY CLASSES: clear, float, bold etc ---------------------------------------*/ .clear { clear:both; } .center {text-align:center;} .divider { margin:0 auto; border-top:1px solid #ccc; height:0; } .uppercase { text-transform:uppercase; } .avatar { display:block; float:left; width:30px; height:30px; } .avatar-text { } /* --------------------------------------- COLOR CLASSES ---------------------------------------*/ .blue { color: #3399cc; } .green { color: #669966; } .purple { color: #996699; } .tourquoise { color: #00647c; } h3.purple { background:transparent;} /* --------------------------------------- BUTTONS ---------------------------------------*/ .button { display:inline-block; color:#fff; padding:6px 8px 6px; text-decoration:none; font-weight:bold; background:url(../images/button-overlay.png) repeat-x top left; border-top:3px solid rgba(255,255,255,0.25); text-shadow: rgba(0,0,0,.15) -1px -1px 1px; cursor:pointer;} .button:hover { color:#fff; } .large.button { font-size:14px;} .button.tourquoise { background-color:#333; } .button.tourquoise:hover {background-color:#555;} .button.purple { background-color:#777;} .button.purple:hover { background-color:#999;} button.button { border:none;} input.button { border:none;} /* --------------------------------------- SIDEBAR ---------------------------------------*/ #sidebar {margin-left:10px;} .box-shadow-container { width:273; margin-top:8px; margin-left:3px; background: url(../images/poll-middle.jpg) repeat-y; } .box-shadow-top {background: url(../images/poll-top.jpg) no-repeat; width:273; height:26px; } .box-shadow-bottom { background: url(../images/poll-bottom.jpg) 0% 0% no-repeat; width:273px; height:164px; position:relative; z-index:0; margin-top:-130px; } .box-shadow { width:273px; padding:0; position:relative; margin-left:2px; margin-top: -20px; z-index: 1; } .box-shadow .content { width:240px; overflow:hidden; padding:15px 15px 0px 15px; position:relative; z-index:5; } #whyJoin, .poll-question, #whyJoinReasons { } #whyJoin, .poll-question { font-size:20px; color:#333; } #whyJoin { margin:0 0 0 0; padding:0 0 10px 0; text-transform:uppercase; text-align:center; border-bottom:1px solid #ccc; } #whyJoinReasons li { margin-bottom:5px; } #pollForm .button { position:relative; z-index:800; } #pollForm { margin:0; } #pollForm #whyJoinReasons { padding:0; margin-bottom:20px; list-style:none; } #pollForm #whyJoinReasons li { } .poll-question { font-size:11px; } .gray-rounded-top { background:url(/images/gray-sidebar-top.jpg) no-repeat; height:14px; width:273px; margin-top:20px; margin-left:3px; } .gray-rounded-bottom {background:url(/images/gray-sidebar-bottom.jpg) no-repeat; height:14px; width:273px; margin-left:3px; margin-top:-14px; margin-bottom: 20px; } .gray-rounded { background:url(/images/gray-sidebar-center.jpg) repeat-y; padding:0 20px 0 20px; margin-left:3px; margin-top:-18px; width:240px;} .gray-rounded h3 { color:#333; text-transform:uppercase; border-bottom: 1px dotted #c9cfcf; padding:5px 0 5px 0; } .gray-rounded h4 { color:#e8a127; font-size:16px;} .gray-rounded h5 { color:#23262a; font-size:13px; margin:.5em 0 0em 0; } .gray-rounded ul { list-style:none; margin:0; padding:0; } .gray-rounded ol { margin:0; padding:0 0 0 20px;} .gray-rounded li { margin:0 0 1em 0; padding:0 0 10px 0; border-bottom:1px dotted #c9cfcf;} .gray-rounded li a { color:#444; text-decoration:underline; } .gray-rounded p { margin:0; padding:0; } .gray-rounded1 { background:url(/images/gray-sidebar-center.jpg) repeat-y; padding:0 20px 0 20px; margin-left:3px; margin-top:-18px; width:240px;} .gray-rounded1 h3 { color:#333; text-transform:uppercase; border-bottom: 1px dotted #c9cfcf; padding:5px 0 5px 10px; } /* --------------------------------------- FOOTER ---------------------------------------*/ #footerWrap { width:928px; padding-left:20px; margin-top:0px; } #footer { background: #535353 url(/images/footer-bg.jpg) no-repeat -2px 0; padding-top:20px; margin-left:4px; padding-bottom:40px; width:928px; } #footer ul { font-size:14px; border-top:1px solid #fff; border-bottom:1px solid #fff; height:30px; padding-left:20px; } #footer li { line-height:30px; border-right:1px solid #fff; padding-right:20px;} #footer a { color:#fff;} #footer a:hover { text-decoration:underline;} #footerDivider { display:none;} #footer #copyright { display:block; margin:20px 0 0 0; padding:0 0 0 20px; font-size:12px; color:#999; text-align:center; } #footer #copyright br { display:none;} #footer table { margin:0px 0 0 0px; padding:0; height:27px; border-top:1px solid #fff; border-bottom: 1px solid #fff; border-collapse:collapse; text-align:center; width:928px; } #footer td { border-right:1px solid #fff; padding:1px; margin-right:0; float:none; } #footer td.last { border-right: none; } #footer td a { display:block; text-align:center; padding:6px 15px 6px 15px; color:#fff; font-size:11px; font-weight:bold; } #footer td a:hover, #footer td.active a { color:#333; background:url(/images/new_design/button-hover.jpg) repeat-x; } /* --------------------------------------- CommentForm ---------------------------------------*/ #commentForm { margin:0; padding:0; border-top:1px dotted #ccc; } #commentForm label { display:block; width:81px; height:81px; background:url(../images/post-page/form-icon.jpg) no-repeat; text-indent:-1000em; margin-top:-10px; position:relative; z-index:1000;} #commentForm textarea { height:150px; width:100%;} #commentForm input { display:block; margin-top:20px;} /* --------------------------------------- GRID CLASSES ---------------------------------------*/ .row { margin:20px 0 20px 0; } .form-row { margin:20px 0 0 0; } .row:after, .form-row:after { display:block; clear:both; content:"."; visibility:hidden; height:0; } .column, .columns { margin:0; padding:0; float:left; } .quarter { width:25px; } .half { width:50px; } .three-quarters { width:75px; } .one { width:100px; } .two { width:200px; } .three { width:300px; } .four { width:400px; } .five { width:500px; } .six { width:600px; } .seven { width:700px; } .eight { width:800px; } .nine { width:900px; } .ten { width:1000px; } .one-and-a-quarter { width:125px; } .two-and-a-quarter { width:225px; } .three-and-a-quarter { width:325px; } .four-and-a-quarter { width:425px; } .five-and-a-quarter { width:525px; } .six-and-a-quarter { width:625px; } .seven-and-a-quarter { width:725px; } .eight-and-a-quarter { width:825px; } .nine-and-a-quarter { width:925px; } .one-and-a-half { width:150px; } .two-and-a-half { width:250px; } .three-and-a-half { width:350px; } .four-and-a-half { width:450px; } .five-and-a-half { width:550px; } .six-and-a-half { width:650px; } .seven-and-a-half { width:750px; } .eight-and-a-half { width:850px; } .nine-and-a-half { width:950px; } .one-and-three-quarter { width:175px; } .two-and-three-quarters { width:275px; } .three-and-three-quarters { width:375px; } .four-and-three-quarters { width:475px; } .five-and-three-quarters { width:575px; } .six-and-three-quarters { width:675px; } .seven-and-three-quarters { width:775px; } .eight-and-three-quarters { width:875px; } .nine-and-three-quarters { width:975px; } * html .form-row { height: 1%; } .form-row { display: inline-block; } .form-row { display: block; } /* --------------------------------------- USER PROFILE ---------------------------------------*/ .userPosts, .userComments,.userVotes{ float:left; width:275px; padding:10px; } .userItemDetail{ border-bottom:1px dotted #c0c0c0; } /* --------------------------------------- Error / System Messages ---------------------------------------*/ .errorMsg { width:400px; padding:10px; margin:10px; font-size:11pt; border:1pt solid #804040; background-color: #ffc4c4; } .systemMsg { width:400px; padding:10px; margin:10px; font-size:11pt; border:1pt solid #008000; background-color: #d9ffd9; } /* --------------------------------------- Misc ---------------------------------------*/ .pagination{ clear:both; border-top:1px solid #ccc; padding-top:10px; } /* --------------------------------------- New form related stuff (jeff g) --------------------------------------- */ .formbg{ background-color:#DDDDDD; padding:10px; margin:10px; color:#505050; } .formbg label{ font-weight:bold; font-size:14pt; } .plainlabel{ fone-weight:normal; font-size:10pt; } .formbg input,select{ margin:5px 0px 15px 0px; } .formbg textarea{ margin:5px 0px 0px 0px; width:98%; } .counter { background-color:#BBBBBB; color:#505050; border:0px; width:100px; font-weight:bold; padding-left:20px; } /* --------------------------------------- Additions by Dan Criel 12/6/09 --------------------------------------- */ .ideaFormField { width: 350px; } #leftContent h1 { margin-top: 5px; } .groupImage { float: left; width: 242px; //height: 148px; overflow: hidden; margin: 10px 20px 10px 20px; } .groupInfo { float: left; width: 620px; text-align: left; margin: 20px 0 0 0; } .groupInfo h2 { color: #333; } .groupInfo p { float: left; width: 400px; margin: 0 40px 20px 0; } .groupButtonContainer { float: left; width: 180px; } .groupButtonContainer button { width: 160px; } .highlightBox { width: 289px; height: 282px; background: url('/images/highlightBox.jpg') no-repeat; margin-left: -5px; margin-top: 8px; } .highlightBoxTitle { width: 289px; height: 42px; text-align: center; color: white; text-transform: uppercase; font-size: 18px; margin-top: 7px; float: left; clear: left; } .highlightBoxContent { width: 250px; float: left; clear: left; margin: 30px 10px 10px 10px; color: white; }