body, td, input, textarea, select { font: 12px/16px Verdana, Arial, Helvetica, sans-serif; color: #000; } input { display: block; width: 100%; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } select { background: #fff; overflow: hidden; -moz-border-radius: 4px 4px 4px 4px; -webkit-border-radius: 4px 4px 4px 4px; border: 1px solid #ccc; border-radius: 4px; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); height: 28px; } @media (max-width: 360px) { select { max-width: 250px; } } input.hint { color: #888; } .form-element input { padding: 0 4px; } .form-element-date { width: 94px; height: 25px; text-align: right; } label { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; text-align: left; } label#form-label-creditCardType { display: none; } h3 { color: #808080; } h2, label { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #212529; text-align: left; } body { display: block; margin: 1px; } .form { padding: 20px 16px; margin: 0 auto; } @media (min-width: 768px) { .form { min-width: 100%; } } .invalid { border: 1px solid #ed1c24; } .form img { vertical-align: middle; } .form-group { margin-bottom: 1rem; } .form-element { display: inline-block; border-left: 2px solid #fff; padding-left: 1px; border-left-color: rgba(255, 255, 255, 0); min-width: 285px; } .form-element.required { border-left: 4px solid #6ec5ab; vertical-align: middle; height: 28px; padding: 2px; } .form-element input { padding: 0 2px; } .form-element-date { width: 94px; height: 25px; text-align: right; } .form-group .error { margin: 4px 0 5px 140px; } .popup { background-color: #fff; } .popup .form { margin-top: 1px; padding: 0; width: 100%; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .popup .form h2 { padding: 10px 17px; margin: 0 auto; margin-top: 1px; background-color: #fff; border-bottom: 1px solid #d5d5d5; } .whitespace { padding: 5px; border-bottom: 0px; } .popup .form h3 { padding: 10px 25px; margin-top: 0; border-bottom: 0px; } .popup .form .content { margin: 0 auto; } .popup .form #btn-submit { margin-right: 200px; } a { text-decoration: none; } a.modalCloseImg { background: url(Images/hpm/icon-close.gif) no-repeat; width: 7px; height: 7px; display: inline; z-index: 3200; position: absolute; top: 13px; right: 13px; cursor: pointer; } .required-desc { width: 24%; float: right; margin-top: 11px; border-left: 4px solid #6ec5ab; vertical-align: middle; min-width: 120px; } @media (min-width: 768px) { .required-desc { width: 30%; float: left; max-width: 280px; } } @media (max-width: 360px) { .required-desc { float: none; margin: 0 0 16px 5px; width: 100%; } } ^ .spacer { padding: 2px; } #btn-submit { float: right; margin-right: 150px; } .error { font-size: 12px; color: #ed1c24; margin: -8px 0 5px 0; } .error-field { color: #121212; font-family: "EconSansOS", "EconSansOSSec", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important; font-size: 16px; font-weight: 500; margin: 0.375rem 0 0 0.1rem; } #error-cardSecurityCode.error-field { margin-top: -0.6em; } .date-separator { font-size: 12px; } .bottom { margin-top: 15px; overflow: hidden; } .form .desc { margin-bottom: 15px; margin-top: 5px; } .popup .form .desc { margin-left: 25px; margin-right: 37px; } .popup .form #btn-submit { margin-right: 27px; } .tooltip-text { font-size: 12px; } a.tooltip { display: none; } .image-cvv { cursor: pointer; top: -3px; } .image-cvv-position { position: relative; } .image-cvv-des { position: absolute; top: 28px; left: 120px; z-index: 20; border: 1px solid rgb(232, 232, 232); } .btn-submit { float: left; margin-left: 5px; display: inline-block; padding: 9px 20px; color: white; font-weight: bold; font-size: 12px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; *zoom: 1; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFC1DB9B', endColorstr='#FF8BBF4B'); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ec5ab), color-stop(100%, #6ec5ab)); background-image: -webkit-linear-gradient(#6ec5ab, #6ec5ab); background-image: -moz-linear-gradient(#6ec5ab, #6ec5ab); background-image: linear-gradient(#6ec5ab, #6ec5ab); } .btn-submit.disabled { *zoom: 1; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFE2E3E3', endColorstr='#FFC9CACA'); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e2e3e3), color-stop(100%, #c9caca)); background-image: -webkit-linear-gradient(#e2e3e3, #c9caca); background-image: -moz-linear-gradient(#e2e3e3, #c9caca); background-image: linear-gradient(#e2e3e3, #c9caca); pointer-events: none; cursor: default; } @media only screen and (max-width: 768px) { .btn-submit { float: left; margin-left: 12px; } } form#HostedPageForm .form-element { border: none; height: auto; } form#HostedPageForm img.image-cvv { display: flex; position: absolute; right: -6em; top: 0.3em; } form#HostedPageForm .form-element select, form#HostedPageForm .form-element input { display: block; width: 100%; height: calc(1.5em + 0.75rem + 2px); padding: 1px 13.3333px; font-size: 13.3333px; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } form#HostedPageForm .form-element select[aria-invalid="true"], form#HostedPageForm .form-element input[aria-invalid="true"] { -webkit-box-shadow: inset 0 0 0 0.125rem #d21982; box-shadow: inset 0 0 0 0.125rem #d21982; } form#HostedPageForm .required-desc { display: none; } form#HostedPageForm .form-element select:focus, form#HostedPageForm .form-element input:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%); } #z_hppm_iframe { background: #fff; } .form-element { min-width: 100%; } form#HostedPageForm .form-element select, form#HostedPageForm .form-element input { max-width: calc(100% - 40px) !important; } .form-element#form-element-cardSecurityCode { min-width: calc(100% - 130px); } form#HostedPageForm .form-element select, form#HostedPageForm .form-element#form-element-cardSecurityCode { max-width: calc(100% - 50px) !important; } form#HostedPageForm .form-element select, form#HostedPageForm div#form-group-creditCardCountry select#input-creditCardCountry { max-width: 200px !important; } #form-group-creditCardAddress1, #form-group-creditCardCity, #form-group-creditCardType, #form-group-creditCardPostalCode, #form-group-creditCardState, #form-group-email, #form-group-creditCardCountry { display: none !important; }