/* Common */
body {margin:0;font-family:"Microsoft Yahei","宋体";font-size:63%;}
.bold {font-weight:bold;}
.center {text-align:center}
.hidden {display:none}
.left {float:left;}
.right {float:right;}
.clear {clear:both}
.red {color:#E7100B;}
.orange {color:#DF7514;}
.green {color:#1CB841;}

/* Layout */
#layout {margin:0 auto;width:760px;font-size:1.5em;}

/* Header */
#header {padding:15px 10px;}
    #logo {float:left;width:200px;height:50px;background-image:url(../img/yaic.20161129.png);background-repeat:no-repeat;cursor:pointer;}

/* Content Header */
#content-header {margin:10px 0;padding:10px 20px;background-color:#FFF0F0;border-top:1px solid #FFB4B4;border-bottom:1px solid #FFB4B4;}
    #content-header legend {border:none;font-weight:bold;}
    #content-header input {width:210px;}
    #content-header .pure-button-primary {margin-left:10px;background-color:#E7100B;}
    #order-amount {padding-bottom:10px;font-size:1.1em;font-weight:bold;}
    #order-insuredname {margin-left:20px;}

/* Content Body */
#content-body {padding:10px 20px;}
    #content-body .pure-button-primary {margin:10px;background-color:#E7100B;}
    #bank-gateway {padding:0 0 5px 0;}
    #bank-common {padding:5px 0;}
    #bank-uncommon {margin:5px 10px;}
    .bank-icon {width:148px;border:1px solid #DDDDDD;background-color:#ffffff;margin:5px 10px;padding:5px;float:left;background-image:url("../img/bankicon_sh.20161129.png");background-repeat:no-repeat;height:24px;}
    .bank-gateway {background-image:url("../img/gateway.20251113.png");}
    .bank-selected {border:2px solid #E4393C;margin:4px 9px;}
    #message {padding-bottom:10px;text-align:center;}
    #message table {margin:0 auto;}
    #error-title,#success-title{font-size:1.4em;}
    #error-message,#success-message{margin:10px 0 10px 0;}
    .channel {margin:15px;float:left;}

/* Footer */
#footer {margin:10px 0;padding:10px;border-top: 1px solid #EEE;font-size:0.9em;}

/* Responsive */
@media screen and (max-width: 759px) {
    #layout {width:640px;}
    .bank-icon {width:118px;}
    .payment-channle{width:118px;}
}
@media screen and (max-width: 639px) {
    #layout {width:auto;min-width:320px;text-align:center;font-size:1.7em;}
    #header {padding:10px;}
    #logo {width:96%;background-position:center;}
    #content-header {margin:5px 0;padding:5px 0;}
    #content-header legend {margin:0;}
    #content-header input {margin:0 auto;text-align:center;}
    #content-header .pure-button-primary {margin:10px 0 0 0;}
    #order-detail span {margin:0;width:100%;float:left;}
    #content-body {width:460px;margin:0 auto;padding:10px;}
    .bank-icon {width:121px;}
    .payment-channle{width:121px;}
    #footer{margin:0 0 10px 0;}
}
@media screen and (min-width: 480px) and (max-width: 639px) {
    #bank-gateway-list {width:320px;margin:0 auto;}
}
@media screen and (max-width: 479px) {
    #content-body {width:320px;}
    .bank-icon {width:128px;}
    .payment-channle{width:128px;}
}
@media screen and (max-width: 359px) {
    #content-body {width:300px;}
    .bank-icon {width:118px;}
    .payment-channle{width:118px;}
}