/* Highlight content area */
div.highlight
{
    background: #C3E4FF;
    border: 3px solid #A9D9FF;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    margin-bottom: 1em;
    padding: 10px 5% 10px;
    overflow: hidden;
}

div.highlight h3
{
    margin: 0;
    padding: 0;
    font-size: 18px;
}

.highlight { padding:0px; margin: 0 10px; }

div.highlight ul
{
    margin: 0;
}    
div.highlight li
{
    float: left;
    width: 50%;
    list-style: none;    
    margin: 0 0 .25em 0;
}
div.highlight li a
{
    background: url(/assets/images/bullet-blue.gif) left center no-repeat;
    padding-left: 10px;
}

ul.highlight li
{
    float: left;
    width: 456px;
    height: 96px;
    margin-bottom: 16px;
    list-style: none;
    overflow: hidden;
    border:3px solid #A9D9FF;
    background:#E5F3FF;
}
/*ul.highlight li.how-buddybackup-works,
ul.highlight li.why-choose-buddybackup*/
ul.highlight li.even
{
    margin-left: 16px;
}
ul.highlight li:hover
{
    /*border-color: #0080c8;*/
    /*background-image: url(../images/bg-highlight-hover.png)*/
}

ul.highlight li a 
{ 
    text-decoration: none;
}

ul.highlight li div
{
    background: url(/assets/images/icon-network.gif) 10px center no-repeat;
    padding: 10px 8px 10px 86px;
}

/* About / Help icons */
/*ul.highlight li.how-buddybackup-works div,
ul.highlight li.getting-started div
{
    background-image: url(../images/icon-network.gif);
}*/
ul.highlight li.system-requirements div
{
    background-image: url(/assets/images/icon-laptop.gif);
}
ul.highlight li.why-choose-buddybackup div
{
    background-image: url(/assets/images/icon-question.gif);
}
ul.highlight li.contact-us div
{
    background-image: url(/assets/images/icon-letter.gif);
}

ul.highlight li.online-manual div
{
    background-image: url(/assets/images/icon-q.gif);
}
ul.highlight li.download-manual div
{
    background-image: url(/assets/images/icon-pdf.gif);
}
ul.highlight li.restoring-lost-files div
{
    background-image: url(/assets/images/icon-restoring.gif);
}
ul.highlight li.faq div
{
    background-image: url(/assets/images/icon-faq.gif);
}
ul.highlight li.forum div
{
    background-image: url(/assets/images/icon-bulb.gif);
}

ul.highlight li h2 { margin: 10px 0 -8px 0; }
ul.highlight li p { margin-top: .4em; color: #3d3d3d; }

/* Download Page */
#downloadButton {
	position: absolute;
	margin: 50px 0 0 550px;
}

#downloadButton p.compatible {
	margin-left: 60px;
}

.buddyBackupEmailError { color:#ff5a00; font-size:80%; }

.award { clear:both; background: url(/assets/images/award.png) no-repeat 40px 0px; width:100%; margin:15px 0px 30px 0px; }
.award  .awardContent { margin-left:136px; margin-right:40px; border-top:2px solid #F04A51; border-bottom:2px solid #F04A51; }
.award  .awardContent p { line-height:1.3em; background: url(/assets/images/red-quote.png) no-repeat 0px 4px; margin:15px 0px 25px 0px; color:#EC1D25; font-style:italic; padding-left:46px; font-size:1.1em; }
.award  .awardContent .stars { margin:-22px 0px 0px 0px; float:right; padding-left:74px; background: url(/assets/images/stars.png) no-repeat 0px 3px; color:#EC1D25; font-style:italic; }

/* sidebar */
div.supporting-media 
{
    float: right;
    width: 308px;
    padding: 0;
}

.rightPanelWrapper { padding:20px 0 20px 13px; background:#E5EEF5; }
.rightNavDownload { margin-left:40px; }

.secondary-navigation { list-style:none; padding:0; margin:0 0 15px 0; }

.secondary-navigation li
{
	/* See also sifr.css .sIFR-active .secondary-navigation li */
    list-style: none;
    padding-left: 20px;
    margin-bottom: 10px;
    padding-top: 0px;
}

.secondary-navigation li a, .secondary-navigation li a:visited
{
	text-decoration: none;
	font-size: 18px;  /* Don't forget to change in sifr.css too! */
    font-family: Rockwell, Arial;
}

/* Selector did include the link element - but in IE7 sIFR links weren't clickable */
.secondary-navigation li.current,
.secondary-navigation li:hover
{
    background: url(/assets/images/bullet-green-big.gif) left 8px no-repeat;
}

/* HACK: If the background images don't load, the white text will not be visible as they will be on a white background. How can we avoid this, whilst using transparent images? As it is, setting a background colour will bleed through any transparent areas runing the display */
div.supporting-media blockquote
{
    background: url(/assets/images/blockquote-top.gif) left top no-repeat;
    width: 257px;
    margin: 1em auto;
    padding-top: 45px; /* To ensure the top image shows */
    line-height: 1.25;
    margin-top: 1em;
}
div.supporting-media blockquote p
{
    background: url(/assets/images/blockquote-bottom.gif) left bottom no-repeat;
    color: White;
    padding: 0 1em 85px; /* To ensure the bottom of the image shows */
    font-weight: bold;
    text-align: center;
}

/* Compatible section */
p.compatible 
{
    font-size: 0.9em; 
    color: #818181;
}
p.compatible img
{
    display: block;
    margin-top: 1em;
}
div.supporting-media p.compatible 
{
    margin: 1em 4em 3em;
}

input.button {
    background: url(/assets/images/input_button_bg.gif);
    color: white;
    border: none;
    width: 79px;
    height: 25px;
    text-transform:uppercase;
    margin-left:0px;
}