﻿/*

粉紅 #f05092
gray1 商標灰 #666666
gray2 #999999
gray3 文字淺灰 #b3b3b3
 */
html, body{background-color:#ebeef0;padding:0;margin:0;height:auto;min-height: auto;}
.test{border:1px solid #ff0000;}
* {color_:#333333;}
a {color: #5b6abf;text-decoration: none;}
a:not([href]):not([tabindex]){color: #5b6abf;}
a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
  color: #5b6abf;
  text-decoration: none;
}
a:hover {color: #5b6abf;}
.btn{color:#5b6abf;padding: 9px 29px;}

.page-top-left {width:700px;float:left;}
.page-top-right {width:440px;float:right;}
.clearfix {clear:both;}
.m-t-67 {margin-top:67px;}
.navbar-static-top {position: fixed;top:0;right: 0;left: 0;z-index: 1030;background-color:#5c6bc0;}
.navbar-brand {float: left;padding-top:15px;padding-bottom: 0;margin-right: 1rem;font-size: 1.25rem;}
.main-nav-container {height:60px;padding:0 0;background-color:#5c6bc0;position: relative;}
.main-nav-container h2.navh2 {color:#ffffff;line-height:1.8;text-align:center;}

/* login signup */
.login-signup-box {width:900px;height:400px;margin:0 auto;margin-top:60px;border:1px solid #3F51B5;border-radius:20px;background-color:#ffffff;}
.login-signup-box .new-partner,.login-signup-box .Existing-partner {float:left;}
.login-signup-box .new-partner {width:450px;padding-left:60px;padding-top:50px;}
.login-signup-box .Existing-partner {height:398px;border-left:1px solid #3F51B5;padding-left:60px;padding-top:50px;}
.loginlogo {margin-bottom:15px;}
.login-signup-box img {margin-bottom:20px;}
.login-signup-box h3{color:#5b6abf;line-height:1;}
.login-signup-box h4{font-size:0.95rem;color:#ef4f91;font-weight:600;text-transform:uppercase;margin-top:10px;margin-bottom:50px;}
.login-signup-box p {width:330px;font-size:0.9rem;margin-bottom:30px;}
.tr-login-txt {font-size:0.9rem;color:#78909C;margin:15px 0;margin-top:70px;}
.tr-login-txt:hover{color:#546E7A;}
.tr-login-txt a {color:#78909C;text-decoration: none;}
.tr-login-txt a:hover {color:#546E7A;text-decoration: underline;}

.trs-login-txt {font-size:0.9rem;color:#78909C;margin:15px 0;padding-top:50px;}
.trs-login-txt:hover{color:#546E7A;}
.trs-login-txt a {color:#78909C;text-decoration: none;}
.trs-login-txt a:hover {color:#546E7A;text-decoration: underline;}

.bottom-login-txt {font-size:0.9rem;color:#78909C;margin:15px 0;}
.bottom-login-txt:hover{color:#546E7A;}
.bottom-login-txt a {color:#78909C;text-decoration: none;}
.bottom-login-txt a:hover {color:#546E7A;text-decoration: underline;}

.btn-login-signup {font-weight:400;color:#5b6abf;text-transform:uppercase;background-color:#eef0f9;border:1px solid #5b6abf;border-radius:2px;}
.btn-login-signup:hover {color:#5b6abf;background-color:#ced2ec;}

.signup-box {width:500px;min-height:400px;text-align:center;margin:0 auto;margin-top:60px;border:1px solid #3F51B5;border-radius:20px;padding-top:50px;padding-bottom:40px;background-color:#ffffff;}
.signup-box h3{font-weight:400;color:#5C6BC0;line-height:1;margin-top:20px;}
.signup-box h4{font-size:0.9rem;color:#ef4f91;font-weight:600;text-transform:uppercase;margin-top:10px;margin-bottom:50px;}
.signup-box h4.becomeh4 {margin-bottom:40px;}
.signup-form {width:340px;margin:0 auto;}
.signup-box .form-group {margin:0;margin-bottom:10px;}
.become-txt {font-size:0.8rem;}
.signup-box label {color:#999999;line-height:0;}
.signup-form .form-control {border-top:0;border-left:0;border-right:0;padding: 0.2rem 0rem;}
.signup-box .q-txt {font-size:0.9rem;color:#5C6BC0;margin-top:30px;}
.signup-box .q-txt a {font-weight:600;color:#5C6BC0;text-decoration:none;}
.signup-box .q-txt a:hover {color:#3F51B5;text-decoration: underline;}
.signup-box .col-rememberme {float:left;}
.signup-box .col-rememberme label {line-height:1.6;}
.signup-box .col-rememberme .checkbox {margin-bottom:0;font-size:0.8rem;}
.signup-box .col-forgot {float:right;font-size:0.8rem;margin-top:1px;}
.signup-box .col-forgot a {color:#78909C;line-height:1.8;text-decoration:none;}
.signup-box .col-forgot a:hover{color:#546E7A;text-decoration: underline;}
.alert-box img {margin-top:120px;}
.alert-box h3 {color:#5C6BC0;line-height:1;margin-top:10px;}
.alert-box .alert-txt1 {margin:40px 0;}
.alert-box .alert-txt2 {font-size:0.9rem;color:#5C6BC0;}
.alert-box .alert-txt2 span {color:#5C6BC0;text-decoration: underline;}
.alert-box .alert-txt2 a {font-weight:600;color:#5C6BC0;text-decoration: none;}
.alert-box .alert-txt2 a:hover {color:#3F51B5;text-decoration: underline;}
/* signup form */
.signup-form-zone {margin-top:30px;}
.signup-form-head {padding:30px 60px;background-color:#ffffff;border:1px solid #3F51B5;border-radius:20px;}
.signup-form-head .head-txt1 {color:#5C6BC0;margin-bottom:10px;}
.signup-form-head .head-txt1 span {display:inline-block;margin:0;margin-left:30px;}
.signup-form-head .head-txt1b {font-size:1.1rem;color:#5C6BC0;margin-bottom:10px;}
.signup-form-head .head-txt1b span {font-weight:600;display:inline-block;margin:0;margin-left:30px;}

.signup-form-head .head-txt2 {font-size:0.9rem;margin:0;margin-top:20px;}
.signup-form-head .head-txt3 {font-size:0.9rem;color:#90A4AE;margin:0;margin-top:20px;}
.signup-form-head .head-txt3 a {color:#90A4AE;text-decoration: underline;}
.signup-form-zone h2 {font-size: 1.5rem;color: #5C6BC0;margin: 40px 0 10px 0;line-height:1;}
.signup-form-zone h2.mth {margin-top:100px;}
.signup-form-zone h2 span {display:inline-block;margin-left:60px;color: #5C6BC0;}
.signup-form-body{padding:50px 60px 40px 60px;background-color:#ffffff;border:1px solid #3F51B5;border-radius:20px;}
.signup-form-body .ep-txt {font-size:0.75rem;color:#999999;margin:50px 0;}
.col-1 {width:100%;}
.col--2 {width:309px;height:40px;}
.col-txt{float:left;width:109px;font-size:0.85rem;line-height:1.5;text-transform:uppercase;}
.col-txt2{float:left;width:109px;font-size:0.85rem;line-height:1.2;margin-top:-4px;text-transform:uppercase;}
.col-txt3{float:left;width:109px;font-size:0.85rem;line-height:1.2;margin-top:-10px;text-transform:uppercase;}
@media screen and (-webkit-min-device-pixel-ratio:0) {  /* Chrome only */ 
.col-txt2{float:left;width:109px;font-size:0.85rem;line-height:1.2;margin-top:-2px;text-transform:uppercase;}
.col-txt3{float:left;width:109px;font-size:0.85rem;line-height:1.2;margin-top:-10px;text-transform:uppercase;}
}
.col-1-form{float:left;width:569px;position: relative;}
.col-2-form{float:left;width:200px;position: relative;}
.form-control-txt {float:left;text-transform:uppercase;}

.col-slider-txt {float:left;width:170px;font-size:0.85rem;line-height:1.5;text-transform:uppercase;}
.col-slider-box {float:left;width:508px;font-size:0.85rem;line-height:1.5;padding-top:3px;}
.radio-group-box {padding-top:5px;}
.radio {padding-left:25px;padding-right:20px;}
.col-slider-box .radio {width:200px;}
.checkbox {padding-left:25px;padding-right:20px;}
.radio + .radio, .checkbox + .checkbox {margin-top: 0;}
.radio .icons {font-size:18px;}
.checkbox .icons {font-size:14px;line-height: 22px;}
.radio .icon-checked:before,
.radio .icon-unchecked:before {
    background-color:#fff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}
.checkbox .icon-checked:before,
.checkbox .icon-unchecked:before {
    width:20px;
    background-color:#fff;
}
.checkbox .icon-checked:before {border:1px solid #7986CB;border-radius: 3px;}
.checkbox .icon-unchecked:before {border:1px solid #bdc3c7;border-radius: 3px;}

.ui-slider {
    float:left;
    width:240px;
    background: #fff;
    border-radius: 0;
    height: 12px;
    box-shadow: none;
    margin-top:8px;
    margin-bottom: 0;
    position: relative;
    cursor: pointer;
    border:1px solid #CFD8DC;
}
.ui-slider-horizontal .ui-slider-segment {
    float: left;
    margin: 0 -1px 0 0;
}
.ui-slider-segment {
    background-color: transparent;
    border-radius: 0;
    height: 12px;
    width: 0;
    border-right:1px solid #CFD8DC;
}
.ui-slider-horizontal .ui-slider-range {
    border-radius: 0 0 0 0;
}
.slider-value-txt{
    width:50px;
    float:left;
    font-weight:600;
    line-height:1;
    margin-top:8px;
    vertical-align:middle;
}
.slider-txt {
    width:98px;
    float:left;
    line-height:2.2;
}

.p-r-30 {padding-right:30px;}
.m-t-30{margin-top:30px;}
.m-b-10{margin-bottom:10px;}
.m-b-15{margin-bottom:15px;}
.m-b-25{margin-bottom:20px;}
.m-b-50{margin-bottom:50px;}
.m-b-0 {margin-bottom:0;}

.signup-form-body .select {
    position: relative;
    display: inline-block;
    vertical-align: top;
    min-width: 200px;
    width: auto;
}
.signup-form-body .select-primary .select2-choice {
    color_: #CFD8DC;
    background-color: #fff;
}
.signup-form-body .select2-choice {
    width: 100%;
    display: inline-block;
    position: relative;
    border: none;
    font-size: 0.9rem;
    font-weight: normal;
    line-height: 1;
    border-radius: 0;
    padding: 12px 10px 12px 10px;
    margin: 0;
    -webkit-transition: border 0.25s linear, color 0.25s linear, background-color 0.25s linear;
    transition: border 0.25s linear, color 0.25s linear, background-color 0.25s linear;
    text-decoration: none;
    border:1px solid #CFD8DC;
}
.signup-form-body .select2-arrow {
  display: inline-block;
  border-width: 0;
  border-color: #34495e transparent;
  border-style: solid;
  border-bottom-style: none;
  position: absolute;
  right: 10px;
  top:3px;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}
.signup-form-body .select2-arrow::after {
    font-family:'FontAwesome';
    content: "\f0d7";
    font-size:2rem;
    color:#CFD8DC;
}
.signup-form-body .select2-choice:hover .select2-arrow::after {
    color:#5C6BC0;
}
.signup-form-body .select2-choice:hover,
.signup-form-body .select2-choice:focus,
.signup-form-body .select2-choice:active {
  outline: none;
  box-shadow: none;
  border:1px solid #5C6BC0;
}

.transition-form-head {width:700px;border-bottom:1px solid #cfd8dc;margin:0 auto;}
.tcol-head {display:inline-block;}
.tcol-head .form-control-static {padding:0;}
.tcol-h2-form{}

.transition-form-body {width:350px;margin:0 auto;}
.transition-form-body h2 {font-size:0.9rem;font-weight:600;}
.tcol-1 {width:100%;}
.tcol-2 {width:165px;}
.tcol-txt{font-size:0.85rem;color:#777777;line-height:1;text-transform:uppercase;}
.tcol-2-form{width:165px;position: relative;}

.tcol-1-form{width:350px;position: relative;}

.transition-form-body .select {
    position: relative;
    display: inline-block;
    vertical-align: top;
    min-width: 350px;
    width: auto;
}
.transition-form-body .select-primary .select2-choice {
    color_: #CFD8DC;
    background-color: #fff;
}
.transition-form-body .select2-choice {
    width: 100%;
    display: inline-block;
    position: relative;
    border: none;
    font-size: 0.9rem;
    font-weight: normal;
    line-height: 1;
    border-radius: 0;
    padding: 12px 10px 12px 10px;
    margin: 0;
    -webkit-transition: border 0.25s linear, color 0.25s linear, background-color 0.25s linear;
    transition: border 0.25s linear, color 0.25s linear, background-color 0.25s linear;
    text-decoration: none;
    border:1px solid #CFD8DC;
}
.transition-form-body .select2-arrow {
  display: inline-block;
  border-width: 0;
  border-color: #34495e transparent;
  border-style: solid;
  border-bottom-style: none;
  position: absolute;
  right: 10px;
  top:3px;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}
.transition-form-body .select2-arrow::after {
    font-family:'FontAwesome';
    content: "\f0d7";
    font-size:1.8rem;
    color:#CFD8DC;
}
.transition-form-body .select2-choice:hover .select2-arrow::after {
    color:#5C6BC0;
}
.transition-form-body .select2-choice:hover,
.transition-form-body .select2-choice:focus,
.transition-form-body .select2-choice:active {
  outline: none;
  box-shadow: none;
  border:1px solid #5C6BC0;
}

.btn-transition-signup {
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    background-color: #ec407a;
    border: 1px solid #ec407a;
    border-radius: 2px;
}

.btn-dis-signup {
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    background-color: #cfd8dc;
    border: 1px solid #cfd8dc;
    border-radius: 2px;
}
.btn-dis-signup:hover,
.btn-transition-signup:hover {
    color:#ffffff;
}
.btnxxx {text-align:center;}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
.main-nav-container {height:30px;padding:0 0;background-color:#5c6bc0;position: relative;}
.main-nav-container h2.navh2 {font-size:1.3rem;font-weight:600;color:#ffffff;line-height:1.5;text-align:center;}
.signup-form-body {padding:15px;}
.signup-form-zone h2.mth {margin-top: 60px;}
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.container {width: 960px;max-width: 100%;}
}


/* 基本編輯 */
.w-100 {width: 100% !important;}
.m-x-auto {margin-right: auto !important;margin-left: auto !important;}
.m-a-0 {margin: 0 0 !important;}
.m-t-0 {margin-top: 0 !important;}
.m-r-0 {margin-right: 0 !important;}
.m-b-0 {margin-bottom: 0 !important;}
.m-l-0 {margin-left: 0 !important;}
.m-x-0 {margin-right: 0 !important;margin-left: 0 !important;}
.m-y-0 {margin-top: 0 !important;margin-bottom: 0 !important;}
.m-a-1 {margin: 1rem 1rem !important;}
.m-t-1 {margin-top: 1rem !important;}
.m-r-1 {margin-right: 1rem !important;}
.m-b-1 {margin-bottom: 1rem !important;}
.m-l-1 {margin-left: 1rem !important;}
.m-x-1 {margin-right: 1rem !important;margin-left: 1rem !important;}
.m-y-1 {margin-top: 1rem !important;margin-bottom: 1rem !important;}
.m-a-2 {margin: 1.5rem 1.5rem !important;}
.m-t-2 {margin-top: 1.5rem !important;}
.m-r-2 {margin-right: 1.5rem !important;}
.m-b-2 {margin-bottom: 1.5rem !important;}
.m-l-2 {margin-left: 1.5rem !important;}
.m-x-2 {margin-right: 1.5rem !important;margin-left: 1.5rem !important;}
.m-y-2 {margin-top: 1.5rem !important;margin-bottom: 1.5rem !important;}
.m-a-3 {margin: 3rem 3rem !important;}
.m-t-3 {margin-top: 3rem !important;}
.m-r-3 {margin-right: 3rem !important;}
.m-b-3 {margin-bottom: 3rem !important;}
.m-l-3 {margin-left: 3rem !important;}
.m-x-3 {margin-right: 3rem !important;margin-left: 3rem !important;}
.m-y-3 {margin-top: 3rem !important;margin-bottom: 3rem !important;}
.p-a-0 {padding: 0 0 !important;}
.p-t-0 {padding-top: 0 !important;}
.p-r-0 {padding-right: 0 !important;}
.p-b-0 {padding-bottom: 0 !important;}
.p-l-0 {padding-left: 0 !important;}
.p-x-0 {padding-right: 0 !important;  padding-left: 0 !important;}
.p-y-0 {padding-top: 0 !important;  padding-bottom: 0 !important;}
.p-a-1 {padding: 1rem 1rem !important;}
.p-t-1 {padding-top: 1rem !important;}
.p-r-1 {padding-right: 1rem !important;}
.p-b-1 {padding-bottom: 1rem !important;}
.p-l-1 {padding-left: 1rem !important;}
.p-x-1 {padding-right: 1rem !important;  padding-left: 1rem !important;}
.p-y-1 {padding-top: 1rem !important;  padding-bottom: 1rem !important;}
.p-a-2 {padding: 1.5rem 1.5rem !important;}
.p-t-2 {padding-top: 1.5rem !important;}
.p-r-2 {padding-right: 1.5rem !important;}
.p-b-2 {padding-bottom: 1.5rem !important;}
.p-l-2 {padding-left: 1.5rem !important;}
.p-x-2 {padding-right: 1.5rem !important;  padding-left: 1.5rem !important;}
.p-y-2 {padding-top: 1.5rem !important;  padding-bottom: 1.5rem !important;}
.p-a-3 {padding: 3rem 3rem !important;}
.p-t-3 {padding-top: 3rem !important;}
.p-r-3 {padding-right: 3rem !important;}
.p-b-3 {padding-bottom: 3rem !important;}
.p-l-3 {padding-left: 3rem !important;}
.p-x-3 {padding-right: 3rem !important;  padding-left: 3rem !important;}
.p-y-3 {padding-top: 3rem !important;  padding-bottom: 3rem !important;}

button, html, input, select, textarea {
    font-family: "Open Sans", sans-serif;
}
md-content {overflow:visible;}
.layout-padding, .layout-padding-gt-sm, .layout-padding-gt-sm > *, .layout-padding-md, .layout-padding-md > *, .layout-padding > *, .layout-padding > .flex, .layout-padding > .flex-gt-sm, .layout-padding > .flex-md {padding:0;}
.md-inline-form {padding-top:10px;}

.md-block {text-align:left;}
.md-block label {line-height:1.3;margin-bottom:3px;}
md-input-container.md-input-focused .md-input, md-input-container.md-input-resized .md-input, md-input-container .md-input.ng-invalid.ng-dirty {
    padding-bottom: 0;
    border-width: 0 0 1px;
}
md-input-container {margin:18px 0 0 0;}

md-input-container.md-input-focused label:not(.md-no-float), md-input-container.md-input-has-placeholder label:not(.md-no-float), md-input-container.md-input-has-value label:not(.md-no-float) {
    transform: translate3d(0,10px,0) scale(0.9);
}
md-input-container .md-errors-spacer {
    float: right;
    min-height: 0;
    min-width: 1px;
}
md-input-container.md-default-theme.md-input-invalid label, 
md-input-container.md-input-invalid label{color: #999999;}
md-input-container.md-default-theme.md-input-invalid .md-input-message-animation, 
md-input-container.md-input-invalid .md-input-message-animation, 
md-input-container.md-default-theme.md-input-invalid .md-char-counter, 
md-input-container.md-input-invalid .md-char-counter {
    color: #F14950;
}
md-input-container.md-default-theme.md-input-invalid .md-input, 
md-input-container.md-input-invalid .md-input {
    border-color:#3F51B5;
}
.md-input-messages-animation {
position: relative;
}
.md-error-icon {
    display:none;
    position: absolute;
    top:16px;
    left:-10px;
    z-index:9;
    width:5px;
    height:5px;
    font-size:0.45rem;
    color:#F14950;
    background-color:#F14950;
    border-radius:10px;
}
.md-error-icon i {display:none;}
.md-input-invalid .md-error-icon {display:block;}

* input:-webkit-autofill,
* textarea:-webkit-autofill,
* select:-webkit-autofill {
    background-color: rgb(255, 255, 255);;
    background-image: none;
    color: rgb(0, 0, 0);
}
md-select:focus:not([disabled]) .md-select-value {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    padding-bottom: 0;
}
md-input-container.md-default-theme label.md-required::after, md-input-container label.md-required::after {
    color: #ffffff;
}
md-input-container.md-default-theme:not(.md-input-focused):not(.md-input-invalid) label.md-required::after, md-input-container:not(.md-input-focused):not(.md-input-invalid) label.md-required::after {
    color: #ffffff;
}
md-input-container:not(.md-input-focused):not(.md-input-invalid) md-select.md-default-theme .md-select-value span:first-child::after, md-input-container:not(.md-input-focused):not(.md-input-invalid) md-select .md-select-value span:first-child::after {
    color: #ffffff;
}
md-input-container md-select.md-default-theme .md-select-value span:first-child::after, md-input-container md-select .md-select-value span:first-child::after {
    color: #ffffff;
}

.commentzone p span.na {color:#FF9800;}
.commentzone p{color:#959595;}
.form-control-static {line-height:1.6;}
.commentzone .replydiv div.signup-form-body {width:100%;padding:0;background-color:#ebeef0;border:0;}