﻿/* Promo codes */
.promoCodes #content {
    padding-right: 0px;
    padding-left: 0px;
}
.promoCodes .title {
	font-size: 20px;
    padding-bottom: 0;
    margin-bottom: 0;
    border: none;
}
.promoCodes .node {
    font-size: 14px;
    margin-bottom: 16px;
}
.promoCodes .label {
    font-size: 12px;
}

.promoCodes .generate {
    margin-bottom: 50px;
}
.promoCodes .generate .textBoxWrapper {
    margin-right: 4px;
    margin-bottom: 0;
}
.promoCodes .generate .email .Button_Usability {
    vertical-align: bottom;
}
.promoCodes .textBoxWrapper.numeric-textbox {
    margin-right: 4px;
}
.promoCodes .dialog_Usability {
    width: 80%;
}
.promoCodes .dialog_Usability .title {
    border-bottom: 1px solid #cccccc;
    font-size: 15px;
	padding-bottom: 6px;
    margin-bottom: 12px;
}
.promoCodes .dialog_Usability .subtitle {
	font-size: 14px;
	line-height: normal;    
	border-bottom: 1px solid #cccccc;
	padding-bottom: 6px;
    margin-bottom: 10px;
}
.promoCodes .dialog_Usability .captionText {
    text-align: left;
}
.promoCodes .dialog_Usability .note {
    margin-bottom: 24px;
}
.promoCodes .message {
    margin-top: 8px;
}
.promoCodes .message,
.promoCodes .TextArea_Usability {
    width: 100%;
    height: 315px;
}
.promoCodes .dialog_Usability .right {
    padding-right: 0px;
}


.promoCodes .print .comboBoxWrapper {
    margin-right: 4px;
    width: 96px;
}
.promoCodes .print .RadComboBox {
    width: auto !important;
}
.promoCodes .print {
    margin-bottom: 50px;
}
/*.promoCodes .vouchers {
    width: 680px;
    margin-top: 12px;
    padding-bottom: 17px;
}
.promoCodes .voucher {
    display: inline-block;
    border: 1px dashed #d5d5d5;
    width: 301px;
    height: 107px;
    padding: 14px 5px 5px 22px;
    margin-right: 6px;
    margin-bottom: 6px;
}
.promoCodes .voucher .discount p {
    height: 81px;
    position: relative;
    margin: 0;
}
.promoCodes .voucher .logo {
    display: block;
    width: 70px;
}
.promoCodes .voucher .discount,
.promoCodes .voucher .details {
    display: inline-block;
    vertical-align: top;
}
.promoCodes .voucher .discount .amount {
    font-size: 66px;
    font-weight: bold;
    color: #cdcccc;
    text-align: right;
    position: relative;
    top: -15px;
}
.promoCodes .voucher .discount .percent {
    font-family: Georgia;
    font-size: 36px;
    font-style: italic;
    color: #cdcccc;
    text-align: left;
    position: relative;
    top: -40px;
    left: -6px;
}
.promoCodes .voucher .details {
    line-height: 1.2;
    position: relative;
    padding-left: 12px;
    max-width: 210px;
}
.promoCodes .voucher .description,
.promoCodes .voucher .valid,
.promoCodes .voucher .code,
.promoCodes .voucher .sender .label,
.promoCodes .voucher .sender .value {
    display: block;
}
.promoCodes .voucher .code .label,
.promoCodes .voucher .code .value {
    display: inline-block;
}
.promoCodes .voucher .description {
    font-size: 18px;
    color: #191919;
    margin: 4px 0 4px 0;
}
.promoCodes .voucher .valid {
    font-size: 9px;
    color: #939393;
    margin-bottom: 2px;
}
.promoCodes .voucher .code .label {
    font-size: 9px;
    color: #939393;
}
.promoCodes .voucher .code {
    margin-top: -1px;
    margin-bottom: 24px;
}
.promoCodes .voucher .code .value {
    font-size: 12px;
    color: #939393;
}
.promoCodes .voucher .sender {
    line-height: 1.3;
    position: absolute;
    top: 81px;
}
.promoCodes .voucher .sender .label,
.promoCodes .voucher .sender .value {
    font-size: 8px;
}
.promoCodes .voucher .sender .label {
    color: #a5a5a5;
}
.promoCodes .voucher .sender .value {
    color: #191919;
}
*/
.promoCodes .vouchers {
    width: 100%;
    margin-top: 4px;
    margin-bottom: 8px;
}
.promoCodes .vouchers th,
.promoCodes .vouchers td {
    height: 40px;
    border-bottom: 1px solid #ccc;
    text-align: left;
}
.promoCodes .vouchers th {
    font-size: 13px;
    font-weight: normal;
    text-transform: uppercase;
}
.promoCodes .vouchers .key,
.promoCodes .vouchers .discount,
.promoCodes .vouchers .validto {
    width: 180px;
}
.promoCodes .vouchers .print {
    text-align: right;
}
.promoCodes .vouchers .print a {
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-right: 25px;
    background: url("../../Images/V4/V4-icons.png") no-repeat;
    background-position: -460px -140px;
}
.promoCodes .vouchers .print a:hover {
    background-position: -460px -160px;
}

.promoCodes .printButton {
    float: right;
    margin-right: 3px;
    font-size: 13px;
    text-transform: uppercase;
}

.promoCodes .history .label.bold {
	font-size: 20px;
    text-transform: uppercase;
}
.promoCodes .filter {
    text-align: right;
    margin-bottom: 4px;
}
.promoCodes .filter .comboBoxWrapper  {
    margin-right: 0;
}


/* Promotions (RAF, Loyalty, ...) */
.promotions .subtitle {
    /*font-family: Futura, Arial;*/
    font-size: 36px;
    font-weight: bold;
	min-height: 29px;
	line-height: 40px;    
    padding-bottom: 14px;
    text-align: center;
    text-transform: none;
}
.promotions .offer.single {
    display: inline-block;
    margin-top: -1px;
    margin-left: 64px;
    margin-right: 60px;
}
.promotions .offer .pagingWrapper {
    min-width: 733px;
}
.promotions .offer .pagination {
    border-bottom-color: #e5e5e5;
}

.promotions .offerItem .points {
    text-transform: capitalize;
}
.promotions.loyalty .offerItem .price {
    color: #9a9a9a;
    text-decoration: line-through;
}
.promotions .offerItem .productLink {
    position: relative;
    display: inline-block; 
    height: 20px;
    width: 100%;
    z-index: 2;
    font-size: 12px;
    font-weight: normal;
    color: #000;   
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
   
}
.promotions .summary,
.ordering .loyalty .summary {
    display: inline-block;
    width: 160px;
    border: 2px solid #f3f3f3;
    padding: 37px 22px 33px 22px;
    text-align: center;
}
.promotions .summary .label,
.ordering .loyalty .summary .label {
    font-size: 13px;
    text-transform: uppercase;
    color: #666;
}
.promotions .summary .balance,
.ordering .loyalty .summary .balance {
    font-size: 37px;
    line-height: 44px;
    margin-bottom: 1px;
}
.promotions .summary .exchangeNote,
.ordering .loyalty .summary .exchangeNote {
    margin-top: 12px;
    font-size: 12px;
    line-height: 15px;
}
.promotions .summary .simple-link {
    font-size: 12px;
    margin-top: 5px;
}

/* Recommend a friend, Loyalty program */
.raf,
.promotions.loyalty {        
    display: inline-block;  /* for correct calculation of contentWrapper.height() */
}
.raf .content {
	/*border-bottom: 1px solid #cccccc;*/
	padding-bottom: 10px;
    display: inline;
    width: 100%
}
.raf .overview,
.loyalty .overview {
    width: 437px;
    display: inline-block;
    vertical-align: top;
}
.raf.banner .overview,
.loyalty.banner .overview {
    padding-top: 17px;
}
.raf .overview {
    float: left; 
    width: 60%;
}
.raf .beauty-rewards {
    display: inline-block;
    margin-left: 56px;
    margin-right: 50px;
    float: right;
}
.raf .earn,
.raf .editorials,
.raf .favorites,
.loyalty .spend,
.loyalty .redeemPoints {
    width: 733px;
}
.loyalty .rewards .redeemPoints {
    width: 100%;
}
.raf .earn,
.loyalty .spend {
    margin-bottom: 24px;
}
.raf.banner .earn .title,
.loyalty.banner .spend .title {
    margin-bottom: 30px;
}
.raf .earn .overview,
.loyalty .spend .overview {
    width: 477px;
    margin-right: 42px;
}
.raf .earnedPoints,
.loyalty .earnedPoints {
    display: inline-block;
}
.raf .expiration,
.loyalty .expiration {
    margin-top: 7px;
    width: 208px;
    color: #a3a3a3;
    font-size: 10px;
    text-align: center;
}
.raf .overview .reward,
.loyalty .overview .redeem {
    margin: 0;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 16px;
}
.raf.banner .overview .reward,
.loyalty.banner .overview .redeem {
    text-align: center;
}
.raf .summary,
.loyalty .summary {
    margin-top: 21px;
}
.raf.banner .summary,
.loyalty.banner .summary {
    margin-top: 0px;
}
.loyalty .overview .divButtons {
    margin-bottom: 5px;
}
.raf .offer,
.loyalty .offer {
    padding-top: 12px;
}
.loyalty .offer.rewards {
    padding-top: 0px;
}
.raf .editorials,
.loyalty .redeemPoints.detail {
    margin-top: 20px;
    display: inline-block;
}
.raf .editorials {
    margin-bottom: 54px;
}
.raf .editorials .subtitle,
.loyalty .redeemPoints .subtitle {
    font-size: 12px;
    font-weight: normal;
    color: #666;
    text-transform: uppercase;
    border-bottom: 0px;
    height: 23px;
    margin-bottom: 2px;
}
.raf .editorials .divButtons,
.raf .recommendations .divButtons,
.loyalty .redeemPoints .divButtons {
    padding-top: 13px;
    padding-bottom: 0px;
}
.raf .editorials .divButtons,
.loyalty .redeemPoints .divButtons {
    padding-right: 8px;
}
.raf .favorites {
    margin-bottom: 46px;
}
.raf.promotions .favorites .title {
    margin-bottom: 8px;
}
.raf .favorites .products {
    margin-bottom: 7px;
}
.raf .recommendations .Repeater_Usability {
    width: 100%;
}
.raf .recommendations .Repeater_Usability th {
    font-size: 12px;
    font-weight: normal;
    text-align: center;
    padding-bottom: 6px;
    border-bottom: 1px solid #e6e6e6;
}
.raf .recommendations .Repeater_Usability td {
    font-size: 12px;
    padding-top: 5px;
    padding-bottom: 2px;
    border-bottom: 1px solid #e6e6e6;
}
.raf .recommendations th.productName {
    text-align: left;
}
.raf .recommendations td.productName 
{
    padding-left: 9px;
    padding-right: 8px;
}
.raf .recommendations .receiver {
    width: 100px;
    padding-left: 4px;
    padding-right: 4px;
}
.raf .recommendations .receiver div {
    font-size: 12px;
    text-align: center;
    width: 150px;
	overflow: hidden;
	text-overflow: ellipsis;    
}
.raf .recommendations td.when {
    text-align: center;
    width: 110px;
    padding-left: 4px;
    padding-right: 4px;
}
.raf .recommendations th.status,
.raf .recommendations td.status {
    text-align: right;
    width: 122px;
}
.raf .recommendations td.status.invalid {
    color: #ea094f;
}
.raf .dialog_Usability {
    width: 650px;
}
.raf .dialog_Usability .title {
    margin-bottom: 12px;
}
.raf .dialog_Usability .note {
    font-size: 12px;
    margin-bottom: 24px;
}
.raf .dialog_Usability .content {
    display: inline-block;
    border: 1px solid #cccccc;
    padding-bottom: 17px;
}
.raf .dialog_Usability .errorResult UL {
    width: auto;
    float: none;
}
.raf .dialog_Usability .offerItem {
    width: 262px;
    margin-top: 26px;
    margin-bottom: 20px;
    padding-left: 4px;
    padding-right: 4px;
}
.raf .dialog_Usability .offerItem .image {
    padding-top: 0px;
    padding-bottom: 0px;
    width: auto;
}
.raf .dialog_Usability .offerItem .image img {
    width: 245px;
    height: 245px;
}
.raf .dialog_Usability .offerItem .prodDescription {
    margin-left: 50px;
    margin-right: 50px;
}
.raf .dialog_Usability .decorative {
    width: auto;
}
.raf .emailBody {
    width: 365px;
    margin-top: 24px;
    padding-left: 10px;
    padding-top: 21px;
    border-right: 1px solid #cccccc;
    display: inline-block;
    float: left;
}
.raf .emailBody .textAreaWrapper {
    width: 355px;
    height: 345px;
    border: 0px;
}
.raf .emailBody .TextArea_Usability {
    font-family: Georgia;
    font-style: italic;
    width: 337px;
    height: 350px;
    background-color: #fff;
    overflow: auto;
}
.raf .dialog_Usability .divButtons {
    padding-top: 20px;
    padding-bottom: 3px;
}
.raf .dialog_Usability .divButtons .right .textBoxWrapper {
    margin-right: 0px;
    margin-bottom: 0px;
}