/* buildingblocks portalpage */
h2.smallmargin
{
    margin: 20px 0 5px 0;
}
.buildingblock
{
    position: relative;
    width: 813px;
    height: 170px;
    margin-bottom: 10px;
    border: 1px solid #000;
}

.buildingblock img
{
    position: absolute;
    left: 10px;
    top: 10px;
    max-width: 150px;
    max-height: 150px;
}
.buildingblock img.locked
{
    position: absolute;
    left: 15px;
    top: 15px;
    max-width: 20px;
    max-height: 20px;
}
.buildingblock button.add,
.buildingblock button.start
{
    width: 140px;
    height: 22px;
    color: #fff;
    font-weight: normal;
    font-size: 14px;
    line-height: 14px;
    margin-top: 5px;
    border: 1px solid #000;
    border-radius: 10px;
}
.buildingblock > button.add,
.buildingblock > button.start
{
    position: absolute;
    left: 15px;
    bottom: 6px;
}
.buildingblock button.add
{
    background: green;
}
.buildingblock button.start
{
    background: #333;
}
.buildingblock .light-blue,
.buildingblock .description,
.buildingblock .usps
{
    position: absolute;
    left: 170px;
    width: 440px;
}
.buildingblock .description
{
    top: 30px;
    font-size: 12px;
}
.buildingblock .light-blue
{
    top: 7px;
}
.buildingblock .usps
{
    bottom: 10px;
    padding: 10px;
    border: 1px solid #000;
    width: 420px;
    background-color: #eee;
}
.buildingblock .description
{
    font-size: 13px;
}
.buildingblock .usps
{
}
.buildingblock .usps .usp
{
    display: inline-block;
    width: 180px;
    font-size: 12px;
    padding-left: 20px;
    background-image: url(/public/images/gray_dark/check_12x10.png);
    background-repeat: no-repeat;
    background-position: center left;
}
.buildingblock .credits,
.buildingblock .upgrade,
.buildingblock .addtoaccount
{
    position: absolute;
    right: 0;
    width: 165px;
    padding: 2px 5px;
    text-align: center;
    border: 1px solid #000;
    font-size: 14px;
}
.buildingblock .credits
{
    top: 0;
}
.buildingblock .upgrade
{
    top: 40px;
    padding: 8px 5px;
}
.buildingblock .upgrade.free
{
    padding: 15px 5px;
}

.buildingblock .addtoaccount
{
    bottom: 10px;
    border-right: 0;
    padding: 5px 6px 5px 5px;
    line-height: 18px;
}
.buildingblock .credits,
.buildingblock .upgrade
{
    background-color: #000;
    color: #fff;
}
.buildingblock .digibooklink,
.buildingblock .examlink
{
    cursor: pointer;
}


.upgradepopup {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
}
.upgradepopup .overlay
{
    position:fixed;
    width:100%;
    height:100%;
    opacity:0.5;
}
.upgradepopup .content
{
    display: none;
    width: 600px;
    padding: 10px 40px 20px 40px;
    position: fixed; /* absolute;*/
    left: 50%;
    margin-left: -340px;
    top: 50%;
    margin-top: -250px; /*-300px;*/
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 10px;
    z-index:1001;
}
.upgradepopup .close
{
    position: absolute;
    top: 10px;
    right: 15px;
    font-weight: bold;
    cursor: pointer;
}
.upgradepopup .upgradeheader
{
    margin-top: 15px;
}
.upgradepopup h2.light-blue
{
    font-weight: bold;
}
.upgradeitem
{
    position: relative;
    width: 580px;
    border: 1px solid #000;
    border-radius: 5px;
    padding: 15px 0 15px 5px;
    margin-bottom: 5px;
}
.upgradeitem:hover
{
    background-color: #efe;
}
.upgradeitem.selected
{
    background-color: #dfc;
}
.upgradeitem span,
.upgradeheader span,
.upgradeitem label
{
    display: inline-block;
}
.upgradeitem input[type="radio"],
.payitem input[type="radio"]
{
    margin: 0 5px;
    vertical-align: middle;
}
.upgradeitem span.description,
.upgradeitem label.description
{
    width: 380px;
    font-weight: bold;
}
.upgradeitem span.price,
.upgradeheader span.price
{
    width: 80px;
    text-align: center;
}
.upgradeitem span.price.incl
{
    font-weight: bold;
}
.upgradeheader span.incl
{
    margin-left: 410px;
}
.upgradeitem span.recommended
{
    position: absolute;
    top: 0;
    right: 10px;
    padding: 1px 10px;
    background: green;
    color: white;
    font-size: 11px;
}
.upgradeitem,
.payitem
{
    cursor: pointer;
}

.payitem
{
    display: inline-block;
    width: 270px;
    border: 1px solid #000;
    border-radius: 5px;
    padding: 10px 0 10px 5px;
}
.payitem.chosen
{
    background-color: #efd;
    border-color: #8f8;
}
.payitem.notchosen,
.upgradeitem.notchosen
{
    background-color: #fdd;
    border-color: #f88;
}
.payitem.paypal
{
    margin-left: 27px;
}
.payitem img
{
    vertical-align: middle;
}

.upgradeheader span.price
{
    width: 80px;
    text-align: center;
}

.upgradepopup button.upgrade
{
    width: 150px;
    height: 30px;
    color: #fff;
    font-weight: normal;
    font-size: 14px;
    line-height: 14px;
    margin-top: 20px;
    background: green;
    border: 1px solid #000;
    border-radius: 5px;
    margin-left: 210px;
}
