/*
template_002.css

CSS file for the v2 blog template

A NOTE ABOUT EMS:
As far as it was possible, this document uses ems for units.  This is a
good accessibility practice because since the size of an em is based on the
font size, it grows in relation to the font when the user changes the text size
of their browser.  As the text size increases, so does the size of margins and
padding, column widths, etc, thus maintaining the page layout as much as
possible.  The only times that ems are not used are when the CSS spec doesn't
allow them to be used, such as in the case of setting an element's absolute
position, or when a border needs to be only one pixel thick.

Likewise, all font sizes are set as a percentage of the base font size.  As the
base font size is changed in the user's browser, the rest of the fonts on the
page are resized accordingly.

 */

/*   BODY SETTINGS   */
body, html {
background-image: url(http://compendiumblogware.com/images/blog/bubbly_compendiumbackground.jpg);
background-repeat: repeat;
background-color: #999999;
}

.mc {
background-image: url(http://compendiumblogware.com/images/blog/bodybackground_compendium.jpg);
background-repeat: repeat-y;
background-color: #e6e6e6;
position: relative;
border-left: 0 #333333;
border-right: 0 #333333;
padding: 0;
margin-bottom: 0;
}

#leftfade {
background-image: url(http://images.content.compendiumblog.com/images/sidefade-left.png);
position: absolute;
width: 32px;
height: 100%;
padding: 0 !important;
margin: 0;
margin-left: -32px;
top: 0;
left: 0;
overflow: visible;
}

#rightfade {
background-image: url(http://images.content.compendiumblog.com/images/sidefade-right.png);
position: absolute;
width: 32px;
height: 100%;
padding: 0 !important;
margin: 0;
margin-right: -32px;
top: 0;
right: 0;
overflow: visible;
}



/*   LEADERBOARD CTA  */
#leaderboardcta {
width: 100%;
background-color: #ffffff;
}

#leaderboardctaA {
width: 974px;
height: 234px;
background-color: #ffffff;
background-image: url(http://compendiumblogware.com/images/blog/blogleader_whitepaper_thirdgeneration.jpg);
background-repeat: no-repeat;
}

#leaderboardctaA_button {
background-color: transparent;
float: right;
padding: 94px 42px 0 0;
}

#leaderboardctaB {
width: 973px;
height: 234px;
background-color: #ffffff;
background-image: url(http://compendiumblogware.com/images/blog/blogleaderboard_cta_considering_c.jpg);
background-repeat: no-repeat;
}

#leaderboardctaB_button {
background-color: transparent;
float: right;
padding: 154px 90px 0 0;
}

#leaderboardcta-search-social {
width: 973px;
height: 234px;
background-color: #ffffff;
background-image: url(http://www.compendium.com/images/blog/blogleader-social-search.jpg);
background-repeat: no-repeat;
}

#leaderbuttonwrap{
float: right;
width: 350px;
height: 234px;
display: block;
padding-top: 50px;
}

#leaderbutton-top {
background-image: url(http://www.compendium.com/images/blog/search-social-button.png);
background-repeat: no-repeat;
width: 313px;
height: 94px;
margin: 65px 40px;
float: left;
}

#leaderbutton-bottom {
background-image: url(http://www.compendium.com/images/blog/grip-button.png);
background-repeat: no-repeat;
width: 315px;
height: 83px;
margin-top: 10px;
float: left;
}



/*   HEADER SETTINGS  */
#header {
height: 50px;
margin: 0;
background-color: #333333;
background-image: none;
}

#header h1 { 
position: absolute;
bottom: 8px; /* used pixels because you can't position using ems */
font-weight: normal;
padding-left: 5px;
color: #cadb2a;
font-size: 182%;
width: 100%; /* making the width 100% allows horiz alignment from the UI */
}


#header a:link, #header a:visited, #a:hover, #header a:active {
color: #fff;
margin: 0 20px;
}

/*   BORDER SETTINGS  */
#borderline {
margin: 0 -1em 1em -1em;
background-image: url(http://compendiumblogware.com/images/blog/borderline.jpg);
background-repeat: repeat-x;
height: 19px;
}

/*   MENU SETTINGS   */
#menu {
overflow: hidden;
backgorund: transparent;
}

#menu-1 ul {
margin: 0;
padding: 0.5em 0 0.5em 0;
}

#menu-1 li {
display: inline;
margin-left: 30px; /* used pixels to keep it aligned with the absolutely positioned blog title */
font-weight: bold;
font-size: 100%;
}

#menu-1 a:link, #menu-1 a:visited, #menu-1 a:active {
color: #444;
}

#menu-1 a:hover {
color: #008D3D;
}

/*   BLOGGING RESOURCES CTA   */
#resources {
top: 30%;
float: left;
position:fixed;
}

/*   MAIN COLUMN SETTINGS   */
#content {
margin-left: 2em;
margin-right: 4em;
margin-bottom: 0;
overflow: hidden;
border-right: 0 solid #999999;
}

/*   POST SETTINGS   */
.post {
margin-bottom: 1em;
}

.post-header h2 {
font-size: 138.5%;
font-weight: bold;
margin-bottom: 0;
margin-top: 0;
padding: 2em 0 0 0;
/*color: #008D3D;*/
}

.post-header-meta {
font-size: 85% !important;
font-style: italic;
padding: 0 0 0 0;
}

.post-body {
margin-top: 1em;
margin-bottom: 0em;
padding-right:0;
padding-left:0;
line-height: 1.5em;
}

.post-body a {
text-decoration: underline !important;
}

.post-body img {
margin: 0.25em;
}

.post-body h3 {
font-size: 110%;
font-weight: bold;
margin-bottom: 1em;
margin-top: 1em;
padding: 0;
color: #444444;
}

.post-body ol li {
list-style-position: outside;
margin-left: 20px;
}

.post-footer {
padding: 1em 0 2em 0;
background-color: #ffffff;
border-bottom: 1px dashed #999999;
font-size: 85%;
position: relative;
clear: both;
margin-top: 1em;
margin-bottom: -1.1em;
}

.post-footer a {
color: #444444;
display: inline;
float: left;
background-color: #cadb2a;
padding: .2em 1em;
}

.post-social-bookmarking {
padding: 1em 1em 0 0;
color: #444444;
}

.post-facebook-like {
height: 25px;
width: 100px;
float: left;
padding: 0 2em 0 2em;
color: #444444;
}

.post-social-bookmarking2 {
padding: 2em 0 0 0em;
color: #444444;
border-top: 1px dashed #999999;
}

.post-social-bookmarking2 a, .post-social-bookmarking2 a:visited {
color: #444444;
}

.spreadWord {
background: #FFFFFF url(http://compendiumblogware.com/images/blog/spreadword_blogposticon.jpg) no-repeat !important;
padding: 2px 0 0 23px !important;
margin: 0 0 0 14px;
}

/*   POST FORMS   */
#post-form {
background-color: #e6e6e6;
}

#post-form div {
}

#post-form h3 {
color: #444444;
background-color: #e6e6e6;
margin: 0;
padding: 0.5em;
}

/* Labels appear before the corresponding form field in the HTML.  Both
   are floated left, so
 */
#post-form label {
float: left;
clear: left;
width: 35%;
text-align: right;
margin: 0.3em 0.3em 0 0;
}

#post-form input[type="text"], #post-form textarea {
float: left;
margin-top: 0.3em;
border: 1px solid #eeeeee;
}

#post-form textarea {
width: 60%;
}

#post-form #captcha, #post-form img {
clear: left;
margin-left: 35%;
margin-top: 0.3em;
padding-left: 0.3em;
border: 0;
width: auto;
}

#post-form-submit {
margin-left: 35%;
margin-top: 0.3em;
margin-bottom: 0.3em;
}



/*   POSTS NAVIGATION   */
#posts-navigation {
margin: 1em 0 1em 0;
width:100%;
clear: left;
}

#posts-navigation #prev {
float: left;
}

#posts-navigation #next {
float: right;
}

#posts-navigation a {
padding: 0.2em 1em;
margin-top: 1em;
margin-bottom: 1em;
color: #444444;
font-weight: bold;
background-color:#CADB2A;
display:inline;
}

/*   COMMENTS SETTINGS   */
#comments {
clear: both;
padding-bottom: 2em;
border-bottom: none #999999;
}

#comments h3 {
margin-top: 5em;
margin-left: 0em;
color: #444444;
}

#comment-list {
margin-left: 1em;
margin-right: 4em;
margin-bottom: 3em;
}

.comments-blog-title {
font-style: italic;
color: #008D3D;
}

.comment-header {
padding: .5em;
}

.comment-odd {
background-color: #e6e6e6;
}

.comment-even {
background-color: #d2d2d2;
}

#comment-list dt {
margin: 2em 0 0.20em 0;
color: #404040;
font-weight: bold;
}

#comment-list dd {
margin-bottom: 1em;
}

#comment-form {
width: 80%;
background-color: #e6e6e6;
margin-left: 2em;
}

#comment-form div {
}

#comment-form h3 {
color: #444444;
background-color: #e6e6e6;
margin: 0;
padding: 0.5em;
}

/* Labels appear before the corresponding form field in the HTML.  Both
   are floated left, so
 */
#comment-form label {
float: left;
clear: left;
width: 35%;
text-align: right;
margin: 0.3em 0.3em 0 0;
}

#comment-form input[type="text"], #comment-form textarea {
float: left;
margin-top: 0.3em;
border: 1px solid #404040;
}

#comment-form textarea {
width: 60%;
}

#comment-form #captcha, #comment-form img {
clear: left;
margin-left: 35%;
margin-top: 0.3em;
padding-left: 0.3em;
border: 0;
width: auto;
}

#comment-form-submit {
margin-left: 35%;
margin-top: 0.3em;
margin-bottom: 0.3em;
}

/*   MESSAGE SETTINGS  */
/*   Used to display a message to the user to indicate the result of their
 *   action.  Possible message types include success, warning, and 
 *   failure.
 */

/* Styles common to all message types */
.message {
margin: 1em;
width: 90%;
background-color: #e6e6e6;
border-width: 1px;
border-style: solid;
font-weight: bold;
padding: 7px;
}

.message.success {
background-color: #e6e6e6;
border-color: #88f;
color: #666666;
}

.message.error, .message.warning {
background-color: #e6e6e6;
border-color: #e6e6e6;
color: #990000;
}

/*   SEARCH SETTINGS   */
#search-results-header {
border-bottom: 1px dashed #999999;
color: #393939;
font-size: 138.5%;
font-weight: bold;
font-family: Tahoma, Arial;
}

/*   SIDEBAR SETTINGS   */
.sidebar {
overflow: hidden;
min-height: 900px;
margin-top: 0;
padding: 20px 0 0 0;
}

.sidebar h3 {
margin: 0;
padding: 1.4em 0 .8em 3em;
background-image: url(http://compendiumblogware.com/images/blog/cpdm_sidewidget_03.jpg);
background-repeat: no-repeat;
background-color: #e6e6e6;
font-weight: bold;
font-size: 93%;
}

.sidebar .widget {
padding-bottom: 2em;
margin: .5em 1em .5em -1em;
background-color: #CCCCCC;
background-image: url(http://compendiumblogware.com/images/blog/cpdm_sidewidget_06.jpg);
background-position: center bottom;
background-repeat: no-repeat;
}

.sidebar a:link, .sidebar a:visited, .sidebar a:hover, .sidebar a:active, .sidebar ul, .sidebar li {
}

.sidebar .widget div, .sidebar .widget ul, .sidebar .widget p {
margin: 0;
padding: .5em 0 0 2em; /* pad the entire *content* of the widget */
}

.sidebar .widget ul,  .sidebar .widget ul li {
list-style-position: outside;
margin: 0 0 0.25em .5em;
list-style-type: square !important;
color: #444444;
}

.linkList h4 a {
color: #2f2f2f;
}


/* SIDEBAR TABBING */

.idTabs {

}

 .idTabs a {
text-decoration: none !important;
background-color: #FFFFFF;
padding: 5px 10px;
color: #333333;
-moz-border-radius: 6px 0 0 0;
-webkit-border-radius: 6px 0 0 0;
}

 .idTabs a.selected {
background-color: #999999;
color: #333333;
}

 .idTabs a:hover {
background-color: #999999;
color: #333333;
}

.idTabs ul li {
padding: 20px 0 0 0;
}

 .idTabs li {
list-style: none !important;
float: left;
margin-bottom: 20px;
}

#qdwhitepapers {
padding: 10px 0 20px 2px;
}

#qdwhitepapers li {
margin-bottom: 5px;
}
#qdcasestudies {
padding: 10px 0 20px 2px;
}
#qdcasestudies li {
margin-bottom: 5px;
}
#qdwebinars {
padding: 10px 0 20px 2px;
}
#qdwebinars li {
margin-bottom: 5px;
}



/*   SIDEBAR CTAS   */

#sidebar {
background-color: #e6e6e6;
}

#sidebar_cta_a {
background-image: url(http://compendium.com/images/blog/roitoolkit_blog_ctablock.png) !important;
background-repeat: no-repeat;
height: 265px;
width: 299px;
margin-top: 5px;
margin-bottom: 5px;
}

#sidebar_cta_a_button {
background-color: transparent;
padding: 192px 0 0 50px;
}

#sidebar_cta_demo {
background-image: url(http://compendium.com/images/blog/blogsidebar_demo.png) !important;
background-repeat: no-repeat;
height: 265px;
width: 299px;
margin-top: 5px;
margin-bottom: 5px;
}

#sidebar_cta_demo_button {
background-color: transparent;
padding: 192px 0 0 50px;
}

#sidebar_cta_longtail {
background-image: url(http://compendium.com/images/blog/blogsidebar_bloggings-long-tail.png) !important;
background-repeat: no-repeat;
height: 265px;
width: 299px;
margin-top: 5px;
margin-bottom: 5px;
}

#sidebar_cta_longtail_button {
background-color: transparent;
padding: 192px 0 0 50px;
}

#sidebar_cta_b {
background-image: url(http://compendium.com/images/blog/starbucks_demo_blogsidebarcta.png) !important;
background-repeat: no-repeat;
height: 260px;
width: 299px;
margin-top: 5px;
margin-bottom: 5px;
}

#sidebar_cta_b_button {
background-color: transparent;
padding: 182px 0 0 50px;
}

#sidebar_cta_c {
background-image: url(http://compendium.com/images/blog/nanoaday_demo_blogsidebarcta.png) !important;
background-repeat: no-repeat;
height: 260px;
width: 299px;
margin-top: 5px;
margin-bottom: 5px;
}

#sidebar_cta_c_button {
background-color: transparent;
padding: 182px 0 0 50px;
}

/* prevent the double-padding of paragraphs and divs within widget content */
.sidebar .widget div div, .sidebar .widget div p {
padding: 0;
}

.InlineImage, .Text, .HTML, sidebarDivider {
padding: 0;
background-color: transparent !important;
}

#search form, .Search form {
position: relative;
}

.search-button {
position: relative;
bottom: -6px;
}

/*   FOOTER SETTINGS   */
#footer {
width: 100%;
margin-top: 30px;
margin-bottom: 0;
background-color: #222222;
padding: 10px 0 0 0;
}

#footer p {
padding: 0 0 0 2em;
font-size: 77%;
text-align: center;
}

#footer-text {
padding: 1em 0 0 0;
text-align: center;
}

#resource-footer {
padding-top: 40px;
background-image: url(http://compendiumblogware.com/images/blog/newsletter_footer_signup_01.jpg);
background-repeat: no-repeat;
background-color: #2f2f2f;
margin-left: 1em;
width: 363px;
height: 95px;
}

#compendium-footer {
position: absolute;
top: 0;
right: 0;
padding: 0.5em;
}

#sasquatchContainer {
background-image: url(http://compendiumblogware.com/images/blog/sasquatch_topline.jpg);
background-repeat: repeat-x;
background-color: #2f2f2f;
width: 100%;
padding: 3em 0 14em 0;
height: 500px;
margin-top: 0;
}


#sasquatch {
width: 990px;
margin: 0 auto 5em;
text-align: left;
padding: 0 0 5em 3em;
color: #FFFFFF;
height: 200px;
}

.sasContent {
padding: 0 1em 4em 1em;
width: 275px;
margin-right: 2em;
margin-top: 1em;
color: #CADB2A;
float: left;
line-height: 1.6em;
text-align: left;
}


.sasContent h3 {
padding: .5em .8em;
background-color: #222222;
color: #CADB2A;
font-weight: normal;
font-size: 18px;
margin-top: 0 !important;
}

.sasContent p {
padding: 0 1em;
color: #e6e6e6;
font-weight: normal;
}

.sasContent a {
display: inline;
padding: .3em;
}

.sasContent a:link, .sasContent a:visited {
color: #FFFFFF;
}

.sasContent a:hover, .sasContent a:active {
background-color: #444444; 
color: #cadb2a;
text-decoration: none !important;
}

.sasContent ul,  .sasContent ul li {
margin: 0 0 1em .2em;
list-style-type: arrow;
color: #444444;
}

.sasContent ul span {
color: #EEEEEE;
margin-left: 10px;
}

#compendiumBloggers {
width: 275px;
}

#compendiumBloggers a {
width: 36px !important;
height: 36px !important;
margin: 2px 2px 0 0;
background-color: transparent;
border: none;
float: left;
}

.asales {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat 0 0;
}
.cbaggott {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -45px 0;
}
.kwoodside {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -91px 0;
}
.mglover {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -137px 0;
}
.jbuscher {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -183px 0;
}
.phinton {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -229px 0;
}
.awarner {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat 0 -46px;
}
.ccorner {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -45px -46px;
}
.ssedberry {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -91px -46px;
}
.jhyslop {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -137px -46px;
}
.rcox {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -183px -46px;
}
.jwehner {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -229px -46px;
}
.mmanning {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat 0 -92px;
}
.kfeatherston {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -45px -92px;
}
.dmartin {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -91px -92px;
}
.jlitton {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -137px -92px;
}
.jmurphy {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -183px -92px;
}
.bmillis {
background: transparent url(http://compendium.com/images/blog/compendiumbloggers_sprite.png) no-repeat -229px -92px;
}

.contributors {
line-height: 1.4em;
margin-left: .5em;
}

.contributors a {
padding: 0;
margin: 0;
}

.contributors a:hover, .contributors a:active {
padding: 0;
background-color: transparent;
}

.contributors a:link, .contributors a:visited {
padding: 0;
background-color: transparent;
}

.contributors a img {
padding: 2px;
background-color: #444444;
}

.contributors a img:link, .contributors a img:visited {
padding: 2px;
}

.contributors a img:hover, .contributors a img:active {
background-color: #CADB2A; 
padding: 2px;
}


#footerForm {
padding: 0 0 0 1em;
line-height: 1.3em;
color: #e6e6e6;
}

#footerForm input[type="text"], #footerForm forum input textarea {
background-color: #efefef;
color: #444444;
border: 1px grooved #222222;
padding: .4em;
width: 15.25em;
}


#footerForm img {
clear: left;
margin-left: 35%;
margin-top: 0.3em;
padding-left: 0.3em;
border: 0;
width: auto;
}

#footerFormsubmit {
margin-left: 35%;
margin-top: 0.3em;
margin-bottom: 0.3em;
}

.queryField {
height: 60px;
padding: .4em;
width: 15.25em;
background-color: #efefef;
color: #444444;
border: 1px grooved #222222;
}






/*   GENERAL SETTINGS   */

/* Rounded corners are accomplished though displaying one quarter of an
   absolutely positioned transparent PNG image.  The correct section of the
   image is displayed at each corner of the rounded element using as CSS Sprite
   technique.  The image has a white radius with a transparent inside to let the
   background color of the rounded element come through.

   PNG images look much better than GIF images for this purpose because PNGs
   support alpha transparency.  That means that a given pixel in a PNG image
   can be set to be totally opaque (showing true white, in this case), totally
   transparent (showing the background color of the rounded element), or one of
   254 levels of transparency in between.  Alpha transparency permits us to create
   a smoother antialiased corner than a corresponding GIF image, in which there
   are only fully white or fully transparent pixels.  IE6 and below do not support
   PNG transparency, so a browser-specific CSS file for IE6 specifies a GIF
   version of the corner-rounding mask.  It doesn't look as nice as the PNG in a
   more modern browser, but it is acceptable.
 */
.rounded {
position: relative;
margin: 0;
}

.tl, .tr, .bl, .br {
background: transparent url(http://images.content.compendiumblog.com/images/roundcornersprite-white.png) no-repeat 

scroll !important;
position: absolute;
width: 4px;
height: 4px;
padding: 0 !important;
margin: 0;
}

.tl {
top:0;
left:0;
background-position: 0 0 !important;
}

.tr {
top:0;
right:0;
background-position: -4px 0 !important;
}

.bl {
bottom:0;
left:0;
background-position: 0 -4px !important;
}

.br {
bottom:0;
right:0;
background-position: -4px -4px !important;
}

a:link, a:visited, a:active {
text-decoration: none;
}

a:hover {
text-decoration: underline !important; /* always underline a clickable link during hover */
}


#compendium-analytics {
display: none;
}