How can I code a Highlightbox like this:

https://themes.jestro.com/vigilance/features/

I was browsing for a new theme and stumbled upon this one that had that great Highlight box feature, I wanted to see how it would look if I incorporated it in my current theme :),

The css of it seems straight forward:

.highlight-box {
	float: right;
  margin: 0 0 10px 10px;
	width: 200px;
	padding: 10px;
  font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans", Verdana, Arial, sans-serif;
	border-top: 8px solid #000;
	background: #772124;
	color: #fff;
	}
.highlight-box a:link, .highlight-box a:visited {
	color: #fff;
	text-decoration: underline;
}
.highlight-box a:hover { text-decoration: none; }
.entry .highlight-box p {
  margin: 10px 0;
  line-height: 1.4em;
  font-size: 1.1em;
  }
.entry .highlight-box ul li {
  font-size: 1.1em;
  background: url(../images/list-square.gif) no-repeat 0 .4em;
   }
.entry .highlight-box h2, .entry .highlight-box h3, .entry .highlight-box h4 {
 margin: 0;
 padding: 0;
 color: #fff;
 }
.highlight-box h2 { text-transform: uppercase; }

But how could I implement that into a post after adding it to the stylesheet? :S

Thanks for your help ??