bg-img-nonebody { padding:0; margin:0; }
html, body {}
* { font-family:'微軟正黑體', Arial, "Hiragino Sans GB", "Source Han Sans", 'PingFangTC-Regular', sans-serif; font-weight: bold;}
font-size:1.02em; /*color:#444;*/  -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-decoration:none;}
.noscroll { overflow:hidden; }
#container { display:block; margin:0; box-sizing:border-box; width:100%; }
.area { display:block; padding:15px; margin:0; box-sizing:border-box; width:100%; border-bottom:1px solid #eee; } 
.areafull { padding:0; }
.areap40 { padding:40px; }
.center { text-align:center; }
.bglightgray { background-color:#f5f6f7; }
.m30 { margin:30px; }



h1 { font-size:1.5em; }
h2 { font-size:1.3em; }
h3 { font-size:1.15em; }
h4 { font-size:.9em; }
h5 { font-size:.8em; }
p { line-height:1.55em; }
p.p90 { font-size:.9em; }
p.justify { text-align:justify; }
small { font-size:.65em; line-height:1.55em; }

/* fadeouts of placeholder in focus */
input::-webkit-input-placeholder       {opacity: 1; transition: opacity 0.3s ease;}
input::-moz-placeholder                {opacity: 1; transition: opacity 0.3s ease;}
input:-moz-placeholder                 {opacity: 1; transition: opacity 0.3s ease;}
input:-ms-input-placeholder            {opacity: 1; transition: opacity 0.3s ease;}
input:focus::-webkit-input-placeholder {opacity: 0; transition: opacity 0.3s ease;}
input:focus::-moz-placeholder          {opacity: 0; transition: opacity 0.3s ease;}
input:focus:-moz-placeholder           {opacity: 0; transition: opacity 0.3s ease;}
input:focus:-ms-input-placeholder      {opacity: 0; transition: opacity 0.3s ease;}




.loader { width:40px; height:40px; margin:100px auto; background-color:#a5a6a8; border-radius:100%; -webkit-animation: scaleout 1.0s infinite ease-in-out; animation: scaleout 1.0s infinite ease-in-out; }
@-webkit-keyframes scaleout {
    0% { -webkit-transform:scale(0.0) }
    100% { -webkit-transform:scale(1.0); opacity:0; }
}
@keyframes scaleout {
    0% { transform:scale(0.0); -webkit-transform:scale(0.0); }
    100% { transform:scale(1.0); -webkit-transform:scale(1.0); opacity:0; }
}


.headermenu {
    background-repeat:no-repeat;
    background-position:center;
    background-size:70%; 
    background-image: url('../asset/icon_menu.svg');
}

.headersearch {
    background-repeat:no-repeat;
    background-position:center;
    background-size:70%; 
    background-image: url('../asset/icon_search.svg');
}

.headerback {
    background-repeat:no-repeat;
    background-position:center;
    background-size:70%; 
    background-image: url('../asset/icon_prev.svg');
}

.bar-vip { display:block; height:5px; width:100%; background-image: url('../img/twm-vipbar.jpg'); background-repeat:no-repeat; background-position:center; background-size:cover; }
.btnset { margin:20px 0; }
.btnset-inline a { display:inline-block; }
.btnset-bottom { display:block; width:100%; border-top:1px solid #ccc; text-align:center; position:absolute; bottom:0; left:0; }
.btnset .icon { margin:0 6px !important; }
.btn { position:relative; display:inline-block; padding:8px 45px; width:auto; margin:5px 0; text-align:center; font-size:.95em;
    text-shadow:none !important; box-shadow:none; text-shadow:-1px -1px 0 rgba(0,0,0,0.2); text-decoration:none;
    box-shadow-xx:0 1px 2px rgba(100,100,100,.2);
    border-radius:30px; color:#333; border:1px solid #bbb; 
    border-top:1px solid #ccc; 
    color:#ccc; transition:all .3s; }

    .btn {
        background-image: rgba(255,255,255,1);
        background-image: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(245,246,247,1) 100%);
        background-image: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(100%, rgba(245,246,247,1)));
        background-image: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(245,246,247,1) 100%);
        background-image: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(245,246,247,1) 100%);
        background-image: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(245,246,247,1) 100%);
        background-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(245,246,247,1) 100%);
    }

.btn:active { color:#000; border:1px solid #888; background-color:#e5e6e7; }
.btns { text-shadow:1px 1px 0 rgba(255,255,255,.4), -1px -1px 0 rgba(0,0,0,.2); box-shadow-x:0 1px 3px rgba(0,0,0,.2); }
.btn-ready { padding:11px 70px; width:auto; margin:5px; text-align:center; box-shadow:0 1px 2px rgba(0,0,0,.2); 
    border:1px solid #ccc; border-top:2px solid rgba(255,255,255,.5); background-color:orange; color:white !important; }
.btn-w100, .btn-full { width:100%; }
.btn-narrow { padding:8px 25px !important;  }
.btnsubmit { transform-x:rotate(45deg); }
.btnsubmit { border:0; color:white; background-color:red; padding:10px 70px; }
.btncancel-x { border:0; color:white; background-color:#999; }
.btn-disable { opacity:.5; }
.btn-disable:active { color:#333; border:1px solid #ccc; background-color:transparent; }
.btn-centerlize { margin:12px auto; padding:14px 60px; font-size:1.03em; }
.btnok { border-color:green; color:green; padding:10px 70px; }
.btn-fit { padding:12px 10px !important ; }
.btnselect { border:0; color:white; background-color:#999; padding:10px 70px; padding-right:60px; }
.btnselect:before {
    content:'  '; 
    background:url(asset/icon_check.svg) no-repeat; background-size:30px; 
    position:absolute; width:30px; height:30px; top:10px; left:40px; z-index:0; 
    -webkit-transform: scale(1.3) rotate(120deg);
    -moz-transform: scale(1.3) rotate(120deg);
    -ms-transform: scale(1.3) rotate(120deg);
    -o-transform: scale(1.3) rotate(120deg);
    transform: scale(1.3) rotate(120deg);
    animation:_checkmark .5s cubic-bezier(0.245, 1.525, 0.770, 0.960) forwards;
}

.bg-img-none { background-image:none; }
.bg-white { background-color:white; }

.access-mobile-form { display:block; position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; }
.access-mobile-submit { position:absolute; top:0; left:0; display:block; width:40px; height:40px;  }

@keyframes _checkmark { 
    to { 
        -moz-transform: scale(1) rotate(0deg);
        -o-transform: scale(1) rotate(0deg); 
        transform: scale(1) rotate(0deg);
    }
}

.btngo { border:0; color:white; background-color:#999; padding:10px 70px; }
.btngo:after {
    content:'  '; 
    background:url(asset/icon_next.svg) no-repeat; background-size:30px; 
    position:absolute; width:30px; height:30px; top:7px; right:0px; z-index:1;
    animation:_gonext .5s cubic-bezier(0.245, 1.525, 0.770, 0.960) forwards;
}
@keyframes _gonext { 
    to { right:40px; }
}



@keyframes _zoomin { 
    to { right:40px; }
}


.icon { display:inline-block; background-position:center; background-size:100%; 
    background-repeat:no-repeat; background-color:transparent; width:128px; height:128px; margin:10px auto; 
    /*
    xxx-webkit-clip-path: polygon(200px 250px,400px 100px,300px 50px,0px 0px);
    xxx-webkit-clip-path: circle(70% at 0% 50%);
    xxx-webkit-clip-path: inset(10px 20px 30px 40px round 10px);
    x-webkit-clip-path:url(#basicShape); 
    x-clip-path:url(#basicShape); 
    */
    -webkit-mask-image: url(../asset/icon_twm_shape.svg);
    mask-image: url(../asset/icon_twm_shape.svg);
    overflow:hidden;
}
.icon128 { width:128px; height:128px; }
.icon96 { width:96px; height:96px; }
.icon72 { width:72px; height:72px; }
.icon64 { width:64px; height:64px; }
.icon48 { width:48px; height:48px; }
.icon40 { width:40px; height:40px; }
.icon32 { width:32px; height:32px; }
.icon24 { width:24px; height:24px; }
.icon20 { width:20px; height:20px; }
.icon16 { width:16px; height:16px; }

.icon80 { width:80px; height:80px; }


.img16 { width:16px; height:16px; margin:2px 2px -2px 2px; }


    /* icon image */
    .icon_twm_4g { background-image:url(../asset/icon_twm_4g.svg); }
    .icon_twm_4g_mobile { background-image:url(../asset/icon_twm_4g_mobile.svg); }
    .icon_twm_4g_plan { background-image:url(../asset/icon_twm_4g_plan.svg); }
    .icon_twm_4g_prepay { background-image:url(../asset/icon_twm_4g_prepay.svg); }
    .icon_twm_4g_vol { background-image:url(../asset/icon_twm_4g_vol.svg); }
    .icon_twm_app { background-image:url(../asset/icon_twm_app.svg); }
    .icon_twm_atm { background-image:url(../asset/icon_twm_atm.svg); }
    .icon_twm_bank_pay { background-image:url(../asset/icon_twm_bank_pay.svg); }
    .icon_twm_bill { background-image:url(../asset/icon_twm_bill.svg); }
    .icon_twm_bill_6 { background-image:url(../asset/icon_twm_bill_6.svg); }
    .icon_twm_bill_change { background-image:url(../asset/icon_twm_bill_change.svg); }
    .icon_twm_bill_current { background-image:url(../asset/icon_twm_bill_current.svg); }
    .icon_twm_bill_search { background-image:url(../asset/icon_twm_bill_search.svg); }
    .icon_twm_bill_sms { background-image:url(../asset/icon_twm_bill_sms.svg); }
    .icon_twm_bill_store { background-image:url(../asset/icon_twm_bill_store.svg); }
    .icon_twm_chart { background-image:url(../asset/icon_twm_chart.svg); }
    .icon_twm_chart_plus { background-image:url(../asset/icon_twm_chart_plus.svg); }
    .icon_twm_change_input { background-image:url(../asset/icon_twm_change_input.svg); }
    .icon_twm_check { background-image:url(../asset/icon_twm_check.svg); }
    .icon_twm_contact { background-image:url(../asset/icon_twm_contact.svg); }
    .icon_twm_contract { background-image:url(../asset/icon_twm_contract.svg); }
    .icon_twm_creditcard_extend { background-image:url(../asset/icon_twm_creditcard_extend.svg); }
    .icon_twm_creditcard_transfer { background-image:url(../asset/icon_twm_creditcard_transfer.svg); }
    .icon_twm_csapp { background-image:url(../asset/icon_twm_csapp.svg); }
    .icon_twm_ebill { background-image:url(../asset/icon_twm_ebill.svg); }
    .icon_twm_eticket { background-image:url(../asset/icon_twm_eticket.svg); }
    .icon_twm_fixing { background-image:url(../asset/icon_twm_fixing.svg); }
    .icon_twm_gift { background-image:url(../asset/icon_twm_gift.svg); }
    .icon_twm_giftbox { background-image:url(../asset/icon_twm_giftbox.svg); }
    .icon_twm_good { background-image:url(../asset/icon_twm_good.svg); }
    .icon_twm_loc { background-image:url(../asset/icon_twm_loc.svg); }
    .icon_twm_loc_white { background-image:url(../asset/icon_twm_loc_white.svg); }
    .icon_twm_logo { background-image:url(../asset/icon_twm_logo.svg); }
    .icon_twm_member { background-image:url(../asset/icon_twm_member.svg); }
    .icon_twm_member_cannot_login { background-image:url(../asset/icon_twm_member_cannot_login.svg); }
    .icon_twm_member_forget_password { background-image:url(../asset/icon_twm_member_forget_password.svg); }
    .icon_twm_member_register { background-image:url(../asset/icon_twm_member_register.svg); }
    .icon_twm_member_reset_password { background-image:url(../asset/icon_twm_member_reset_password.svg); }
    .icon_twm_member_service { background-image:url(../asset/icon_twm_member_service.svg); }
    .icon_twm_member_white { background-image:url(../asset/icon_twm_member_white.svg); }
    .icon_twm_news { background-image:url(../asset/icon_twm_news.svg); }
    .icon_twm_pay { background-image:url(../asset/icon_twm_pay.svg); }
    .icon_twm_pay_voice { background-image:url(../asset/icon_twm_pay_voice.svg); }
    .icon_twm_plan { background-image:url(../asset/icon_twm_plan.svg); }
    .icon_twm_plan_3g { background-image:url(../asset/icon_twm_plan_3g.svg); }
    .icon_twm_plan_4g { background-image:url(../asset/icon_twm_plan_4g.svg); }
    .icon_twm_plan_change { background-image:url(../asset/icon_twm_plan_change.svg); }
    .icon_twm_plan_current { background-image:url(../asset/icon_twm_plan_current.svg); }
    .icon_twm_plan_prepay_card { background-image:url(../asset/icon_twm_plan_prepay_card.svg); }
    .icon_twm_prepaid_card { background-image:url(../asset/icon_twm_prepaid_card.svg); }
    .icon_twm_prepaid_plan { background-image:url(../asset/icon_twm_prepaid_plan.svg); }
    .icon_twm_prepaid_on_card { background-image:url(../asset/icon_twm_prepaid_on_card.svg); }
    .icon_twm_prepay { background-image:url(../asset/icon_twm_prepay.svg); }
    .icon_twm_prepay_product { background-image:url(../asset/icon_twm_prepay_product.svg); }
    .icon_twm_qa { background-image:url(../asset/icon_twm_qa.svg); }
    .icon_twm_reach { background-image:url(../asset/icon_twm_reach.svg); }
    .icon_twm_remail { background-image:url(../asset/icon_twm_remail.svg); }
    .icon_twm_retain_gift { background-image:url(../asset/icon_twm_plan.svg); }
    .icon_twm_retain_promo { background-image:url(../asset/icon_twm_retain_promo.svg); }
    .icon_twm_sale { background-image:url(../asset/icon_twm_sale.svg); }
    .icon_twm_search { background-image:url(../asset/icon_twm_search.svg); }
    .icon_twm_search_gray { background-image:url(../asset/icon_twm_search_gray.svg); }
    .icon_twm_shop { background-image:url(../asset/icon_twm_shop.svg); }
    .icon_twm_talk_detail { background-image:url(../asset/icon_twm_talk_detail.svg); }
    .icon_twm_travel { background-image:url(../asset/icon_twm_travel.svg); }
    .icon_twm_travel_change { background-image:url(../asset/icon_twm_travel_change.svg); }
    .icon_twm_travel_help { background-image:url(../asset/icon_twm_travel_help.svg); }
    .icon_twm_vip { background-image:url(../asset/icon_twm_vip.svg); }
    .icon_twm_vip_announce { background-image:url(../asset/icon_twm_vip_announce.svg); }
    .icon_twm_vip_catalog { background-image:url(../asset/icon_twm_vip_catalog.svg); }
    .icon_twm_wifi { background-image:url(../asset/icon_twm_wifi.svg); }
    .icon_twm_wifi_how { background-image:url(../asset/icon_twm_wifi_how.svg); }
        

        .icon_add { background-image:url(../asset/icon_add.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_alert { background-image:url(../asset/icon_alert.svg); }
        .icon_alert_red { background-image:url(../asset/icon_alert_red.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowback { background-image:url(../asset/icon_arrowback.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowback_gray { background-image:url(../asset/icon_arrowback_gray.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowdown { background-image:url(../asset/icon_arrowdown.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowgo { background-image:url(../asset/icon_arrowgo.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowgo_white { background-image:url(../asset/icon_arrowgo_white.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrownext { background-image:url(../asset/icon_arrownext.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowprev { background-image:url(../asset/icon_arrowprev.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_arrowup { background-image:url(../asset/icon_arrowup.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_bell { background-image:url(../asset/icon_bell.svg); }
        .icon_checked_blue { background-image:url(../asset/icon_checked_blue.svg); }
        .icon_checked_gray { background-image:url(../asset/icon_checked_gray.svg); }
        .icon_checked_green { background-image:url(../asset/icon_checked_green.svg); }
        .icon_checked_orange { background-image:url(../asset/icon_checked_orange.svg); }
        .icon_checked_white { background-image:url(../asset/icon_checked_white.svg); }
        .icon_close { background-image:url(../asset/icon_close.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_close_white { background-image:url(../asset/icon_close_white.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_edit { background-image:url(../asset/icon_edit.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_download { background-image:url(../asset/icon_download.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_download_white { background-image:url(../asset/icon_download_white.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_exclamation { background-image:url(../asset/icon_exclamation.svg); }
        .icon_gift { background-image:url(../asset/icon_gift.svg); }
        .icon_lock { background-image:url(../asset/icon_lock.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_menu_more { background-image:url(../asset/icon_menu_more.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_menu_more_gray { background-image:url(../asset/icon_menu_more_gray.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_minus { background-image:url(../asset/icon_minus.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_youtube { background-image:url(../img/icon-youtube.png); -webkit-mask-image:none; mask-image:none; margin-right:5px; }
        .icon_facebook { background-image:url(../img/icon-facebook.png); -webkit-mask-image:none; mask-image:none; margin-right:5px; }
        .icon_search { background-image:url(../asset/icon_search.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step1 { background-image:url(../asset/icon_step1.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step2 { background-image:url(../asset/icon_step2.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step3 { background-image:url(../asset/icon_step3.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step1_white { background-image:url(../asset/icon_step1_white.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step2_white { background-image:url(../asset/icon_step2_white.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step3_white { background-image:url(../asset/icon_step3_white.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step1_reverse { background-image:url(../asset/icon_step1_reverse.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step2_reverse { background-image:url(../asset/icon_step2_reverse.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_step3_reverse { background-image:url(../asset/icon_step3_reverse.svg); -webkit-mask-image:none; mask-image:none; }
        

        .icon_vip_80percent { background-image:url(../asset/icon_vip_80percent.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_90percent { background-image:url(../asset/icon_vip_90percent.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_bell { background-image:url(../asset/icon_vip_bell.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_birthday { background-image:url(../asset/icon_vip_birthday.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_book { background-image:url(../asset/icon_vip_book.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_club { background-image:url(../asset/icon_vip_club.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_diamond { background-image:url(../asset/icon_vip_diamond.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_event { background-image:url(../asset/icon_vip_event.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_gift { background-image:url(../asset/icon_vip_gift.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_heart { background-image:url(../asset/icon_vip_heart.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_movie3 { background-image:url(../asset/icon_vip_movie3.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_music { background-image:url(../asset/icon_vip_music.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_person { background-image:url(../asset/icon_vip_person.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_roaming { background-image:url(../asset/icon_vip_roaming.svg); -webkit-mask-image:none; mask-image:none; }
        .icon_vip_spade { background-image:url(../asset/icon_vip_spade.svg); -webkit-mask-image:none; mask-image:none; }
                



    /* icon color */
    /* http://www.colors.commutercreative.com/grid/ */
    .bg_twm_pink, .header-pink, .btn-bg-pink { background-color:#ec5b8b; background-color:#ff5764; }
    .bg_twm_red, .header-red, .btn-bg-red { background-color:#e95236; background-color:#fe3e49; }
    .bg_twm_salmon { background-color:#ff803f; }
    .bg_twm_orange, .header-orange, .btn-bg-orange { background-color:orange; }
    
    .bg_twm_blue, .header-blue, .btn-bg-blue { background-color:#4a89f4; }
    .bg_twm_lightblue, .header-lightblue, .btn-bg-lightblue { background-color:#4ab3f3; }
    .bg_twm_sky, .header-sky, .btn-bg-sky  { background-color:#61d0ff; background-color:#60d5ff; }
    .bg_twm_lightcyan { background-color:#96d7ff; }
    
    .bg_twm_lightgreen, .header-lightgreen, .btn-bg-lightgreen { background-color:#90da2a; }
    .bg_twm_green, .header-green, .btn-bg-green { background-color:#8dd428; }
    .bg_twm_grass, .header-grass, .btn-bg-grass { background-color:#7ab549; }
    .bg_twm_turquoise, .header-turquoise, .btn-bg-turquoise  { background-color:#59ffbb; }
    
    .bg_twm_yellow, .header-yellow, .btn-bg-yellow { background-color:#ffdf4a;  color:#333 !important; }
        .header-yellow h4,
        .header-yellow .btn-back,
        .header-yellow .btn-row-cal2 a,
        .header-yellow .btn-row a { color:rgba(25,25,25,.5) !important; }
        .header-yellow .btn-more .icon svg path { fill:#333333; }
    .bg_twm_skin { background-color:#ffb6a7; }
    
    .bg_twm_purple { background-color:#9389f4; }

    .bg_twm_gray { background-color:#d2d2d2; }
    .bg_twm_black { background-color:#222222; }
    .bg_twm_white { background-color:#ffffff; }

    .color-club { color:#9dd200; }
    .color-diamond { color:#1cade1; }
    .color-heart { color:#e5610d; }
    .color-spade { color:#ac4f9f; }


        .btn-bg-pink.btnconfirm, 
        .btn-bg-red.btnconfirm,
        .btn-bg-orange.btnconfirm,
        .btn-bg-blue.btnconfirm, 
        .btn-bg-lightblue.btnconfirm, 
        .btn-bg-green.btnconfirm { color:white !important; }

        .icon-appicon { display:inline-block; width:120px !important; height:120px !important; }
        .icon-app-list { display:inline-block; width:80px !important; height:80px !important; }
        .phone-ui-sample { margin:10px; box-sizing:border-box; width:calc(100% - 20px) !important; box-shadow:0 1px 2px rgba(0,0,0,.5); }
        .thumb-product { display:inline-block; width:150px !important; height:150px !important; margin:10px auto; }
        
        
    
    /* color */
    .red { color:#fe3e49 !important; }
    .pink { color:#ff5764; }
    .lightblue { color:#4ab3f3; }
    .blue { color:#4a89f4; }
    .sky { color:#60d5ff; }
    .lightgreen { color:#90da2a; }
    .green { color:#8dd428; }
    .purple { color:#9389f4; }

.btnicon { display:inline-block; text-align:center; width:auto; transition:all .2s; 
    -webkit-transform-origin:50% 50%; 
    -moz-transform-origin:50% 50%; 
    -ms-transform-origin:50% 50%; 
    -o-transform-origin:50% 50%; 
    transform-origin:50% 50%;
}
.btnicon .icon { display:block; }
.btnicon:active .icon { transform:scale(.97); -webkit-transform:scale(.97); -moz-transform:scale(.97); -ms-transform:scale(.97); -o-transform:scale(.97); opacity:0.7; }
.btnicon:active { transform:scale(.97); -webkit-transform:scale(.97); -moz-transform:scale(.97); -ms-transform:scale(.97); -o-transform:scale(.97); }



.selectset { text-align:left; }
    .selectset input[name="radio"] {}
    .selectset label-x { margin-left:40px; }    
    .selectset label{ margin-left:40px; margin-bottom:8px; display:inline-block; max-width:calc(100% - 60px); padding-top:5px; vertical-align:top; }
    .selectset .ui-checkbox { position:absolute; left:5px; margin-top:0; }
    .ui-checkbox input, .ui-radio input { margin:0; }


    label { text-align:left; }
    select {
        display: inline-block; position:relative;
        font-size: 1.2em;
        padding: 13px 10px 12px 10px;
        margin: 2px 0;
        background: #f5f6f7;
        border: 1px solid #e5e5e5;
        border-bottom: 1px solid #ccc;
        border-radius: 5px; width:100%;
        box-shadow:inset 0 -1px 5px -2px rgba(0,0,0,0.05);
        width:100%; max-width:100%;
    }
    select option { font-size: 1.2em; }
    input[type="radio"],
    input[type="checkbox"] { width:20px; height:20px; border:1px solid #ccc !important; margin-left-x:10px !important; xxxtransform:translateY(3px); xxxdisplay:none !important; }
    select.pr40 { padding-right:0 !important; }
    select::-ms-expand { display: none; }
    select { -webkit-appearance:none; -moz-appearance:none; text-indent:1px; text-overflow:''; }
    .select-arrow { display:block; width:26px; height:26px; border-radius:50%; background:rgba(200,200,200,.5); 
        position:absolute; margin-left:-13px; margin-top:-13px; }
    .select-arrow .icon { display:block; width:140%; height:140%; margin:-20%; }

    .switch-selected { display:inline-block; width:auto; border:2px solid rgba(200,200,210,.0); border-radius:50px; background:rgba(80,90,110,.95);  
        color:white !important; text-shadow:-1px -1px 0 rgba(50,50,50,.4); margin:0 auto 10px auto !important; font-size:.8em !important; 
        padding:6px 15px 4px 15px; margin:15px auto 15px auto !important; transition:all .3s; width:103px; }
        .switch-selected .icon { display:inline-block; margin:-2px 0 0 0; vertical-align:middle; }
    .switch-selected-unselect { border:2px solid rgba(200,200,210,.95); background:white; color:rgb(200,200,210) !important; 
        text-shadow:none; margin:15px auto 22px auto !important;  }
    
    .switch-download { display:inline-block; width:auto; border:2px solid rgba(200,200,210,.0); border-radius:50px; background:rgba(80,90,110,.95);  
        color:white !important; text-shadow:-1px -1px 0 rgba(50,50,50,.4); margin:0 auto 10px auto !important; font-size:.8em !important; 
        padding:6px 15px 4px 15px; margin:8px auto 15px auto !important; transition:all .3s; }
        .switch-download .icon { display:inline-block; margin:-2px 0 0 0; vertical-align:middle; }