.clearBoth {
    clear:both;
}

#sidebarCartFrame {
    display:none;
}

.contentContainer {
    width:99%;
    max-width:1351px;
    margin:0 auto;
}

#sidebarCartFrame {
    display:none;
}

.checkoutTerms {
    padding:10px 0 0 0;
    float:left;
    font-size:12px;
    width:100%;
    text-align:left;
}

.checkoutTerms a {
    color:#06c;
}

#modalConfirmTwo {
    display:none;
}

.savedPayment, #showSavedCards {
    display:none;
}

.paymentShow {
    display:block;
}

.loginButtonWrapper {
    max-width: 300px;
    margin: 0 auto;
}

#pageOverlayWrap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.7);
    z-index: 99998;
    position: fixed;
    display: none;
}

#pageOverlay {
    top: 50px;
    width: 470px;
    height:700px;
    background: none;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-bottom: 24px;
    z-index: 99999;
    display:none;
}

#pageOverlayFrame {
    height:850px;
    background: none;
}

#pageOverlayClose {
    position:absolute;
    right:5px;
    font-size:24px;
    line-height:30px;
    font-weight:600;
    text-align:center;
    cursor:pointer;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
}

#savedCardError, #newCardError, #disabledAccount {
    display:none;
    font-size: 12px;
    line-height: 18px;
    color: #db2222;
    text-align: center;
}

#savedCardError a, #newCardError a, #disabledAccount a {
    color: #06c;
}

#pageOverlayConfirm {
    width:100%;
    background-color:#ffffff;
    border-radius:8px;
    border:solid 3px #888;
}

.confirmButtons {
    width:260px;
    margin:0 auto;
    padding-bottom:30px;
    position:relative;
}

.overlayModalHeader {
    color: #000;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
}

.modalConfirmText {
    width:100%;
    text-align:center;
    margin-bottom:20px;
    font-size:16px;
    line-height:24px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
}
.modalLoader {
    height:100%;
    width:100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url("../img/loader.gif") no-repeat center center;
    z-index:10;
}

#modalLoader {
    height:150px;
    display:none;
}

#modalComplete {
    height: 170px;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #ffffff;
    border-radius: 4px;
}

.modalFirst {
    width:80%;
    font-size:21px;
    line-height:28px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    margin:0 auto;
    text-align:center;
    padding: 0 20px;
    margin-top:10px;
    margin-bottom:20px;;
}

#modalCheckmark {
    height:100px;
    width:100px;
    border-radius:50px;
    background: #36b210;
    text-align:center;
    font-size:64px;
    color:#ffffff;
    line-height:100px;
    margin:0 auto;
}

#pageLoader {
    position:fixed;
    top:100px;
    left:45%;
    height:250px;
    width:200px;
    display:none;
}


.homeContentWrap {
    margin-top: 170px;
    min-height: 630px;
    position: relative;
    background: #ffffff;
}

.homeCategoryWrap {
    width:100%;
}

.topTen {
    top:10px;
}

.cardFrame {
    width:100%;
    max-width:240px;
    height:130px;
    border-radius: 10px;
    background-color: rgb(25, 52, 94);
    margin:0 auto;
    padding:15px;
    box-shadow: 3px 4px 4px 0 rgba(212,210,212,1);
}

.cardColor {
    background-color:#ffffff !important;
    margin-top:15px;
}

.cardLogo {
    float:left;
    height:40px;
}

.cardLogo img{
    height:40px;
}

.cardLogoText {
    float:left;
    margin-left:10px;
    color:#e8e8e8;
    font-size:28px;
    line-height:40px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-weight:600;
}

.cardText {
    color:#e8e8e8;
    font-size:14px;
    line-height:22px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-weight:600;
}

.cardPriceText {
    color:#e8e8e8;
    font-size:22px;
    line-height:30px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-weight:600;
}

.cardBottom {
     margin-top:20px;
 }

.cardBottomLeft {
    float:left;
    width:150px;
}

.cardBottomRight {
    float:left;
}

.cardButton {
    width:90px !important;
    text-align:center;
    font-size:13px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height:28px;
    color: #06c;
    border:solid 1px #06c;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
    background-color:#ffffff;
    border-radius:4px;
    box-sizing: border-box;
    margin-top:38px;
}

.cardButton:hover {
    cursor:pointer;
    color:#ffffff;
    background-color:#06c;
}

.homeHeaderText {
    font-size:22px;
    line-height:32px;
    font-weight:600;
    margin-top:10px;
    margin-bottom:10px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
}

.homeBoxWrapper {
    width:99%;
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
}

.artBoxWrapper {
    width:100%;
    max-width:950px;
    margin:0 auto;
    padding:20px;
}

.artBoxLeft {
    width:60%;
    float:left;
}

.artBoxRight {
    width:35%;
    float:left;
}

.artBuyBoxLeft {
    width:40%;
    margin-top:45px;
    float:left;
}

.artBuyBoxRight {
    width:55%;
    float:left;
}

.artList {
    margin-left:20px;
    list-style-type: disc;
}

.artList li{
    padding-bottom:20px;
    list-style-type: disc;
    color: #37465A;
}

.artBoxFooter {
    width:100%;
    max-width:950px;
    margin:0 auto;
    padding:20px;
}

.artFooterImage {
    height: 125px;
}

.artFineText {
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    padding-bottom:10px;
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
}

.artBuyBoxText {
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    font-family: Arial, Helvetica, sans-serif;
    color: #37465A;
    height:130px;
    width:130px;
    border-radius:65px;
    border: solid 1px #37465A;
    text-align:center;
    display: inline-block;
}

.artBuyBoxMiddle {
    margin-top:10px;
    margin-left:15px;
    width:100px;
    text-align:center;
}

.artFooterText {
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    padding-bottom:10px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #000000;
}

.artFooterLeft {
    float:left;
    padding-right:20px;
}

.artFooterRight {
    float:left;
    width:80%;
}

.specialBoxWrapper {
    min-width:100%;
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
    overflow-x: auto;
}

.specialPackagesBox {
    width:32%;
    border-radius:5px;
    margin-right:5px;
    margin-left:5px;
    background-color:rgb(25, 52, 94);
    color:#ffffff;
    position:relative;
    cursor:pointer;
}

.specialBoxTop {
    height:160px;
    position:relative;
}

.specialBoxImage {
    border-radius:4px 4px 0 0;
    height:100%;
    width:100%;
    object-fit: cover;
}

.specialBoxTitle {
    font-size:16px;
    line-height:32px;
    font-weight:600;
    margin-left:10px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#ffffff;
}

.specialBoxText {
    font-size:13px;
    line-height:18px;
    font-weight:400;
    margin-left:10px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#ffffff;
}

.specialOffer {
    height:14px;
    font-size:12px;
    text-align:center;
    line-height:14px;
    color: #ffffff;
    font-weight:400;
    border-radius:5px;
    padding:2px 8px;
    background-color:goldenrod;
    position:absolute;
    right:20px;
    top:10px;
}

.specialArrowBox {
    margin-top:20px;
}

.regularBoxWrapper {
    position:relative;
    width:23%;
    margin:5px;
    flex-grow:3;
}

.regularBox {
    width:100%;
    height:250px;
    border-radius:5px;
    margin-right:5px;
    margin-left:5px;
    margin-bottom:10px;
    background-color:#f4f4f4;
    color:#015cf0;
    cursor:pointer;
}

.regularBoxTop {
    padding-top:15px;
    width:100%;
    height:150px;
    text-align:center;
}

.overlayBox {
    width:90%;
    height:230px;
    padding:10px 20px;
    border-radius:5px;
    background-color:#015cf0;
    color:#ffffff;
    cursor:pointer;
    position:absolute;
    top:0;
    left:5px;
    opacity: 0.9;
    display:none;
}

.overlayBoxTitle {
    line-height:28px;
    font-size:18px;
    font-weight:600;
    color:#ffffff;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
}

.overlayBoxText {
    line-height:13px;
    font-size:13px;
    font-weight:400;
    margin-bottom:15px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#ffffff;
}

.overlayBoxLine {
    line-height:30px;
    font-size:14px;
    font-weight:400;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#ffffff;
}

.overlayBoxButton {
    width:90%;
    height:40px;
    position:absolute;
    bottom:10px;
    left:20px;
    text-align:center;
    font-size:13px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height:40px;
    color: #06c;
    margin-top:10px;
    background-color:#ffffff;
    border-radius:4px;
    box-sizing: border-box;
}

#trendingBoxWrapper {
    min-width:100%;
    display: flex;
    align-content:space-between;
    overflow-x: auto;
}

.trendingBoxTop {
    padding-top:15px;
    width:100%;
    height:150px;
    text-align:center;
}

::-webkit-scrollbar {
    width: 0;
    background: transparent; /* make scrollbar transparent */
}

.trendingBox {
    min-width:290px;
    width:290px;
    height:300px;
    position:relative;
    border-radius:5px;
    border: solid 1px #f4f4f4;
    margin-right:5px;
    margin-left:5px;
    margin-bottom:10px;
    background-color:#f4f4f4;
    color:#015cf0;
}

.trendingButtons {
    position: absolute;
    width:100%;
    height:50px;
    padding-left:30px;
    bottom: 0;
    left: 0;
}

.trendingButton {
    border-radius: 4px;
    box-shadow: 0 4px 4px -3px rgba(0, 102, 204, 0.5);
    border: solid 1px #0066cc;
    background-color: #ffffff;
    float:left;
    width:120px;
    height:32px;
    text-align:center;
    font-size:13px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height:28px;
    color: #06c;
    margin-right:10px;
    box-sizing: border-box;
}

.trendingButton:hover {
    cursor:pointer;
    box-shadow: 0 4px 8px -2px rgba(25, 52, 94, 0.7);
}

.trendingButton a {
    cursor:pointer;
    color: #06c;
    background-color:#ffffff;
}

.trendingButtonBlue {
    border-radius: 4px;
    box-shadow: 0 4px 4px -3px rgba(0, 102, 204, 0.5);
    border: 1px solid #06C;
    background: #06C;
    cursor: pointer;
    float:left;
    width:120px;
    height:32px;
    font-size:13px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height:28px;
    color: #fff;
    box-sizing: border-box;
    text-align: center;
}

.trendingButtonBlue:hover {
    box-shadow: 0 4px 8px -2px rgba(25, 52, 94, 0.7);
}

.buttonWide {
    width:230px !important;
}

.buttonNoFloat {
    float:none;
}

#errorReturnButton {
    width:240px;
    margin:0 auto;
    margin-top:30px;
}

.trendingNav {
    height:32px;
    width:32px;
    background-color:#ffffff;
    border:solid 1px #06c;
    border-radius:32px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.15);
    cursor:pointer;
}

.trendingArrowLeft {
    width:30px;
    margin-top:8px;
    margin-left:12px;
}

.trendingArrowRight {
    width:30px;
    margin-top:8px;
    margin-left:8px;
}

.backArrowLeft {
    height:40px;
    margin-top:10px;
}

#trendingNavLeft {
    position:absolute;
    left:-10px;
    top: 33%;

}

#trendingNavRight {
    position:absolute;
    right:-10px;
    top: 33%;
}

.trendingNavDisabled {
    border-color:#5e5e5e !important;
    opacity: 0.5;
    cursor: default;
}

.productBoxWrapper {
    position:relative;
    width:23%;
    margin:5px;
    flex-grow:3;
}

.productBox {
    width:100%;
    height:100%;
    position:relative;
    border-radius:5px;
    margin-right:5px;
    margin-left:5px;
    margin-bottom:10px;
    background-color:#f4f4f4;
    color:#015cf0;
}

.productBoxBottom {
    width:100%;
    max-width:300px;
    margin:0 auto;
}

.productPriceBox {
    font-size:15px;
    line-height:36px;
    font-weight:600;
    margin-left: 20px;
    color:#000000;
    width:100%;
    max-width:300px;
    height:36px;
}

.productButtons {
    width:100%;
    height:50px;
    max-width:260px;
    margin:0 auto;
}

.arrowBoxWrapper {
    width:99%;
    height:320px;
    position:relative;
}

#marqueeNavLeft {
    position:absolute;
    left:-15px;
    top: 40%;

}

#marqueeNavRight {
    position:absolute;
    right:-15px;
    top: 40%;
}

.regularBoxBottom {
    max-width:270px;
    margin:0 auto;
}

.boxBottomLeft {
    float:left;
    max-width:270px;
    padding-bottom:10px;
}

.boxBottomRight {
    float:right;
    margin-right:10px;
}

.trendingPriceBox {
    font-size:15px;
    line-height:36px;
    font-weight:600;
    margin-left: 30px;
    color:#000000;
    position: absolute;
    width:100%;
    height:50px;
    bottom: 35px;
    left: 0;
}

.arrowBox {
    margin-top:18px;
}

.regularBoxTitle {
    line-height:20px;
    font-size:16px;
    font-weight:600;
    margin-left:30px;
    color:#015cf0;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
}

.regularBoxText {
    line-height:13px;
    font-size:13px;
    font-weight:400;
    margin-left:30px;
    margin-top:4px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#000000;
}

.ppHeader {
    margin-left:5px;
    position:relative;
}

.cardInfoLine {
    margin-left:5px;
    font-size:14px;
    line-height:18px;
    font-weight:600;
}

#cardList {
    display:none;
}

.cardNumberText {
    margin-left:5px;
    margin-top:5px;
    font-size:12px;
    line-height:18px;
}

.cardBox, .cardHeaderBox {
    padding:10px;
    margin:5px;
    background-color:#f4f4f4;
    border: solid 1px #f4f4f4;
    height:20px;
    line-height:20px;
    color:#015cf0;
    font-weight:600;
    border-radius: 2px;
    cursor:pointer;
    text-align:center;
    float:left;
    flex-grow:3;
}

.cardBox:hover, .cardHeaderBox:hover, .compareMenuBox:hover {
    background-color:#fff;
    border: solid 1px #015cf0;
    box-shadow: 2px 2px #f4f4f4;
}

.cardBoxSelected {
    background-color:#fff;
    border: solid 1px #015cf0;
    box-shadow: 3px 4px 4px 0 rgba(212,210,212,1);
}

.cardRow, .cardHeaderRow, .cardRowDaily {
    width:100%;
    min-height: 55px;
    display: flex;
    justify-content:space-between;
}

.buyInfo {
    width:96%;
    margin:0 auto;
    height: 60px;
}

.cardLeft {
    margin-top:5px;
    float:left;
}

.cardRight {
    margin-top:5px;
    float:right;
}

#cardInfo {
    font-size: 19px;
    line-height: 24px;
    font-weight: 600;
}

#cardPrice {
    float: right;
    font-size: 24px;
    line-height: 32px;
    color: #417505;
    font-weight: 700;
}

#cardMessage {
    font-size: 13px;
    line-height: 20px;
    font-weight: 400;
    float: left;
}

#cardMessageGreen {
    font-size: 13px;
    height:20px;
    line-height: 20px;
    font-weight: 400;
    color:#fff;
    background: #669933;
    border-radius:2px;
    padding:0 10px;
    margin-left: 10px;
    float: left;
}

#cardStrike {
    float: right;
    font-weight: 700;
    font-size: 15px;
    line-height: 20px;
    text-decoration: line-through;
    color:#EC1C24;
    margin-right:0;
    display:block;
}

#dailyTitle {
    margin-top:15px;
    margin-left:5px;
    font-size:15px;
    line-height:28px;
    font-weight:400;
    color:#015cf0;
    cursor:pointer;
}

#homeMarqueeBackground {
    width: 1349px;
}

.homeFeatureBox {
    height: 210px;
    width: 200px;
    border-radius: 5px;
    border: solid 1px #d3d3d3;
    position: relative;
    display:block;
    text-align:center;
    float:right;
}

.ppHeadWrap {
    width:100%;
    padding-top:40px;
}

.ppHeadLeft {
    width:48%;
    float:left;
}

.ppRunLines {
    width:80%;
    font-size:14px;
    padding:10px;
    margin:0 auto;
}

.ppRunLine {
    width:49%;
    float:left;
}

.ppHeadRight {
    display:none;
    margin-top:10px;
    width:48%;
    float:left;
}

.ppBoxRight {
    width:400px;
    margin:0 auto;
}

.ppTitle {
    font-size:28px;
    line-height:32px;
    margin-bottom:10px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#000000;
}

.ppSubTitle {
    font-size:18px;
    line-height:24px;
    margin-bottom:10px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#37465A;
}

.ppText {
    font-size:14px;
    line-height:18px;
    margin-bottom:10px;
    padding-right:10px;
    font-weight:400;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#000000;
}

.ppBackButton {
    height:30px;
    line-height:30px;
    font-size:18px;
    font-weight:600;
    width:100px;
    color:#015cf0;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    cursor:pointer;
}

#backArrowMobile {
    display:block;
    font-size: 14px;
    font-weight: 400;
    padding-top:0;
    margin-left:0;
    position:absolute;
    top:0;
    left:0;
}

.ppAdditionalWrapper {
    margin-top:15px;
    width:100%;
    border:solid 1px #fff;
    background-color:#f6f6f6;
}

#bottomSlot {
    position:relative;
}

.ppBottomSlot {
    width:100%;
    height:50px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #06c;
    line-height:50px;
    box-sizing: border-box;
}

.ppTopSlot {
    width:100%;
    height:50px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #06c;
    border:solid 1px #fff;
    line-height:50px;
    background-color:#f6f6f6;
    box-sizing: border-box;
    margin-top:15px;
}

.ppTopSlotSelected {
    border:solid 1px #06c;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.15);
    background-color:#ffffff;
    border-radius:4px;
}

#ppSlotTitle {
    font-size:16px;
    font-weight:600;
    float:left;
    width:240px;
}

#ppSlotPrice {
    font-size:18px;
    font-weight:600;
    font-family: Arial, Helvetica, sans-serif;
    color:#000000;
    letter-spacing: -1px;
    float:left;
}

#ppBottomItem {
    width:90%;
    height:40px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #06c;
    line-height:40px;
    font-size:14px;
    padding-left:10px;
    font-weight:600;
    position:relative;
    margin:0 auto;
    background-color:#ffffff;
    border: solid 1px #d3d3d3;
    border-radius:4px;
}

.ppBottomWrapper {
    width:90%;
    margin:0 auto;
}

#ppArrowBox {
    position:absolute;
    top:-2px;
    right:20px;
    cursor:pointer;
}

#ppBottomLabel {
    float:left;
    width:60%;
    height:40px;
    margin-top:5px;
    margin-bottom:10px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #000000;
    font-size:14px;
    font-weight:400;
    text-align:left;
}

#ppBottomPrice {
    float:right;
    width:30%;
    height:40px;
    margin-top:5px;
    margin-bottom:10px;
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
    font-size:18px;
    font-weight:600;
    text-align:right;
}

#ppListWrapper {
    width:93%;
    position:absolute;
    top:50px;
    right:10px;
    margin:0 auto;
    background-color:#ffffff;
    border: solid 1px #d3d3d3;
    border-radius:4px;
    display:none;
}

.ppListItem {
    width:100%;
    height:60px;
    padding:10px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #06c;
    line-height:50px;
    border-bottom: solid 1px #d3d3d3;
    box-sizing: border-box;
    cursor:pointer;
}

.ppListTitle {
    height:20px;
    line-height:20px;
    font-size:14px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #06c;
}

.ppListPrice {
    height:20px;
    line-height:20px;
    font-size:14px;
    font-weight:600;
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
    float:left;
}

.ppListText {
    height:20px;
    line-height:20px;
    margin-left:20px;
    font-size:12px;
    font-weight:400;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color: #000000;
    float:left;
}

#ppListArrowBox {
    position:absolute;
    top:20px;
    right:20px;
    cursor:pointer;
}

.ppButtons {
    margin-top:20px;
    width:100%;
    height:50px;
}

.ppButton {
    border-radius: 4px;
    box-shadow: 0 4px 4px -3px rgba(0, 102, 204, 0.5);
    border: solid 1px #0066cc;
    background-color: #ffffff;
    float:left;
    width:49%;
    height:40px;
    text-align:center;
    font-size:13px;
    font-weight:600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height:38px;
    color: #06c;
    box-sizing: border-box;
    cursor:pointer;
}

.ppButton:hover {
    box-shadow: 0 4px 8px -2px rgba(25, 52, 94, 0.7);
}

.ppButtonBlue {
    border-radius: 4px;
    box-shadow: 0 4px 4px -3px rgba(0, 102, 204, 0.5);
    border: 1px solid #06C;
    background: #06C;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height: 38px;
    color: #fff;
    cursor: pointer;
    margin-left: 8px;
    float:left;
    width:49%;
    height:40px;
    box-sizing: border-box;
}

.ppButtonBlue:hover {
    cursor:pointer;
    box-shadow: 0 4px 8px -2px rgba(25, 52, 94, 0.7);
}

.ppButtonRight {
    float:right;
}

.ppMenuContainer {
    width:100%;
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
}

.ppMenuItem {
    width:49%;
    min-height:30px;
    line-height:30px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size:14px;
    border-bottom: solid 1px #d3d3d3;
}

.ppMenuTitle {
    width:49%;
    min-height:40px;
    line-height:40px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size:16px;
    font-weight:600;
    border-bottom: solid 1px #d3d3d3;
}

.ppMenuCompare {
    width:49%;
    height:40px;
    line-height:40px;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size:16px;
    font-weight:400;
    color: #06c;
    text-align:right;
    cursor:pointer;
    border-bottom: solid 1px #d3d3d3;
}

.ppMenuCompare a {
    color: #06c;
}

.ppMenuLeft {
    float:left;
    width:70%;
}

.ppMenuCenter {
    width:10%;
    float:left;
    display:none;
}

.ppMenuRight {
    float:right;
    margin-right:20px;
}

.ppCheckmark {
    margin:0 auto;
    width: 24px;
    height: 23px;
    object-fit: contain;
    background: url(../img/tickmark-green.png) top left no-repeat;
}

.ppFloatCheckmark {
    float:left;
    width: 24px;
    height: 23px;
    object-fit: contain;
    background: url(../img/tickmark-green.png) top left no-repeat;
}

.ppX {
    background: #fff;
    width: 14px;
    height: 14px;
    position:relative;
    padding-right:10px;
    padding-top:5px;
    margin:0 auto;
}
.ppX:after {
    content: '';
    height: 14px;
    border-left: 1px solid #333;
    position: absolute;
    transform: rotate(45deg);
    left: 13px;
}

.ppX:before {
    content: '';
    height: 14px;
    border-left: 1px solid #333;
    position: absolute;
    transform: rotate(-45deg);
    left: 13px;
}

.ppIcon {
    background-color: #06c;
    height:16px;
    width:16px;
    border-radius:8px;
    cursor:pointer;
    color:#ffffff;
    font-weight:600;
    text-align:center;
    line-height:16px;
    margin-top:7px;
}

.plusHeadWrap {
    padding:20px;
    background-color: #19345E;
    font-size: 32px;
    letter-spacing:3px;
    color:#ffffff;
    line-height: 50px;
    font-family: 'Alfa Slab One', cursive;
    font-weight: 400;
}

.plusHeadWrap img{
    height: 50px;
    vertical-align:middle;
}

.plusHeadLeft {
    display: flex;
    align-items:center;
}

.plusHeadImage {
    margin-right:10px;
}

.plusBlue {
    padding:20px 0 20px 20px;
    font-size: 20px;
    font-weight:600;
    line-height: 24px;
    color: #19345E;
}

.plusGray {
    padding-left:20px;
    font-size: 14px;
}

.plusWrapper {
    width:95%;
}

.plusFull {
    padding:20px;
    width:100%;
}

.plusFlex {
    width:100%;
    display: flex;
    justify-content:space-between;
    flex-wrap: wrap;

}

.plusThird {
    float:left;
    width:31%;
}

.plusTwoThird {
    float:right;
    width:67%;
}

.plusHeader {
    font-size: 16px;
    font-weight:600;
    line-height: 28px;
    color: #06c;
}

.plusWrap {
    background-color:#e8e8e8;
    padding:10px 10px;
}

.plusHalfWrap {
    background-color:#e8e8e8;
    padding:5px 5px;
    margin-bottom:5px;
    width:47%;
    float:left;
}

.blueLink {
    color: #06c;
}

.plusWrapLeft {
    float:left;
    width: 45%;
    line-height:32px;
}

.plusWrapLeftText {
    float: left;
    line-height: 28px;
    min-width:120px;
}

.plusWrapRight {
    float:right;
    padding-right:10px;
}

.plusWrapRight a{
    color: #06c;
    line-height:32px;
}

.plusBottom {
    padding:20px;
    text-align:center;
    font-size:16px;
    line-height:18px;
    font-weight:600;
}

.plusBottom a{
    color: #06c;
}

.categoryHeadWrap {
    padding:10px;
    background-color: #f4f4f4;
}

.categoryHeadLeft {
    width:10%;
    float:left;
}

.categoryHeaders {
    margin-left:20px;
}

.categoryHeadRight {
    width:80%;
    float:left;
    text-align:center;
}

.categoryHeadRight img {
    height:200px;
    float:right;
}

.eventHeadWrap {
    padding:20px;
    text-align:center;
    background-color: rgb(25, 52, 94);
}

.eventSubHeadWrap {
    padding:20px 10px;
    text-align:center;
    color:#ffffff;
    float:right;
}

.eventSubHeadText {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 400;
}

.eventStar {
    height:18px;
    margin-bottom:4px;
}

.eventSpan {
    margin-left:8px;
    margin-right:8px;
}

.eventHead {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#ffffff;
    float:left;
}

.eventHeadTitle {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 28px;
    line-height:48px;
    font-weight:600;
    color:#ffffff;
    float:left;
}

.eventHeadSubTitle {
    margin-left:15px;
    font-size:24px;
    line-height:48px;
    letter-spacing:2px;
    float:left;
}

.eventWrap {
    padding:10px 10px 0 10px;
    background-color: #e8e8e8;
}

.eventContent {
    width:100%;
    margin:20px 10px;
    padding-bottom:20px;
}

.eventLeft {
    float:left;
    width:40%;
}

.eventBlackText {
    padding: 10px 0;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-weight: 600;
    color:#06c;
}

.eventRedText {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:red;
    font-size: 16px;
    line-height:20px;
    font-weight: 400;
}

.eventSmallBoldText {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#000000;
    font-size: 16px;
    line-height:28px;
    font-weight: 600;
}

.eventSmallText {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    color:#000000;
    font-size: 16px;
    line-height:22px;
    font-weight: 400;
}

.eventSmallText a {
    color: #06c;
    font-weight:600;
    text-decoration: underline;
}

.eventCenter {
    float:left;
    width:25%;
    padding-left:20px;
}

.eventRight {
    float:right;
    width:30%;
}

.eventTextRight {
    color:#000000;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height:32px;
    font-weight: 400;
    margin-top: 7px;
}

.eventTextWrap {
    padding:20px;
    background-color: #ffffff;
}

.eventTextContent {
    width:100%;
    margin:0 auto;
    padding-bottom:10px;
}

.eventTextHeader {
    color:#000000;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height:30px;
    font-weight: 600;
}

.eventTextSubHeader {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height:30px;
    color: #06c;
    font-weight: 600;
    padding-bottom:15px;
}

.eventTextMonth {
    color:red;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height:18px;
    font-weight: 600;
}

.eventTextBox {
    margin-bottom:10px;
}

.eventTextLeftBold {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height:18px;
    font-weight: 600;
}

.eventTextLeft {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height:16px;
    font-weight: 400;
    float:left;
    width:300px;
}

.eventTextCenter {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height:16px;
    font-weight: 400;
    float:left;
    width:300px;
}

.eventTextRight {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height:16px;
    font-weight: 400;
    float:left;
}

.categoryWrap {
    padding:10px;
    background-color: #f4f4f4;
}

.compareMenuWrap {
    padding:10px;
    display: flex;
    justify-content:space-between;
    flex-wrap: wrap;
}

.compareMenuBlock {
    width:18%;
}

.compareGridBlock {
    width:18%;
    text-align:center;
}

.compareMenuTitle {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 61px;
    letter-spacing: -0.2px;
    color: #000000;
}

.compareIcon {
    display:none;
}

.compareMenuBox {
    padding:10px;
    background-color: #f4f4f4;
    width:97%;
    text-align:center;
    border: solid 1px #ffffff;
}

.compareBoxTitle {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.41;
    letter-spacing: normal;
    color: #0066cc;
}

.compareLine {
    margin-left:10px;
    width:99%;
    height: 1px;
    background-color: #cccccc;
}

.compareGridText {
    font-size:13px;
    line-height:24px;
}

.floatText {
    float:left;
    width:80%;
}

.compareIcon {
    background-color: #06c;
    height:16px;
    width:16px;
    border-radius:8px;
    cursor:pointer;
    color:#ffffff;
    font-weight:600;
    text-align:center;
    line-height:16px;
    margin-top:7px;
    float:left;
}

.radioWrapper {
    float:left;
    margin-left:10px;
    margin-top:14px;
    width:30px;
}

/* Custom Radio Box */
.radioContainer {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 8px;
    cursor: pointer;
    font-size: 15px;
    line-height:18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.radioContainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 14px;
    width: 14px;
    background-color: #eee;
    border: 2px  solid #6ba444;
}

.radioContainer:hover input ~ .checkmark {
    background-color: #ccc;
}

.radioContainer input:checked ~ .checkmark {
    background-color: #6ba444;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.radioContainer input:checked ~ .checkmark:after {
    display: block;
}

.radioContainer .checkmark:after {
    top: 3px;
    left: 3px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

/* Arrows */
.arrow {
    border: solid #015cf0;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
}

.arrowWhite {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
}

.arrowSix {
    border: solid #015cf0;;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 6px;
}

.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

@media only screen and (max-width: 1200px) {

    .eventCenter {
        padding-left:30px;
    }

    .plusHalfWrap {
        width:46%;
    }

    .cardSpace {
        width:46% !important;
    }

    .confirmButtons {
        width:220px;
        padding-left:10px;
    }

    #homeMarqueeBackground {
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;

    }

    .homepageCategoryWrap {
        margin-left:5px;
        margin-right:10px;
    }

    .productButtons {
        padding-left: 20px;
        width: 230px;
    }

    .trendingPriceBox, .productPriceBox {
        margin-left:0;
        text-align:center;
    }

    .trendingBox .trendingButtons {
        padding-left:40px;
        width:230px;
    }

    .trendingButton {
        width: 100px !important;
    }

    .regularBoxBottom {
        width:100%;
        max-width:100%;
        text-align:center;
    }

    .regularBoxTitle, .specialBoxTitle {
        margin-left:0;
    }

    .regularBoxText, .specialBoxText {
        margin-left:0;
    }

    .boxBottomLeft {
        width:100%;
        max-width: 100%;
        text-align:center;
    }

    .homeFeatureBox {
        margin-right:5px;
    }

    .boxBottomRight {
        display:none;
    }

}

@media only screen and (max-width: 979px) {

    .eventCategoryWrap {
        margin-left:0;
        margin-right:0;
    }

    .eventHeadWrap {
        padding:10px;
    }

    .eventLeft {;
        width:100%;
        margin-bottom:15px;
    }

    .eventHeadTitle {
        width:100%;
        text-align:center;
        line-height:36px;
    }

    .eventHeadSubTitle {
        width:100%;
        text-align:center;
        line-height:36px;
        margin-left:0;
    }

    .eventCenter{;
        display:none;
    }

    .eventRight {;
        width:100%;
        max-width:500px;
        float:left;
    }

    .eventContent {
        width:95%;
    }

    .eventTextRight {
        margin-bottom:10px;
    }

    .eventTextHeader {
        font-size:24px;
        line-height:36px;
    }

    .eventTextSubHeader {
        font-size:18px;
        line-height:24px;
    }

    .plusThird {
        width:100%;
    }

    .plusFull {
        width:100%;
        padding: 0 20px;
    }

    .plusTwoThird {
        width:100%;
        float:left;
        padding: 0;
    }

    .plusHalfWrap {
        width:98%;
        padding: 10px 10px;
    }

    .homeContentWrap {
        margin-top: 110px;
    }

    .homeFeatureBox {
        display:none;
    }

    .homeBoxWrapper {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .regularBoxWrapper {
        width: 46%;
    }

    .productBoxWrapper {
        width: 46%;
    }

    .trendingBox {
        width: 46%;
    }

    .boxBottomRight {
        display:none;
    }
}

@media only screen and (max-width: 768px) {

    .trendingButtonBlue {
        margin-left:5px;
    }

    .ppButtonBlue {
        margin-left:5px;
    }

    .artBoxLeft {
        width:94.5%;
    }

    .artBoxRight {
        width:100%;
        margin-top:10px;
    }

    .artBoxWrapper {
        padding:10px;
    }

    .artFooterLeft {
        width:100%;
    }

    .artFooterRight {
        width:90%;
        margin-top:10px;
    }

    #pageOverlay {
        top: 20px;
        width: 360px;
        margin:0 auto;
    }

    #pageOverlayClose {
        right:10px;
    }
    .plusHeadLeft {
        display: block;
        text-align: center;
    }
    .plusHeadText {
        font-size:24px;
        line-height:28px;
    }

    .plusBlue {
        font-size:16px;
        line-height:18px;
    }

    .plusHeadWrap {
        padding:10px;
    }

    .plusHeadWrap img {
        height: 30px;
    }

    .ppMenuTitle {
        width:75%;
    }

    .ppMenuCompare {
        width:25%;
        font-size:14px;
    }

    .compareMenuBlock {
        width:24%;
    }

    .compareGridBlock {
        width: 24%;
    }

    .compareMenuBox {
        padding:5px;
        width:90%;
    }

    .compareBoxTitle {
        padding-right:5px;
        font-size:12px;
    }

    .compareBoxText {
        display:none;
    }

    .firstBlock {
        width:100%;
    }

    .floatText {
        font-weight:600;
        width:95%;
    }

    .homeHeaderText {
        font-size:18px;
        line-height:24px;
    }

    .specialPackagesBox {
        width: 100%;
        margin-bottom:10px;
    }

    .ppBoxRight {
        padding-left:10px;
        width: 98%;
        max-width:500px;
    }

    #backArrowDesktop, #backArrowCategory {
        display:none;
    }

    .categoryHeadRight {
        width:100%;
    }

    #backArrowMobile {
        display:block;
    }

    .ppHeader {
        background-color: #f4f4f4;
        padding: 10px;
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom:10px;
        text-align:center;
    }

    .ppTitle {
        font-size: 22px;
        line-height: 28px;
    }

    .specialBoxTitle {
        line-height: 18px;
    }

    .ppHeadWrap {
        padding-top:0;
    }


    .ppHeadLeft {
        display:none;
    }

    .ppHeadRight {
        width:98%;
    }

    .ppMenuItem {
        width:100%;
    }

    .ppMenuCenter {
        width: 10%;
    }

    .overlayBox {
        display:none !important;
    }

    .regularBox {
        height:auto;
        border: solid 1px #f4f4f4;
        margin-left:0;
        min-height:67px;
    }

    .regularBoxWrapper {
        width: 40%;
    }

    .regularBox:hover {
        background-color:#fff;
        border: solid 1px #015cf0;
        box-shadow: 2px 2px #f4f4f4;
    }

    .regularBoxTop {
        display:none;
    }

    .regularBoxTitle {
        font-size:16px;
        margin-left:0;
    }

    .regularBoxText {
        margin-left:0;
    }

    .trendingBox {
        width: 92%;
    }

    .specialBoxTop {
        height:15px;
    }

    .specialBoxImage {
        display:none;
    }

    .specialOffer {
        top:22px;
        right:10px;
    }

    .categoryHeadWrap {
        padding:10px;
        margin-left:10px;
        margin-right:10px;
    }

    .categoryHeaders {
        width:100%;
        margin-left: 10px;
        margin-top: 0;
        position:relative;
    }
}

@media only screen and (max-width: 600px) {

    #pageOverlay {
        width: 360px;
    }

    .plusHeadWrap {
        margin-left: 20px;
    }

    .cardSpace {
        width:100% !important;
    }

    .productBoxWrapper {
        width: 100%;
    }

    .trendingNav {
        height:25px;
        width:25px;
        border-radius:0;
        opacity:0.5;
    }

    .trendingBox {
        margin-left:0;
    }

    .trendingArrowLeft {
        width: 25px;
        margin-top: 5px;
        margin-left: 8px;
    }

    .trendingArrowRight {
        width: 25px;
        margin-top: 5px;
        margin-left: 5px;
    }

    #marqueeNavLeft {
        left:0;
        top: 32%;
    }

    #marqueeNavRight {
        right:0;
        top: 32%;
    }

    #trendingNavLeft {
        left: 0;
    }

    #trendingNavRight {
        right: 0;
    }

}