.resellerHead { width: 100%; height: 80px; background: #ffffff; border-bottom: 1px solid #ddd; }
.resellerHead .dynamsoftLogo { display: inline-block; width: 176px; height: 43px; margin: 17px 0 0; background: url(../../images/dynamsoft-logos/logo-dynamsoft-black.svg) no-repeat 0; }
.resellerHead .name { font-size: 36px; line-height: 80px; color: #323234; margin-left: 20px; }
.resellerHead .registerSign { transition: ease-in 0.2s all; margin-top: 26px; float: right; }
.resellerHead .registerSign:hover { box-shadow: -4px 4px 0 0 #000; transform: translate(4px,-4px); background: #fe8e14; }

/*  Start: Registration */
.registration h1 { font-size: 40px; line-height: 60px; }
.registration .briefInfo  { width: 1072px; margin-left: auto; margin-right: auto; }
.registration .note { width: 840px; margin-left: auto; margin-right: auto; padding: 18px 80px 18px 30px; background: #F5F5F5; font-size: 16px; line-height: 28px; }

.registration .formList { width: 840px; margin-left: auto; margin-right: auto; margin-bottom: 60px; }
.registration .formList .form { position: relative; padding: 40px 35px 40px 30px; border: solid 1px #ddd; margin-top: 25px; }

.registration .formList .form .formHead { font-size: 18px; line-height: 28px; font-family: OpenSans-Semibold; }
.registration .formList .form .formHead .switchIcon { position: absolute; top: 25px; right: 20px; width: 28px; height: 28px; background: url(../../images/icons/icn-switch-35x35.png) no-repeat -4px top; cursor: pointer; }
.registration .formList .form .formHead .switchIcon:hover { background-position: -4px -70px; }
.registration .formList .form .formHead .switchIcon.on { background-position: -4px -35px; }
.registration .formList .form .formHead .switchIcon.on:hover { background-position: -4px -105px; }

.registration .formList .form .formContent:after { content: ''; display: block; clear: both; }
.registration .formList .form .formContent .formItem { margin-top: 25px; width: 100%; }
.registration .formList .form .formContent .formItem:after { content: ''; display: block; clear: both; }
.registration .formList .form .formContent .formItem.halfLine { display: inline-block; width: 50%; float: left; }
.registration .formList .form .formContent .formItem .formLabel { display: inline-block; width: 94px; height: 40px; line-height: 40px; vertical-align: top; margin-bottom: 0; font-size: 14px; float: left; }
.registration .formList .form .formContent .formItem .form-input { display: inline-block; position: relative; width: calc(100% - 94px); float: left; vertical-align: top; }
.registration .formList .form .formContent .formItem.requiredMark .form-input:after { content: "*"; color: #ff0000; position: absolute; right: -14px; top: 12px; font-size: 16px; }
.registration .formList .form .formContent .formItem.hideMarkIcon .form-input:after { content: ""; }

/* formLabel 和 form-input 的一些别的宽度 */
.registration .formList .form .formContent .formItem .formLabel.blockLabel { display: block; width: 100%; }
.registration .formList .form .formContent .formItem .formLabel.blockLabel + .form-input { width: 100%; }
.registration .formList .form .formContent .formItem .formLabel.w170 { width: 170px; padding-left: 30px; }
.registration .formList .form .formContent .formItem .formLabel.w170 + .form-input { width: calc(100% - 170px); }
.registration .formList .form .formContent .formItem .formLabel.w125 { width: 125px; padding-left: 30px; }
.registration .formList .form .formContent .formItem .formLabel.w125 + .form-input { width: calc(100% - 125px); }
.registration .formList .form .formContent .formItem .formLabel.w200 { width: 200px; }
.registration .formList .form .formContent .formItem .formLabel.w200 + .form-input { width: calc(100% - 200px); }
.registration .formList .form .formContent .formItem .formLabel.lh24 { line-height: 24px; }

/* input[type=text] & textarea */
.registration .formList .form .formContent .formItem .form-input.half { width: 50%; }
.registration .formList .form .formContent .formItem .form-input input[type=text],
.registration .formList .form .formContent .formItem .form-input input[type=email],
.registration .formList .form .formContent .formItem .form-input select,
.registration .formList .form .formContent .formItem .form-input textarea { width: 100%; border: 1px solid #dddddd; outline: none; padding: 8px 15px; font-size: 14px; border-radius: 0; }
.registration .formList .form .formContent .formItem .form-input input[type=text],
.registration .formList .form .formContent .formItem .form-input input[type=email],
.registration .formList .form .formContent .formItem .form-input select { height: 40px; }
.registration .formList .form .formContent .formItem .form-input input:disabled { background: #f2f2f2; }
.registration .formList .form .formContent .formItem.appendLine .form-input .append { display: inline-block; height: 40px; line-height: 40px; vertical-align: top; width: 140px; margin-left: 5px; font-size: 14px; }
.registration .formList .form .formContent .formItem.appendLine .form-input input[type=text] { width: calc(100% - 150px); }
.registration .formList .form .formContent .formItem.errorHighlight > label { color: #a94442; }
.registration .formList .form .formContent .formItem.errorHighlight .form-input input[type=text],
.registration .formList .form .formContent .formItem.errorHighlight .form-input input[type=email],
.registration .formList .form .formContent .formItem.errorHighlight .form-input select { border-color: #a94442 !important; background: #d78684; }
.registration .formList .form .formContent .formItem.errorHighlight .form-input input[type=text]:disabled { border-color: #dddddd !important; background: #f2f2f2; }
/* checkbox */
.registration .formList .form .formContent .formItem .checkbox { margin-top: 5px; }
.registration .formList .form .formContent .formItem .checkbox input[type=checkbox] { width: 18px; height: 18px; border-radius: 0; margin-top: 2px; margin-bottom: 15px; }
.registration .formList .form .formContent .formItem .checkbox input[type=checkbox] + label { display: inline-block; width: calc(100% - 30px); font-size: 14px; margin-left: 5px; margin-bottom: 0; vertical-align: top; }
.registration .formList .form .formContent .formItem .inlineCheckbox > div  { display: inline-block; width: 250px; vertical-align: top; }
.registration .formList .form .formContent .formItem.errorHighlight .checkbox input[type=checkbox] + label { color: #a94442; }
 


.registration .formList .form .formContent .formItem .carried { margin-top: 5px; }
.registration .formList .form .formContent .formItem .carried .grain { counter-increment: grainCounter; position: relative; display: inline-block; width: 40%; margin-right: 5%; margin-bottom: 20px; }
.registration .formList .form .formContent .formItem .carried .grain:before { content: counter(grainCounter); font-size: 14px; color: #999; position: absolute; top: 9px; left: 8px; }
.registration .formList .form .formContent .formItem .carried .grain input { padding-left: 23px; }

.registration .formList .form .formContent .formItem .form-input p { margin-top: 10px; font-size: 14px; line-height: 24px; }
.registration .formList .form .formContent .list-numbers { padding-left: 16px; font-size: 14px; list-style-position: inside; }
.registration .formList .form .formContent .list-numbers > li { list-style: decimal; margin-top: 8px; }

.registration .formList .form .submitBtn { height: 45px; line-height: 45px; margin-bottom: 10px; color: #ffffff; font-size: 20px; cursor: pointer; transition: all ease-in-out .3s; }
.registration .formList .form .submitBtn:hover { box-shadow: -5px 5px 0 0 #000000; transform: translate(5px, -5px); }


@media (max-width: 1199px) {
    .resellerHead .name { font-size: 30px; }

    .registration h1 { font-size: 36px; line-height: 50px; }
    .registration .briefInfo { width: 100%; }
    .registration .note { width: 100%; max-width: 840px; font-size: 16px; }

    .registration .formList { width: 100%; max-width: 840px; }
    .registration .formList .form { position: relative; margin-top: 20px; }

    .registration .formList .form .formContent .formItem .formLabel.blockLabel { height: auto; line-height: 24px; margin-bottom: 8px; }
}

@media (max-width: 768px) {
    .registration .formList .form .formContent .formItem.halfLine { width: 100%; }
    .registration .formList .form .formContent .formItem .formLabel.w170,
    .registration .formList .form .formContent .formItem .formLabel.w125,
    .registration .formList .form .formContent .formItem .formLabel.w200 { padding-left: 0; }
    .registration .formList .form .formContent .formItem .formLabel.blockLabel { height: auto; line-height: 24px; }

    .registration .formList .form .submitBtn { font-size: 16px; }
    .registration .formList .form .formContent .formItem .form-input.half { width: calc(100% - 100px); }
}
/*  End: Registration */

#msgDialog { display: none; position: fixed; z-index: 1; top: 210px; left: 50%; margin-left: -275px; padding: 35px 55px 35px 45px; width: 550px; height: auto; background: #fff; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 0 0 #eee, 0 0 0 #fff, 0 4px 6px #e8e8e8, 0 0 0 #eee; -webkit-box-shadow: 0 0 0 #eee, 0 0 0 #fff, 0 4px 6px #ddd, 0 0 0 #eee; -moz-box-shadow: 0 0 0 #eee,0 0 0 #fff,0 4px 6px #ddd,0 0 0 #eee; }
#msgDialog a.closeDialog { position: absolute; top: 8px; right: 20px; cursor: pointer; }
#msgDialog .content-lt { float: left; margin-right: 45px; }
#msgDialog .content-rt { float: left; width: calc(100% - 150px); }
#msgDialog p { margin-bottom: 3px; }
#msgDialog p.title { color: #444; font-size: 18px; line-height: 27px; }
#msgDialog input[type=button] { margin-top: 15px; font-size: 16px; padding: 0 30px; width: auto; height: 28px; border-radius: 0; background: #F15A23; color: #fff; outline: none; border: none; }


/* Start: Portal */
#portalBanner { height: 330px; padding-top: 90px; background: url(../../images/reseller/bg-portal-banner.png) no-repeat center center; background-size: cover; }
/*#portalBanner h1 { font-size: 36px; line-height: 58px; }*/
#portalContent { padding: 60px 0; }
#portalContent .contact li { line-height: 28px; }

.pr { position: relative; }

@media (min-width: 768px) { 
    #portalBanner { height: 450px; padding-top: 100px; }
    /*#portalBanner h1 { font-size: 48px; line-height: 90px; }*/
    #portalContent { background: url(../../images/reseller/bg-portal-content.png) no-repeat center center; background-size: cover; }
    #portalContent { padding: 0 0 80px; }
    #portalContent .content { position: relative; padding: 145px 50px 145px 125px; margin-top: -130px; background: #fff; box-shadow: 0 0 4px #bbb; }
    #portalContent .content img.trigon-top { position: absolute; top: 20px; left: 20px; width: 180px; }
    #portalContent .content img.trigon-btm { position: absolute; bottom: 20px; right: 20px; }
}

@media (min-width: 992px) {
    #portalBanner { padding-top: 115px; }
    /*#portalBanner h1 { font-size: 60px; }*/
    #portalContent { padding: 0 0 120px; }
    #portalContent .content { padding: 180px 90px 160px 160px; margin-top: -110px; }
    #portalContent .content img.trigon-top { width: 250px; }
    #portalContent .content img.trigon-btm { width: 160px; }
    #portalContent .contact img.thankYou { position: absolute; top: 5px; right: 0; }
}

/* End: Portal */

/* Start: Partner Portal */
.partner-portal .partner-news .orange-li { margin-top: 20px; }
.partner-portal .partner-news .orange-li > li { padding-left: 15px; background: url(../../images/icons/icn-orange-li.png) no-repeat left 12px; }
.partner-portal .partner-news .leftPart { padding-right: 100px; }
.partner-portal .partner-news .leftPart img { max-width: 307px; width: 100%; }
.partner-portal .partner-news .rightPart { padding-left: 100px; padding-top: 70px; }
.partner-portal .aboutInfo { padding-bottom: 100px; }

@media (max-width: 1679px) {
    .partner-portal .partner-news .orange-li > li { background: url(../../images/icons/icn-orange-li.png) no-repeat left 10px; }
    .partner-portal .partner-news .leftPart { padding-right: 80px; }
    .partner-portal .partner-news .rightPart { padding-left: 80px; }
}

@media (max-width: 991px) {
    .partner-portal .aboutInfo { padding-bottom: 60px; }
}

@media (max-width: 767px) {
    .partner-portal .partner-news .leftPart { padding-right: 15px; text-align: center; }
    .partner-portal .partner-news .rightPart { padding-left: 15px; text-align: center; }
}
/* End: Partner Portal */