/* File: 'Blueball Cubicle' main.css Style Sheet Created: 9, January, 2008 Last Modified: 25, September, 2008 Version: 4.0 Author: Charlie Lockhart, Blueball Design www.blueballdesign.com Copyright 2008 Charlie Lockhart/Blueball Design USA, All Rights Reserved */ /* @group Global CSS */ body { width: 790px; font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 13px; line-height: 22px; font-weight: normal; background: #e5e5e5; /* Edit the color code below for the normal content text color */ color: #333; word-wrap: break-word; margin: 0px auto; } * html body { font-weight: 500; } * { margin: 0px; padding: 0px; } #main { min-height: 200px; } img { border: none; } a img { border: none; } a:link { color: #AB062F; text-decoration: underline; } a:hover { color: #d9231f; text-decoration: none; } a:visited { color: #AB062F; text-decoration: underline; } a:active { color: #AB062F; font-weight: bold; text-decoration: none; } p { } h2 { font-size: 24px; font-family: Georgia, "Times New Roman", Arial, Helvetica, sans-serif; line-height: 28px; color: #ab062f; margin-top: 0; padding-top: 0; margin-bottom: 12px; } * html h2 { font-weight: 600; } h3 { font-size: 17px; font-family: Helvetica, Arial, sans-serif; line-height: 19px; color: #333; font-weight: bold; margin-top: 0; padding-top: 0; margin-bottom: 10px; } .clear { clear: both; height: 0; } #main .clear { clear: left; } .hidden { display: none; } .ImageElement, .VideoElement { text-align: center; margin: 10px 0 6px 0; } img.narrow { display: block; clear: left; float: left; margin-top: 5px; margin-right: 20px; margin-bottom: 2px; } img.wide { display: block; clear: both; } div.rssBadge { margin: 10px; } /* Small icon option */ img.smallRSSBadgeIcon { vertical-align: middle; } img.smallRSSBadgeIconLeft { margin-right: 4px; } img.smallRSSBadgeIconRight { margin-left: 4px; } /* Large icon option */ div.largeRSSBadgeIcon, p.largeRSSBadgeIcon { margin: 0 10px; text-align: center !important; } img.largeRSSBadgeIcon { margin-bottom: 4px; } p.largeRSSBadgeIcon { margin: 0; } ul { padding-left: 18px; list-style-type: disc; color: #333; line-height: 18px; } * html ul { padding-left: 22px; list-style-type: square; color: #333; } ul a:hover { color: #d9231f; text-decoration: none; } li a:hover { color: #d9231f; text-decoration: none; } .sitemap-page a:hover { color: #d9231f; text-decoration: none; } /* @end */ /* @group Page-Top */ #page-container { background: transparent; margin: 0px auto; width: 790px; } #page { width: 790px; margin: 0px auto; margin-top: 0px; margin-bottom: 24px; padding: 0; background: url(cubicle_bg790.gif) top repeat-y; } #page-top { width: 782px; margin: 0px auto; padding-left: 4px; background: url(cubicle_banner.jpg) top no-repeat; z-index: 10; } #title { position: relative; background: transparent; width: 780px; margin: 0px auto; overflow: hidden; height: 200px; } #title h1 { font-family: Arial, Helvetica, Verdana, sans-serif; margin: 21px 30px 0 20px; padding: 0; font-size: 24px; line-height: 50px; font-weight: normal; /* Edit the color code below for the Title text color */ color: #AB062F; text-align: left; overflow: hidden; z-index: 20; } * html #title h1 { font-weight: bold; letter-spacing: -1px; } .has-logo h1 { margin: 30px 30px 0 30px; padding: 0 0 0 16px; overflow: hidden; } #title h1 a:link, h1 a:visited { color: #ab062f; text-decoration: none; } #title h1 a:hover { text-decoration: none; color: #d9231f; } #title p { position: absolute; top: 108px; bottom: 15px; left: 20px; width: 340px; font-family: Arial, Helvetica, sans-serif; font-style: italic; font-weight: normal; font-size: 15px; line-height: 24px; text-align: left; letter-spacing: 1px; /* Edit the color code below for the text color in the red block area */ color: #e5e5e5; } * html #title p { font-weight: 600; letter-spacing: 0px; } #title img { float: right; margin: 0 47px 0 30px; display: block; height: 90px; width: 200px; } * html #title img { margin: 0 15px 0 15px; } /* @end */ /* @group Site Menu */ #sitemenu-container { clear: both; position: relative; margin: 0px auto; padding-left: 0; width: 782px; margin-left: -2px; margin-bottom: 7px; background: url(navbg_up.jpg) top left repeat-x; z-index: 5; } #sitemenu ul { font-size: 12px; font-weight: normal; list-style: none; height: 24px; line-height: 24px; overflow: hidden; padding: 0; margin: 0; } * html #sitemenu ul { font-weight: 500; } #sitemenu ul li { float: left; } #sitemenu ul a { display: block; color: #333333; list-style: none; text-decoration: none; white-space: nowrap; border-right: 1px solid #999; padding: 0 12px 0 12px; z-index: 10; } #sitemenu ul a:hover { color: #ab062f; text-decoration: none; padding: 0 12px 0 12px; } #sitemenu ul .currentPage .in { display: block; color: #333333; list-style: none; text-decoration: none; white-space: nowrap; text-decoration: none; } #sitemenu .currentPage .in { background: #ffffff; color: #ab062f !important; padding: 0 12px 0 12px; border-right: 1px solid #999; font-weight: bold; background: url(navbg_over.jpg) top left repeat-x; text-decoration: none; } #sitemenu .currentParent a { background: #ffffff; color: #ab062f!important; font-weight: bold; border-right: 1px solid #999; background: url(navbg_over.jpg) top left repeat-x; text-decoration: none; } /* @end */ /* @group Sidebar */ #sidebar { float: right; width: 230px; margin-top: 1px; margin-bottom: 12px; padding: 10px 5px 5px 10px; background: #e5e5e5; line-height: 1.5em; min-height: 80px; height: auto !important; height: 80px; } .allow-sidebar #main { margin-right: 265px; padding: 1px 0 0 0; min-height: 158px; height: auto !important; height: 158px; } .no-sidebar #main { width: 740px; margin-left: 0; padding: 1px 0 0 0; height: auto !important; } /* @end */ /* @group Pagelet */ .pagelet { margin-bottom: 12px; margin-left: 0px; padding: 4px 0px 4px 2px; overflow: hidden; width: 220px; background: #e5e5e5; } *:first-child+html .pagelet { padding: 2px 0px 6px 2px; } .pagelet-body { font-size: 12px; line-height: 17px; padding: 3px; } .pagelet h4 { font-size: 15px; font-weight: bold; line-height: 17px; margin: 0px 8px 5px 8px; color: #ab062f; background: transparent; padding: 3px 0px 3px 0px; letter-spacing: .5px; border-bottom: 1px solid #ab062f; } .pagelet.bordered { border-style: solid; border-color: #626262; border-width: 1px; background: #e5e5e5; } .pagelet.bordered h4 { font-size: 15px; font-weight: bold; line-height: 16px; margin: 0px 5px 5px 5px; color: #ab062f; background: transparent; padding: 3px 8px 3px 6px; letter-spacing: .5px; border-bottom: 1px solid #ab062f; } .pagelet div { margin: 0px 3px; } .pagelet a:hover { text-decoration: none; } .pagelet img { border: none; padding: 10px 0 0 0; margin-left: -3px; } .pagelet.bordered a img { border: none; } .pagelet.bordered img { border: none; padding: 10px 0 0 0; } .pagelet a img { border: none; } /* @end */ /* @group Callout */ .callout { width: 220px; float: left; margin: 3px 20px 0px 0px; padding: 0px; width: 220px; background: #e5e5e5; } .callout-body { font-size: 12px; line-height: 17px; padding: 3px; } .callout .pagelet.bordered { border-style: solid; border-color: #626262; border-width: 1px; background: #e5e5e5; } .callout h4 { font-size: 15px; font-weight: bold; line-height: 17px; margin: 0px 5px 5px 5px; color: #ab062f; background: transparent; padding: 3px 8px 3px 6px; text-align: left; letter-spacing: .5px; border-bottom: 1px solid #ab062f; } .callout img { border: none; padding: 0; margin-left: -4px; } .callout a img { border: none; padding: 0; } /* @end */ /* @group Page-Content */ #page-content { width: 740px; min-height: 200px; margin: 0px auto; padding: 14px 0 8px 0px; background: transparent; text-align: left; } * html #page-content { padding: 2px 0px 0px 0px; margin-top: -12px; margin-bottom: -22px; } *:first-child+html #page-content { padding: 10px 0 5px 0px; } /* @end */ /* @group Page Bottom */ #page-bottom { clear: both; width: 782px; margin: 10px 0px 0px 4px; padding: 0; text-align: center; background: #333; border-left: 1px solid #333; } *:first-child+html #page-bottom { margin: 4px 0px 0px 4px; } #page-bottom p { font-size: 12px; letter-spacing: .5px; line-height: 1.4em; color: #fff; text-align: center; padding: 6px 12px 6px 12px; margin: 0px; overflow: hidden; } #page-bottom p a:link { color: #ccc; text-decoration: underline; } #page-bottom p a:hover { color: #ffffff; text-decoration: none; } #page-bottom p a:visited { color: #ccc; text-decoration: underline; } #page-bottom p a:active { color: #ffffff; font-weight: bold; text-decoration: none; } /* @end */ /* @group Contact Form */ form.contactElement textarea, form.contactElement input, form.contactElement select { background-color: #e5e5e5; } * html form.contactElement textarea, form.contactElement input, form.contactElement select { background-color: #e5e5e5; } form.contactElement textarea { background-color: #eee; } td.dli1 { text-align: center; } *:first-child+html form.contactElement input.submit { padding: 0px 10%; min-width: 40%; } /* Contact Element (customized HTML) */ form.contactElement textarea, form.contactElement input, form.contactElement select { width: 98%; margin: 4px 0; } form.contactElement input.submit { width: auto; display: block; margin-left: 0px; margin-right: 2%; min-width: 50%; } * html form.contactElement input.submit { margin-bottom: 8px; } *:first-child+html form.contactElement input.submit { margin-bottom: 8px; } form.contactElement th { text-align: right; font-weight: normal; width: 25%; } /* @end */ /* @group Article-Blog Page */ #main h2 { font-size: 24px; font-family: Georgia, "Times New Roman", Arial, Helvetica, sans-serif; line-height: 28px; color: #ab062f; margin-top: 0; padding-top: 0; margin-bottom: 14px; font-weight: normal; padding-bottom: 5px; border-bottom: 1px solid #626262; } * html #main h2 { font-weight: 600; } .general-index { font-size: 13px; line-height: 22px; color: #333; font-weight: normal; margin-top: 0; margin-bottom: 10px; padding: 10px 0 10px 0; } .general-index h3 { padding: 10px 10px 0px 0; font-size: 17px; line-height: 1.4em; color: #333; font-weight: bold; margin-top: 12px; margin-bottom: 2px; border-bottom: 1px solid #626262; width: 98%; } .general-index h3 a { color: #ab062f; font-weight: bold; text-decoration: underline; padding: 0px 10px 0px 0; margin-top: 12px; margin-bottom: 8px; } .general-index h3 a:hover { color: #d9231f; text-decoration: none; } .listing-index { margin-bottom: 15px; padding: 0px 6px; } .listing-index h3 { font-size: 13px; line-height: 16px; color: #333; font-weight: normal; } .general-index .article { margin: 0px; padding: 0px; border: 0px none; background: transparent; clear: left; margin-bottom: 15px; } .article { margin-bottom: 6px; padding: 10px 0 0 0; } * html .article { padding: 2px 0 0 0; } t-child+html .article { padding: 10px 0 10px 0; } .article ul { line-height: 24px; } .article-info { clear: left; } .article h3 { padding: 0px 10px 10px 0; font-size: 17px; line-height: 19px; color: #333; font-weight: bold; margin-top: 0; margin-bottom: 10px; } .article h3 a, a:active { text-decoration: underline; color: #ab062f; } .article h3 a:hover, a:focus { text-decoration: none; color: #d9231f; } .article-info .timestamp { clear: left; text-align: left; background: transparent; padding: 1px 12px 1px 0px; margin: 6px 0px 0px 0px; font-size: 11px; font-family: Georgia, "Times New Roman", Arial, Helvetica, sans-serif; font-style: italic; letter-spacing: .6px; color: #ab062f; } .article-info .continue-reading-link a:link, .article-info .continue-reading-link a:visited, .article-info .continue-reading-link a:active { color: #AB062F; text-decoration: underline; font-size: .95em; font-style: italic; margin-top: 3px; } .article-info .continue-reading-link a:hover { color: #d9231f; text-decoration: none; font-size: .95em; font-style: italic; margin-top: 3px; } .article-info .comments { padding: 0 0 6px 0; color: #333; font-size: 12px; } .article-info .comments a { padding: 0 0 6px 20px; color: #333; text-decoration: underline; background: #fff url(commentR.png) left center no-repeat; } * html .article-info .comments a { background: #fff url(commentR.gif) left center no-repeat; } .article-info .comments a:hover { padding: 0 0 6px 20px; color: #d9231f; text-decoration: none; background: #fff url(commentR.png) left center no-repeat; } * html .article-info .comments a:hover { background: #fff url(commentR.gif) left center no-repeat; } .article img { border: none; margin-top: 4px; margin-right: 15px; margin-bottom: 2px; } .article img.narrow { display: block; clear: left; float: left; border: none; margin-right: 15px; margin-bottom: 2px; } .article-thumbnail { float: left; border: none; margin: 0 12px 12px 0; } * html article-thumbnail { float: left; border: none; margin-right: 6px; margin-bottom: 6px; } /* @end */ /* @group Photo Grid */ .photogrid-index { margin-top: 12px; margin-left: 8px; } .photogrid-index a { text-decoration: none; } .gridItem { float: left; position: relative; width: 150px; height: 186px; /* room for caption */ overflow: hidden; margin-top: 5px; } .gridItem h3 { font-weight: normal; font-size: 11.5px; line-height: 14px; text-align: center; margin: 0 5px; padding: 1px 0px 0px 0px; background: transparent; min-height: 36px; height: auto !important; height: 36px; width: 136px; position: absolute; top: 140px; } * html .gridItem h3 { margin: 2px 5px; } .gridItem h3 a { text-decoration: underline; color: #ab062f; } .gridItem h3 a:hover, a:focus { text-decoration: none; color: #d9231f; } .gridItem img { border: 1px solid #626262; margin: auto!important; display: block; position: absolute; top: 0; bottom: 48px; right: 0; left: 0; } .gridItem img a:hover { border: 1px solid #d9231f; } * html .gridItem img { position: relative; } * html .gridItem h3 { position: relative; top: 0px; } *:first-child+html .gridItem img { position: relative; top: 0px; } *:first-child+html .gridItem h3 { position: relative; top: 2px; } /* @end */ /* @group Single Photo Page */ .photo-navigation { position: relative; z-index: 100; height: 34px; width: 200px; margin: 0px auto; margin-top: 15px; } .photo img { padding: 0px; border: 1px solid #626262; margin-top: 0px; margin-bottom: 8px; } .caption { font-size: 13px; line-height: 22px; } .photo-navigation a { border: none; } .photo-navigation div { width: 35px; height: 34px; position: absolute; text-indent: -5000em; } .photo-navigation a { border-bottom: none; display: block; width: 100%; height: 100%; } .image-controls a, .image-controls a:hover { border: 0; } #previous-photo { background: url(leftarrow_off.jpg) top no-repeat; left: 32px; } #previous-photo a, #previous-photo a:visited { background: url(leftarrow_on.jpg) top no-repeat; } #previous-photo a:hover { background: url(leftarrow_off.jpg) top no-repeat; } #next-photo { background: url(rightarrow_off.jpg) top no-repeat; left: 118px; } #next-photo a, #next-photo a:visited { background: url(rightarrow_on.jpg) top no-repeat; } #next-photo a:hover { background: url(rightarrow_off.jpg) top no-repeat; } #photo-list { background: url(centerindex_off.jpg) top no-repeat; left: 75px; } #photo-list a { background: url(centerindex_on.jpg) top no-repeat; } #photo-list a:hover { background: url(centerindex_off.jpg) top no-repeat; } .image-controls a { border-bottom: 0; } /* @end */ #page-top { background-image: url(../_Media/monkey-tiger.jpeg); }