You might pop it into a plain text file and save it. Or not. :-)

#blackout-ribbon {
position: fixed !important;
top: -50px !important;
top: -22px !important;
right: 0 !important;
z-index: 99000 !important;
cursor: pointer !important;
height: 40px !important;
line-height: 40px !important;
padding: 0 100px !important;
font-size: 16px !important;
letter-spacing: 1px !important;
text-shadow: -1px -1px 0 #111 !important;
font-family: "Helvetica Neue", sans-serif !important;
text-decoration: none !important;
color: white !important;
text-transform: uppercase !important;
font-weight: bold !important;
border-style: solid !important;
border-color: #414141 !important;
border-width: 1px 0 !important;
-webkit-box-shadow: inset 0 0 0 1px #6A6A6A !important;
-moz-box-shadow: inset 0 0 0 1px #6A6A6A !important;
box-shadow: inset 0 0 0 1px #6A6A6A !important;
background-color: #222 !important;
background-image: linear-gradient(left , #222 0%, #545454 50%, #222 100%) !important;
background-image: -o-linear-gradient(left , #222 0%, #545454 50%, #222 100%) !important;
background-image: -moz-linear-gradient(left , #222 0%, #545454 50%, #222 100%) !important;
background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #222), color-stop(0.5, #545454), color-stop(1, #222) ) !important;
background-image: -webkit-linear-gradient(left , #222 0%, #545454 50%, #222 100%) !important;
background-image: -ms-linear-gradient(left , #222 0%, #545454 50%, #222 100%) !important;
-moz-transform: rotate(45deg) translate(151px, -11px) !important;
-webkit-transform: rotate(45deg) translate(151px, -11px) !important;
-o-transform: rotate(45deg) translate(151px, -11px) !important;
-ms-transform: rotate(45deg) translate(151px, -11px) !important;
transform: rotate(45deg) translate(151px, -11px) !important;
}

You can create a square, transparent PNG image with the ribbon and then put slip it in as a background image right aligned at top.

One is spacing between paragraphs since each non-captioned image is enclosed in paragraph tags.

The second is some bottom margin that is set for all non-captioned images.

The paragraph spacing should not be changed since it would also change the spacing between textual paragraphs.

You can adjust the bottom margin for centered images by adding this to your CSS and adjusting as desired, but this will also bring any text under an image up closer to the bottom of the image and it will also affect captioned images that are before or follow a non-captioned image.

You can add this to your CSS and play with the bottom margin values. The second bit of code you already have in your CSS (without the margin-bottom) so just add a margin-bottom declaration to it and the you will have to work the two together to get the spacing to be consistent. Make sure and check spacing between images and text following an image as this will also be affected by the changes you make below.

.aligncenter, #sidebar .aligncenter {
margin-bottom: 10px;
}

.wp-caption {
margin-bottom: 5px;
}

Point me to a place where you are seeing this.

Thank you very much .. #SHIMWORLD is now ready to usher in the Year of the Dragon (3 days to go).

.wp-caption p.wp-caption-text {
background-color: #000000;
color: #FFFFFF;
font-size: 13px;
margin-left: 4px !important;
margin-right: 4px !important;
padding: 10px !important;
line-height: 130% !important;
}

.wp-caption {
background: none;
border: none;
}

.wp-caption img {
border: 1px solid #000000 !important;
}

The wordpress/theme software is actually setting the width of the caption background in the HTML code. Normally the way I do this is to bring it in at the same width as the image and then use CSS to add padding as needed around the image. That gives you full control through CSS. The way this is done on this particular theme, the width of the caption background is out of our hands. The best we can do is take away the border line and the padding set in the CSS which will leave 5px of background showing on left, top and right of the image.

Let take out all the code I had you put in, and you tweaked, and start from scratch.

[sourcecode language="css"]
.wp-caption {
background:#000000;
border:none;
border-radius:0;
color:#eee;
width:620px!important;
padding:1px 0 10px;
}

.wp-caption p.wp-caption-text {
font-size:1em;
padding-top:9px;
line-height:1.5em;
}

.widget_image .wp-caption {
background:none repeat scroll 0 0 #000000;
border:medium none;
border-radius:0 0 0 0;
color:#EEEEEE;
width:232px!important;
padding:0 0 10px;
}
[/sourcecode]

.entry .wp-caption {
background: #000000;
padding: 2px 0 10px;
width: 624px !important;
border: none;
border-radius: 0;
color: #eee;
}

.entry .wp-caption p.wp-caption-text {
line-height: 1.5em;
}

.widget_image .wp-caption {
background: none repeat scroll 0 0 #000000;
border: medium none;
border-radius: 0 0 0 0;
color: #EEEEEE;
padding: 2px 0 10px;
width: 234px !important;
}

`.widget_image .wp-caption {
background: none repeat scroll 0 0 #000000;
border: medium none;
border-radius: 0 0 0 0;
color: #EEEEEE;
padding: 2px 0 10px;
width: 234px !important;
}

.widget_image .wp-caption {
background: none repeat scroll 0 0 #000000;
border: medium none;
border-radius: 0 0 0 0;
color: #EEEEEE;
padding: 2px 0 10px;
width: 234px !important;
}`

.widget_image .wp-caption {
background: #000000;
padding: 2px 0 10px;
border: none;
border-radius: 0;
color: #eeeeee;
}

Add in the first code instead and I'll come up with additional code strictly for the image widgets.

[sourcecode language="css"]
#wrap,#nav,div#header {
-moz-border-radius-topleft:0;
-moz-border-radius-topright:0;
-moz-border-radius-bottomleft:0;
-moz-border-radius-bottomright:0;
-khtml-border-radius:0;
-webkit-border-top-left-radius:0;
-webkit-border-top-right-radius:0;
-webkit-border-bottom-left-radius:0;
-webkit-border-bottom-right-radius:0;
}

body {
font-family:Serif, Arial, Tahoma, Verdana;
font-size:13px;
}

#searchform,#subnav,.rsslink,.tags,.categories {
display:none;
}

#sidebar .widget_search form {
display:block;
}

#header {
width:960px;
height:385px;
background:#fff url('http://shimworld.files.wordpress.com/2011/01/wordpress-2011.jpg') no-repeat 0 0;
border-top:none;
margin:0 auto 1px;
}

#nav {
float:left;
width:960px;
min-height:45px;
background:#333 url('images/nav.png') repeat-x;
display:block;
text-transform:uppercase;
position:relative;
margin:0 auto;
padding:0;
}

.post-meta {
margin-bottom:-25px;
}

#s {
width:170px;
}

#sidebar .widget {
margin:0 0 15px;
}

.commentlist li ul li {
font-size:13px;
}

.twp-container {
margin-left:Auto!important;
}

div.sharedaddy h3,#content div.sharedaddy h3,#main div.sharedaddy h3,#primary div.sharedaddy h3 {
padding-right:15px;
width:auto;
}

div.sharedaddy .sd-content {
float:left;
width:auto;
}

.wp-caption {
background:#000000;
width:624px!important;
border:none;
border-radius:0;
color:#eee;
padding:1px 0 10px;
}

.wp-caption p.wp-caption-text {
font-size:1em;
padding-top:9px;
line-height:1.5em;
}
[/sourcecode]

Give this a try and see what you think (add to bottom of your CSS). I've targeted only the images in the posts/pages and left the ones in the sidebar alone. Those can be changed as well if you wish by using the second bunch of code. You might want to try it both ways.

.entry .wp-caption {
background: #000000;
padding: 2px 0 10px;
width: 624px !important;
border: none;
border-radius: 0;
color: #eee;
}

.entry .wp-caption p.wp-caption-text {
line-height: 1.5em;
}

Or to do all images with captions.

.wp-caption {
background: #000000;
padding: 2px 0 10px;
width: 624px !important;
border: none;
border-radius: 0;
color: #eee;
}

.wp-caption p.wp-caption-text {
line-height: 1.5em;
}

This is a screen shot from the Boston Big Picture web page. Is this what you pictured?

All the stuff for the captions on your theme though are pretty much right here. I added a color declaration since you will most likely want to change that (the color code I put in is just a placeholder).

.wp-caption {
background: #F5F5F5;
border: 1px solid #E4E4E4;
border-radius: 3px 3px 3px 3px;
color: #CC0000;
padding: 7px 2px;
text-align: center;
}

If you want to control each border independently, then replace the combined border declaration with the following and edit as you see fit.

border-top: 1px solid #E4E4E4;
border-bottom: 1px solid #E4E4E4;
border-left: 1px solid #E4E4E4;
border-right: 1px solid #E4E4E4;

Sorry I can't be more specific, but I can't fly to Boston's site tonight. :-)